@gravity-ui/page-constructor 8.8.1 → 8.9.0

package/build/cjs/blocks/Hero/Hero.js

@@ -12,8 +12,17 @@ const sub_blocks_1 = require("../../sub-blocks/index.js");
 const utils_1 = require("../../utils/index.js");
 const hooks_1 = require("./hooks.js");
 const b = (0, utils_1.block)('hero-block');
+const QA_ID = 'hero-block';
 const Hero = (props) => {
     const { breadcrumbs, overtitle, buttons, media: themedMedia, fullWidth, verticalOffset = 'm', theme: contentTheme = 'default', background: themedBackground, ...contentProps } = props;
+    const qaAttributes = (0, utils_1.getQaAttrubutes)(QA_ID, [
+        'background',
+        'beadcrumbs',
+        'content-wrapper',
+        'content-overtitle',
+        'media-wrapper',
+        'media',
+    ]);
     const [mediaAspectRatio, setMediaAspectRatio] = React.useState(Infinity);
     const { aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef } = (0, hooks_1.useContainerAspectRatio)();
     const isDesktop = (0, windowWidthContext_1.useWindowWidth)() > constants_1.BREAKPOINTS.md;
@@ -33,17 +42,17 @@ const Hero = (props) => {
         };
     }), [buttons, theme]);
     const onMediaIntrinsicSizeChange = React.useCallback(({ width, height }) => setMediaAspectRatio(width / height), []);
-    return ((0, jsx_runtime_1.jsxs)("header", { className: b(), children: [background && ((0, jsx_runtime_1.jsx)(components_1.Media, { className: b('background', {
+    return ((0, jsx_runtime_1.jsxs)("header", { className: b(), "data-qa": qaAttributes.default, children: [background && ((0, jsx_runtime_1.jsx)(components_1.Media, { className: b('background', {
                     ['full-width']: fullWidth,
-                }), imageClassName: b('background-image'), videoClassName: b('background-video'), ...background, isBackground: true })), (0, jsx_runtime_1.jsx)(grid_1.Grid, { children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), children: [breadcrumbs && ((0, jsx_runtime_1.jsx)(components_1.HeaderBreadcrumbs, { className: b('breadcrumbs'), ...breadcrumbs, theme: theme })), (0, jsx_runtime_1.jsxs)("div", { className: b('content', {
+                }), imageClassName: b('background-image'), videoClassName: b('background-video'), ...background, isBackground: true, qa: qaAttributes.background })), (0, jsx_runtime_1.jsx)(grid_1.Grid, { children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), "data-qa": qaAttributes.wrapper, children: [breadcrumbs && ((0, jsx_runtime_1.jsx)(components_1.HeaderBreadcrumbs, { className: b('breadcrumbs'), ...breadcrumbs, theme: theme, qa: qaAttributes.breadcrumbs })), (0, jsx_runtime_1.jsxs)("div", { className: b('content', {
                                 ['vertical-offset']: verticalOffset,
-                            }), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('content-overtitle', { theme }), children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { tagName: "span", content: overtitle, modifiers: {
+                            }), "data-qa": qaAttributes.contentWrapper, children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('content-overtitle', { theme }), "data-qa": qaAttributes.contentOvertitle, children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { tagName: "span", content: overtitle, modifiers: {
                                             constructor: true,
                                             constructorTheme: theme,
-                                        } })) : (overtitle) })), (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { size: "xl", colSizes: { all: 12 }, ...contentProps, buttons: buttonProps, theme: contentTheme })] }), media && ((0, jsx_runtime_1.jsx)("div", { className: b('media'), children: (0, jsx_runtime_1.jsx)("div", { className: b('media-container'), ref: mediaContainerRef, children: (0, jsx_runtime_1.jsx)(components_1.Media, { className: b('media-container-content', {
+                                        } })) : (overtitle) })), (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { size: "xl", colSizes: { all: 12 }, ...contentProps, buttons: buttonProps, theme: contentTheme, qa: qaAttributes.content })] }), media && ((0, jsx_runtime_1.jsx)("div", { className: b('media'), "data-qa": qaAttributes.mediaWrapper, children: (0, jsx_runtime_1.jsx)("div", { className: b('media-container'), ref: mediaContainerRef, children: (0, jsx_runtime_1.jsx)(components_1.Media, { className: b('media-container-content', {
                                         ['round-corners']: media.roundCorners ?? true,
                                         vertical: isDesktop && isMediaVertical,
-                                    }), ...media, disablePlayerAutoSizing: true, onIntrinsicSizeChange: onMediaIntrinsicSizeChange }) }) }))] }) })] }));
+                                    }), ...media, disablePlayerAutoSizing: true, onIntrinsicSizeChange: onMediaIntrinsicSizeChange, qa: qaAttributes.mediaContainerContent }) }) }))] }) })] }));
 };
 exports.default = Hero;
 //# sourceMappingURL=Hero.js.map

package/build/cjs/blocks/Hero/Hero.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hero.js","sourceRoot":"../../../../src","sources":["blocks/Hero/Hero.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,0DAAsE;AACtE,kDAA4C;AAC5C,wDAA6C;AAC7C,kFAAgE;AAChE,8CAAgC;AAEhC,0DAAyC;AACzC,gDAAkD;AAElD,sCAAgD;AAIhD,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,IAAI,GAAG,CAAC,KAAqB,EAAE,EAAE;IACnC,MAAM,EACF,WAAW,EACX,SAAS,EACT,OAAO,EACP,KAAK,EAAE,WAAW,EAClB,SAAS,EACT,cAAc,GAAG,GAAG,EACpB,KAAK,EAAE,YAAY,GAAG,SAAS,EAC/B,UAAU,EAAE,gBAAgB,EAC5B,GAAG,YAAY,EAClB,GAAG,KAAK,CAAC;IAEV,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,QAAQ,CAAC,CAAC;IAEjF,MAAM,EAAC,WAAW,EAAE,yBAAyB,EAAE,GAAG,EAAE,iBAAiB,EAAC,GAClE,IAAA,+BAAuB,GAAE,CAAC;IAE9B,MAAM,SAAS,GAAG,IAAA,mCAAc,GAAE,GAAG,uBAAW,CAAC,EAAE,CAAC;IACpD,MAAM,eAAe,GAAG,gBAAgB,GAAG,yBAAyB,CAAC;IAErE,MAAM,YAAY,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAChC,MAAM,KAAK,GAAG,YAAY,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAE,YAAsB,CAAC;IAElF,MAAM,UAAU,GAAG,IAAA,sBAAc,EAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,IAAA,sBAAc,EAAC,WAAW,EAAE,KAAK,CAAC,CAAC;IAEjD,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAC7B,GAAG,EAAE,CACD,OAAO,EAAE,GAAG,CAAC,CAAC,YAAY,EAAE,EAAE;QAC1B,IAAI,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC;YACrC,OAAO,YAAY,CAAC;QACxB,CAAC;QAED,MAAM,MAAM,GAAG,IAAA,sBAAc,EAAC,YAAY,EAAE,KAAK,CAAgB,CAAC;QAElE,OAAO;YACH,IAAI,EAAE,IAAI;YACV,GAAG,MAAM;SACZ,CAAC;IACN,CAAC,CAAC,EACN,CAAC,OAAO,EAAE,KAAK,CAAC,CACnB,CAAC;IAEF,MAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CAChD,CAAC,EAAC,KAAK,EAAE,MAAM,EAAkC,EAAE,EAAE,CAAC,mBAAmB,CAAC,KAAK,GAAG,MAAM,CAAC,EACzF,EAAE,CACL,CAAC;IAEF,OAAO,CACH,oCAAQ,SAAS,EAAE,CAAC,EAAE,aACjB,UAAU,IAAI,CACX,uBAAC,kBAAK,IACF,SAAS,EAAE,CAAC,CAAC,YAAY,EAAE;oBACvB,CAAC,YAAY,CAAC,EAAE,SAAS;iBAC5B,CAAC,EACF,cAAc,EAAE,CAAC,CAAC,kBAAkB,CAAC,EACrC,cAAc,EAAE,CAAC,CAAC,kBAAkB,CAAC,KACjC,UAAU,EACd,YAAY,SACd,CACL,EACD,uBAAC,WAAI,cACD,iCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACvB,WAAW,IAAI,CACZ,uBAAC,8BAAiB,IACd,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,KACvB,WAAW,EACf,KAAK,EAAE,KAAK,GACd,CACL,EACD,iCACI,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE;gCACpB,CAAC,iBAAiB,CAAC,EAAE,cAAc;6BACtC,CAAC,aAED,SAAS,IAAI,CACV,gCAAK,SAAS,EAAE,CAAC,CAAC,mBAAmB,EAAE,EAAC,KAAK,EAAC,CAAC,YAC1C,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC7B,uBAAC,uBAAU,IACP,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE;4CACP,WAAW,EAAE,IAAI;4CACjB,gBAAgB,EAAE,KAAK;yCAC1B,GACH,CACL,CAAC,CAAC,CAAC,CACA,SAAS,CACZ,GACC,CACT,EACD,uBAAC,oBAAO,IACJ,IAAI,EAAC,IAAI,EACT,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAC,KACf,YAAY,EAChB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,YAAY,GACrB,IACA,EACL,KAAK,IAAI,CACN,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACtB,gCAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,GAAG,EAAE,iBAAiB,YACxD,uBAAC,kBAAK,IACF,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE;wCACpC,CAAC,eAAe,CAAC,EAAE,KAAK,CAAC,YAAY,IAAI,IAAI;wCAC7C,QAAQ,EAAE,SAAS,IAAI,eAAe;qCACzC,CAAC,KACE,KAAK,EACT,uBAAuB,QACvB,qBAAqB,EAAE,0BAA0B,GACnD,GACA,GACJ,CACT,IACC,GACH,IACF,CACZ,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,IAAI,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {HeaderBreadcrumbs, Media, YFMWrapper} from '../../components';\nimport {BREAKPOINTS} from '../../constants';\nimport {useTheme} from '../../context/theme';\nimport {useWindowWidth} from '../../context/windowWidthContext';\nimport {Grid} from '../../grid';\nimport {ButtonProps, HeroBlockProps, Theme} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport {useContainerAspectRatio} from './hooks';\n\nimport './Hero.scss';\n\nconst b = block('hero-block');\n\nconst Hero = (props: HeroBlockProps) => {\n    const {\n        breadcrumbs,\n        overtitle,\n        buttons,\n        media: themedMedia,\n        fullWidth,\n        verticalOffset = 'm',\n        theme: contentTheme = 'default',\n        background: themedBackground,\n        ...contentProps\n    } = props;\n\n    const [mediaAspectRatio, setMediaAspectRatio] = React.useState<number>(Infinity);\n\n    const {aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef} =\n        useContainerAspectRatio();\n\n    const isDesktop = useWindowWidth() > BREAKPOINTS.md;\n    const isMediaVertical = mediaAspectRatio < mediaContainerAspectRatio;\n\n    const contextTheme = useTheme();\n    const theme = contentTheme === 'default' ? contextTheme : (contentTheme as Theme);\n\n    const background = getThemedValue(themedBackground, theme);\n    const media = getThemedValue(themedMedia, theme);\n\n    const buttonProps = React.useMemo<(ButtonProps | React.ReactNode)[] | undefined>(\n        () =>\n            buttons?.map((buttonThemed) => {\n                if (React.isValidElement(buttonThemed)) {\n                    return buttonThemed;\n                }\n\n                const button = getThemedValue(buttonThemed, theme) as ButtonProps;\n\n                return {\n                    size: 'xl',\n                    ...button,\n                };\n            }),\n        [buttons, theme],\n    );\n\n    const onMediaIntrinsicSizeChange = React.useCallback(\n        ({width, height}: {width: number; height: number}) => setMediaAspectRatio(width / height),\n        [],\n    );\n\n    return (\n        <header className={b()}>\n            {background && (\n                <Media\n                    className={b('background', {\n                        ['full-width']: fullWidth,\n                    })}\n                    imageClassName={b('background-image')}\n                    videoClassName={b('background-video')}\n                    {...background}\n                    isBackground\n                />\n            )}\n            <Grid>\n                <div className={b('wrapper')}>\n                    {breadcrumbs && (\n                        <HeaderBreadcrumbs\n                            className={b('breadcrumbs')}\n                            {...breadcrumbs}\n                            theme={theme}\n                        />\n                    )}\n                    <div\n                        className={b('content', {\n                            ['vertical-offset']: verticalOffset,\n                        })}\n                    >\n                        {overtitle && (\n                            <div className={b('content-overtitle', {theme})}>\n                                {typeof overtitle === 'string' ? (\n                                    <YFMWrapper\n                                        tagName=\"span\"\n                                        content={overtitle}\n                                        modifiers={{\n                                            constructor: true,\n                                            constructorTheme: theme,\n                                        }}\n                                    />\n                                ) : (\n                                    overtitle\n                                )}\n                            </div>\n                        )}\n                        <Content\n                            size=\"xl\"\n                            colSizes={{all: 12}}\n                            {...contentProps}\n                            buttons={buttonProps}\n                            theme={contentTheme}\n                        />\n                    </div>\n                    {media && (\n                        <div className={b('media')}>\n                            <div className={b('media-container')} ref={mediaContainerRef}>\n                                <Media\n                                    className={b('media-container-content', {\n                                        ['round-corners']: media.roundCorners ?? true,\n                                        vertical: isDesktop && isMediaVertical,\n                                    })}\n                                    {...media}\n                                    disablePlayerAutoSizing\n                                    onIntrinsicSizeChange={onMediaIntrinsicSizeChange}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </Grid>\n        </header>\n    );\n};\n\nexport default Hero;\n"]}
+{"version":3,"file":"Hero.js","sourceRoot":"../../../../src","sources":["blocks/Hero/Hero.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {HeaderBreadcrumbs, Media, YFMWrapper} from '../../components';\nimport {BREAKPOINTS} from '../../constants';\nimport {useTheme} from '../../context/theme';\nimport {useWindowWidth} from '../../context/windowWidthContext';\nimport {Grid} from '../../grid';\nimport {ButtonProps, HeroBlockProps, Theme} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getQaAttrubutes, getThemedValue} from '../../utils';\n\nimport {useContainerAspectRatio} from './hooks';\n\nimport './Hero.scss';\n\nconst b = block('hero-block');\n\nconst QA_ID = 'hero-block';\n\nconst Hero = (props: HeroBlockProps) => {\n    const {\n        breadcrumbs,\n        overtitle,\n        buttons,\n        media: themedMedia,\n        fullWidth,\n        verticalOffset = 'm',\n        theme: contentTheme = 'default',\n        background: themedBackground,\n        ...contentProps\n    } = props;\n\n    const qaAttributes = getQaAttrubutes(QA_ID, [\n        'background',\n        'beadcrumbs',\n        'content-wrapper',\n        'content-overtitle',\n        'media-wrapper',\n        'media',\n    ]);\n\n    const [mediaAspectRatio, setMediaAspectRatio] = React.useState<number>(Infinity);\n\n    const {aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef} =\n        useContainerAspectRatio();\n\n    const isDesktop = useWindowWidth() > BREAKPOINTS.md;\n    const isMediaVertical = mediaAspectRatio < mediaContainerAspectRatio;\n\n    const contextTheme = useTheme();\n    const theme = contentTheme === 'default' ? contextTheme : (contentTheme as Theme);\n\n    const background = getThemedValue(themedBackground, theme);\n    const media = getThemedValue(themedMedia, theme);\n\n    const buttonProps = React.useMemo<(ButtonProps | React.ReactNode)[] | undefined>(\n        () =>\n            buttons?.map((buttonThemed) => {\n                if (React.isValidElement(buttonThemed)) {\n                    return buttonThemed;\n                }\n\n                const button = getThemedValue(buttonThemed, theme) as ButtonProps;\n\n                return {\n                    size: 'xl',\n                    ...button,\n                };\n            }),\n        [buttons, theme],\n    );\n\n    const onMediaIntrinsicSizeChange = React.useCallback(\n        ({width, height}: {width: number; height: number}) => setMediaAspectRatio(width / height),\n        [],\n    );\n\n    return (\n        <header className={b()} data-qa={qaAttributes.default}>\n            {background && (\n                <Media\n                    className={b('background', {\n                        ['full-width']: fullWidth,\n                    })}\n                    imageClassName={b('background-image')}\n                    videoClassName={b('background-video')}\n                    {...background}\n                    isBackground\n                    qa={qaAttributes.background}\n                />\n            )}\n            <Grid>\n                <div className={b('wrapper')} data-qa={qaAttributes.wrapper}>\n                    {breadcrumbs && (\n                        <HeaderBreadcrumbs\n                            className={b('breadcrumbs')}\n                            {...breadcrumbs}\n                            theme={theme}\n                            qa={qaAttributes.breadcrumbs}\n                        />\n                    )}\n                    <div\n                        className={b('content', {\n                            ['vertical-offset']: verticalOffset,\n                        })}\n                        data-qa={qaAttributes.contentWrapper}\n                    >\n                        {overtitle && (\n                            <div\n                                className={b('content-overtitle', {theme})}\n                                data-qa={qaAttributes.contentOvertitle}\n                            >\n                                {typeof overtitle === 'string' ? (\n                                    <YFMWrapper\n                                        tagName=\"span\"\n                                        content={overtitle}\n                                        modifiers={{\n                                            constructor: true,\n                                            constructorTheme: theme,\n                                        }}\n                                    />\n                                ) : (\n                                    overtitle\n                                )}\n                            </div>\n                        )}\n                        <Content\n                            size=\"xl\"\n                            colSizes={{all: 12}}\n                            {...contentProps}\n                            buttons={buttonProps}\n                            theme={contentTheme}\n                            qa={qaAttributes.content}\n                        />\n                    </div>\n                    {media && (\n                        <div className={b('media')} data-qa={qaAttributes.mediaWrapper}>\n                            <div className={b('media-container')} ref={mediaContainerRef}>\n                                <Media\n                                    className={b('media-container-content', {\n                                        ['round-corners']: media.roundCorners ?? true,\n                                        vertical: isDesktop && isMediaVertical,\n                                    })}\n                                    {...media}\n                                    disablePlayerAutoSizing\n                                    onIntrinsicSizeChange={onMediaIntrinsicSizeChange}\n                                    qa={qaAttributes.mediaContainerContent}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </Grid>\n        </header>\n    );\n};\n\nexport default Hero;\n"]}

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -10,11 +10,12 @@ const utils_1 = require("../../utils/index.js");
 const i18n_1 = require("./i18n/index.js");
 const b = (0, utils_1.block)('header-breadcrumbs');
 function HeaderBreadcrumbs(props) {
-    const { items, theme = 'light', className, analyticsEvents } = props;
+    const { items, theme = 'light', className, analyticsEvents, qa } = props;
+    const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, ['list', 'item']);
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.Breadcrumb);
     const onClick = React.useCallback(() => {
         handleAnalytics(analyticsEvents);
     }, [analyticsEvents, handleAnalytics]);
-    return ((0, jsx_runtime_1.jsx)("nav", { className: b({ theme }, className), "aria-label": (0, i18n_1.i18n)('label'), children: (0, jsx_runtime_1.jsx)("ol", { className: b('list'), children: items?.map(({ url, text }) => ((0, jsx_runtime_1.jsxs)("li", { className: b('item'), children: [(0, jsx_runtime_1.jsx)("a", { href: url, className: b('text'), onClick: onClick, children: text }), (0, jsx_runtime_1.jsx)("span", { className: b('separator'), "aria-hidden": true, children: "/" })] }, url))) }) }));
+    return ((0, jsx_runtime_1.jsx)("nav", { className: b({ theme }, className), "aria-label": (0, i18n_1.i18n)('label'), "data-qa": qaAttributes.default, children: (0, jsx_runtime_1.jsx)("ol", { className: b('list'), "data-qa": qaAttributes.list, children: items?.map(({ url, text }) => ((0, jsx_runtime_1.jsxs)("li", { className: b('item'), "data-qa": qaAttributes.item, children: [(0, jsx_runtime_1.jsx)("a", { href: url, className: b('text'), onClick: onClick, children: text }), (0, jsx_runtime_1.jsx)("span", { className: b('separator'), "aria-hidden": true, children: "/" })] }, url))) }) }));
 }
 //# sourceMappingURL=HeaderBreadcrumbs.js.map

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderBreadcrumbs.js","sourceRoot":"../../../../src","sources":["components/HeaderBreadcrumbs/HeaderBreadcrumbs.tsx"],"names":[],"mappings":";;AAYA,oCAwBC;;;AApCD,qDAA+B;AAE/B,gDAAyC;AACzC,kDAAuE;AACvE,gDAAkC;AAElC,0CAA4B;AAI5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,oBAAoB,CAAC,CAAC;AAEtC,SAAwB,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAC,KAAK,EAAE,KAAK,GAAG,OAAO,EAAE,SAAS,EAAE,eAAe,EAAC,GAAG,KAAK,CAAC;IACnE,MAAM,eAAe,GAAG,IAAA,oBAAY,EAAC,0BAAiB,CAAC,UAAU,CAAC,CAAC;IAEnE,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACnC,eAAe,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC;IAEvC,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,KAAK,EAAC,EAAE,SAAS,CAAC,gBAAc,IAAA,WAAI,EAAC,OAAO,CAAC,YAC5D,+BAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACnB,KAAK,EAAE,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,EAAC,EAAE,EAAE,CAAC,CACzB,gCAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aACpB,8BAAG,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,YAC/C,IAAI,GACL,EACJ,iCAAM,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,uCAExB,KANoB,GAAG,CAO7B,CACR,CAAC,GACD,GACH,CACT,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, HeaderBreadCrumbsProps} from '../../models';\nimport {block} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './HeaderBreadcrumbs.scss';\n\nconst b = block('header-breadcrumbs');\n\nexport default function HeaderBreadcrumbs(props: HeaderBreadCrumbsProps) {\n    const {items, theme = 'light', className, analyticsEvents} = props;\n    const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);\n\n    const onClick = React.useCallback(() => {\n        handleAnalytics(analyticsEvents);\n    }, [analyticsEvents, handleAnalytics]);\n\n    return (\n        <nav className={b({theme}, className)} aria-label={i18n('label')}>\n            <ol className={b('list')}>\n                {items?.map(({url, text}) => (\n                    <li className={b('item')} key={url}>\n                        <a href={url} className={b('text')} onClick={onClick}>\n                            {text}\n                        </a>\n                        <span className={b('separator')} aria-hidden>\n                            /\n                        </span>\n                    </li>\n                ))}\n            </ol>\n        </nav>\n    );\n}\n"]}
+{"version":3,"file":"HeaderBreadcrumbs.js","sourceRoot":"../../../../src","sources":["components/HeaderBreadcrumbs/HeaderBreadcrumbs.tsx"],"names":[],"mappings":";;AAYA,oCA8BC;;;AA1CD,qDAA+B;AAE/B,gDAAyC;AACzC,kDAAuE;AACvE,gDAAmD;AAEnD,0CAA4B;AAI5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,oBAAoB,CAAC,CAAC;AAEtC,SAAwB,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAC,KAAK,EAAE,KAAK,GAAG,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,EAAC,GAAG,KAAK,CAAC;IACvE,MAAM,YAAY,GAAG,IAAA,uBAAe,EAAC,EAAE,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IAE3D,MAAM,eAAe,GAAG,IAAA,oBAAY,EAAC,0BAAiB,CAAC,UAAU,CAAC,CAAC;IAEnE,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACnC,eAAe,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC;IAEvC,OAAO,CACH,gCACI,SAAS,EAAE,CAAC,CAAC,EAAC,KAAK,EAAC,EAAE,SAAS,CAAC,gBACpB,IAAA,WAAI,EAAC,OAAO,CAAC,aAChB,YAAY,CAAC,OAAO,YAE7B,+BAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aAAW,YAAY,CAAC,IAAI,YAC/C,KAAK,EAAE,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,EAAC,EAAE,EAAE,CAAC,CACzB,gCAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aAAqB,YAAY,CAAC,IAAI,aAC1D,8BAAG,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,YAC/C,IAAI,GACL,EACJ,iCAAM,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,uCAExB,KANoB,GAAG,CAO7B,CACR,CAAC,GACD,GACH,CACT,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, HeaderBreadCrumbsProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './HeaderBreadcrumbs.scss';\n\nconst b = block('header-breadcrumbs');\n\nexport default function HeaderBreadcrumbs(props: HeaderBreadCrumbsProps) {\n    const {items, theme = 'light', className, analyticsEvents, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa, ['list', 'item']);\n\n    const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);\n\n    const onClick = React.useCallback(() => {\n        handleAnalytics(analyticsEvents);\n    }, [analyticsEvents, handleAnalytics]);\n\n    return (\n        <nav\n            className={b({theme}, className)}\n            aria-label={i18n('label')}\n            data-qa={qaAttributes.default}\n        >\n            <ol className={b('list')} data-qa={qaAttributes.list}>\n                {items?.map(({url, text}) => (\n                    <li className={b('item')} key={url} data-qa={qaAttributes.item}>\n                        <a href={url} className={b('text')} onClick={onClick}>\n                            {text}\n                        </a>\n                        <span className={b('separator')} aria-hidden>\n                            /\n                        </span>\n                    </li>\n                ))}\n            </ol>\n        </nav>\n    );\n}\n"]}

package/build/cjs/components/Title/Title.d.ts

@@ -1,9 +1,9 @@
 import { GridColumnSizesType, GridJustifyContent } from "../../grid/index.js";
-import { ClassNameProps, TitleProps as TitleParams } from "../../models/index.js";
-export interface TitleProps extends TitleParams {
+import { ClassNameProps, QAProps, TitleProps as TitleParams } from "../../models/index.js";
+export interface TitleProps extends TitleParams, QAProps {
     colSizes?: GridColumnSizesType;
     colJustifyContent?: GridJustifyContent;
     id?: string;
 }
-declare const Title: ({ title, subtitle, className, colSizes, colJustifyContent, id, }: TitleProps & ClassNameProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Title: ({ title, subtitle, className, colSizes, colJustifyContent, id, qa, }: TitleProps & ClassNameProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Title;

package/build/cjs/components/Title/Title.js

@@ -7,12 +7,13 @@ const utils_1 = require("../../utils/index.js");
 const YFMWrapper_1 = tslib_1.__importDefault(require("../YFMWrapper/YFMWrapper.js"));
 const TitleItem_1 = tslib_1.__importDefault(require("./TitleItem.js"));
 const b = (0, utils_1.block)('title');
-const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, colJustifyContent, id, }) => {
+const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, colJustifyContent, id, qa, }) => {
     if (!title && !subtitle) {
         return null;
     }
+    const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, ['title', 'subtitle']);
     const { text, ...titleProps } = !title || typeof title === 'string' ? { text: title } : title;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), id: id, children: [text && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: (0, jsx_runtime_1.jsx)(TitleItem_1.default, { text: text, ...titleProps }) })), subtitle && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: (0, jsx_runtime_1.jsx)("div", { className: b('description', { titleSize: titleProps?.textSize }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), id: id, children: [text && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: (0, jsx_runtime_1.jsx)(TitleItem_1.default, { text: text, ...titleProps, qa: qaAttributes.title }) })), subtitle && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: (0, jsx_runtime_1.jsx)("div", { className: b('description', { titleSize: titleProps?.textSize }), "data-qa": qaAttributes.subtitle, children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
 };
 exports.default = Title;
 //# sourceMappingURL=Title.js.map

package/build/cjs/components/Title/Title.js.map

@@ -1 +1 @@
-{"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";;;;AAAA,8CAAwE;AAExE,gDAAkC;AAClC,qFAAkD;AAElD,uEAAoC;AAIpC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,OAAO,CAAC,CAAC;AAQzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,iBAAiB,EACjB,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,EAAC,IAAI,EAAE,GAAG,UAAU,EAAC,GACvB,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,uBAAC,UAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,uBAAC,mBAAS,IAAC,IAAI,EAAE,IAAI,KAAM,UAAU,GAAI,GACvC,CACT,EACA,QAAQ,IAAI,CACT,uBAAC,UAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,gCAAK,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,YAC/D,uBAAC,oBAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType, GridJustifyContent} from '../../grid';\nimport {ClassNameProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams {\n    colSizes?: GridColumnSizesType;\n    colJustifyContent?: GridJustifyContent;\n    id?: string;\n}\n\nconst Title = ({\n    title,\n    subtitle,\n    className,\n    colSizes = {all: 12, sm: 8},\n    colJustifyContent,\n    id,\n}: TitleProps & ClassNameProps) => {\n    if (!title && !subtitle) {\n        return null;\n    }\n\n    const {text, ...titleProps} =\n        !title || typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n    return (\n        <div className={b(null, className)} id={id}>\n            {text && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <TitleItem text={text} {...titleProps} />\n                </Col>\n            )}\n            {subtitle && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <div className={b('description', {titleSize: titleProps?.textSize})}>\n                        <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n                    </div>\n                </Col>\n            )}\n        </div>\n    );\n};\n\nexport default Title;\n"]}
+{"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";;;;AAAA,8CAAwE;AAExE,gDAAmD;AACnD,qFAAkD;AAElD,uEAAoC;AAIpC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,OAAO,CAAC,CAAC;AAQzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,iBAAiB,EACjB,EAAE,EACF,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,YAAY,GAAG,IAAA,uBAAe,EAAC,EAAE,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhE,MAAM,EAAC,IAAI,EAAE,GAAG,UAAU,EAAC,GACvB,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,uBAAC,UAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,uBAAC,mBAAS,IAAC,IAAI,EAAE,IAAI,KAAM,UAAU,EAAE,EAAE,EAAE,YAAY,CAAC,KAAK,GAAI,GAC/D,CACT,EACA,QAAQ,IAAI,CACT,uBAAC,UAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,gCACI,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,aACrD,YAAY,CAAC,QAAQ,YAE9B,uBAAC,oBAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType, GridJustifyContent} from '../../grid';\nimport {ClassNameProps, QAProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams, QAProps {\n    colSizes?: GridColumnSizesType;\n    colJustifyContent?: GridJustifyContent;\n    id?: string;\n}\n\nconst Title = ({\n    title,\n    subtitle,\n    className,\n    colSizes = {all: 12, sm: 8},\n    colJustifyContent,\n    id,\n    qa,\n}: TitleProps & ClassNameProps) => {\n    if (!title && !subtitle) {\n        return null;\n    }\n\n    const qaAttributes = getQaAttrubutes(qa, ['title', 'subtitle']);\n\n    const {text, ...titleProps} =\n        !title || typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n    return (\n        <div className={b(null, className)} id={id}>\n            {text && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <TitleItem text={text} {...titleProps} qa={qaAttributes.title} />\n                </Col>\n            )}\n            {subtitle && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <div\n                        className={b('description', {titleSize: titleProps?.textSize})}\n                        data-qa={qaAttributes.subtitle}\n                    >\n                        <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n                    </div>\n                </Col>\n            )}\n        </div>\n    );\n};\n\nexport default Title;\n"]}

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

@@ -313,7 +313,7 @@ export interface AuthorItem {
     description?: string;
     avatar?: ThemeSupporting<ImageProps> | JSX.Element;
 }
-export interface HeaderBreadCrumbsProps extends ClassNameProps {
+export interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {
     items: {
         url: string;
         text: React.ReactNode;

package/build/cjs/models/constructor-items/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":";;;AAQA,QAAQ;AACR,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,0BAAV,UAAU,QAGrB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,+BAAf,eAAe,QAM1B;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACjB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAED,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,+CAA/B,+BAA+B,QAI1C;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,sCAAtB,sBAAsB,QAGjC;AAED,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,yBAAT,SAAS,QAGpB;AAuED,SAAS;AAET,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,sBAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n    Column = 'column',\n    Line = 'line',\n}\n\nexport enum PriceDetailsType {\n    MARKED_LIST = 'marked-list',\n    SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n    BLUE = 'blue',\n    GREEN = 'green',\n    YELLOW = 'yellow',\n    PURPLE = 'purple',\n    RED = 'red',\n}\n\nexport enum PlayButtonType {\n    Default = 'default',\n    Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n    Blue = 'blue',\n    Grey = 'grey',\n}\n\nexport enum CustomControlsType {\n    WithMuteButton = 'with-mute-button',\n    WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n    Left = 'left',\n    Right = 'right',\n    Center = 'center',\n}\n\nexport enum MediaVideoType {\n    Default = 'default',\n    Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n    Default = 'default',\n    Custom = 'custom',\n}\n\nexport enum QuoteType {\n    Chevron = 'chevron', // « »\n    EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' | 'dark';\nexport type TextSize = 'xs' | 's' | 'sm' | 'm' | 'l';\nexport type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\nexport type HeaderWidth = 's' | 'm' | 'l';\nexport type HeaderImageSize = 's' | 'm';\nexport type HeaderOffset = 'default' | 'large';\nexport type Justify = 'start' | 'center' | 'end';\nexport type ColumnsCount = 1 | 2 | 3 | 4;\nexport type LegendTableMarkerType = 'disk' | 'tick';\nexport type LinkTheme = 'file-link' | 'normal' | 'back' | 'underline';\nexport type MediaDirection = 'media-content' | 'content-media';\nexport type PriceDescriptionColor = 'cornflower' | 'black';\nexport type ContentSize = 's' | 'm' | 'l' | 'xl';\nexport type ContentTextSize = 's' | 'm' | 'l';\nexport type ContentTheme = 'default' | 'dark' | 'light';\nexport type FileLinkType = 'vertical' | 'horizontal';\nexport type ImageCardMargins = 's' | 'm';\nexport type LayoutItemContentMargin = 'm' | 'l';\nexport type GravityIconProps = string | {name: keyof typeof icons; color: 'brand' | 'text-color'};\n\n// modifiers\nexport interface Themable {\n    theme?: TextTheme;\n}\n\nexport interface Justifyable {\n    justify?: Justify;\n}\n\nexport interface Stylable {\n    className?: string;\n}\n\nexport interface Animatable {\n    animated?: boolean;\n}\n\nexport interface Tabbable {\n    tabIndex?: number;\n}\n\nexport interface Roleable {\n    role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n    ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n    image?: string;\n    color?: string;\n}\n\nexport interface AnchorProps {\n    text: string;\n    url: string;\n}\n\n/**\n * @deprecated Component VideoBlock will be deleted, which uses this logic\n */\ninterface LoopProps {\n    start: number;\n    end?: number;\n}\n\n// images\n\nexport enum Device {\n    Desktop = 'desktop',\n    Mobile = 'mobile',\n    Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n    extends Pick<\n            React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n            'aria-describedby' | 'loading'\n        >,\n        ImageDevicesVisibleProps {\n    alt?: string;\n    fetchPriority?: 'high' | 'low' | 'auto';\n    disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n    src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n    [Device.Desktop]: string;\n    [Device.Mobile]: string;\n    [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n    hide?: boolean | Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string | ImageObjectProps | ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n    extends React.HTMLProps<HTMLDivElement>,\n        Partial<ImageDeviceProps>,\n        Partial<ImageObjectProps>,\n        QAProps,\n        ImageDevicesVisibleProps {\n    style?: React.CSSProperties;\n    imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n    src: string[];\n    type?: MediaVideoType;\n    loop?: LoopProps | boolean;\n    muted?: boolean;\n    autoplay?: boolean;\n    elapsedTime?: number;\n    playButton?: PlayButtonProps;\n    controls?: MediaVideoControlsType;\n    customControlsOptions?: CustomControlsOptions;\n    ariaLabel?: string;\n    contain?: boolean;\n    onVideoEnd?: () => void;\n    ref?: React.Ref<HTMLVideoElement | null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n    url: string;\n    urlTitle?: string;\n    text?: string;\n    textSize?: TextSize;\n    theme?: LinkTheme;\n    colorTheme?: TextTheme;\n    arrow?: boolean;\n    target?: string;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n    href: string;\n    text: React.ReactNode;\n    type?: FileLinkType;\n    textSize?: TextSize;\n    theme?: ContentTheme;\n    urlTitle?: string;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n    | ButtonView\n    | 'github'\n    | 'app-store'\n    | 'google-play'\n    | 'scale'\n    | 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n    text: string;\n    url: string;\n    urlTitle?: string;\n    primary?: boolean;\n    theme?: ButtonTheme;\n    img?: ButtonImageProps | string;\n    target?: string;\n    size?: UikitButtonProps['size'];\n    width?: UikitButtonProps['width'];\n    extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' | 'right';\n\nexport interface ButtonImageProps {\n    url?: string;\n    position?: ButtonImagePosition;\n    alt?: string;\n    iconData?: IconData;\n    iconSize?: number;\n    className?: string;\n}\n\nexport interface CustomControlsOptions {\n    type?: CustomControlsType;\n    muteButtonShown?: boolean;\n    positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n    type?: PlayButtonType;\n    theme?: PlayButtonThemes;\n    text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n    video: MediaVideoProps;\n    height?: number;\n    ratio?: number | 'auto';\n    previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n    videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n    youtube: string;\n    previewImg?: string;\n    fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n    image: ImageProps | ImageProps[] | ImageDeviceProps;\n    video?: MediaVideoProps;\n    parallax?: boolean;\n    height?: number;\n    disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n    dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n    iframe: IframeProps;\n    margins?: boolean;\n}\n\nexport interface MediaProps\n    extends Animatable,\n        Partial<MediaComponentDataLensProps>,\n        Partial<MediaComponentYoutubeProps>,\n        Partial<MediaComponentVideoIframeProps>,\n        Partial<MediaComponentImageProps>,\n        Partial<MediaComponentIframeProps>,\n        Partial<MediaComponentVideoProps> {\n    color?: string;\n    videoMicrodata?: {\n        name?: string;\n        description?: string;\n        duration?: string;\n        uploadDate?: string;\n        contentUrl?: string;\n        thumbnailUrl?: string;\n    };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n    fullWidthMedia?: boolean;\n    className?: string;\n    mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n    zoom?: number;\n    className?: string;\n    forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n    address: string;\n}\n\nexport type YMapMargin =\n    | number\n    | [vertical: number, horizontal: number]\n    | [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n    top?: number;\n    right?: number;\n    bottom?: number;\n    left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n    markers: YMapMarker[];\n    disableControls?: boolean;\n    disableBalloons?: boolean;\n    areaMargin?: YMapMargin;\n    copyrightPosition?: YMapCopyrightPosition;\n    id: string;\n}\n\nexport interface YMapMarker {\n    address?: string;\n    coordinate?: Coordinate;\n    label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n    iconCaption?: string;\n    iconContent?: string;\n    iconColor?: string;\n    iconImageHref?: string;\n    iconImageSize?: [number, number];\n    iconImageOffset?: [number, number];\n    iconImageClipRect?: [[number, number], [number, number]];\n    iconLayout?: 'default#image';\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    iconShape?: Record<string, any>;\n    preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n    label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n    cursor?: string;\n    interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps | YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n    id: string;\n    theme: 'dark' | 'light';\n}\n\nexport interface IframeProps {\n    src: string;\n    width?: number;\n    height?: number;\n    title?: string;\n    name?: string;\n}\n\nexport type DataLensProps = string | DataLensObjectProps;\n\nexport interface AuthorItem {\n    firstName: string;\n    secondName: string;\n    description?: string;\n    avatar?: ThemeSupporting<ImageProps> | JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps {\n    items: {\n        url: string;\n        text: React.ReactNode;\n    }[];\n    theme?: TextTheme;\n    analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n    navTitle?: string;\n    anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n    text: string;\n    textSize?: TextSize;\n    url?: string;\n    urlTitle?: string;\n    custom?: string | React.ReactNode;\n    onClick?: () => void;\n}\n\nexport type MediaView = 'fit' | 'full';\n\n// card\nexport type MediaBorder = 'shadow' | 'line' | 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' | 'footer';\n\nexport interface CardBaseProps {\n    border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n    controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n    title: string;\n    detailedTitle?: string;\n    description: string;\n    label?: {\n        color: PriceLabelColor;\n        text?: string;\n        size?: TextSize;\n    };\n}\n\nexport interface PriceDetailsSettingsProps {\n    title: string;\n    description: string;\n}\n\nexport interface PriceDetailsListProps {\n    text: string;\n}\n\nexport interface PriceDetailsProps {\n    items?: PriceDetailsSettingsProps[] | PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n    extends PriceDetailsProps,\n        PriceDescriptionProps,\n        AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n    title: string;\n    size?: TextSize;\n    titleColor?: PriceDescriptionColor;\n}\n\n/** @deprecated */\nexport interface PriceDetailedProps extends CardBaseProps {\n    items: PriceItemProps[];\n    description?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n        titleColor?: PriceDescriptionColor;\n    };\n    details?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n    };\n    priceType?: PriceDetailsType;\n    numberGroupItems?: 3 | 4 | 5;\n    isCombined?: boolean;\n    useMixedView?: boolean;\n    foldable?: PriceFoldableDetailsProps;\n    labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n    author: AuthorItem;\n    className?: string;\n    authorContainerClassName?: string;\n    type?: AuthorType;\n    theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n    title?: TitleItemProps | string;\n    subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n    id: number | string;\n    containerId?: string;\n    theme?: string;\n    className?: string;\n    headerHeight?: number;\n    customFormOrigin?: string;\n    customFormSection?: string;\n    params?: {[key: string]: string};\n\n    onSubmit?: () => void;\n    onLoad?: () => void;\n}\n\nexport interface WithBorder {\n    border?: MediaBorder;\n    /**\n     * @deprecated use custom class for media-component\n     */\n    disableShadow?: boolean;\n}\n"]}
+{"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":";;;AAQA,QAAQ;AACR,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,0BAAV,UAAU,QAGrB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,+BAAf,eAAe,QAM1B;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACjB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAED,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,+CAA/B,+BAA+B,QAI1C;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,sCAAtB,sBAAsB,QAGjC;AAED,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,yBAAT,SAAS,QAGpB;AAuED,SAAS;AAET,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,sBAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n    Column = 'column',\n    Line = 'line',\n}\n\nexport enum PriceDetailsType {\n    MARKED_LIST = 'marked-list',\n    SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n    BLUE = 'blue',\n    GREEN = 'green',\n    YELLOW = 'yellow',\n    PURPLE = 'purple',\n    RED = 'red',\n}\n\nexport enum PlayButtonType {\n    Default = 'default',\n    Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n    Blue = 'blue',\n    Grey = 'grey',\n}\n\nexport enum CustomControlsType {\n    WithMuteButton = 'with-mute-button',\n    WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n    Left = 'left',\n    Right = 'right',\n    Center = 'center',\n}\n\nexport enum MediaVideoType {\n    Default = 'default',\n    Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n    Default = 'default',\n    Custom = 'custom',\n}\n\nexport enum QuoteType {\n    Chevron = 'chevron', // « »\n    EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' | 'dark';\nexport type TextSize = 'xs' | 's' | 'sm' | 'm' | 'l';\nexport type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\nexport type HeaderWidth = 's' | 'm' | 'l';\nexport type HeaderImageSize = 's' | 'm';\nexport type HeaderOffset = 'default' | 'large';\nexport type Justify = 'start' | 'center' | 'end';\nexport type ColumnsCount = 1 | 2 | 3 | 4;\nexport type LegendTableMarkerType = 'disk' | 'tick';\nexport type LinkTheme = 'file-link' | 'normal' | 'back' | 'underline';\nexport type MediaDirection = 'media-content' | 'content-media';\nexport type PriceDescriptionColor = 'cornflower' | 'black';\nexport type ContentSize = 's' | 'm' | 'l' | 'xl';\nexport type ContentTextSize = 's' | 'm' | 'l';\nexport type ContentTheme = 'default' | 'dark' | 'light';\nexport type FileLinkType = 'vertical' | 'horizontal';\nexport type ImageCardMargins = 's' | 'm';\nexport type LayoutItemContentMargin = 'm' | 'l';\nexport type GravityIconProps = string | {name: keyof typeof icons; color: 'brand' | 'text-color'};\n\n// modifiers\nexport interface Themable {\n    theme?: TextTheme;\n}\n\nexport interface Justifyable {\n    justify?: Justify;\n}\n\nexport interface Stylable {\n    className?: string;\n}\n\nexport interface Animatable {\n    animated?: boolean;\n}\n\nexport interface Tabbable {\n    tabIndex?: number;\n}\n\nexport interface Roleable {\n    role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n    ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n    image?: string;\n    color?: string;\n}\n\nexport interface AnchorProps {\n    text: string;\n    url: string;\n}\n\n/**\n * @deprecated Component VideoBlock will be deleted, which uses this logic\n */\ninterface LoopProps {\n    start: number;\n    end?: number;\n}\n\n// images\n\nexport enum Device {\n    Desktop = 'desktop',\n    Mobile = 'mobile',\n    Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n    extends Pick<\n            React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n            'aria-describedby' | 'loading'\n        >,\n        ImageDevicesVisibleProps {\n    alt?: string;\n    fetchPriority?: 'high' | 'low' | 'auto';\n    disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n    src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n    [Device.Desktop]: string;\n    [Device.Mobile]: string;\n    [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n    hide?: boolean | Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string | ImageObjectProps | ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n    extends React.HTMLProps<HTMLDivElement>,\n        Partial<ImageDeviceProps>,\n        Partial<ImageObjectProps>,\n        QAProps,\n        ImageDevicesVisibleProps {\n    style?: React.CSSProperties;\n    imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n    src: string[];\n    type?: MediaVideoType;\n    loop?: LoopProps | boolean;\n    muted?: boolean;\n    autoplay?: boolean;\n    elapsedTime?: number;\n    playButton?: PlayButtonProps;\n    controls?: MediaVideoControlsType;\n    customControlsOptions?: CustomControlsOptions;\n    ariaLabel?: string;\n    contain?: boolean;\n    onVideoEnd?: () => void;\n    ref?: React.Ref<HTMLVideoElement | null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n    url: string;\n    urlTitle?: string;\n    text?: string;\n    textSize?: TextSize;\n    theme?: LinkTheme;\n    colorTheme?: TextTheme;\n    arrow?: boolean;\n    target?: string;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n    href: string;\n    text: React.ReactNode;\n    type?: FileLinkType;\n    textSize?: TextSize;\n    theme?: ContentTheme;\n    urlTitle?: string;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n    | ButtonView\n    | 'github'\n    | 'app-store'\n    | 'google-play'\n    | 'scale'\n    | 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n    text: string;\n    url: string;\n    urlTitle?: string;\n    primary?: boolean;\n    theme?: ButtonTheme;\n    img?: ButtonImageProps | string;\n    target?: string;\n    size?: UikitButtonProps['size'];\n    width?: UikitButtonProps['width'];\n    extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' | 'right';\n\nexport interface ButtonImageProps {\n    url?: string;\n    position?: ButtonImagePosition;\n    alt?: string;\n    iconData?: IconData;\n    iconSize?: number;\n    className?: string;\n}\n\nexport interface CustomControlsOptions {\n    type?: CustomControlsType;\n    muteButtonShown?: boolean;\n    positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n    type?: PlayButtonType;\n    theme?: PlayButtonThemes;\n    text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n    video: MediaVideoProps;\n    height?: number;\n    ratio?: number | 'auto';\n    previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n    videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n    youtube: string;\n    previewImg?: string;\n    fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n    image: ImageProps | ImageProps[] | ImageDeviceProps;\n    video?: MediaVideoProps;\n    parallax?: boolean;\n    height?: number;\n    disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n    dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n    iframe: IframeProps;\n    margins?: boolean;\n}\n\nexport interface MediaProps\n    extends Animatable,\n        Partial<MediaComponentDataLensProps>,\n        Partial<MediaComponentYoutubeProps>,\n        Partial<MediaComponentVideoIframeProps>,\n        Partial<MediaComponentImageProps>,\n        Partial<MediaComponentIframeProps>,\n        Partial<MediaComponentVideoProps> {\n    color?: string;\n    videoMicrodata?: {\n        name?: string;\n        description?: string;\n        duration?: string;\n        uploadDate?: string;\n        contentUrl?: string;\n        thumbnailUrl?: string;\n    };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n    fullWidthMedia?: boolean;\n    className?: string;\n    mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n    zoom?: number;\n    className?: string;\n    forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n    address: string;\n}\n\nexport type YMapMargin =\n    | number\n    | [vertical: number, horizontal: number]\n    | [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n    top?: number;\n    right?: number;\n    bottom?: number;\n    left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n    markers: YMapMarker[];\n    disableControls?: boolean;\n    disableBalloons?: boolean;\n    areaMargin?: YMapMargin;\n    copyrightPosition?: YMapCopyrightPosition;\n    id: string;\n}\n\nexport interface YMapMarker {\n    address?: string;\n    coordinate?: Coordinate;\n    label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n    iconCaption?: string;\n    iconContent?: string;\n    iconColor?: string;\n    iconImageHref?: string;\n    iconImageSize?: [number, number];\n    iconImageOffset?: [number, number];\n    iconImageClipRect?: [[number, number], [number, number]];\n    iconLayout?: 'default#image';\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    iconShape?: Record<string, any>;\n    preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n    label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n    cursor?: string;\n    interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps | YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n    id: string;\n    theme: 'dark' | 'light';\n}\n\nexport interface IframeProps {\n    src: string;\n    width?: number;\n    height?: number;\n    title?: string;\n    name?: string;\n}\n\nexport type DataLensProps = string | DataLensObjectProps;\n\nexport interface AuthorItem {\n    firstName: string;\n    secondName: string;\n    description?: string;\n    avatar?: ThemeSupporting<ImageProps> | JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {\n    items: {\n        url: string;\n        text: React.ReactNode;\n    }[];\n    theme?: TextTheme;\n    analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n    navTitle?: string;\n    anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n    text: string;\n    textSize?: TextSize;\n    url?: string;\n    urlTitle?: string;\n    custom?: string | React.ReactNode;\n    onClick?: () => void;\n}\n\nexport type MediaView = 'fit' | 'full';\n\n// card\nexport type MediaBorder = 'shadow' | 'line' | 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' | 'footer';\n\nexport interface CardBaseProps {\n    border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n    controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n    title: string;\n    detailedTitle?: string;\n    description: string;\n    label?: {\n        color: PriceLabelColor;\n        text?: string;\n        size?: TextSize;\n    };\n}\n\nexport interface PriceDetailsSettingsProps {\n    title: string;\n    description: string;\n}\n\nexport interface PriceDetailsListProps {\n    text: string;\n}\n\nexport interface PriceDetailsProps {\n    items?: PriceDetailsSettingsProps[] | PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n    extends PriceDetailsProps,\n        PriceDescriptionProps,\n        AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n    title: string;\n    size?: TextSize;\n    titleColor?: PriceDescriptionColor;\n}\n\n/** @deprecated */\nexport interface PriceDetailedProps extends CardBaseProps {\n    items: PriceItemProps[];\n    description?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n        titleColor?: PriceDescriptionColor;\n    };\n    details?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n    };\n    priceType?: PriceDetailsType;\n    numberGroupItems?: 3 | 4 | 5;\n    isCombined?: boolean;\n    useMixedView?: boolean;\n    foldable?: PriceFoldableDetailsProps;\n    labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n    author: AuthorItem;\n    className?: string;\n    authorContainerClassName?: string;\n    type?: AuthorType;\n    theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n    title?: TitleItemProps | string;\n    subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n    id: number | string;\n    containerId?: string;\n    theme?: string;\n    className?: string;\n    headerHeight?: number;\n    customFormOrigin?: string;\n    customFormSection?: string;\n    params?: {[key: string]: string};\n\n    onSubmit?: () => void;\n    onLoad?: () => void;\n}\n\nexport interface WithBorder {\n    border?: MediaBorder;\n    /**\n     * @deprecated use custom class for media-component\n     */\n    disableShadow?: boolean;\n}\n"]}

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

@@ -23,18 +23,26 @@ function getTextSize(size) {
 }
 const Content = (props) => {
     const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, controlPosition, } = props;
-    const qaAttributes = (0, blocks_1.getQaAttrubutes)(qa, ['links', 'link', 'buttons', 'button', 'list']);
+    const qaAttributes = (0, blocks_1.getQaAttrubutes)(qa, [
+        'title',
+        'links',
+        'link',
+        'additional-info',
+        'buttons',
+        'button',
+        'list',
+    ]);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: getTextSize(size) }
         : title;
     const hasTitle = Boolean(title);
     const defaultTitleId = (0, uikit_1.useUniqId)();
     const titleId = titleIdFromProps || defaultTitleId;
-    return ((0, jsx_runtime_1.jsxs)(grid_1.Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container, children: [title && ((0, jsx_runtime_1.jsx)(components_1.Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })), text && ((0, jsx_runtime_1.jsx)("div", { className: b('text', { ['without-title']: !hasTitle }), children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId, qa: qaAttributes.list }) })), list?.length ? ((0, jsx_runtime_1.jsx)("div", { className: b('list'), children: (0, jsx_runtime_1.jsx)(components_1.ContentList, { list: list, size: size, qa: qaAttributes.list, theme: theme }) })) : null, additionalInfo && ((0, jsx_runtime_1.jsx)("div", { className: b('notice'), children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: additionalInfo, modifiers: {
+    return ((0, jsx_runtime_1.jsxs)(grid_1.Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container, children: [title && ((0, jsx_runtime_1.jsx)(components_1.Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId, qa: qaAttributes.title })), text && ((0, jsx_runtime_1.jsx)("div", { className: b('text', { ['without-title']: !hasTitle }), children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId, qa: qaAttributes.list }) })), list?.length ? ((0, jsx_runtime_1.jsx)("div", { className: b('list'), children: (0, jsx_runtime_1.jsx)(components_1.ContentList, { list: list, size: size, qa: qaAttributes.list, theme: theme }) })) : null, additionalInfo && ((0, jsx_runtime_1.jsx)("div", { className: b('notice'), children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: additionalInfo, modifiers: {
                         constructor: true,
                         'constructor-notice': true,
                         [`constructor-size-${size}`]: true,
-                    } }) })), links && ((0, jsx_runtime_1.jsx)(components_1.Links, { className: b('links'), size: size, links: links, titleId: titleId, qa: qaAttributes.links, linkQa: qaAttributes.link })), buttons && ((0, jsx_runtime_1.jsx)(components_1.Buttons, { className: b('buttons'), size: size, buttons: buttons, titleId: titleId, qa: qaAttributes.buttons, buttonQa: qaAttributes.button }))] }));
+                    }, qa: qaAttributes.additionalInfo }) })), links && ((0, jsx_runtime_1.jsx)(components_1.Links, { className: b('links'), size: size, links: links, titleId: titleId, qa: qaAttributes.links, linkQa: qaAttributes.link })), buttons && ((0, jsx_runtime_1.jsx)(components_1.Buttons, { className: b('buttons'), size: size, buttons: buttons, titleId: titleId, qa: qaAttributes.buttons, buttonQa: qaAttributes.button }))] }));
 };
 exports.default = Content;
 //# sourceMappingURL=Content.js.map

package/build/cjs/sub-blocks/Content/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sourceRoot":"../../../../src","sources":["sub-blocks/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useUniqId} from '@gravity-ui/uikit';\n\nimport {Buttons, ContentList, Links, Title, YFMWrapper} from '../../components';\nimport {Col} from '../../grid';\nimport {\n    ClassNameProps,\n    ContentBlockProps,\n    ContentSize,\n    TextSize,\n    TitleItemProps,\n} from '../../models';\nimport {QAProps} from '../../models/common';\nimport {block} from '../../utils';\nimport {getQaAttrubutes} from '../../utils/blocks';\n\nimport './Content.scss';\n\nconst b = block('content');\n\nfunction getTextSize(size: ContentSize): TextSize {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'm':\n            return 'sm';\n        case 'l':\n            return 'm';\n        case 'xl':\n            return 'l';\n        default:\n            return 'm';\n    }\n}\n\nexport type ContentProps = ContentBlockProps & ClassNameProps & QAProps;\n\nconst Content = (props: ContentProps) => {\n    const {\n        title,\n        titleId: titleIdFromProps,\n        text,\n        textId,\n        additionalInfo,\n        size = 'l',\n        links,\n        buttons,\n        colSizes = {all: 12, sm: 8},\n        centered,\n        theme,\n        className,\n        list,\n        qa,\n        controlPosition,\n    } = props;\n    const qaAttributes = getQaAttrubutes(qa, ['links', 'link', 'buttons', 'button', 'list']);\n\n    const titleProps =\n        !title || typeof title === 'string'\n            ? ({text: title, textSize: getTextSize(size)} as TitleItemProps)\n            : title;\n\n    const hasTitle = Boolean(title);\n    const defaultTitleId = useUniqId();\n    const titleId = titleIdFromProps || defaultTitleId;\n\n    return (\n        <Col\n            className={b({size, centered, theme, 'control-position': controlPosition}, className)}\n            reset\n            sizes={colSizes}\n            qa={qaAttributes.container}\n        >\n            {title && (\n                <Title\n                    className={b('title')}\n                    title={titleProps}\n                    colSizes={{all: 12}}\n                    id={titleId}\n                />\n            )}\n            {text && (\n                <div className={b('text', {['without-title']: !hasTitle})}>\n                    <YFMWrapper\n                        content={text}\n                        modifiers={{constructor: true, [`constructor-size-${size}`]: true}}\n                        id={textId}\n                        qa={qaAttributes.list}\n                    />\n                </div>\n            )}\n            {list?.length ? (\n                <div className={b('list')}>\n                    <ContentList list={list} size={size} qa={qaAttributes.list} theme={theme} />\n                </div>\n            ) : null}\n            {additionalInfo && (\n                <div className={b('notice')}>\n                    <YFMWrapper\n                        content={additionalInfo}\n                        modifiers={{\n                            constructor: true,\n                            'constructor-notice': true,\n                            [`constructor-size-${size}`]: true,\n                        }}\n                    />\n                </div>\n            )}\n            {links && (\n                <Links\n                    className={b('links')}\n                    size={size}\n                    links={links}\n                    titleId={titleId}\n                    qa={qaAttributes.links}\n                    linkQa={qaAttributes.link}\n                />\n            )}\n            {buttons && (\n                <Buttons\n                    className={b('buttons')}\n                    size={size}\n                    buttons={buttons}\n                    titleId={titleId}\n                    qa={qaAttributes.buttons}\n                    buttonQa={qaAttributes.button}\n                />\n            )}\n        </Col>\n    );\n};\n\nexport default Content;\n"]}
+{"version":3,"file":"Content.js","sourceRoot":"../../../../src","sources":["sub-blocks/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useUniqId} from '@gravity-ui/uikit';\n\nimport {Buttons, ContentList, Links, Title, YFMWrapper} from '../../components';\nimport {Col} from '../../grid';\nimport {\n    ClassNameProps,\n    ContentBlockProps,\n    ContentSize,\n    TextSize,\n    TitleItemProps,\n} from '../../models';\nimport {QAProps} from '../../models/common';\nimport {block} from '../../utils';\nimport {getQaAttrubutes} from '../../utils/blocks';\n\nimport './Content.scss';\n\nconst b = block('content');\n\nfunction getTextSize(size: ContentSize): TextSize {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'm':\n            return 'sm';\n        case 'l':\n            return 'm';\n        case 'xl':\n            return 'l';\n        default:\n            return 'm';\n    }\n}\n\nexport type ContentProps = ContentBlockProps & ClassNameProps & QAProps;\n\nconst Content = (props: ContentProps) => {\n    const {\n        title,\n        titleId: titleIdFromProps,\n        text,\n        textId,\n        additionalInfo,\n        size = 'l',\n        links,\n        buttons,\n        colSizes = {all: 12, sm: 8},\n        centered,\n        theme,\n        className,\n        list,\n        qa,\n        controlPosition,\n    } = props;\n    const qaAttributes = getQaAttrubutes(qa, [\n        'title',\n        'links',\n        'link',\n        'additional-info',\n        'buttons',\n        'button',\n        'list',\n    ]);\n\n    const titleProps =\n        !title || typeof title === 'string'\n            ? ({text: title, textSize: getTextSize(size)} as TitleItemProps)\n            : title;\n\n    const hasTitle = Boolean(title);\n    const defaultTitleId = useUniqId();\n    const titleId = titleIdFromProps || defaultTitleId;\n\n    return (\n        <Col\n            className={b({size, centered, theme, 'control-position': controlPosition}, className)}\n            reset\n            sizes={colSizes}\n            qa={qaAttributes.container}\n        >\n            {title && (\n                <Title\n                    className={b('title')}\n                    title={titleProps}\n                    colSizes={{all: 12}}\n                    id={titleId}\n                    qa={qaAttributes.title}\n                />\n            )}\n            {text && (\n                <div className={b('text', {['without-title']: !hasTitle})}>\n                    <YFMWrapper\n                        content={text}\n                        modifiers={{constructor: true, [`constructor-size-${size}`]: true}}\n                        id={textId}\n                        qa={qaAttributes.list}\n                    />\n                </div>\n            )}\n            {list?.length ? (\n                <div className={b('list')}>\n                    <ContentList list={list} size={size} qa={qaAttributes.list} theme={theme} />\n                </div>\n            ) : null}\n            {additionalInfo && (\n                <div className={b('notice')}>\n                    <YFMWrapper\n                        content={additionalInfo}\n                        modifiers={{\n                            constructor: true,\n                            'constructor-notice': true,\n                            [`constructor-size-${size}`]: true,\n                        }}\n                        qa={qaAttributes.additionalInfo}\n                    />\n                </div>\n            )}\n            {links && (\n                <Links\n                    className={b('links')}\n                    size={size}\n                    links={links}\n                    titleId={titleId}\n                    qa={qaAttributes.links}\n                    linkQa={qaAttributes.link}\n                />\n            )}\n            {buttons && (\n                <Buttons\n                    className={b('buttons')}\n                    size={size}\n                    buttons={buttons}\n                    titleId={titleId}\n                    qa={qaAttributes.buttons}\n                    buttonQa={qaAttributes.button}\n                />\n            )}\n        </Col>\n    );\n};\n\nexport default Content;\n"]}

package/build/esm/blocks/Hero/Hero.js

@@ -6,12 +6,21 @@ import { useTheme } from "../../context/theme/index.js";
 import { useWindowWidth } from "../../context/windowWidthContext/index.js";
 import { Grid } from "../../grid/index.js";
 import { Content } from "../../sub-blocks/index.js";
-import { block, getThemedValue } from "../../utils/index.js";
+import { block, getQaAttrubutes, getThemedValue } from "../../utils/index.js";
 import { useContainerAspectRatio } from "./hooks.js";
 import './Hero.css';
 const b = block('hero-block');
+const QA_ID = 'hero-block';
 const Hero = (props) => {
     const { breadcrumbs, overtitle, buttons, media: themedMedia, fullWidth, verticalOffset = 'm', theme: contentTheme = 'default', background: themedBackground, ...contentProps } = props;
+    const qaAttributes = getQaAttrubutes(QA_ID, [
+        'background',
+        'beadcrumbs',
+        'content-wrapper',
+        'content-overtitle',
+        'media-wrapper',
+        'media',
+    ]);
     const [mediaAspectRatio, setMediaAspectRatio] = React.useState(Infinity);
     const { aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef } = useContainerAspectRatio();
     const isDesktop = useWindowWidth() > BREAKPOINTS.md;
@@ -31,17 +40,17 @@ const Hero = (props) => {
         };
     }), [buttons, theme]);
     const onMediaIntrinsicSizeChange = React.useCallback(({ width, height }) => setMediaAspectRatio(width / height), []);
-    return (_jsxs("header", { className: b(), children: [background && (_jsx(Media, { className: b('background', {
+    return (_jsxs("header", { className: b(), "data-qa": qaAttributes.default, children: [background && (_jsx(Media, { className: b('background', {
                     ['full-width']: fullWidth,
-                }), imageClassName: b('background-image'), videoClassName: b('background-video'), ...background, isBackground: true })), _jsx(Grid, { children: _jsxs("div", { className: b('wrapper'), children: [breadcrumbs && (_jsx(HeaderBreadcrumbs, { className: b('breadcrumbs'), ...breadcrumbs, theme: theme })), _jsxs("div", { className: b('content', {
+                }), imageClassName: b('background-image'), videoClassName: b('background-video'), ...background, isBackground: true, qa: qaAttributes.background })), _jsx(Grid, { children: _jsxs("div", { className: b('wrapper'), "data-qa": qaAttributes.wrapper, children: [breadcrumbs && (_jsx(HeaderBreadcrumbs, { className: b('breadcrumbs'), ...breadcrumbs, theme: theme, qa: qaAttributes.breadcrumbs })), _jsxs("div", { className: b('content', {
                                 ['vertical-offset']: verticalOffset,
-                            }), children: [overtitle && (_jsx("div", { className: b('content-overtitle', { theme }), children: typeof overtitle === 'string' ? (_jsx(YFMWrapper, { tagName: "span", content: overtitle, modifiers: {
+                            }), "data-qa": qaAttributes.contentWrapper, children: [overtitle && (_jsx("div", { className: b('content-overtitle', { theme }), "data-qa": qaAttributes.contentOvertitle, children: typeof overtitle === 'string' ? (_jsx(YFMWrapper, { tagName: "span", content: overtitle, modifiers: {
                                             constructor: true,
                                             constructorTheme: theme,
-                                        } })) : (overtitle) })), _jsx(Content, { size: "xl", colSizes: { all: 12 }, ...contentProps, buttons: buttonProps, theme: contentTheme })] }), media && (_jsx("div", { className: b('media'), children: _jsx("div", { className: b('media-container'), ref: mediaContainerRef, children: _jsx(Media, { className: b('media-container-content', {
+                                        } })) : (overtitle) })), _jsx(Content, { size: "xl", colSizes: { all: 12 }, ...contentProps, buttons: buttonProps, theme: contentTheme, qa: qaAttributes.content })] }), media && (_jsx("div", { className: b('media'), "data-qa": qaAttributes.mediaWrapper, children: _jsx("div", { className: b('media-container'), ref: mediaContainerRef, children: _jsx(Media, { className: b('media-container-content', {
                                         ['round-corners']: media.roundCorners ?? true,
                                         vertical: isDesktop && isMediaVertical,
-                                    }), ...media, disablePlayerAutoSizing: true, onIntrinsicSizeChange: onMediaIntrinsicSizeChange }) }) }))] }) })] }));
+                                    }), ...media, disablePlayerAutoSizing: true, onIntrinsicSizeChange: onMediaIntrinsicSizeChange, qa: qaAttributes.mediaContainerContent }) }) }))] }) })] }));
 };
 export default Hero;
 //# sourceMappingURL=Hero.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Hero.js","sourceRoot":"../../../../src","sources":["blocks/Hero/Hero.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,iBAAiB,EAAE,KAAK,EAAE,UAAU,EAAC,kCAAyB;AACtE,OAAO,EAAC,WAAW,EAAC,2BAAwB;AAC5C,OAAO,EAAC,QAAQ,EAAC,qCAA4B;AAC7C,OAAO,EAAC,cAAc,EAAC,kDAAyC;AAChE,OAAO,EAAC,IAAI,EAAC,4BAAmB;AAEhC,OAAO,EAAC,OAAO,EAAC,kCAAyB;AACzC,OAAO,EAAC,KAAK,EAAE,cAAc,EAAC,6BAAoB;AAElD,OAAO,EAAC,uBAAuB,EAAC,mBAAgB;AAEhD,OAAO,YAAY,CAAC;AAEpB,MAAM,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,IAAI,GAAG,CAAC,KAAqB,EAAE,EAAE;IACnC,MAAM,EACF,WAAW,EACX,SAAS,EACT,OAAO,EACP,KAAK,EAAE,WAAW,EAClB,SAAS,EACT,cAAc,GAAG,GAAG,EACpB,KAAK,EAAE,YAAY,GAAG,SAAS,EAC/B,UAAU,EAAE,gBAAgB,EAC5B,GAAG,YAAY,EAClB,GAAG,KAAK,CAAC;IAEV,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,QAAQ,CAAC,CAAC;IAEjF,MAAM,EAAC,WAAW,EAAE,yBAAyB,EAAE,GAAG,EAAE,iBAAiB,EAAC,GAClE,uBAAuB,EAAE,CAAC;IAE9B,MAAM,SAAS,GAAG,cAAc,EAAE,GAAG,WAAW,CAAC,EAAE,CAAC;IACpD,MAAM,eAAe,GAAG,gBAAgB,GAAG,yBAAyB,CAAC;IAErE,MAAM,YAAY,GAAG,QAAQ,EAAE,CAAC;IAChC,MAAM,KAAK,GAAG,YAAY,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAE,YAAsB,CAAC;IAElF,MAAM,UAAU,GAAG,cAAc,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,cAAc,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;IAEjD,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAC7B,GAAG,EAAE,CACD,OAAO,EAAE,GAAG,CAAC,CAAC,YAAY,EAAE,EAAE;QAC1B,IAAI,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC;YACrC,OAAO,YAAY,CAAC;QACxB,CAAC;QAED,MAAM,MAAM,GAAG,cAAc,CAAC,YAAY,EAAE,KAAK,CAAgB,CAAC;QAElE,OAAO;YACH,IAAI,EAAE,IAAI;YACV,GAAG,MAAM;SACZ,CAAC;IACN,CAAC,CAAC,EACN,CAAC,OAAO,EAAE,KAAK,CAAC,CACnB,CAAC;IAEF,MAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CAChD,CAAC,EAAC,KAAK,EAAE,MAAM,EAAkC,EAAE,EAAE,CAAC,mBAAmB,CAAC,KAAK,GAAG,MAAM,CAAC,EACzF,EAAE,CACL,CAAC;IAEF,OAAO,CACH,kBAAQ,SAAS,EAAE,CAAC,EAAE,aACjB,UAAU,IAAI,CACX,KAAC,KAAK,IACF,SAAS,EAAE,CAAC,CAAC,YAAY,EAAE;oBACvB,CAAC,YAAY,CAAC,EAAE,SAAS;iBAC5B,CAAC,EACF,cAAc,EAAE,CAAC,CAAC,kBAAkB,CAAC,EACrC,cAAc,EAAE,CAAC,CAAC,kBAAkB,CAAC,KACjC,UAAU,EACd,YAAY,SACd,CACL,EACD,KAAC,IAAI,cACD,eAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACvB,WAAW,IAAI,CACZ,KAAC,iBAAiB,IACd,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,KACvB,WAAW,EACf,KAAK,EAAE,KAAK,GACd,CACL,EACD,eACI,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE;gCACpB,CAAC,iBAAiB,CAAC,EAAE,cAAc;6BACtC,CAAC,aAED,SAAS,IAAI,CACV,cAAK,SAAS,EAAE,CAAC,CAAC,mBAAmB,EAAE,EAAC,KAAK,EAAC,CAAC,YAC1C,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC7B,KAAC,UAAU,IACP,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE;4CACP,WAAW,EAAE,IAAI;4CACjB,gBAAgB,EAAE,KAAK;yCAC1B,GACH,CACL,CAAC,CAAC,CAAC,CACA,SAAS,CACZ,GACC,CACT,EACD,KAAC,OAAO,IACJ,IAAI,EAAC,IAAI,EACT,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAC,KACf,YAAY,EAChB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,YAAY,GACrB,IACA,EACL,KAAK,IAAI,CACN,cAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACtB,cAAK,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAAE,GAAG,EAAE,iBAAiB,YACxD,KAAC,KAAK,IACF,SAAS,EAAE,CAAC,CAAC,yBAAyB,EAAE;wCACpC,CAAC,eAAe,CAAC,EAAE,KAAK,CAAC,YAAY,IAAI,IAAI;wCAC7C,QAAQ,EAAE,SAAS,IAAI,eAAe;qCACzC,CAAC,KACE,KAAK,EACT,uBAAuB,QACvB,qBAAqB,EAAE,0BAA0B,GACnD,GACA,GACJ,CACT,IACC,GACH,IACF,CACZ,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {HeaderBreadcrumbs, Media, YFMWrapper} from '../../components';\nimport {BREAKPOINTS} from '../../constants';\nimport {useTheme} from '../../context/theme';\nimport {useWindowWidth} from '../../context/windowWidthContext';\nimport {Grid} from '../../grid';\nimport {ButtonProps, HeroBlockProps, Theme} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport {useContainerAspectRatio} from './hooks';\n\nimport './Hero.scss';\n\nconst b = block('hero-block');\n\nconst Hero = (props: HeroBlockProps) => {\n    const {\n        breadcrumbs,\n        overtitle,\n        buttons,\n        media: themedMedia,\n        fullWidth,\n        verticalOffset = 'm',\n        theme: contentTheme = 'default',\n        background: themedBackground,\n        ...contentProps\n    } = props;\n\n    const [mediaAspectRatio, setMediaAspectRatio] = React.useState<number>(Infinity);\n\n    const {aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef} =\n        useContainerAspectRatio();\n\n    const isDesktop = useWindowWidth() > BREAKPOINTS.md;\n    const isMediaVertical = mediaAspectRatio < mediaContainerAspectRatio;\n\n    const contextTheme = useTheme();\n    const theme = contentTheme === 'default' ? contextTheme : (contentTheme as Theme);\n\n    const background = getThemedValue(themedBackground, theme);\n    const media = getThemedValue(themedMedia, theme);\n\n    const buttonProps = React.useMemo<(ButtonProps | React.ReactNode)[] | undefined>(\n        () =>\n            buttons?.map((buttonThemed) => {\n                if (React.isValidElement(buttonThemed)) {\n                    return buttonThemed;\n                }\n\n                const button = getThemedValue(buttonThemed, theme) as ButtonProps;\n\n                return {\n                    size: 'xl',\n                    ...button,\n                };\n            }),\n        [buttons, theme],\n    );\n\n    const onMediaIntrinsicSizeChange = React.useCallback(\n        ({width, height}: {width: number; height: number}) => setMediaAspectRatio(width / height),\n        [],\n    );\n\n    return (\n        <header className={b()}>\n            {background && (\n                <Media\n                    className={b('background', {\n                        ['full-width']: fullWidth,\n                    })}\n                    imageClassName={b('background-image')}\n                    videoClassName={b('background-video')}\n                    {...background}\n                    isBackground\n                />\n            )}\n            <Grid>\n                <div className={b('wrapper')}>\n                    {breadcrumbs && (\n                        <HeaderBreadcrumbs\n                            className={b('breadcrumbs')}\n                            {...breadcrumbs}\n                            theme={theme}\n                        />\n                    )}\n                    <div\n                        className={b('content', {\n                            ['vertical-offset']: verticalOffset,\n                        })}\n                    >\n                        {overtitle && (\n                            <div className={b('content-overtitle', {theme})}>\n                                {typeof overtitle === 'string' ? (\n                                    <YFMWrapper\n                                        tagName=\"span\"\n                                        content={overtitle}\n                                        modifiers={{\n                                            constructor: true,\n                                            constructorTheme: theme,\n                                        }}\n                                    />\n                                ) : (\n                                    overtitle\n                                )}\n                            </div>\n                        )}\n                        <Content\n                            size=\"xl\"\n                            colSizes={{all: 12}}\n                            {...contentProps}\n                            buttons={buttonProps}\n                            theme={contentTheme}\n                        />\n                    </div>\n                    {media && (\n                        <div className={b('media')}>\n                            <div className={b('media-container')} ref={mediaContainerRef}>\n                                <Media\n                                    className={b('media-container-content', {\n                                        ['round-corners']: media.roundCorners ?? true,\n                                        vertical: isDesktop && isMediaVertical,\n                                    })}\n                                    {...media}\n                                    disablePlayerAutoSizing\n                                    onIntrinsicSizeChange={onMediaIntrinsicSizeChange}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </Grid>\n        </header>\n    );\n};\n\nexport default Hero;\n"]}
+{"version":3,"file":"Hero.js","sourceRoot":"../../../../src","sources":["blocks/Hero/Hero.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {HeaderBreadcrumbs, Media, YFMWrapper} from '../../components';\nimport {BREAKPOINTS} from '../../constants';\nimport {useTheme} from '../../context/theme';\nimport {useWindowWidth} from '../../context/windowWidthContext';\nimport {Grid} from '../../grid';\nimport {ButtonProps, HeroBlockProps, Theme} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getQaAttrubutes, getThemedValue} from '../../utils';\n\nimport {useContainerAspectRatio} from './hooks';\n\nimport './Hero.scss';\n\nconst b = block('hero-block');\n\nconst QA_ID = 'hero-block';\n\nconst Hero = (props: HeroBlockProps) => {\n    const {\n        breadcrumbs,\n        overtitle,\n        buttons,\n        media: themedMedia,\n        fullWidth,\n        verticalOffset = 'm',\n        theme: contentTheme = 'default',\n        background: themedBackground,\n        ...contentProps\n    } = props;\n\n    const qaAttributes = getQaAttrubutes(QA_ID, [\n        'background',\n        'beadcrumbs',\n        'content-wrapper',\n        'content-overtitle',\n        'media-wrapper',\n        'media',\n    ]);\n\n    const [mediaAspectRatio, setMediaAspectRatio] = React.useState<number>(Infinity);\n\n    const {aspectRatio: mediaContainerAspectRatio, ref: mediaContainerRef} =\n        useContainerAspectRatio();\n\n    const isDesktop = useWindowWidth() > BREAKPOINTS.md;\n    const isMediaVertical = mediaAspectRatio < mediaContainerAspectRatio;\n\n    const contextTheme = useTheme();\n    const theme = contentTheme === 'default' ? contextTheme : (contentTheme as Theme);\n\n    const background = getThemedValue(themedBackground, theme);\n    const media = getThemedValue(themedMedia, theme);\n\n    const buttonProps = React.useMemo<(ButtonProps | React.ReactNode)[] | undefined>(\n        () =>\n            buttons?.map((buttonThemed) => {\n                if (React.isValidElement(buttonThemed)) {\n                    return buttonThemed;\n                }\n\n                const button = getThemedValue(buttonThemed, theme) as ButtonProps;\n\n                return {\n                    size: 'xl',\n                    ...button,\n                };\n            }),\n        [buttons, theme],\n    );\n\n    const onMediaIntrinsicSizeChange = React.useCallback(\n        ({width, height}: {width: number; height: number}) => setMediaAspectRatio(width / height),\n        [],\n    );\n\n    return (\n        <header className={b()} data-qa={qaAttributes.default}>\n            {background && (\n                <Media\n                    className={b('background', {\n                        ['full-width']: fullWidth,\n                    })}\n                    imageClassName={b('background-image')}\n                    videoClassName={b('background-video')}\n                    {...background}\n                    isBackground\n                    qa={qaAttributes.background}\n                />\n            )}\n            <Grid>\n                <div className={b('wrapper')} data-qa={qaAttributes.wrapper}>\n                    {breadcrumbs && (\n                        <HeaderBreadcrumbs\n                            className={b('breadcrumbs')}\n                            {...breadcrumbs}\n                            theme={theme}\n                            qa={qaAttributes.breadcrumbs}\n                        />\n                    )}\n                    <div\n                        className={b('content', {\n                            ['vertical-offset']: verticalOffset,\n                        })}\n                        data-qa={qaAttributes.contentWrapper}\n                    >\n                        {overtitle && (\n                            <div\n                                className={b('content-overtitle', {theme})}\n                                data-qa={qaAttributes.contentOvertitle}\n                            >\n                                {typeof overtitle === 'string' ? (\n                                    <YFMWrapper\n                                        tagName=\"span\"\n                                        content={overtitle}\n                                        modifiers={{\n                                            constructor: true,\n                                            constructorTheme: theme,\n                                        }}\n                                    />\n                                ) : (\n                                    overtitle\n                                )}\n                            </div>\n                        )}\n                        <Content\n                            size=\"xl\"\n                            colSizes={{all: 12}}\n                            {...contentProps}\n                            buttons={buttonProps}\n                            theme={contentTheme}\n                            qa={qaAttributes.content}\n                        />\n                    </div>\n                    {media && (\n                        <div className={b('media')} data-qa={qaAttributes.mediaWrapper}>\n                            <div className={b('media-container')} ref={mediaContainerRef}>\n                                <Media\n                                    className={b('media-container-content', {\n                                        ['round-corners']: media.roundCorners ?? true,\n                                        vertical: isDesktop && isMediaVertical,\n                                    })}\n                                    {...media}\n                                    disablePlayerAutoSizing\n                                    onIntrinsicSizeChange={onMediaIntrinsicSizeChange}\n                                    qa={qaAttributes.mediaContainerContent}\n                                />\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </Grid>\n        </header>\n    );\n};\n\nexport default Hero;\n"]}

package/build/esm/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -2,16 +2,17 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { useAnalytics } from "../../hooks/index.js";
 import { DefaultEventNames } from "../../models/index.js";
-import { block } from "../../utils/index.js";
+import { block, getQaAttrubutes } from "../../utils/index.js";
 import { i18n } from "./i18n/index.js";
 import './HeaderBreadcrumbs.css';
 const b = block('header-breadcrumbs');
 export default function HeaderBreadcrumbs(props) {
-    const { items, theme = 'light', className, analyticsEvents } = props;
+    const { items, theme = 'light', className, analyticsEvents, qa } = props;
+    const qaAttributes = getQaAttrubutes(qa, ['list', 'item']);
     const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);
     const onClick = React.useCallback(() => {
         handleAnalytics(analyticsEvents);
     }, [analyticsEvents, handleAnalytics]);
-    return (_jsx("nav", { className: b({ theme }, className), "aria-label": i18n('label'), children: _jsx("ol", { className: b('list'), children: items?.map(({ url, text }) => (_jsxs("li", { className: b('item'), children: [_jsx("a", { href: url, className: b('text'), onClick: onClick, children: text }), _jsx("span", { className: b('separator'), "aria-hidden": true, children: "/" })] }, url))) }) }));
+    return (_jsx("nav", { className: b({ theme }, className), "aria-label": i18n('label'), "data-qa": qaAttributes.default, children: _jsx("ol", { className: b('list'), "data-qa": qaAttributes.list, children: items?.map(({ url, text }) => (_jsxs("li", { className: b('item'), "data-qa": qaAttributes.item, children: [_jsx("a", { href: url, className: b('text'), onClick: onClick, children: text }), _jsx("span", { className: b('separator'), "aria-hidden": true, children: "/" })] }, url))) }) }));
 }
 //# sourceMappingURL=HeaderBreadcrumbs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"HeaderBreadcrumbs.js","sourceRoot":"../../../../src","sources":["components/HeaderBreadcrumbs/HeaderBreadcrumbs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,YAAY,EAAC,6BAAoB;AACzC,OAAO,EAAC,iBAAiB,EAAyB,8BAAqB;AACvE,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAElC,OAAO,EAAC,IAAI,EAAC,wBAAe;AAE5B,OAAO,yBAAyB,CAAC;AAEjC,MAAM,CAAC,GAAG,KAAK,CAAC,oBAAoB,CAAC,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAC,KAAK,EAAE,KAAK,GAAG,OAAO,EAAE,SAAS,EAAE,eAAe,EAAC,GAAG,KAAK,CAAC;IACnE,MAAM,eAAe,GAAG,YAAY,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAEnE,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACnC,eAAe,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC;IAEvC,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,CAAC,EAAC,KAAK,EAAC,EAAE,SAAS,CAAC,gBAAc,IAAI,CAAC,OAAO,CAAC,YAC5D,aAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACnB,KAAK,EAAE,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,EAAC,EAAE,EAAE,CAAC,CACzB,cAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aACpB,YAAG,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,YAC/C,IAAI,GACL,EACJ,eAAM,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,uCAExB,KANoB,GAAG,CAO7B,CACR,CAAC,GACD,GACH,CACT,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, HeaderBreadCrumbsProps} from '../../models';\nimport {block} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './HeaderBreadcrumbs.scss';\n\nconst b = block('header-breadcrumbs');\n\nexport default function HeaderBreadcrumbs(props: HeaderBreadCrumbsProps) {\n    const {items, theme = 'light', className, analyticsEvents} = props;\n    const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);\n\n    const onClick = React.useCallback(() => {\n        handleAnalytics(analyticsEvents);\n    }, [analyticsEvents, handleAnalytics]);\n\n    return (\n        <nav className={b({theme}, className)} aria-label={i18n('label')}>\n            <ol className={b('list')}>\n                {items?.map(({url, text}) => (\n                    <li className={b('item')} key={url}>\n                        <a href={url} className={b('text')} onClick={onClick}>\n                            {text}\n                        </a>\n                        <span className={b('separator')} aria-hidden>\n                            /\n                        </span>\n                    </li>\n                ))}\n            </ol>\n        </nav>\n    );\n}\n"]}
+{"version":3,"file":"HeaderBreadcrumbs.js","sourceRoot":"../../../../src","sources":["components/HeaderBreadcrumbs/HeaderBreadcrumbs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,YAAY,EAAC,6BAAoB;AACzC,OAAO,EAAC,iBAAiB,EAAyB,8BAAqB;AACvE,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AAEnD,OAAO,EAAC,IAAI,EAAC,wBAAe;AAE5B,OAAO,yBAAyB,CAAC;AAEjC,MAAM,CAAC,GAAG,KAAK,CAAC,oBAAoB,CAAC,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA6B;IACnE,MAAM,EAAC,KAAK,EAAE,KAAK,GAAG,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,EAAC,GAAG,KAAK,CAAC;IACvE,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IAE3D,MAAM,eAAe,GAAG,YAAY,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAEnE,MAAM,OAAO,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACnC,eAAe,CAAC,eAAe,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC;IAEvC,OAAO,CACH,cACI,SAAS,EAAE,CAAC,CAAC,EAAC,KAAK,EAAC,EAAE,SAAS,CAAC,gBACpB,IAAI,CAAC,OAAO,CAAC,aAChB,YAAY,CAAC,OAAO,YAE7B,aAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aAAW,YAAY,CAAC,IAAI,YAC/C,KAAK,EAAE,GAAG,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,EAAC,EAAE,EAAE,CAAC,CACzB,cAAI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aAAqB,YAAY,CAAC,IAAI,aAC1D,YAAG,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,YAC/C,IAAI,GACL,EACJ,eAAM,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,uCAExB,KANoB,GAAG,CAO7B,CACR,CAAC,GACD,GACH,CACT,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, HeaderBreadCrumbsProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './HeaderBreadcrumbs.scss';\n\nconst b = block('header-breadcrumbs');\n\nexport default function HeaderBreadcrumbs(props: HeaderBreadCrumbsProps) {\n    const {items, theme = 'light', className, analyticsEvents, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa, ['list', 'item']);\n\n    const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);\n\n    const onClick = React.useCallback(() => {\n        handleAnalytics(analyticsEvents);\n    }, [analyticsEvents, handleAnalytics]);\n\n    return (\n        <nav\n            className={b({theme}, className)}\n            aria-label={i18n('label')}\n            data-qa={qaAttributes.default}\n        >\n            <ol className={b('list')} data-qa={qaAttributes.list}>\n                {items?.map(({url, text}) => (\n                    <li className={b('item')} key={url} data-qa={qaAttributes.item}>\n                        <a href={url} className={b('text')} onClick={onClick}>\n                            {text}\n                        </a>\n                        <span className={b('separator')} aria-hidden>\n                            /\n                        </span>\n                    </li>\n                ))}\n            </ol>\n        </nav>\n    );\n}\n"]}

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

@@ -1,10 +1,10 @@
 import { GridColumnSizesType, GridJustifyContent } from "../../grid/index.js";
-import { ClassNameProps, TitleProps as TitleParams } from "../../models/index.js";
+import { ClassNameProps, QAProps, TitleProps as TitleParams } from "../../models/index.js";
 import './Title.css';
-export interface TitleProps extends TitleParams {
+export interface TitleProps extends TitleParams, QAProps {
     colSizes?: GridColumnSizesType;
     colJustifyContent?: GridJustifyContent;
     id?: string;
 }
-declare const Title: ({ title, subtitle, className, colSizes, colJustifyContent, id, }: TitleProps & ClassNameProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Title: ({ title, subtitle, className, colSizes, colJustifyContent, id, qa, }: TitleProps & ClassNameProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Title;

package/build/esm/components/Title/Title.js

@@ -1,16 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Col } from "../../grid/index.js";
-import { block } from "../../utils/index.js";
+import { block, getQaAttrubutes } from "../../utils/index.js";
 import YFMWrapper from "../YFMWrapper/YFMWrapper.js";
 import TitleItem from "./TitleItem.js";
 import './Title.css';
 const b = block('title');
-const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, colJustifyContent, id, }) => {
+const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, colJustifyContent, id, qa, }) => {
     if (!title && !subtitle) {
         return null;
     }
+    const qaAttributes = getQaAttrubutes(qa, ['title', 'subtitle']);
     const { text, ...titleProps } = !title || typeof title === 'string' ? { text: title } : title;
-    return (_jsxs("div", { className: b(null, className), id: id, children: [text && (_jsx(Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: _jsx(TitleItem, { text: text, ...titleProps }) })), subtitle && (_jsx(Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: _jsx("div", { className: b('description', { titleSize: titleProps?.textSize }), children: _jsx(YFMWrapper, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
+    return (_jsxs("div", { className: b(null, className), id: id, children: [text && (_jsx(Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: _jsx(TitleItem, { text: text, ...titleProps, qa: qaAttributes.title }) })), subtitle && (_jsx(Col, { reset: true, sizes: colSizes, ...(colJustifyContent && { justifyContent: colJustifyContent }), children: _jsx("div", { className: b('description', { titleSize: titleProps?.textSize }), "data-qa": qaAttributes.subtitle, children: _jsx(YFMWrapper, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
 };
 export default Title;
 //# sourceMappingURL=Title.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,GAAG,EAA0C,4BAAmB;AAExE,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAClC,OAAO,UAAU,oCAAiC;AAElD,OAAO,SAAS,uBAAoB;AAEpC,OAAO,aAAa,CAAC;AAErB,MAAM,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC;AAQzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,iBAAiB,EACjB,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,EAAC,IAAI,EAAE,GAAG,UAAU,EAAC,GACvB,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpF,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,KAAC,GAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,KAAM,UAAU,GAAI,GACvC,CACT,EACA,QAAQ,IAAI,CACT,KAAC,GAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,cAAK,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,YAC/D,KAAC,UAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType, GridJustifyContent} from '../../grid';\nimport {ClassNameProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams {\n    colSizes?: GridColumnSizesType;\n    colJustifyContent?: GridJustifyContent;\n    id?: string;\n}\n\nconst Title = ({\n    title,\n    subtitle,\n    className,\n    colSizes = {all: 12, sm: 8},\n    colJustifyContent,\n    id,\n}: TitleProps & ClassNameProps) => {\n    if (!title && !subtitle) {\n        return null;\n    }\n\n    const {text, ...titleProps} =\n        !title || typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n    return (\n        <div className={b(null, className)} id={id}>\n            {text && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <TitleItem text={text} {...titleProps} />\n                </Col>\n            )}\n            {subtitle && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <div className={b('description', {titleSize: titleProps?.textSize})}>\n                        <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n                    </div>\n                </Col>\n            )}\n        </div>\n    );\n};\n\nexport default Title;\n"]}
+{"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,GAAG,EAA0C,4BAAmB;AAExE,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AACnD,OAAO,UAAU,oCAAiC;AAElD,OAAO,SAAS,uBAAoB;AAEpC,OAAO,aAAa,CAAC;AAErB,MAAM,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC;AAQzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,iBAAiB,EACjB,EAAE,EACF,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhE,MAAM,EAAC,IAAI,EAAE,GAAG,UAAU,EAAC,GACvB,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpF,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,KAAC,GAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,KAAM,UAAU,EAAE,EAAE,EAAE,YAAY,CAAC,KAAK,GAAI,GAC/D,CACT,EACA,QAAQ,IAAI,CACT,KAAC,GAAG,IACA,KAAK,QACL,KAAK,EAAE,QAAQ,KACX,CAAC,iBAAiB,IAAI,EAAC,cAAc,EAAE,iBAAiB,EAAC,CAAC,YAE9D,cACI,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,aACrD,YAAY,CAAC,QAAQ,YAE9B,KAAC,UAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType, GridJustifyContent} from '../../grid';\nimport {ClassNameProps, QAProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams, QAProps {\n    colSizes?: GridColumnSizesType;\n    colJustifyContent?: GridJustifyContent;\n    id?: string;\n}\n\nconst Title = ({\n    title,\n    subtitle,\n    className,\n    colSizes = {all: 12, sm: 8},\n    colJustifyContent,\n    id,\n    qa,\n}: TitleProps & ClassNameProps) => {\n    if (!title && !subtitle) {\n        return null;\n    }\n\n    const qaAttributes = getQaAttrubutes(qa, ['title', 'subtitle']);\n\n    const {text, ...titleProps} =\n        !title || typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n    return (\n        <div className={b(null, className)} id={id}>\n            {text && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <TitleItem text={text} {...titleProps} qa={qaAttributes.title} />\n                </Col>\n            )}\n            {subtitle && (\n                <Col\n                    reset\n                    sizes={colSizes}\n                    {...(colJustifyContent && {justifyContent: colJustifyContent})}\n                >\n                    <div\n                        className={b('description', {titleSize: titleProps?.textSize})}\n                        data-qa={qaAttributes.subtitle}\n                    >\n                        <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n                    </div>\n                </Col>\n            )}\n        </div>\n    );\n};\n\nexport default Title;\n"]}

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

@@ -313,7 +313,7 @@ export interface AuthorItem {
     description?: string;
     avatar?: ThemeSupporting<ImageProps> | JSX.Element;
 }
-export interface HeaderBreadCrumbsProps extends ClassNameProps {
+export interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {
     items: {
         url: string;
         text: React.ReactNode;

package/build/esm/models/constructor-items/common.js.map

@@ -1 +1 @@
-{"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":"AAQA,QAAQ;AACR,MAAM,CAAN,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,KAAV,UAAU,QAGrB;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,KAAf,eAAe,QAM1B;AAED,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACjB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,KAAlB,kBAAkB,QAG7B;AAED,MAAM,CAAN,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,KAA/B,+BAA+B,QAI1C;AAED,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB;AAED,MAAM,CAAN,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,KAAtB,sBAAsB,QAGjC;AAED,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAuED,SAAS;AAET,MAAM,CAAN,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,KAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n    Column = 'column',\n    Line = 'line',\n}\n\nexport enum PriceDetailsType {\n    MARKED_LIST = 'marked-list',\n    SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n    BLUE = 'blue',\n    GREEN = 'green',\n    YELLOW = 'yellow',\n    PURPLE = 'purple',\n    RED = 'red',\n}\n\nexport enum PlayButtonType {\n    Default = 'default',\n    Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n    Blue = 'blue',\n    Grey = 'grey',\n}\n\nexport enum CustomControlsType {\n    WithMuteButton = 'with-mute-button',\n    WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n    Left = 'left',\n    Right = 'right',\n    Center = 'center',\n}\n\nexport enum MediaVideoType {\n    Default = 'default',\n    Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n    Default = 'default',\n    Custom = 'custom',\n}\n\nexport enum QuoteType {\n    Chevron = 'chevron', // « »\n    EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' | 'dark';\nexport type TextSize = 'xs' | 's' | 'sm' | 'm' | 'l';\nexport type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\nexport type HeaderWidth = 's' | 'm' | 'l';\nexport type HeaderImageSize = 's' | 'm';\nexport type HeaderOffset = 'default' | 'large';\nexport type Justify = 'start' | 'center' | 'end';\nexport type ColumnsCount = 1 | 2 | 3 | 4;\nexport type LegendTableMarkerType = 'disk' | 'tick';\nexport type LinkTheme = 'file-link' | 'normal' | 'back' | 'underline';\nexport type MediaDirection = 'media-content' | 'content-media';\nexport type PriceDescriptionColor = 'cornflower' | 'black';\nexport type ContentSize = 's' | 'm' | 'l' | 'xl';\nexport type ContentTextSize = 's' | 'm' | 'l';\nexport type ContentTheme = 'default' | 'dark' | 'light';\nexport type FileLinkType = 'vertical' | 'horizontal';\nexport type ImageCardMargins = 's' | 'm';\nexport type LayoutItemContentMargin = 'm' | 'l';\nexport type GravityIconProps = string | {name: keyof typeof icons; color: 'brand' | 'text-color'};\n\n// modifiers\nexport interface Themable {\n    theme?: TextTheme;\n}\n\nexport interface Justifyable {\n    justify?: Justify;\n}\n\nexport interface Stylable {\n    className?: string;\n}\n\nexport interface Animatable {\n    animated?: boolean;\n}\n\nexport interface Tabbable {\n    tabIndex?: number;\n}\n\nexport interface Roleable {\n    role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n    ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n    image?: string;\n    color?: string;\n}\n\nexport interface AnchorProps {\n    text: string;\n    url: string;\n}\n\n/**\n * @deprecated Component VideoBlock will be deleted, which uses this logic\n */\ninterface LoopProps {\n    start: number;\n    end?: number;\n}\n\n// images\n\nexport enum Device {\n    Desktop = 'desktop',\n    Mobile = 'mobile',\n    Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n    extends Pick<\n            React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n            'aria-describedby' | 'loading'\n        >,\n        ImageDevicesVisibleProps {\n    alt?: string;\n    fetchPriority?: 'high' | 'low' | 'auto';\n    disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n    src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n    [Device.Desktop]: string;\n    [Device.Mobile]: string;\n    [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n    hide?: boolean | Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string | ImageObjectProps | ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n    extends React.HTMLProps<HTMLDivElement>,\n        Partial<ImageDeviceProps>,\n        Partial<ImageObjectProps>,\n        QAProps,\n        ImageDevicesVisibleProps {\n    style?: React.CSSProperties;\n    imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n    src: string[];\n    type?: MediaVideoType;\n    loop?: LoopProps | boolean;\n    muted?: boolean;\n    autoplay?: boolean;\n    elapsedTime?: number;\n    playButton?: PlayButtonProps;\n    controls?: MediaVideoControlsType;\n    customControlsOptions?: CustomControlsOptions;\n    ariaLabel?: string;\n    contain?: boolean;\n    onVideoEnd?: () => void;\n    ref?: React.Ref<HTMLVideoElement | null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n    url: string;\n    urlTitle?: string;\n    text?: string;\n    textSize?: TextSize;\n    theme?: LinkTheme;\n    colorTheme?: TextTheme;\n    arrow?: boolean;\n    target?: string;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n    href: string;\n    text: React.ReactNode;\n    type?: FileLinkType;\n    textSize?: TextSize;\n    theme?: ContentTheme;\n    urlTitle?: string;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n    | ButtonView\n    | 'github'\n    | 'app-store'\n    | 'google-play'\n    | 'scale'\n    | 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n    text: string;\n    url: string;\n    urlTitle?: string;\n    primary?: boolean;\n    theme?: ButtonTheme;\n    img?: ButtonImageProps | string;\n    target?: string;\n    size?: UikitButtonProps['size'];\n    width?: UikitButtonProps['width'];\n    extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' | 'right';\n\nexport interface ButtonImageProps {\n    url?: string;\n    position?: ButtonImagePosition;\n    alt?: string;\n    iconData?: IconData;\n    iconSize?: number;\n    className?: string;\n}\n\nexport interface CustomControlsOptions {\n    type?: CustomControlsType;\n    muteButtonShown?: boolean;\n    positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n    type?: PlayButtonType;\n    theme?: PlayButtonThemes;\n    text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n    video: MediaVideoProps;\n    height?: number;\n    ratio?: number | 'auto';\n    previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n    videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n    youtube: string;\n    previewImg?: string;\n    fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n    image: ImageProps | ImageProps[] | ImageDeviceProps;\n    video?: MediaVideoProps;\n    parallax?: boolean;\n    height?: number;\n    disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n    dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n    iframe: IframeProps;\n    margins?: boolean;\n}\n\nexport interface MediaProps\n    extends Animatable,\n        Partial<MediaComponentDataLensProps>,\n        Partial<MediaComponentYoutubeProps>,\n        Partial<MediaComponentVideoIframeProps>,\n        Partial<MediaComponentImageProps>,\n        Partial<MediaComponentIframeProps>,\n        Partial<MediaComponentVideoProps> {\n    color?: string;\n    videoMicrodata?: {\n        name?: string;\n        description?: string;\n        duration?: string;\n        uploadDate?: string;\n        contentUrl?: string;\n        thumbnailUrl?: string;\n    };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n    fullWidthMedia?: boolean;\n    className?: string;\n    mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n    zoom?: number;\n    className?: string;\n    forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n    address: string;\n}\n\nexport type YMapMargin =\n    | number\n    | [vertical: number, horizontal: number]\n    | [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n    top?: number;\n    right?: number;\n    bottom?: number;\n    left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n    markers: YMapMarker[];\n    disableControls?: boolean;\n    disableBalloons?: boolean;\n    areaMargin?: YMapMargin;\n    copyrightPosition?: YMapCopyrightPosition;\n    id: string;\n}\n\nexport interface YMapMarker {\n    address?: string;\n    coordinate?: Coordinate;\n    label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n    iconCaption?: string;\n    iconContent?: string;\n    iconColor?: string;\n    iconImageHref?: string;\n    iconImageSize?: [number, number];\n    iconImageOffset?: [number, number];\n    iconImageClipRect?: [[number, number], [number, number]];\n    iconLayout?: 'default#image';\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    iconShape?: Record<string, any>;\n    preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n    label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n    cursor?: string;\n    interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps | YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n    id: string;\n    theme: 'dark' | 'light';\n}\n\nexport interface IframeProps {\n    src: string;\n    width?: number;\n    height?: number;\n    title?: string;\n    name?: string;\n}\n\nexport type DataLensProps = string | DataLensObjectProps;\n\nexport interface AuthorItem {\n    firstName: string;\n    secondName: string;\n    description?: string;\n    avatar?: ThemeSupporting<ImageProps> | JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps {\n    items: {\n        url: string;\n        text: React.ReactNode;\n    }[];\n    theme?: TextTheme;\n    analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n    navTitle?: string;\n    anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n    text: string;\n    textSize?: TextSize;\n    url?: string;\n    urlTitle?: string;\n    custom?: string | React.ReactNode;\n    onClick?: () => void;\n}\n\nexport type MediaView = 'fit' | 'full';\n\n// card\nexport type MediaBorder = 'shadow' | 'line' | 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' | 'footer';\n\nexport interface CardBaseProps {\n    border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n    controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n    title: string;\n    detailedTitle?: string;\n    description: string;\n    label?: {\n        color: PriceLabelColor;\n        text?: string;\n        size?: TextSize;\n    };\n}\n\nexport interface PriceDetailsSettingsProps {\n    title: string;\n    description: string;\n}\n\nexport interface PriceDetailsListProps {\n    text: string;\n}\n\nexport interface PriceDetailsProps {\n    items?: PriceDetailsSettingsProps[] | PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n    extends PriceDetailsProps,\n        PriceDescriptionProps,\n        AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n    title: string;\n    size?: TextSize;\n    titleColor?: PriceDescriptionColor;\n}\n\n/** @deprecated */\nexport interface PriceDetailedProps extends CardBaseProps {\n    items: PriceItemProps[];\n    description?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n        titleColor?: PriceDescriptionColor;\n    };\n    details?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n    };\n    priceType?: PriceDetailsType;\n    numberGroupItems?: 3 | 4 | 5;\n    isCombined?: boolean;\n    useMixedView?: boolean;\n    foldable?: PriceFoldableDetailsProps;\n    labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n    author: AuthorItem;\n    className?: string;\n    authorContainerClassName?: string;\n    type?: AuthorType;\n    theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n    title?: TitleItemProps | string;\n    subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n    id: number | string;\n    containerId?: string;\n    theme?: string;\n    className?: string;\n    headerHeight?: number;\n    customFormOrigin?: string;\n    customFormSection?: string;\n    params?: {[key: string]: string};\n\n    onSubmit?: () => void;\n    onLoad?: () => void;\n}\n\nexport interface WithBorder {\n    border?: MediaBorder;\n    /**\n     * @deprecated use custom class for media-component\n     */\n    disableShadow?: boolean;\n}\n"]}
+{"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":"AAQA,QAAQ;AACR,MAAM,CAAN,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,KAAV,UAAU,QAGrB;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,KAAf,eAAe,QAM1B;AAED,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB;AAED,MAAM,CAAN,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACjB,CAAC,EAHW,gBAAgB,KAAhB,gBAAgB,QAG3B;AAED,MAAM,CAAN,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,KAAlB,kBAAkB,QAG7B;AAED,MAAM,CAAN,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,KAA/B,+BAA+B,QAI1C;AAED,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB;AAED,MAAM,CAAN,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,KAAtB,sBAAsB,QAGjC;AAED,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAuED,SAAS;AAET,MAAM,CAAN,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,KAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n    Column = 'column',\n    Line = 'line',\n}\n\nexport enum PriceDetailsType {\n    MARKED_LIST = 'marked-list',\n    SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n    BLUE = 'blue',\n    GREEN = 'green',\n    YELLOW = 'yellow',\n    PURPLE = 'purple',\n    RED = 'red',\n}\n\nexport enum PlayButtonType {\n    Default = 'default',\n    Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n    Blue = 'blue',\n    Grey = 'grey',\n}\n\nexport enum CustomControlsType {\n    WithMuteButton = 'with-mute-button',\n    WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n    Left = 'left',\n    Right = 'right',\n    Center = 'center',\n}\n\nexport enum MediaVideoType {\n    Default = 'default',\n    Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n    Default = 'default',\n    Custom = 'custom',\n}\n\nexport enum QuoteType {\n    Chevron = 'chevron', // « »\n    EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' | 'dark';\nexport type TextSize = 'xs' | 's' | 'sm' | 'm' | 'l';\nexport type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';\nexport type HeaderWidth = 's' | 'm' | 'l';\nexport type HeaderImageSize = 's' | 'm';\nexport type HeaderOffset = 'default' | 'large';\nexport type Justify = 'start' | 'center' | 'end';\nexport type ColumnsCount = 1 | 2 | 3 | 4;\nexport type LegendTableMarkerType = 'disk' | 'tick';\nexport type LinkTheme = 'file-link' | 'normal' | 'back' | 'underline';\nexport type MediaDirection = 'media-content' | 'content-media';\nexport type PriceDescriptionColor = 'cornflower' | 'black';\nexport type ContentSize = 's' | 'm' | 'l' | 'xl';\nexport type ContentTextSize = 's' | 'm' | 'l';\nexport type ContentTheme = 'default' | 'dark' | 'light';\nexport type FileLinkType = 'vertical' | 'horizontal';\nexport type ImageCardMargins = 's' | 'm';\nexport type LayoutItemContentMargin = 'm' | 'l';\nexport type GravityIconProps = string | {name: keyof typeof icons; color: 'brand' | 'text-color'};\n\n// modifiers\nexport interface Themable {\n    theme?: TextTheme;\n}\n\nexport interface Justifyable {\n    justify?: Justify;\n}\n\nexport interface Stylable {\n    className?: string;\n}\n\nexport interface Animatable {\n    animated?: boolean;\n}\n\nexport interface Tabbable {\n    tabIndex?: number;\n}\n\nexport interface Roleable {\n    role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n    ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n    image?: string;\n    color?: string;\n}\n\nexport interface AnchorProps {\n    text: string;\n    url: string;\n}\n\n/**\n * @deprecated Component VideoBlock will be deleted, which uses this logic\n */\ninterface LoopProps {\n    start: number;\n    end?: number;\n}\n\n// images\n\nexport enum Device {\n    Desktop = 'desktop',\n    Mobile = 'mobile',\n    Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n    extends Pick<\n            React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n            'aria-describedby' | 'loading'\n        >,\n        ImageDevicesVisibleProps {\n    alt?: string;\n    fetchPriority?: 'high' | 'low' | 'auto';\n    disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n    src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n    [Device.Desktop]: string;\n    [Device.Mobile]: string;\n    [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n    hide?: boolean | Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string | ImageObjectProps | ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n    extends React.HTMLProps<HTMLDivElement>,\n        Partial<ImageDeviceProps>,\n        Partial<ImageObjectProps>,\n        QAProps,\n        ImageDevicesVisibleProps {\n    style?: React.CSSProperties;\n    imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n    src: string[];\n    type?: MediaVideoType;\n    loop?: LoopProps | boolean;\n    muted?: boolean;\n    autoplay?: boolean;\n    elapsedTime?: number;\n    playButton?: PlayButtonProps;\n    controls?: MediaVideoControlsType;\n    customControlsOptions?: CustomControlsOptions;\n    ariaLabel?: string;\n    contain?: boolean;\n    onVideoEnd?: () => void;\n    ref?: React.Ref<HTMLVideoElement | null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n    url: string;\n    urlTitle?: string;\n    text?: string;\n    textSize?: TextSize;\n    theme?: LinkTheme;\n    colorTheme?: TextTheme;\n    arrow?: boolean;\n    target?: string;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n    href: string;\n    text: React.ReactNode;\n    type?: FileLinkType;\n    textSize?: TextSize;\n    theme?: ContentTheme;\n    urlTitle?: string;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n    | ButtonView\n    | 'github'\n    | 'app-store'\n    | 'google-play'\n    | 'scale'\n    | 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n    text: string;\n    url: string;\n    urlTitle?: string;\n    primary?: boolean;\n    theme?: ButtonTheme;\n    img?: ButtonImageProps | string;\n    target?: string;\n    size?: UikitButtonProps['size'];\n    width?: UikitButtonProps['width'];\n    extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' | 'right';\n\nexport interface ButtonImageProps {\n    url?: string;\n    position?: ButtonImagePosition;\n    alt?: string;\n    iconData?: IconData;\n    iconSize?: number;\n    className?: string;\n}\n\nexport interface CustomControlsOptions {\n    type?: CustomControlsType;\n    muteButtonShown?: boolean;\n    positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n    type?: PlayButtonType;\n    theme?: PlayButtonThemes;\n    text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n    video: MediaVideoProps;\n    height?: number;\n    ratio?: number | 'auto';\n    previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n    videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n    youtube: string;\n    previewImg?: string;\n    fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n    image: ImageProps | ImageProps[] | ImageDeviceProps;\n    video?: MediaVideoProps;\n    parallax?: boolean;\n    height?: number;\n    disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n    dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n    iframe: IframeProps;\n    margins?: boolean;\n}\n\nexport interface MediaProps\n    extends Animatable,\n        Partial<MediaComponentDataLensProps>,\n        Partial<MediaComponentYoutubeProps>,\n        Partial<MediaComponentVideoIframeProps>,\n        Partial<MediaComponentImageProps>,\n        Partial<MediaComponentIframeProps>,\n        Partial<MediaComponentVideoProps> {\n    color?: string;\n    videoMicrodata?: {\n        name?: string;\n        description?: string;\n        duration?: string;\n        uploadDate?: string;\n        contentUrl?: string;\n        thumbnailUrl?: string;\n    };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n    fullWidthMedia?: boolean;\n    className?: string;\n    mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n    zoom?: number;\n    className?: string;\n    forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n    address: string;\n}\n\nexport type YMapMargin =\n    | number\n    | [vertical: number, horizontal: number]\n    | [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n    top?: number;\n    right?: number;\n    bottom?: number;\n    left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n    markers: YMapMarker[];\n    disableControls?: boolean;\n    disableBalloons?: boolean;\n    areaMargin?: YMapMargin;\n    copyrightPosition?: YMapCopyrightPosition;\n    id: string;\n}\n\nexport interface YMapMarker {\n    address?: string;\n    coordinate?: Coordinate;\n    label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n    iconCaption?: string;\n    iconContent?: string;\n    iconColor?: string;\n    iconImageHref?: string;\n    iconImageSize?: [number, number];\n    iconImageOffset?: [number, number];\n    iconImageClipRect?: [[number, number], [number, number]];\n    iconLayout?: 'default#image';\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    iconShape?: Record<string, any>;\n    preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n    label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n    cursor?: string;\n    interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps | YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n    id: string;\n    theme: 'dark' | 'light';\n}\n\nexport interface IframeProps {\n    src: string;\n    width?: number;\n    height?: number;\n    title?: string;\n    name?: string;\n}\n\nexport type DataLensProps = string | DataLensObjectProps;\n\nexport interface AuthorItem {\n    firstName: string;\n    secondName: string;\n    description?: string;\n    avatar?: ThemeSupporting<ImageProps> | JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {\n    items: {\n        url: string;\n        text: React.ReactNode;\n    }[];\n    theme?: TextTheme;\n    analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n    navTitle?: string;\n    anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n    text: string;\n    textSize?: TextSize;\n    url?: string;\n    urlTitle?: string;\n    custom?: string | React.ReactNode;\n    onClick?: () => void;\n}\n\nexport type MediaView = 'fit' | 'full';\n\n// card\nexport type MediaBorder = 'shadow' | 'line' | 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' | 'footer';\n\nexport interface CardBaseProps {\n    border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n    controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n    title: string;\n    detailedTitle?: string;\n    description: string;\n    label?: {\n        color: PriceLabelColor;\n        text?: string;\n        size?: TextSize;\n    };\n}\n\nexport interface PriceDetailsSettingsProps {\n    title: string;\n    description: string;\n}\n\nexport interface PriceDetailsListProps {\n    text: string;\n}\n\nexport interface PriceDetailsProps {\n    items?: PriceDetailsSettingsProps[] | PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n    extends PriceDetailsProps,\n        PriceDescriptionProps,\n        AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n    title: string;\n    size?: TextSize;\n    titleColor?: PriceDescriptionColor;\n}\n\n/** @deprecated */\nexport interface PriceDetailedProps extends CardBaseProps {\n    items: PriceItemProps[];\n    description?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n        titleColor?: PriceDescriptionColor;\n    };\n    details?: {\n        titleSize?: TextSize;\n        descriptionSize?: TextSize;\n    };\n    priceType?: PriceDetailsType;\n    numberGroupItems?: 3 | 4 | 5;\n    isCombined?: boolean;\n    useMixedView?: boolean;\n    foldable?: PriceFoldableDetailsProps;\n    labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n    author: AuthorItem;\n    className?: string;\n    authorContainerClassName?: string;\n    type?: AuthorType;\n    theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n    title?: TitleItemProps | string;\n    subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n    id: number | string;\n    containerId?: string;\n    theme?: string;\n    className?: string;\n    headerHeight?: number;\n    customFormOrigin?: string;\n    customFormSection?: string;\n    params?: {[key: string]: string};\n\n    onSubmit?: () => void;\n    onLoad?: () => void;\n}\n\nexport interface WithBorder {\n    border?: MediaBorder;\n    /**\n     * @deprecated use custom class for media-component\n     */\n    disableShadow?: boolean;\n}\n"]}

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

@@ -22,18 +22,26 @@ function getTextSize(size) {
 }
 const Content = (props) => {
     const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, controlPosition, } = props;
-    const qaAttributes = getQaAttrubutes(qa, ['links', 'link', 'buttons', 'button', 'list']);
+    const qaAttributes = getQaAttrubutes(qa, [
+        'title',
+        'links',
+        'link',
+        'additional-info',
+        'buttons',
+        'button',
+        'list',
+    ]);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: getTextSize(size) }
         : title;
     const hasTitle = Boolean(title);
     const defaultTitleId = useUniqId();
     const titleId = titleIdFromProps || defaultTitleId;
-    return (_jsxs(Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container, children: [title && (_jsx(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })), text && (_jsx("div", { className: b('text', { ['without-title']: !hasTitle }), children: _jsx(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId, qa: qaAttributes.list }) })), list?.length ? (_jsx("div", { className: b('list'), children: _jsx(ContentList, { list: list, size: size, qa: qaAttributes.list, theme: theme }) })) : null, additionalInfo && (_jsx("div", { className: b('notice'), children: _jsx(YFMWrapper, { content: additionalInfo, modifiers: {
+    return (_jsxs(Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container, children: [title && (_jsx(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId, qa: qaAttributes.title })), text && (_jsx("div", { className: b('text', { ['without-title']: !hasTitle }), children: _jsx(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId, qa: qaAttributes.list }) })), list?.length ? (_jsx("div", { className: b('list'), children: _jsx(ContentList, { list: list, size: size, qa: qaAttributes.list, theme: theme }) })) : null, additionalInfo && (_jsx("div", { className: b('notice'), children: _jsx(YFMWrapper, { content: additionalInfo, modifiers: {
                         constructor: true,
                         'constructor-notice': true,
                         [`constructor-size-${size}`]: true,
-                    } }) })), links && (_jsx(Links, { className: b('links'), size: size, links: links, titleId: titleId, qa: qaAttributes.links, linkQa: qaAttributes.link })), buttons && (_jsx(Buttons, { className: b('buttons'), size: size, buttons: buttons, titleId: titleId, qa: qaAttributes.buttons, buttonQa: qaAttributes.button }))] }));
+                    }, qa: qaAttributes.additionalInfo }) })), links && (_jsx(Links, { className: b('links'), size: size, links: links, titleId: titleId, qa: qaAttributes.links, linkQa: qaAttributes.link })), buttons && (_jsx(Buttons, { className: b('buttons'), size: size, buttons: buttons, titleId: titleId, qa: qaAttributes.buttons, buttonQa: qaAttributes.button }))] }));
 };
 export default Content;
 //# sourceMappingURL=Content.js.map

package/build/esm/sub-blocks/Content/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sourceRoot":"../../../../src","sources":["sub-blocks/Content/Content.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useUniqId} from '@gravity-ui/uikit';\n\nimport {Buttons, ContentList, Links, Title, YFMWrapper} from '../../components';\nimport {Col} from '../../grid';\nimport {\n    ClassNameProps,\n    ContentBlockProps,\n    ContentSize,\n    TextSize,\n    TitleItemProps,\n} from '../../models';\nimport {QAProps} from '../../models/common';\nimport {block} from '../../utils';\nimport {getQaAttrubutes} from '../../utils/blocks';\n\nimport './Content.scss';\n\nconst b = block('content');\n\nfunction getTextSize(size: ContentSize): TextSize {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'm':\n            return 'sm';\n        case 'l':\n            return 'm';\n        case 'xl':\n            return 'l';\n        default:\n            return 'm';\n    }\n}\n\nexport type ContentProps = ContentBlockProps & ClassNameProps & QAProps;\n\nconst Content = (props: ContentProps) => {\n    const {\n        title,\n        titleId: titleIdFromProps,\n        text,\n        textId,\n        additionalInfo,\n        size = 'l',\n        links,\n        buttons,\n        colSizes = {all: 12, sm: 8},\n        centered,\n        theme,\n        className,\n        list,\n        qa,\n        controlPosition,\n    } = props;\n    const qaAttributes = getQaAttrubutes(qa, ['links', 'link', 'buttons', 'button', 'list']);\n\n    const titleProps =\n        !title || typeof title === 'string'\n            ? ({text: title, textSize: getTextSize(size)} as TitleItemProps)\n            : title;\n\n    const hasTitle = Boolean(title);\n    const defaultTitleId = useUniqId();\n    const titleId = titleIdFromProps || defaultTitleId;\n\n    return (\n        <Col\n            className={b({size, centered, theme, 'control-position': controlPosition}, className)}\n            reset\n            sizes={colSizes}\n            qa={qaAttributes.container}\n        >\n            {title && (\n                <Title\n                    className={b('title')}\n                    title={titleProps}\n                    colSizes={{all: 12}}\n                    id={titleId}\n                />\n            )}\n            {text && (\n                <div className={b('text', {['without-title']: !hasTitle})}>\n                    <YFMWrapper\n                        content={text}\n                        modifiers={{constructor: true, [`constructor-size-${size}`]: true}}\n                        id={textId}\n                        qa={qaAttributes.list}\n                    />\n                </div>\n            )}\n            {list?.length ? (\n                <div className={b('list')}>\n                    <ContentList list={list} size={size} qa={qaAttributes.list} theme={theme} />\n                </div>\n            ) : null}\n            {additionalInfo && (\n                <div className={b('notice')}>\n                    <YFMWrapper\n                        content={additionalInfo}\n                        modifiers={{\n                            constructor: true,\n                            'constructor-notice': true,\n                            [`constructor-size-${size}`]: true,\n                        }}\n                    />\n                </div>\n            )}\n            {links && (\n                <Links\n                    className={b('links')}\n                    size={size}\n                    links={links}\n                    titleId={titleId}\n                    qa={qaAttributes.links}\n                    linkQa={qaAttributes.link}\n                />\n            )}\n            {buttons && (\n                <Buttons\n                    className={b('buttons')}\n                    size={size}\n                    buttons={buttons}\n                    titleId={titleId}\n                    qa={qaAttributes.buttons}\n                    buttonQa={qaAttributes.button}\n                />\n            )}\n        </Col>\n    );\n};\n\nexport default Content;\n"]}
+{"version":3,"file":"Content.js","sourceRoot":"../../../../src","sources":["sub-blocks/Content/Content.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAE5C,OAAO,EAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,EAAC,kCAAyB;AAChF,OAAO,EAAC,GAAG,EAAC,4BAAmB;AAS/B,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAClC,OAAO,EAAC,eAAe,EAAC,8BAA2B;AAEnD,OAAO,eAAe,CAAC;AAEvB,MAAM,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC;AAE3B,SAAS,WAAW,CAAC,IAAiB;IAClC,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,GAAG;YACJ,OAAO,GAAG,CAAC;QACf,KAAK,GAAG;YACJ,OAAO,IAAI,CAAC;QAChB,KAAK,GAAG;YACJ,OAAO,GAAG,CAAC;QACf,KAAK,IAAI;YACL,OAAO,GAAG,CAAC;QACf;YACI,OAAO,GAAG,CAAC;IACnB,CAAC;AACL,CAAC;AAID,MAAM,OAAO,GAAG,CAAC,KAAmB,EAAE,EAAE;IACpC,MAAM,EACF,KAAK,EACL,OAAO,EAAE,gBAAgB,EACzB,IAAI,EACJ,MAAM,EACN,cAAc,EACd,IAAI,GAAG,GAAG,EACV,KAAK,EACL,OAAO,EACP,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,QAAQ,EACR,KAAK,EACL,SAAS,EACT,IAAI,EACJ,EAAE,EACF,eAAe,GAClB,GAAG,KAAK,CAAC;IACV,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,EAAE;QACrC,OAAO;QACP,OAAO;QACP,MAAM;QACN,iBAAiB;QACjB,SAAS;QACT,QAAQ;QACR,MAAM;KACT,CAAC,CAAC;IAEH,MAAM,UAAU,GACZ,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ;QAC/B,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,EAAoB;QAChE,CAAC,CAAC,KAAK,CAAC;IAEhB,MAAM,QAAQ,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAChC,MAAM,cAAc,GAAG,SAAS,EAAE,CAAC;IACnC,MAAM,OAAO,GAAG,gBAAgB,IAAI,cAAc,CAAC;IAEnD,OAAO,CACH,MAAC,GAAG,IACA,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,kBAAkB,EAAE,eAAe,EAAC,EAAE,SAAS,CAAC,EACrF,KAAK,QACL,KAAK,EAAE,QAAQ,EACf,EAAE,EAAE,YAAY,CAAC,SAAS,aAEzB,KAAK,IAAI,CACN,KAAC,KAAK,IACF,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAC,EACnB,EAAE,EAAE,OAAO,EACX,EAAE,EAAE,YAAY,CAAC,KAAK,GACxB,CACL,EACA,IAAI,IAAI,CACL,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,CAAC,eAAe,CAAC,EAAE,CAAC,QAAQ,EAAC,CAAC,YACrD,KAAC,UAAU,IACP,OAAO,EAAE,IAAI,EACb,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAE,CAAC,oBAAoB,IAAI,EAAE,CAAC,EAAE,IAAI,EAAC,EAClE,EAAE,EAAE,MAAM,EACV,EAAE,EAAE,YAAY,CAAC,IAAI,GACvB,GACA,CACT,EACA,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YACrB,KAAC,WAAW,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,YAAY,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,GAAI,GAC1E,CACT,CAAC,CAAC,CAAC,IAAI,EACP,cAAc,IAAI,CACf,cAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,YACvB,KAAC,UAAU,IACP,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE;wBACP,WAAW,EAAE,IAAI;wBACjB,oBAAoB,EAAE,IAAI;wBAC1B,CAAC,oBAAoB,IAAI,EAAE,CAAC,EAAE,IAAI;qBACrC,EACD,EAAE,EAAE,YAAY,CAAC,cAAc,GACjC,GACA,CACT,EACA,KAAK,IAAI,CACN,KAAC,KAAK,IACF,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,EACrB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,YAAY,CAAC,KAAK,EACtB,MAAM,EAAE,YAAY,CAAC,IAAI,GAC3B,CACL,EACA,OAAO,IAAI,CACR,KAAC,OAAO,IACJ,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,EACvB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,YAAY,CAAC,OAAO,EACxB,QAAQ,EAAE,YAAY,CAAC,MAAM,GAC/B,CACL,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import {useUniqId} from '@gravity-ui/uikit';\n\nimport {Buttons, ContentList, Links, Title, YFMWrapper} from '../../components';\nimport {Col} from '../../grid';\nimport {\n    ClassNameProps,\n    ContentBlockProps,\n    ContentSize,\n    TextSize,\n    TitleItemProps,\n} from '../../models';\nimport {QAProps} from '../../models/common';\nimport {block} from '../../utils';\nimport {getQaAttrubutes} from '../../utils/blocks';\n\nimport './Content.scss';\n\nconst b = block('content');\n\nfunction getTextSize(size: ContentSize): TextSize {\n    switch (size) {\n        case 's':\n            return 's';\n        case 'm':\n            return 'sm';\n        case 'l':\n            return 'm';\n        case 'xl':\n            return 'l';\n        default:\n            return 'm';\n    }\n}\n\nexport type ContentProps = ContentBlockProps & ClassNameProps & QAProps;\n\nconst Content = (props: ContentProps) => {\n    const {\n        title,\n        titleId: titleIdFromProps,\n        text,\n        textId,\n        additionalInfo,\n        size = 'l',\n        links,\n        buttons,\n        colSizes = {all: 12, sm: 8},\n        centered,\n        theme,\n        className,\n        list,\n        qa,\n        controlPosition,\n    } = props;\n    const qaAttributes = getQaAttrubutes(qa, [\n        'title',\n        'links',\n        'link',\n        'additional-info',\n        'buttons',\n        'button',\n        'list',\n    ]);\n\n    const titleProps =\n        !title || typeof title === 'string'\n            ? ({text: title, textSize: getTextSize(size)} as TitleItemProps)\n            : title;\n\n    const hasTitle = Boolean(title);\n    const defaultTitleId = useUniqId();\n    const titleId = titleIdFromProps || defaultTitleId;\n\n    return (\n        <Col\n            className={b({size, centered, theme, 'control-position': controlPosition}, className)}\n            reset\n            sizes={colSizes}\n            qa={qaAttributes.container}\n        >\n            {title && (\n                <Title\n                    className={b('title')}\n                    title={titleProps}\n                    colSizes={{all: 12}}\n                    id={titleId}\n                    qa={qaAttributes.title}\n                />\n            )}\n            {text && (\n                <div className={b('text', {['without-title']: !hasTitle})}>\n                    <YFMWrapper\n                        content={text}\n                        modifiers={{constructor: true, [`constructor-size-${size}`]: true}}\n                        id={textId}\n                        qa={qaAttributes.list}\n                    />\n                </div>\n            )}\n            {list?.length ? (\n                <div className={b('list')}>\n                    <ContentList list={list} size={size} qa={qaAttributes.list} theme={theme} />\n                </div>\n            ) : null}\n            {additionalInfo && (\n                <div className={b('notice')}>\n                    <YFMWrapper\n                        content={additionalInfo}\n                        modifiers={{\n                            constructor: true,\n                            'constructor-notice': true,\n                            [`constructor-size-${size}`]: true,\n                        }}\n                        qa={qaAttributes.additionalInfo}\n                    />\n                </div>\n            )}\n            {links && (\n                <Links\n                    className={b('links')}\n                    size={size}\n                    links={links}\n                    titleId={titleId}\n                    qa={qaAttributes.links}\n                    linkQa={qaAttributes.link}\n                />\n            )}\n            {buttons && (\n                <Buttons\n                    className={b('buttons')}\n                    size={size}\n                    buttons={buttons}\n                    titleId={titleId}\n                    qa={qaAttributes.buttons}\n                    buttonQa={qaAttributes.button}\n                />\n            )}\n        </Col>\n    );\n};\n\nexport default Content;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "8.8.1",
+  "version": "8.9.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "type": "commonjs",

package/server/models/constructor-items/common.d.ts

@@ -313,7 +313,7 @@ export interface AuthorItem {
     description?: string;
     avatar?: ThemeSupporting<ImageProps> | JSX.Element;
 }
-export interface HeaderBreadCrumbsProps extends ClassNameProps {
+export interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {
     items: {
         url: string;
         text: React.ReactNode;

package/widget/index.js

@@ -1 +1 @@
-export default "(self.webpackChunk_gravity_ui_page_constructor=self.webpackChunk_gravity_ui_page_constructor||[]).push([[1349],{31349:function(_,t,Y){_.exports=function(_){\"use strict\";function t(_){return _&&\"object\"==typeof _&&\"default\"in _?_:{default:_}}var Y=t(_),e={name:\"zh-tw\",weekdays:\"星期日_星期一_星期二_星期三_星期四_星期五_星期六\".split(\"_\"),weekdaysShort:\"週日_週一_週二_週三_週四_週五_週六\".split(\"_\"),weekdaysMin:\"日_一_二_三_四_五_六\".split(\"_\"),months:\"一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月\".split(\"_\"),monthsShort:\"1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月\".split(\"_\"),ordinal:function(_,t){return\"W\"===t?_+\"週\":_+\"日\"},formats:{LT:\"HH:mm\",LTS:\"HH:mm:ss\",L:\"YYYY/MM/DD\",LL:\"YYYY年M月D日\",LLL:\"YYYY年M月D日 HH:mm\",LLLL:\"YYYY年M月D日dddd HH:mm\",l:\"YYYY/M/D\",ll:\"YYYY年M月D日\",lll:\"YYYY年M月D日 HH:mm\",llll:\"YYYY年M月D日dddd HH:mm\"},relativeTime:{future:\"%s內\",past:\"%s前\",s:\"幾秒\",m:\"1 分鐘\",mm:\"%d 分鐘\",h:\"1 小時\",hh:\"%d 小時\",d:\"1 天\",dd:\"%d 天\",M:\"1 個月\",MM:\"%d 個月\",y:\"1 年\",yy:\"%d 年\"},meridiem:function(_,t){var Y=100*_+t;return Y<600?\"凌晨\":Y<900?\"早上\":Y<1100?\"上午\":Y<1300?\"中午\":Y<1800?\"下午\":\"晚上\"}};return Y.default.locale(e,null,!0),e}(Y(74353))}}]);";
+export default "(self.webpackChunk_gravity_ui_page_constructor=self.webpackChunk_gravity_ui_page_constructor||[]).push([[6007],{56007:function(_,t,e){_.exports=function(_){\"use strict\";function t(_){return _&&\"object\"==typeof _&&\"default\"in _?_:{default:_}}var e=t(_),Y={name:\"zh\",weekdays:\"星期日_星期一_星期二_星期三_星期四_星期五_星期六\".split(\"_\"),weekdaysShort:\"周日_周一_周二_周三_周四_周五_周六\".split(\"_\"),weekdaysMin:\"日_一_二_三_四_五_六\".split(\"_\"),months:\"一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月\".split(\"_\"),monthsShort:\"1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月\".split(\"_\"),ordinal:function(_,t){return\"W\"===t?_+\"周\":_+\"日\"},weekStart:1,yearStart:4,formats:{LT:\"HH:mm\",LTS:\"HH:mm:ss\",L:\"YYYY/MM/DD\",LL:\"YYYY年M月D日\",LLL:\"YYYY年M月D日Ah点mm分\",LLLL:\"YYYY年M月D日ddddAh点mm分\",l:\"YYYY/M/D\",ll:\"YYYY年M月D日\",lll:\"YYYY年M月D日 HH:mm\",llll:\"YYYY年M月D日dddd HH:mm\"},relativeTime:{future:\"%s后\",past:\"%s前\",s:\"几秒\",m:\"1 分钟\",mm:\"%d 分钟\",h:\"1 小时\",hh:\"%d 小时\",d:\"1 天\",dd:\"%d 天\",M:\"1 个月\",MM:\"%d 个月\",y:\"1 年\",yy:\"%d 年\"},meridiem:function(_,t){var e=100*_+t;return e<600?\"凌晨\":e<900?\"早上\":e<1100?\"上午\":e<1300?\"中午\":e<1800?\"下午\":\"晚上\"}};return e.default.locale(Y,null,!0),Y}(e(74353))}}]);";