@gravity-ui/page-constructor 8.15.0 → 8.17.0

package/build/cjs/demo/ComponentMap/viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport.js","sourceRoot":"../../../../src","sources":["demo/ComponentMap/viewport.ts"],"names":[],"mappings":";;;AAeA,sCAkBC;AAED,kCAeC;AAhDY,QAAA,gBAAgB,GAAG,EAAE,CAAC;AACtB,QAAA,sBAAsB,GAAG,IAAI,CAAC;AAEpC,MAAM,aAAa,GAAG,CAAC,KAAY,EAAE,SAA4B,EAAS,EAAE,CAAC,CAAC;IACjF,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,KAAK,GAAG,SAAS,CAAC,CAAC;IAC1C,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,KAAK,GAAG,SAAS,CAAC,CAAC;CAC7C,CAAC,CAAC;AAHU,QAAA,aAAa,iBAGvB;AAEI,MAAM,aAAa,GAAG,CAAC,KAAY,EAAE,SAA4B,EAAS,EAAE,CAAC,CAAC;IACjF,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,KAAK;IAC5C,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,KAAK;CAC/C,CAAC,CAAC;AAHU,QAAA,aAAa,iBAGvB;AAEH,SAAgB,aAAa,CACzB,MAAY,EACZ,QAAsB,EACtB,OAAO,GAAG,wBAAgB;IAE1B,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,KAAK,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC;IACjE,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,OAAO,GAAG,CAAC,CAAC,CAAC;IACnE,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IACxE,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;IAC5E,uFAAuF;IACvF,kFAAkF;IAClF,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,8BAAsB,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAErF,OAAO;QACH,KAAK;QACL,CAAC,EAAE,QAAQ,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,KAAK;QAC7D,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,KAAK;KAClE,CAAC;AACN,CAAC;AAED,SAAgB,WAAW,CACvB,SAA4B,EAC5B,MAAc,EACd,KAAY,EACZ,QAAgB,EAChB,QAAgB;IAEhB,MAAM,KAAK,GAAG,IAAA,qBAAa,EAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAC9C,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC;IAE/E,OAAO;QACH,KAAK;QACL,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,KAAK;QAC5B,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,KAAK;KAC/B,CAAC;AACN,CAAC","sourcesContent":["import type {Point, Rect, ViewportSize, ViewportTransform} from './model';\n\nexport const VIEWPORT_PADDING = 24;\nexport const MINIMUM_VIEWPORT_SCALE = 0.01;\n\nexport const worldToScreen = (point: Point, transform: ViewportTransform): Point => ({\n    x: point.x * transform.scale + transform.x,\n    y: point.y * transform.scale + transform.y,\n});\n\nexport const screenToWorld = (point: Point, transform: ViewportTransform): Point => ({\n    x: (point.x - transform.x) / transform.scale,\n    y: (point.y - transform.y) / transform.scale,\n});\n\nexport function fitToViewport(\n    bounds: Rect,\n    viewport: ViewportSize,\n    padding = VIEWPORT_PADDING,\n): ViewportTransform {\n    const availableWidth = Math.max(0, viewport.width - padding * 2);\n    const availableHeight = Math.max(0, viewport.height - padding * 2);\n    const widthScale = bounds.width > 0 ? availableWidth / bounds.width : 1;\n    const heightScale = bounds.height > 0 ? availableHeight / bounds.height : 1;\n    // React postpones fitting until it has a positive canvas size. Keep this pure fallback\n    // invertible as well for callers that receive an empty or padding-sized viewport.\n    const scale = Math.max(MINIMUM_VIEWPORT_SCALE, Math.min(1, widthScale, heightScale));\n\n    return {\n        scale,\n        x: viewport.width / 2 - (bounds.x + bounds.width / 2) * scale,\n        y: viewport.height / 2 - (bounds.y + bounds.height / 2) * scale,\n    };\n}\n\nexport function zoomAtPoint(\n    transform: ViewportTransform,\n    factor: number,\n    point: Point,\n    minScale: number,\n    maxScale: number,\n): ViewportTransform {\n    const world = screenToWorld(point, transform);\n    const scale = Math.min(maxScale, Math.max(minScale, transform.scale * factor));\n\n    return {\n        scale,\n        x: point.x - world.x * scale,\n        y: point.y - world.y * scale,\n    };\n}\n"]}

package/build/cjs/demo/HeroAndMedia.stories.js

@@ -7,52 +7,41 @@ const utils_1 = require("../../.storybook/utils.js");
 const PageConstructor_1 = require("../containers/PageConstructor/index.js");
 const data_json_1 = tslib_1.__importDefault(require("../blocks/Banner/__stories__/data.json"));
 const data_json_2 = tslib_1.__importDefault(require("../blocks/Companies/__stories__/data.json"));
-const data_json_3 = tslib_1.__importDefault(require("../blocks/Header/__stories__/data.json"));
-const data_json_4 = tslib_1.__importDefault(require("../blocks/Info/__stories__/data.json"));
-const data_json_5 = tslib_1.__importDefault(require("../blocks/Media/__stories__/data.json"));
-const data_json_6 = tslib_1.__importDefault(require("../navigation/__stories__/data.json"));
+const data_json_3 = tslib_1.__importDefault(require("../blocks/Info/__stories__/data.json"));
+const data_json_4 = tslib_1.__importDefault(require("../blocks/Media/__stories__/data.json"));
+const data_json_5 = tslib_1.__importDefault(require("../navigation/__stories__/data.json"));
 exports.default = {
-    title: 'Lab/Tokenization/Blocks/HeroAndMedia',
+    title: 'Lab/Tokenization/Blocks/MediaAndPromo',
     component: PageConstructor_1.PageConstructor,
 };
 const Template = ({ navigation, custom = {}, }) => ((0, jsx_runtime_1.jsx)(PageConstructor_1.PageConstructor, { navigation: navigation, custom: custom, content: {
         blocks: [
-            // header-block: default with action buttons
-            (0, utils_1.blockTransform)(data_json_3.default.default),
-            // header-block: with breadcrumbs + light background
-            (0, utils_1.blockTransform)(data_json_3.default.breadcrumbs[0]),
-            // header-block: with breadcrumbs + dark theme
-            (0, utils_1.blockTransform)(data_json_3.default.breadcrumbs[1]),
-            // header-block: with image
-            (0, utils_1.blockTransform)(data_json_3.default.image),
-            // header-block: with background image and color (media variant)
-            (0, utils_1.blockTransform)({ type: 'header-block', ...data_json_3.default.media.image }),
             // banner-block: light theme with themed image
             (0, utils_1.blockTransform)(data_json_1.default.default.content),
             // banner-block: forced dark theme
             (0, utils_1.blockTransform)(data_json_1.default.darkTheme.content),
             // media-block: default with image
-            (0, utils_1.blockTransform)(data_json_5.default.default),
+            (0, utils_1.blockTransform)(data_json_4.default.default),
             // media-block: image slider
-            (0, utils_1.blockTransform)(data_json_5.default.imageSlider),
+            (0, utils_1.blockTransform)(data_json_4.default.imageSlider),
             // media-block: youtube embed
-            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_5.default.video.youtube }),
+            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_4.default.video.youtube }),
             // media-block: video with controls
-            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_5.default.video.staticWithControls }),
+            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_4.default.video.staticWithControls }),
             // media-block: video with preview
-            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_5.default.video.videoWithPreview }),
+            (0, utils_1.blockTransform)({ type: 'media-block', ...data_json_4.default.video.videoWithPreview }),
             // companies-block: title only
             (0, utils_1.blockTransform)(data_json_2.default.default.content),
             // companies-block: with description
             (0, utils_1.blockTransform)(data_json_2.default.withDescription.content),
             // info-block: dark theme (default)
-            (0, utils_1.blockTransform)(data_json_4.default.default),
+            (0, utils_1.blockTransform)(data_json_3.default.default),
             // info-block: light theme with background color
-            (0, utils_1.blockTransform)({ type: 'info-block', ...data_json_4.default.light }),
+            (0, utils_1.blockTransform)({ type: 'info-block', ...data_json_3.default.light }),
         ],
     } }));
 exports.Default = Template.bind({});
 exports.Default.args = {
-    navigation: data_json_6.default.navigation,
+    navigation: data_json_5.default.navigation,
 };
 //# sourceMappingURL=HeroAndMedia.stories.js.map

package/build/cjs/demo/HeroAndMedia.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeroAndMedia.stories.js","sourceRoot":"../../../src","sources":["demo/HeroAndMedia.stories.tsx"],"names":[],"mappings":";;;;;AAEA,qDAAsD;AACtD,4EAA8D;AAG9D,+FAAgE;AAChE,kGAAsE;AACtE,+FAAgE;AAChE,6FAA4D;AAC5D,8FAA8D;AAC9D,4FAA0D;AAE1D,kBAAe;IACX,KAAK,EAAE,sCAAsC;IAC7C,SAAS,EAAE,iCAAe;CACrB,CAAC;AAEV,MAAM,QAAQ,GAAiE,CAAC,EAC5E,UAAU,EACV,MAAM,GAAG,EAAE,GACd,EAAE,EAAE,CAAC,CACF,uBAAC,iCAAe,IACZ,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,OAAO,EACH;QACI,MAAM,EAAE;YACJ,4CAA4C;YAC5C,IAAA,sBAAc,EAAC,mBAAU,CAAC,OAAO,CAAC;YAClC,oDAAoD;YACpD,IAAA,sBAAc,EAAC,mBAAU,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;YACzC,8CAA8C;YAC9C,IAAA,sBAAc,EAAC,mBAAU,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;YACzC,2BAA2B;YAC3B,IAAA,sBAAc,EAAC,mBAAU,CAAC,KAAK,CAAC;YAChC,gEAAgE;YAChE,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,cAAc,EAAE,GAAG,mBAAU,CAAC,KAAK,CAAC,KAAK,EAAC,CAAC;YAEjE,8CAA8C;YAC9C,IAAA,sBAAc,EAAC,mBAAU,CAAC,OAAO,CAAC,OAAO,CAAC;YAC1C,kCAAkC;YAClC,IAAA,sBAAc,EAAC,mBAAU,CAAC,SAAS,CAAC,OAAO,CAAC;YAE5C,kCAAkC;YAClC,IAAA,sBAAc,EAAC,mBAAS,CAAC,OAAO,CAAC;YACjC,4BAA4B;YAC5B,IAAA,sBAAc,EAAC,mBAAS,CAAC,WAAW,CAAC;YACrC,6BAA6B;YAC7B,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,OAAO,EAAC,CAAC;YACjE,mCAAmC;YACnC,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,kBAAkB,EAAC,CAAC;YAC5E,kCAAkC;YAClC,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,gBAAgB,EAAC,CAAC;YAE1E,8BAA8B;YAC9B,IAAA,sBAAc,EAAC,mBAAa,CAAC,OAAO,CAAC,OAAO,CAAC;YAC7C,oCAAoC;YACpC,IAAA,sBAAc,EAAC,mBAAa,CAAC,eAAe,CAAC,OAAO,CAAC;YAErD,mCAAmC;YACnC,IAAA,sBAAc,EAAC,mBAAQ,CAAC,OAAO,CAAC;YAChC,gDAAgD;YAChD,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,YAAY,EAAE,GAAG,mBAAQ,CAAC,KAAK,EAAC,CAAC;SAC1D;KACW,GAEtB,CACL,CAAC;AAEW,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACX,UAAU,EAAE,mBAAO,CAAC,UAA4B;CACnD,CAAC","sourcesContent":["import {Meta, StoryFn} from '@storybook/react';\n\nimport {blockTransform} from '../../.storybook/utils';\nimport {PageConstructor} from '../containers/PageConstructor';\nimport {CustomConfig, NavigationData, PageContent} from '../models';\n\nimport bannerData from '../blocks/Banner/__stories__/data.json';\nimport companiesData from '../blocks/Companies/__stories__/data.json';\nimport headerData from '../blocks/Header/__stories__/data.json';\nimport infoData from '../blocks/Info/__stories__/data.json';\nimport mediaData from '../blocks/Media/__stories__/data.json';\nimport navData from '../navigation/__stories__/data.json';\n\nexport default {\n    title: 'Lab/Tokenization/Blocks/HeroAndMedia',\n    component: PageConstructor,\n} as Meta;\n\nconst Template: StoryFn<{navigation: NavigationData; custom?: CustomConfig}> = ({\n    navigation,\n    custom = {},\n}) => (\n    <PageConstructor\n        navigation={navigation}\n        custom={custom}\n        content={\n            {\n                blocks: [\n                    // header-block: default with action buttons\n                    blockTransform(headerData.default),\n                    // header-block: with breadcrumbs + light background\n                    blockTransform(headerData.breadcrumbs[0]),\n                    // header-block: with breadcrumbs + dark theme\n                    blockTransform(headerData.breadcrumbs[1]),\n                    // header-block: with image\n                    blockTransform(headerData.image),\n                    // header-block: with background image and color (media variant)\n                    blockTransform({type: 'header-block', ...headerData.media.image}),\n\n                    // banner-block: light theme with themed image\n                    blockTransform(bannerData.default.content),\n                    // banner-block: forced dark theme\n                    blockTransform(bannerData.darkTheme.content),\n\n                    // media-block: default with image\n                    blockTransform(mediaData.default),\n                    // media-block: image slider\n                    blockTransform(mediaData.imageSlider),\n                    // media-block: youtube embed\n                    blockTransform({type: 'media-block', ...mediaData.video.youtube}),\n                    // media-block: video with controls\n                    blockTransform({type: 'media-block', ...mediaData.video.staticWithControls}),\n                    // media-block: video with preview\n                    blockTransform({type: 'media-block', ...mediaData.video.videoWithPreview}),\n\n                    // companies-block: title only\n                    blockTransform(companiesData.default.content),\n                    // companies-block: with description\n                    blockTransform(companiesData.withDescription.content),\n\n                    // info-block: dark theme (default)\n                    blockTransform(infoData.default),\n                    // info-block: light theme with background color\n                    blockTransform({type: 'info-block', ...infoData.light}),\n                ],\n            } as PageContent\n        }\n    />\n);\n\nexport const Default = Template.bind({});\nDefault.args = {\n    navigation: navData.navigation as NavigationData,\n};\n"]}
+{"version":3,"file":"HeroAndMedia.stories.js","sourceRoot":"../../../src","sources":["demo/HeroAndMedia.stories.tsx"],"names":[],"mappings":";;;;;AAEA,qDAAsD;AACtD,4EAA8D;AAG9D,+FAAgE;AAChE,kGAAsE;AACtE,6FAA4D;AAC5D,8FAA8D;AAC9D,4FAA0D;AAE1D,kBAAe;IACX,KAAK,EAAE,uCAAuC;IAC9C,SAAS,EAAE,iCAAe;CACrB,CAAC;AAEV,MAAM,QAAQ,GAAiE,CAAC,EAC5E,UAAU,EACV,MAAM,GAAG,EAAE,GACd,EAAE,EAAE,CAAC,CACF,uBAAC,iCAAe,IACZ,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,OAAO,EACH;QACI,MAAM,EAAE;YACJ,8CAA8C;YAC9C,IAAA,sBAAc,EAAC,mBAAU,CAAC,OAAO,CAAC,OAAO,CAAC;YAC1C,kCAAkC;YAClC,IAAA,sBAAc,EAAC,mBAAU,CAAC,SAAS,CAAC,OAAO,CAAC;YAE5C,kCAAkC;YAClC,IAAA,sBAAc,EAAC,mBAAS,CAAC,OAAO,CAAC;YACjC,4BAA4B;YAC5B,IAAA,sBAAc,EAAC,mBAAS,CAAC,WAAW,CAAC;YACrC,6BAA6B;YAC7B,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,OAAO,EAAC,CAAC;YACjE,mCAAmC;YACnC,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,kBAAkB,EAAC,CAAC;YAC5E,kCAAkC;YAClC,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,aAAa,EAAE,GAAG,mBAAS,CAAC,KAAK,CAAC,gBAAgB,EAAC,CAAC;YAE1E,8BAA8B;YAC9B,IAAA,sBAAc,EAAC,mBAAa,CAAC,OAAO,CAAC,OAAO,CAAC;YAC7C,oCAAoC;YACpC,IAAA,sBAAc,EAAC,mBAAa,CAAC,eAAe,CAAC,OAAO,CAAC;YAErD,mCAAmC;YACnC,IAAA,sBAAc,EAAC,mBAAQ,CAAC,OAAO,CAAC;YAChC,gDAAgD;YAChD,IAAA,sBAAc,EAAC,EAAC,IAAI,EAAE,YAAY,EAAE,GAAG,mBAAQ,CAAC,KAAK,EAAC,CAAC;SAC1D;KACW,GAEtB,CACL,CAAC;AAEW,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACX,UAAU,EAAE,mBAAO,CAAC,UAA4B;CACnD,CAAC","sourcesContent":["import {Meta, StoryFn} from '@storybook/react';\n\nimport {blockTransform} from '../../.storybook/utils';\nimport {PageConstructor} from '../containers/PageConstructor';\nimport {CustomConfig, NavigationData, PageContent} from '../models';\n\nimport bannerData from '../blocks/Banner/__stories__/data.json';\nimport companiesData from '../blocks/Companies/__stories__/data.json';\nimport infoData from '../blocks/Info/__stories__/data.json';\nimport mediaData from '../blocks/Media/__stories__/data.json';\nimport navData from '../navigation/__stories__/data.json';\n\nexport default {\n    title: 'Lab/Tokenization/Blocks/MediaAndPromo',\n    component: PageConstructor,\n} as Meta;\n\nconst Template: StoryFn<{navigation: NavigationData; custom?: CustomConfig}> = ({\n    navigation,\n    custom = {},\n}) => (\n    <PageConstructor\n        navigation={navigation}\n        custom={custom}\n        content={\n            {\n                blocks: [\n                    // banner-block: light theme with themed image\n                    blockTransform(bannerData.default.content),\n                    // banner-block: forced dark theme\n                    blockTransform(bannerData.darkTheme.content),\n\n                    // media-block: default with image\n                    blockTransform(mediaData.default),\n                    // media-block: image slider\n                    blockTransform(mediaData.imageSlider),\n                    // media-block: youtube embed\n                    blockTransform({type: 'media-block', ...mediaData.video.youtube}),\n                    // media-block: video with controls\n                    blockTransform({type: 'media-block', ...mediaData.video.staticWithControls}),\n                    // media-block: video with preview\n                    blockTransform({type: 'media-block', ...mediaData.video.videoWithPreview}),\n\n                    // companies-block: title only\n                    blockTransform(companiesData.default.content),\n                    // companies-block: with description\n                    blockTransform(companiesData.withDescription.content),\n\n                    // info-block: dark theme (default)\n                    blockTransform(infoData.default),\n                    // info-block: light theme with background color\n                    blockTransform({type: 'info-block', ...infoData.light}),\n                ],\n            } as PageContent\n        }\n    />\n);\n\nexport const Default = Template.bind({});\nDefault.args = {\n    navigation: navData.navigation as NavigationData,\n};\n"]}

package/build/cjs/demo/TokenizationHeader.stories.d.ts

@@ -0,0 +1,13 @@
+import { Meta } from '@storybook/react';
+import { HeaderBlockModel, NavigationData } from "../models/index.js";
+interface StoryArgs {
+    headerBlock: HeaderBlockModel;
+    navigation: NavigationData;
+}
+declare const _default: Meta;
+export default _default;
+export declare const Default: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;
+export declare const BreadcrumbsLight: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;
+export declare const BreadcrumbsDark: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;
+export declare const Image: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;
+export declare const BackgroundMedia: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;

package/build/cjs/demo/TokenizationHeader.stories.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BackgroundMedia = exports.Image = exports.BreadcrumbsDark = exports.BreadcrumbsLight = exports.Default = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const PageConstructor_1 = require("../containers/PageConstructor/index.js");
+const tokenizationLanding_1 = require("./tokenizationLanding.js");
+const data_json_1 = tslib_1.__importDefault(require("../blocks/Header/__stories__/data.json"));
+const data_json_2 = tslib_1.__importDefault(require("../navigation/__stories__/data.json"));
+exports.default = {
+    title: 'Lab/Tokenization/Blocks/Header',
+    component: PageConstructor_1.PageConstructor,
+};
+const Template = ({ headerBlock, navigation }) => ((0, jsx_runtime_1.jsx)(PageConstructor_1.PageConstructor, { navigation: navigation, content: (0, tokenizationLanding_1.createTokenizationLandingContent)(headerBlock) }));
+const navigation = data_json_2.default.navigation;
+exports.Default = Template.bind({});
+exports.Default.args = {
+    navigation,
+    headerBlock: data_json_1.default.default,
+};
+exports.BreadcrumbsLight = Template.bind({});
+exports.BreadcrumbsLight.args = {
+    navigation,
+    headerBlock: data_json_1.default.breadcrumbs[0],
+};
+exports.BreadcrumbsDark = Template.bind({});
+exports.BreadcrumbsDark.args = {
+    navigation,
+    headerBlock: data_json_1.default.breadcrumbs[1],
+};
+exports.Image = Template.bind({});
+exports.Image.args = {
+    navigation,
+    headerBlock: {
+        ...data_json_1.default.image,
+        title: data_json_1.default.image.title.replace('{{width}}', 'm'),
+    },
+};
+exports.BackgroundMedia = Template.bind({});
+exports.BackgroundMedia.args = {
+    navigation,
+    headerBlock: {
+        type: 'header-block',
+        ...data_json_1.default.media.image,
+    },
+};
+//# sourceMappingURL=TokenizationHeader.stories.js.map

package/build/cjs/demo/TokenizationHeader.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenizationHeader.stories.js","sourceRoot":"../../../src","sources":["demo/TokenizationHeader.stories.tsx"],"names":[],"mappings":";;;;;AAEA,4EAA8D;AAG9D,kEAAuE;AAEvE,+FAAgE;AAChE,4FAA0D;AAO1D,kBAAe;IACX,KAAK,EAAE,gCAAgC;IACvC,SAAS,EAAE,iCAAe;CACrB,CAAC;AAEV,MAAM,QAAQ,GAAuB,CAAC,EAAC,WAAW,EAAE,UAAU,EAAC,EAAE,EAAE,CAAC,CAChE,uBAAC,iCAAe,IACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,IAAA,sDAAgC,EAAC,WAAW,CAAC,GACxD,CACL,CAAC;AAEF,MAAM,UAAU,GAAG,mBAAO,CAAC,UAA4B,CAAC;AAE3C,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACX,UAAU;IACV,WAAW,EAAE,mBAAU,CAAC,OAA2B;CACtD,CAAC;AAEW,QAAA,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAClD,wBAAgB,CAAC,IAAI,GAAG;IACpB,UAAU;IACV,WAAW,EAAE,mBAAU,CAAC,WAAW,CAAC,CAAC,CAAqB;CAC7D,CAAC;AAEW,QAAA,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACjD,uBAAe,CAAC,IAAI,GAAG;IACnB,UAAU;IACV,WAAW,EAAE,mBAAU,CAAC,WAAW,CAAC,CAAC,CAAqB;CAC7D,CAAC;AAEW,QAAA,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvC,aAAK,CAAC,IAAI,GAAG;IACT,UAAU;IACV,WAAW,EAAE;QACT,GAAG,mBAAU,CAAC,KAAK;QACnB,KAAK,EAAE,mBAAU,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,GAAG,CAAC;KACtC;CACxB,CAAC;AAEW,QAAA,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACjD,uBAAe,CAAC,IAAI,GAAG;IACnB,UAAU;IACV,WAAW,EAAE;QACT,IAAI,EAAE,cAAc;QACpB,GAAG,mBAAU,CAAC,KAAK,CAAC,KAAK;KACR;CACxB,CAAC","sourcesContent":["import {Meta, StoryFn} from '@storybook/react';\n\nimport {PageConstructor} from '../containers/PageConstructor';\nimport {HeaderBlockModel, NavigationData} from '../models';\n\nimport {createTokenizationLandingContent} from './tokenizationLanding';\n\nimport headerData from '../blocks/Header/__stories__/data.json';\nimport navData from '../navigation/__stories__/data.json';\n\ninterface StoryArgs {\n    headerBlock: HeaderBlockModel;\n    navigation: NavigationData;\n}\n\nexport default {\n    title: 'Lab/Tokenization/Blocks/Header',\n    component: PageConstructor,\n} as Meta;\n\nconst Template: StoryFn<StoryArgs> = ({headerBlock, navigation}) => (\n    <PageConstructor\n        navigation={navigation}\n        content={createTokenizationLandingContent(headerBlock)}\n    />\n);\n\nconst navigation = navData.navigation as NavigationData;\n\nexport const Default = Template.bind({});\nDefault.args = {\n    navigation,\n    headerBlock: headerData.default as HeaderBlockModel,\n};\n\nexport const BreadcrumbsLight = Template.bind({});\nBreadcrumbsLight.args = {\n    navigation,\n    headerBlock: headerData.breadcrumbs[0] as HeaderBlockModel,\n};\n\nexport const BreadcrumbsDark = Template.bind({});\nBreadcrumbsDark.args = {\n    navigation,\n    headerBlock: headerData.breadcrumbs[1] as HeaderBlockModel,\n};\n\nexport const Image = Template.bind({});\nImage.args = {\n    navigation,\n    headerBlock: {\n        ...headerData.image,\n        title: headerData.image.title.replace('{{width}}', 'm'),\n    } as HeaderBlockModel,\n};\n\nexport const BackgroundMedia = Template.bind({});\nBackgroundMedia.args = {\n    navigation,\n    headerBlock: {\n        type: 'header-block',\n        ...headerData.media.image,\n    } as HeaderBlockModel,\n};\n"]}

package/build/cjs/demo/TokenizationHero.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta } from '@storybook/react';
+import { HeroBlockModel, NavigationData } from "../models/index.js";
+interface StoryArgs {
+    heroBlock: HeroBlockModel;
+    navigation: NavigationData;
+}
+declare const _default: Meta;
+export default _default;
+export declare const Default: import("@storybook/core/csf", { with: { "resolution-mode": "import" } }).AnnotatedStoryFn<import("@storybook/react").ReactRenderer, StoryArgs>;

package/build/cjs/demo/TokenizationHero.stories.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const PageConstructor_1 = require("../containers/PageConstructor/index.js");
+const tokenizationLanding_1 = require("./tokenizationLanding.js");
+const data_json_1 = tslib_1.__importDefault(require("../blocks/Hero/__stories__/data.json"));
+const data_json_2 = tslib_1.__importDefault(require("../navigation/__stories__/data.json"));
+exports.default = {
+    title: 'Lab/Tokenization/Blocks/Hero',
+    component: PageConstructor_1.PageConstructor,
+};
+const Template = ({ heroBlock, navigation }) => ((0, jsx_runtime_1.jsx)(PageConstructor_1.PageConstructor, { navigation: navigation, content: (0, tokenizationLanding_1.createTokenizationLandingContent)(heroBlock) }));
+exports.Default = Template.bind({});
+exports.Default.args = {
+    navigation: data_json_2.default.navigation,
+    heroBlock: data_json_1.default.default,
+};
+//# sourceMappingURL=TokenizationHero.stories.js.map

package/build/cjs/demo/TokenizationHero.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenizationHero.stories.js","sourceRoot":"../../../src","sources":["demo/TokenizationHero.stories.tsx"],"names":[],"mappings":";;;;;AAEA,4EAA8D;AAG9D,kEAAuE;AAEvE,6FAA4D;AAC5D,4FAA0D;AAO1D,kBAAe;IACX,KAAK,EAAE,8BAA8B;IACrC,SAAS,EAAE,iCAAe;CACrB,CAAC;AAEV,MAAM,QAAQ,GAAuB,CAAC,EAAC,SAAS,EAAE,UAAU,EAAC,EAAE,EAAE,CAAC,CAC9D,uBAAC,iCAAe,IACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,IAAA,sDAAgC,EAAC,SAAS,CAAC,GACtD,CACL,CAAC;AAEW,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACX,UAAU,EAAE,mBAAO,CAAC,UAA4B;IAChD,SAAS,EAAE,mBAAQ,CAAC,OAAyB;CAChD,CAAC","sourcesContent":["import {Meta, StoryFn} from '@storybook/react';\n\nimport {PageConstructor} from '../containers/PageConstructor';\nimport {HeroBlockModel, NavigationData} from '../models';\n\nimport {createTokenizationLandingContent} from './tokenizationLanding';\n\nimport heroData from '../blocks/Hero/__stories__/data.json';\nimport navData from '../navigation/__stories__/data.json';\n\ninterface StoryArgs {\n    heroBlock: HeroBlockModel;\n    navigation: NavigationData;\n}\n\nexport default {\n    title: 'Lab/Tokenization/Blocks/Hero',\n    component: PageConstructor,\n} as Meta;\n\nconst Template: StoryFn<StoryArgs> = ({heroBlock, navigation}) => (\n    <PageConstructor\n        navigation={navigation}\n        content={createTokenizationLandingContent(heroBlock)}\n    />\n);\n\nexport const Default = Template.bind({});\nDefault.args = {\n    navigation: navData.navigation as NavigationData,\n    heroBlock: heroData.default as HeroBlockModel,\n};\n"]}

package/build/cjs/demo/tokenizationLanding.d.ts

@@ -0,0 +1,2 @@
+import { ConstructorBlock, PageContent } from "../models/index.js";
+export declare const createTokenizationLandingContent: (headerBlock: ConstructorBlock) => PageContent;

package/build/cjs/demo/tokenizationLanding.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createTokenizationLandingContent = void 0;
+const tslib_1 = require("tslib");
+const utils_1 = require("../../.storybook/utils.js");
+const data_json_1 = tslib_1.__importDefault(require("../blocks/Banner/__stories__/data.json"));
+const data_json_2 = tslib_1.__importDefault(require("../blocks/Companies/__stories__/data.json"));
+const data_json_3 = tslib_1.__importDefault(require("../blocks/PromoFeaturesBlock/__stories__/data.json"));
+const createTokenizationLandingContent = (headerBlock) => ({
+    blocks: [
+        (0, utils_1.blockTransform)(headerBlock),
+        (0, utils_1.blockTransform)({
+            ...data_json_3.default.common,
+            ...data_json_3.default.defaultTheme.content,
+        }),
+        (0, utils_1.blockTransform)(data_json_2.default.withDescription.content),
+        (0, utils_1.blockTransform)(data_json_1.default.default.content),
+    ],
+});
+exports.createTokenizationLandingContent = createTokenizationLandingContent;
+//# sourceMappingURL=tokenizationLanding.js.map

package/build/cjs/demo/tokenizationLanding.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokenizationLanding.js","sourceRoot":"../../../src","sources":["demo/tokenizationLanding.ts"],"names":[],"mappings":";;;;AAAA,qDAAsD;AAGtD,+FAAgE;AAChE,kGAAsE;AACtE,2GAAmF;AAE5E,MAAM,gCAAgC,GAAG,CAAC,WAA6B,EAAe,EAAE,CAAC,CAAC;IAC7F,MAAM,EAAE;QACJ,IAAA,sBAAc,EAAC,WAAW,CAAC;QAC3B,IAAA,sBAAc,EAAC;YACX,GAAG,mBAAiB,CAAC,MAAM;YAC3B,GAAG,mBAAiB,CAAC,YAAY,CAAC,OAAO;SAC5C,CAAC;QACF,IAAA,sBAAc,EAAC,mBAAa,CAAC,eAAe,CAAC,OAAO,CAAC;QACrD,IAAA,sBAAc,EAAC,mBAAU,CAAC,OAAO,CAAC,OAAO,CAAC;KAC7C;CACJ,CAAC,CAAC;AAVU,QAAA,gCAAgC,oCAU1C","sourcesContent":["import {blockTransform} from '../../.storybook/utils';\nimport {ConstructorBlock, PageContent} from '../models';\n\nimport bannerData from '../blocks/Banner/__stories__/data.json';\nimport companiesData from '../blocks/Companies/__stories__/data.json';\nimport promoFeaturesData from '../blocks/PromoFeaturesBlock/__stories__/data.json';\n\nexport const createTokenizationLandingContent = (headerBlock: ConstructorBlock): PageContent => ({\n    blocks: [\n        blockTransform(headerBlock),\n        blockTransform({\n            ...promoFeaturesData.common,\n            ...promoFeaturesData.defaultTheme.content,\n        }),\n        blockTransform(companiesData.withDescription.content),\n        blockTransform(bannerData.default.content),\n    ],\n});\n"]}

package/build/cjs/models/constructor-items/sub-blocks.d.ts

@@ -154,6 +154,9 @@ export interface LayoutItemProps extends ClassNameProps, CardLayoutProps, Analyt
     border?: boolean;
     fullscreen?: boolean;
     icon?: ThemeSupporting<PositionedIcon>;
+    url?: string;
+    urlTitle?: string;
+    target?: string;
 }
 export interface ImageCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
     image: ThemeSupporting<ImageProps>;

package/build/cjs/models/constructor-items/sub-blocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"sub-blocks.js","sourceRoot":"../../../../src","sources":["models/constructor-items/sub-blocks.ts"],"names":[],"mappings":";;;AA8BA,IAAY,YAoBX;AApBD,WAAY,YAAY;IACpB,mCAAmB,CAAA;IACnB,+BAAe,CAAA;IACf;;OAEG;IACH,gDAAgC,CAAA;IAChC,wCAAwB,CAAA;IACxB,0CAA0B,CAAA;IAC1B,0CAA0B,CAAA;IAC1B,kDAAkC,CAAA;IAClC,wCAAwB,CAAA;IACxB,mCAAmB,CAAA;IACnB,4CAA4B,CAAA;IAC5B;;OAEG;IACH,6BAAa,CAAA;IACb,wCAAwB,CAAA;IACxB,wCAAwB,CAAA;AAC5B,CAAC,EApBW,YAAY,4BAAZ,YAAY,QAoBvB;AAED,IAAY,YAGX;AAHD,WAAY,YAAY;IACpB,2BAAW,CAAA;IACX,6BAAa,CAAA;AACjB,CAAC,EAHW,YAAY,4BAAZ,YAAY,QAGvB;AAkBD,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,uCAAiB,CAAA;IACjB,yCAAmB,CAAA;AACvB,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAEY,QAAA,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC","sourcesContent":["import {ClassNameProps, GravityIconProps, QuoteType} from '../../models';\nimport {ThemeSupporting} from '../../utils';\nimport {\n    HubspotEventData,\n    HubspotEventHandlers,\n    HubspotFormDefaultValues,\n} from '../../utils/hubspot';\nimport {AnalyticsEventsBase} from '../common';\n\nimport {ContentBlockProps} from './blocks';\nimport {\n    AuthorItem,\n    ButtonProps,\n    CardBaseProps,\n    CardLayoutProps,\n    ContentTheme,\n    DividerSize,\n    ImageCardMargins,\n    ImageObjectProps,\n    ImageProps,\n    LayoutItemContentMargin,\n    LinkProps,\n    MediaProps,\n    MediaView,\n    PriceDetailedProps,\n    TextTheme,\n    Themable,\n    ThemedImage,\n} from './common';\n\nexport enum SubBlockType {\n    Divider = 'divider',\n    Quote = 'quote',\n    /**\n     * @deprecated Will be removed\n     */\n    PriceDetailed = 'price-detailed',\n    MediaCard = 'media-card',\n    BannerCard = 'banner-card',\n    LayoutItem = 'layout-item',\n    BackgroundCard = 'background-card',\n    BasicCard = 'basic-card',\n    Content = 'content',\n    HubspotForm = 'hubspot-form',\n    /**\n     * @deprecated Will be removed, use BasicCard instead\n     */\n    Card = 'card',\n    PriceCard = 'price-card',\n    ImageCard = 'image-card',\n}\n\nexport enum IconPosition {\n    Top = 'top',\n    Left = 'left',\n}\n\nexport interface PositionedIcon {\n    value: ImageProps;\n    position?: IconPosition;\n}\n\nexport interface PositionedGravityIcon {\n    value: GravityIconProps;\n    position?: IconPosition;\n}\n\nexport interface IconWrapperProps {\n    icon?: PositionedIcon;\n    gravityIcon?: PositionedGravityIcon;\n    size?: 's' | 'm' | 'l' | 'xl';\n}\n\nexport enum ImageCardDirection {\n    Direct = 'direct',\n    Reverse = 'reverse',\n}\n\nexport const SubBlockTypes = Object.values(SubBlockType);\n\nexport interface DividerProps {\n    size?: DividerSize;\n    border?: boolean;\n}\n\nexport interface HubspotFormProps extends HubspotEventHandlers, AnalyticsEventsBase {\n    className?: string;\n    theme?: ContentTheme;\n    isMobile?: boolean;\n    region?: string;\n    portalId: string;\n    formId: string;\n    formInstanceId?: string;\n    formClassName?: string;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onBeforeLoad?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onBeforeSubmit?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onSubmit?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onLoad?: (arg: HubspotEventData) => void;\n    hubspotEvents?: string[];\n    createDOMElement?: boolean;\n    defaultValues?: HubspotFormDefaultValues;\n}\n\n//cards\nexport interface QuoteProps extends Themable, CardBaseProps {\n    text?: string;\n    // for backward compatibility, yfmText will become property 'text' in major\n    yfmText?: string;\n    image: ThemedImage;\n    logo: ThemeSupporting<ImageProps>;\n    color?: string;\n    /**\n     * @deprecated use property button instead\n     */\n    url?: string;\n    /**\n     * @deprecated use property button instead\n     */\n    urlTitle?: string;\n    author?: AuthorItem;\n    /**\n     * @deprecated use property button instead\n     */\n    buttonText?: string;\n    theme?: TextTheme;\n    quoteType?: QuoteType;\n    button?: ButtonProps;\n}\n\nexport interface BackgroundCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'centered' | 'controlPosition'> {\n    url?: string;\n    urlTitle?: string;\n    background?: ThemeSupporting<ImageObjectProps>;\n    paddingBottom?: 's' | 'm' | 'l' | 'xl';\n    backgroundColor?: string;\n}\n\nexport interface BasicCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'colSizes' | 'centered' | 'theme' | 'controlPosition'> {\n    url: string;\n    urlTitle?: string;\n    icon?: ThemeSupporting<ImageProps>;\n    gravityIcon?: ThemeSupporting<GravityIconProps>;\n    target?: string;\n    iconPosition?: IconPosition;\n    /**\n     * @deprecated This property will be removed in future versions\n     */\n    hoverBackgroundColor?: string;\n}\n\nexport interface BannerCardProps {\n    title: string;\n    subtitle?: string;\n    className?: string;\n    image?: ThemeSupporting<string>;\n    disableCompress?: boolean;\n    color?: ThemeSupporting<string>;\n    theme?: TextTheme;\n    button?: Pick<ButtonProps, 'text' | 'url' | 'target' | 'theme'>;\n    mediaView?: MediaView;\n}\n\nexport interface MediaCardProps extends MediaProps, AnalyticsEventsBase, CardBaseProps {}\n\nexport interface PriceCardProps extends CardBaseProps, Pick<ContentBlockProps, 'theme'> {\n    title: string;\n    price: string;\n    pricePeriod?: string;\n    priceDetails?: string;\n    description?: string;\n    buttons?: ButtonProps[];\n    links?: LinkProps[];\n    backgroundColor?: string;\n    list?: string[];\n}\n\nexport interface LayoutItemProps extends ClassNameProps, CardLayoutProps, AnalyticsEventsBase {\n    content: Omit<ContentBlockProps, 'colSizes' | 'centered'>;\n    contentMargin?: LayoutItemContentMargin;\n    media?: ThemeSupporting<MediaProps>;\n    metaInfo?: string[];\n    border?: boolean;\n    fullscreen?: boolean;\n    icon?: ThemeSupporting<PositionedIcon>;\n}\n\nexport interface ImageCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {\n    image: ThemeSupporting<ImageProps>;\n    enableImageBorderRadius?: boolean;\n    margins?: ImageCardMargins;\n    direction?: ImageCardDirection;\n    backgroundColor?: string;\n    url?: string;\n    urlTitle?: string;\n    target?: string;\n}\n\n// sub-block models\nexport type DividerModel = {\n    type: SubBlockType.Divider;\n} & DividerProps;\n\nexport type QuoteModel = {\n    type: SubBlockType.Quote;\n} & QuoteProps;\n\nexport type LayoutItemModel = {\n    type: SubBlockType.LayoutItem;\n} & LayoutItemProps;\n\nexport type BackgroundCardModel = {\n    type: SubBlockType.BackgroundCard;\n} & BackgroundCardProps;\n\n/** @deprecated */\nexport type PriceDetailedModel = {\n    type: SubBlockType.PriceDetailed;\n} & PriceDetailedProps;\n\nexport type MediaCardModel = {\n    type: SubBlockType.MediaCard;\n} & MediaCardProps;\n\nexport type HubspotFormModel = {\n    type: SubBlockType.HubspotForm;\n} & HubspotFormProps;\n\nexport type BannerCardModel = {\n    type: SubBlockType.BannerCard;\n} & BannerCardProps;\n\nexport type BasicCardModel = {\n    type: SubBlockType.BasicCard;\n} & BasicCardProps;\n\nexport type PriceCardModel = {\n    type: SubBlockType.PriceCard;\n} & PriceCardProps;\n\nexport type ImageCardModel = {\n    type: SubBlockType.ImageCard;\n} & ImageCardProps;\n\nexport type SubBlockModels =\n    | DividerModel\n    | QuoteModel\n    | PriceDetailedModel\n    | MediaCardModel\n    | BackgroundCardModel\n    | HubspotFormModel\n    | BannerCardModel\n    | BasicCardModel\n    | PriceCardModel\n    | LayoutItemModel\n    | ImageCardModel;\n\nexport type SubBlock = SubBlockModels;\n"]}
+{"version":3,"file":"sub-blocks.js","sourceRoot":"../../../../src","sources":["models/constructor-items/sub-blocks.ts"],"names":[],"mappings":";;;AA8BA,IAAY,YAoBX;AApBD,WAAY,YAAY;IACpB,mCAAmB,CAAA;IACnB,+BAAe,CAAA;IACf;;OAEG;IACH,gDAAgC,CAAA;IAChC,wCAAwB,CAAA;IACxB,0CAA0B,CAAA;IAC1B,0CAA0B,CAAA;IAC1B,kDAAkC,CAAA;IAClC,wCAAwB,CAAA;IACxB,mCAAmB,CAAA;IACnB,4CAA4B,CAAA;IAC5B;;OAEG;IACH,6BAAa,CAAA;IACb,wCAAwB,CAAA;IACxB,wCAAwB,CAAA;AAC5B,CAAC,EApBW,YAAY,4BAAZ,YAAY,QAoBvB;AAED,IAAY,YAGX;AAHD,WAAY,YAAY;IACpB,2BAAW,CAAA;IACX,6BAAa,CAAA;AACjB,CAAC,EAHW,YAAY,4BAAZ,YAAY,QAGvB;AAkBD,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,uCAAiB,CAAA;IACjB,yCAAmB,CAAA;AACvB,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAEY,QAAA,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC","sourcesContent":["import {ClassNameProps, GravityIconProps, QuoteType} from '../../models';\nimport {ThemeSupporting} from '../../utils';\nimport {\n    HubspotEventData,\n    HubspotEventHandlers,\n    HubspotFormDefaultValues,\n} from '../../utils/hubspot';\nimport {AnalyticsEventsBase} from '../common';\n\nimport {ContentBlockProps} from './blocks';\nimport {\n    AuthorItem,\n    ButtonProps,\n    CardBaseProps,\n    CardLayoutProps,\n    ContentTheme,\n    DividerSize,\n    ImageCardMargins,\n    ImageObjectProps,\n    ImageProps,\n    LayoutItemContentMargin,\n    LinkProps,\n    MediaProps,\n    MediaView,\n    PriceDetailedProps,\n    TextTheme,\n    Themable,\n    ThemedImage,\n} from './common';\n\nexport enum SubBlockType {\n    Divider = 'divider',\n    Quote = 'quote',\n    /**\n     * @deprecated Will be removed\n     */\n    PriceDetailed = 'price-detailed',\n    MediaCard = 'media-card',\n    BannerCard = 'banner-card',\n    LayoutItem = 'layout-item',\n    BackgroundCard = 'background-card',\n    BasicCard = 'basic-card',\n    Content = 'content',\n    HubspotForm = 'hubspot-form',\n    /**\n     * @deprecated Will be removed, use BasicCard instead\n     */\n    Card = 'card',\n    PriceCard = 'price-card',\n    ImageCard = 'image-card',\n}\n\nexport enum IconPosition {\n    Top = 'top',\n    Left = 'left',\n}\n\nexport interface PositionedIcon {\n    value: ImageProps;\n    position?: IconPosition;\n}\n\nexport interface PositionedGravityIcon {\n    value: GravityIconProps;\n    position?: IconPosition;\n}\n\nexport interface IconWrapperProps {\n    icon?: PositionedIcon;\n    gravityIcon?: PositionedGravityIcon;\n    size?: 's' | 'm' | 'l' | 'xl';\n}\n\nexport enum ImageCardDirection {\n    Direct = 'direct',\n    Reverse = 'reverse',\n}\n\nexport const SubBlockTypes = Object.values(SubBlockType);\n\nexport interface DividerProps {\n    size?: DividerSize;\n    border?: boolean;\n}\n\nexport interface HubspotFormProps extends HubspotEventHandlers, AnalyticsEventsBase {\n    className?: string;\n    theme?: ContentTheme;\n    isMobile?: boolean;\n    region?: string;\n    portalId: string;\n    formId: string;\n    formInstanceId?: string;\n    formClassName?: string;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onBeforeLoad?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onBeforeSubmit?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onSubmit?: (arg: HubspotEventData) => void;\n\n    /**\n     * To use this handler for component that is rendered in iframe, set up useLoopBackHubspotEvents hook on top level frame\n     */\n    onLoad?: (arg: HubspotEventData) => void;\n    hubspotEvents?: string[];\n    createDOMElement?: boolean;\n    defaultValues?: HubspotFormDefaultValues;\n}\n\n//cards\nexport interface QuoteProps extends Themable, CardBaseProps {\n    text?: string;\n    // for backward compatibility, yfmText will become property 'text' in major\n    yfmText?: string;\n    image: ThemedImage;\n    logo: ThemeSupporting<ImageProps>;\n    color?: string;\n    /**\n     * @deprecated use property button instead\n     */\n    url?: string;\n    /**\n     * @deprecated use property button instead\n     */\n    urlTitle?: string;\n    author?: AuthorItem;\n    /**\n     * @deprecated use property button instead\n     */\n    buttonText?: string;\n    theme?: TextTheme;\n    quoteType?: QuoteType;\n    button?: ButtonProps;\n}\n\nexport interface BackgroundCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'centered' | 'controlPosition'> {\n    url?: string;\n    urlTitle?: string;\n    background?: ThemeSupporting<ImageObjectProps>;\n    paddingBottom?: 's' | 'm' | 'l' | 'xl';\n    backgroundColor?: string;\n}\n\nexport interface BasicCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'colSizes' | 'centered' | 'theme' | 'controlPosition'> {\n    url: string;\n    urlTitle?: string;\n    icon?: ThemeSupporting<ImageProps>;\n    gravityIcon?: ThemeSupporting<GravityIconProps>;\n    target?: string;\n    iconPosition?: IconPosition;\n    /**\n     * @deprecated This property will be removed in future versions\n     */\n    hoverBackgroundColor?: string;\n}\n\nexport interface BannerCardProps {\n    title: string;\n    subtitle?: string;\n    className?: string;\n    image?: ThemeSupporting<string>;\n    disableCompress?: boolean;\n    color?: ThemeSupporting<string>;\n    theme?: TextTheme;\n    button?: Pick<ButtonProps, 'text' | 'url' | 'target' | 'theme'>;\n    mediaView?: MediaView;\n}\n\nexport interface MediaCardProps extends MediaProps, AnalyticsEventsBase, CardBaseProps {}\n\nexport interface PriceCardProps extends CardBaseProps, Pick<ContentBlockProps, 'theme'> {\n    title: string;\n    price: string;\n    pricePeriod?: string;\n    priceDetails?: string;\n    description?: string;\n    buttons?: ButtonProps[];\n    links?: LinkProps[];\n    backgroundColor?: string;\n    list?: string[];\n}\n\nexport interface LayoutItemProps extends ClassNameProps, CardLayoutProps, AnalyticsEventsBase {\n    content: Omit<ContentBlockProps, 'colSizes' | 'centered'>;\n    contentMargin?: LayoutItemContentMargin;\n    media?: ThemeSupporting<MediaProps>;\n    metaInfo?: string[];\n    border?: boolean;\n    fullscreen?: boolean;\n    icon?: ThemeSupporting<PositionedIcon>;\n    url?: string;\n    urlTitle?: string;\n    target?: string;\n}\n\nexport interface ImageCardProps\n    extends CardBaseProps,\n        AnalyticsEventsBase,\n        CardLayoutProps,\n        Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {\n    image: ThemeSupporting<ImageProps>;\n    enableImageBorderRadius?: boolean;\n    margins?: ImageCardMargins;\n    direction?: ImageCardDirection;\n    backgroundColor?: string;\n    url?: string;\n    urlTitle?: string;\n    target?: string;\n}\n\n// sub-block models\nexport type DividerModel = {\n    type: SubBlockType.Divider;\n} & DividerProps;\n\nexport type QuoteModel = {\n    type: SubBlockType.Quote;\n} & QuoteProps;\n\nexport type LayoutItemModel = {\n    type: SubBlockType.LayoutItem;\n} & LayoutItemProps;\n\nexport type BackgroundCardModel = {\n    type: SubBlockType.BackgroundCard;\n} & BackgroundCardProps;\n\n/** @deprecated */\nexport type PriceDetailedModel = {\n    type: SubBlockType.PriceDetailed;\n} & PriceDetailedProps;\n\nexport type MediaCardModel = {\n    type: SubBlockType.MediaCard;\n} & MediaCardProps;\n\nexport type HubspotFormModel = {\n    type: SubBlockType.HubspotForm;\n} & HubspotFormProps;\n\nexport type BannerCardModel = {\n    type: SubBlockType.BannerCard;\n} & BannerCardProps;\n\nexport type BasicCardModel = {\n    type: SubBlockType.BasicCard;\n} & BasicCardProps;\n\nexport type PriceCardModel = {\n    type: SubBlockType.PriceCard;\n} & PriceCardProps;\n\nexport type ImageCardModel = {\n    type: SubBlockType.ImageCard;\n} & ImageCardProps;\n\nexport type SubBlockModels =\n    | DividerModel\n    | QuoteModel\n    | PriceDetailedModel\n    | MediaCardModel\n    | BackgroundCardModel\n    | HubspotFormModel\n    | BannerCardModel\n    | BasicCardModel\n    | PriceCardModel\n    | LayoutItemModel\n    | ImageCardModel;\n\nexport type SubBlock = SubBlockModels;\n"]}

package/build/cjs/sub-blocks/LayoutItem/LayoutItem.css

@@ -39,4 +39,19 @@ unpredictable css rules order in build */
   .pc-layout-item__content {
     margin-right: 0;
   }
+}
+
+a.pc-layout-item {
+  color: inherit;
+  text-decoration: none;
+}
+a.pc-layout-item:hover, a.pc-layout-item:active {
+  --pc-text-header-color: inherit;
+  color: inherit;
+}
+a.pc-layout-item .pc-layout-item__media .pc-media-component-image__item {
+  transition: transform 300ms ease-in-out;
+}
+a.pc-layout-item:hover .pc-layout-item__media .pc-media-component-image__item {
+  transform: scale(1.05);
 }

package/build/cjs/sub-blocks/LayoutItem/LayoutItem.d.ts

@@ -1,3 +1,3 @@
 import { LayoutItemProps } from "../../models/index.js";
-declare const LayoutItem: ({ content: { links, ...content }, contentMargin, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: LayoutItemProps) => import("react/jsx-runtime").JSX.Element;
+declare const LayoutItem: ({ content: { links, ...content }, contentMargin, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, url, urlTitle, target, }: LayoutItemProps) => import("react/jsx-runtime").JSX.Element;
 export default LayoutItem;

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

@@ -6,16 +6,19 @@ const React = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const components_1 = require("../../components/index.js");
 const theme_1 = require("../../context/theme/index.js");
+const hooks_1 = require("../../hooks/index.js");
+const models_1 = require("../../models/index.js");
 const utils_1 = require("../../utils/index.js");
 const microdata_1 = require("../../utils/microdata.js");
 const Content_1 = tslib_1.__importDefault(require("../Content/Content.js"));
 const utils_2 = require("./utils.js");
 const b = (0, utils_1.block)('layout-item');
-const LayoutItem = ({ content: { links, ...content }, contentMargin = 'm', metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content', }) => {
+const LayoutItem = ({ content: { links, ...content }, contentMargin = 'm', metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content', url, urlTitle, target, }) => {
     const normalizedLinks = React.useMemo(() => (0, utils_2.getLayoutItemLinks)(links), [links]);
     const areControlsInFooter = controlPosition === 'footer';
     const theme = (0, theme_1.useTheme)();
     const themedIcon = (0, utils_1.getThemedValue)(icon, theme);
+    const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.CardBase, url);
     const contentProps = {
         controlPosition: areControlsInFooter ? 'bottom' : 'default',
         ...content,
@@ -36,7 +39,14 @@ const LayoutItem = ({ content: { links, ...content }, contentMargin = 'm', metaI
         });
         return fullscreen && (0, utils_2.hasFullscreen)(themedMedia) ? ((0, jsx_runtime_1.jsx)(components_1.FullscreenMedia, { showFullscreenIcon: (0, utils_2.showFullscreenIcon)(themedMedia), children: ({ className: mediaClassName, fullscreen: _fullscreen, ...fullscreenMediaProps } = {}) => ((0, jsx_runtime_1.jsx)(components_1.Media, { ...mediaWithMicrodata, ...fullscreenMediaProps, className: b('media', { border }, mediaClassName), analyticsEvents: analyticsEvents })) })) : ((0, jsx_runtime_1.jsx)(components_1.Media, { ...themedMedia, className: b('media', { border }), analyticsEvents: analyticsEvents }));
     };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), children: [renderMedia(), metaInfo && (0, jsx_runtime_1.jsx)(components_1.MetaInfo, { items: metaInfo, className: b('meta-info') }), (0, jsx_runtime_1.jsx)("div", { className: b('content', { 'no-media': !media, margin: contentMargin }), children: (0, jsx_runtime_1.jsx)(components_1.IconWrapper, { icon: themedIcon, className: b('wrapper'), size: contentProps.size, children: (0, jsx_runtime_1.jsx)(Content_1.default, { ...contentProps, titleId: titleId }) }) })] }));
+    const cardContent = ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [renderMedia(), metaInfo && (0, jsx_runtime_1.jsx)(components_1.MetaInfo, { items: metaInfo, className: b('meta-info') }), (0, jsx_runtime_1.jsx)("div", { className: b('content', { 'no-media': !media, margin: contentMargin }), children: (0, jsx_runtime_1.jsx)(components_1.IconWrapper, { icon: themedIcon, className: b('wrapper'), size: contentProps.size, children: (0, jsx_runtime_1.jsx)(Content_1.default, { ...contentProps, titleId: titleId }) }) })] }));
+    if (url) {
+        return ((0, jsx_runtime_1.jsx)(components_1.RouterLink, { href: url, children: (0, jsx_runtime_1.jsx)(uikit_1.Link, { href: url, target: target, rel: target === '_blank' ? 'noopener noreferrer' : undefined, className: b(null, className), title: urlTitle, onClick: () => handleAnalytics(analyticsEvents), extraProps: {
+                    draggable: false,
+                    onDragStart: (event) => event.preventDefault(),
+                }, children: cardContent }) }));
+    }
+    return (0, jsx_runtime_1.jsx)("div", { className: b(null, className), children: cardContent });
 };
 exports.default = LayoutItem;
 //# sourceMappingURL=LayoutItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"LayoutItem.js","sourceRoot":"../../../../src","sources":["sub-blocks/LayoutItem/LayoutItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {useUniqId} from '@gravity-ui/uikit';\n\nimport {FullscreenMedia, IconWrapper, Media, MetaInfo} from '../../components';\nimport {useTheme} from '../../context/theme';\nimport {ContentBlockProps, LayoutItemProps} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {mergeVideoMicrodata} from '../../utils/microdata';\nimport Content from '../Content/Content';\n\nimport {getLayoutItemLinks, hasFullscreen, showFullscreenIcon} from './utils';\n\nimport './LayoutItem.scss';\n\nconst b = block('layout-item');\n\nconst LayoutItem = ({\n    content: {links, ...content},\n    contentMargin = 'm',\n    metaInfo,\n    media,\n    border,\n    fullscreen,\n    icon,\n    className,\n    analyticsEvents,\n    controlPosition = 'content',\n}: LayoutItemProps) => {\n    const normalizedLinks = React.useMemo(() => getLayoutItemLinks(links), [links]);\n    const areControlsInFooter = controlPosition === 'footer';\n    const theme = useTheme();\n    const themedIcon = getThemedValue(icon, theme);\n\n    const contentProps: ContentBlockProps = {\n        controlPosition: areControlsInFooter ? 'bottom' : 'default',\n        ...content,\n        links: normalizedLinks,\n        size: content.size || 's',\n        colSizes: {all: 12, md: 12},\n    };\n    const titleId = useUniqId();\n    const renderMedia = () => {\n        if (!media) {\n            return null;\n        }\n        const themedMedia = getThemedValue(media, theme);\n        const {title} = content;\n        const mediaWithMicrodata = mergeVideoMicrodata(themedMedia, {\n            name: typeof title === 'string' ? title : title?.text,\n            description: content.text,\n        });\n\n        return fullscreen && hasFullscreen(themedMedia) ? (\n            <FullscreenMedia showFullscreenIcon={showFullscreenIcon(themedMedia)}>\n                {({\n                    className: mediaClassName,\n                    fullscreen: _fullscreen,\n                    ...fullscreenMediaProps\n                } = {}) => (\n                    <Media\n                        {...mediaWithMicrodata}\n                        {...fullscreenMediaProps}\n                        className={b('media', {border}, mediaClassName)}\n                        analyticsEvents={analyticsEvents}\n                    />\n                )}\n            </FullscreenMedia>\n        ) : (\n            <Media\n                {...themedMedia}\n                className={b('media', {border})}\n                analyticsEvents={analyticsEvents}\n            />\n        );\n    };\n    return (\n        <div className={b(null, className)}>\n            {renderMedia()}\n            {metaInfo && <MetaInfo items={metaInfo} className={b('meta-info')} />}\n            <div className={b('content', {'no-media': !media, margin: contentMargin})}>\n                <IconWrapper icon={themedIcon} className={b('wrapper')} size={contentProps.size}>\n                    <Content {...contentProps} titleId={titleId} />\n                </IconWrapper>\n            </div>\n        </div>\n    );\n};\n\nexport default LayoutItem;\n"]}
+{"version":3,"file":"LayoutItem.js","sourceRoot":"../../../../src","sources":["sub-blocks/LayoutItem/LayoutItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Link, useUniqId} from '@gravity-ui/uikit';\n\nimport {FullscreenMedia, IconWrapper, Media, MetaInfo, RouterLink} from '../../components';\nimport {useTheme} from '../../context/theme';\nimport {useAnalytics} from '../../hooks';\nimport {ContentBlockProps, DefaultEventNames, LayoutItemProps} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {mergeVideoMicrodata} from '../../utils/microdata';\nimport Content from '../Content/Content';\n\nimport {getLayoutItemLinks, hasFullscreen, showFullscreenIcon} from './utils';\n\nimport './LayoutItem.scss';\n\nconst b = block('layout-item');\n\nconst LayoutItem = ({\n    content: {links, ...content},\n    contentMargin = 'm',\n    metaInfo,\n    media,\n    border,\n    fullscreen,\n    icon,\n    className,\n    analyticsEvents,\n    controlPosition = 'content',\n    url,\n    urlTitle,\n    target,\n}: LayoutItemProps) => {\n    const normalizedLinks = React.useMemo(() => getLayoutItemLinks(links), [links]);\n    const areControlsInFooter = controlPosition === 'footer';\n    const theme = useTheme();\n    const themedIcon = getThemedValue(icon, theme);\n    const handleAnalytics = useAnalytics(DefaultEventNames.CardBase, url);\n\n    const contentProps: ContentBlockProps = {\n        controlPosition: areControlsInFooter ? 'bottom' : 'default',\n        ...content,\n        links: normalizedLinks,\n        size: content.size || 's',\n        colSizes: {all: 12, md: 12},\n    };\n    const titleId = useUniqId();\n    const renderMedia = () => {\n        if (!media) {\n            return null;\n        }\n        const themedMedia = getThemedValue(media, theme);\n        const {title} = content;\n        const mediaWithMicrodata = mergeVideoMicrodata(themedMedia, {\n            name: typeof title === 'string' ? title : title?.text,\n            description: content.text,\n        });\n\n        return fullscreen && hasFullscreen(themedMedia) ? (\n            <FullscreenMedia showFullscreenIcon={showFullscreenIcon(themedMedia)}>\n                {({\n                    className: mediaClassName,\n                    fullscreen: _fullscreen,\n                    ...fullscreenMediaProps\n                } = {}) => (\n                    <Media\n                        {...mediaWithMicrodata}\n                        {...fullscreenMediaProps}\n                        className={b('media', {border}, mediaClassName)}\n                        analyticsEvents={analyticsEvents}\n                    />\n                )}\n            </FullscreenMedia>\n        ) : (\n            <Media\n                {...themedMedia}\n                className={b('media', {border})}\n                analyticsEvents={analyticsEvents}\n            />\n        );\n    };\n\n    const cardContent = (\n        <React.Fragment>\n            {renderMedia()}\n            {metaInfo && <MetaInfo items={metaInfo} className={b('meta-info')} />}\n            <div className={b('content', {'no-media': !media, margin: contentMargin})}>\n                <IconWrapper icon={themedIcon} className={b('wrapper')} size={contentProps.size}>\n                    <Content {...contentProps} titleId={titleId} />\n                </IconWrapper>\n            </div>\n        </React.Fragment>\n    );\n\n    if (url) {\n        return (\n            <RouterLink href={url}>\n                <Link\n                    href={url}\n                    target={target}\n                    rel={target === '_blank' ? 'noopener noreferrer' : undefined}\n                    className={b(null, className)}\n                    title={urlTitle}\n                    onClick={() => handleAnalytics(analyticsEvents)}\n                    extraProps={{\n                        draggable: false,\n                        onDragStart: (event: React.DragEvent<HTMLAnchorElement>) =>\n                            event.preventDefault(),\n                    }}\n                >\n                    {cardContent}\n                </Link>\n            </RouterLink>\n        );\n    }\n\n    return <div className={b(null, className)}>{cardContent}</div>;\n};\n\nexport default LayoutItem;\n"]}

package/build/cjs/sub-blocks/LayoutItem/schema.d.ts

@@ -495,6 +495,16 @@ export declare const LayoutItem: {
         fullscreen: {
             type: string;
         };
+        url: {
+            type: string;
+        };
+        urlTitle: {
+            type: string;
+        };
+        target: {
+            type: string;
+            enum: string[];
+        };
         analyticsEvents: {
             oneOf: ({
                 optionName: string;

package/build/cjs/sub-blocks/LayoutItem/schema.js

@@ -28,6 +28,16 @@ exports.LayoutItem = {
         fullscreen: {
             type: 'boolean',
         },
+        url: {
+            type: 'string',
+        },
+        urlTitle: {
+            type: 'string',
+        },
+        target: {
+            type: 'string',
+            enum: ['_blank', '_parent', '_top', '_self'],
+        },
         analyticsEvents: {
             oneOf: [
                 {

package/build/cjs/sub-blocks/LayoutItem/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["sub-blocks/LayoutItem/schema.ts"],"names":[],"mappings":";;;;AAAA,kEAA+B;AAE/B,yFAAwD;AACxD,8DAAsF;AACtF,4DAAmE;AACnE,iDAA4D;AAE/C,QAAA,UAAU,GAAG;IACtB,IAAI,EAAE,QAAQ;IACd,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC;IAC9B,UAAU,EAAE;QACR,GAAG,kBAAS;QACZ,GAAG,wBAAe;QAClB,KAAK,EAAE,mBAAU;QACjB,OAAO,EAAE,IAAA,cAAI,EAAC,oBAAW,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;QACnD,aAAa,EAAE;YACX,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC;YAChB,OAAO,EAAE,GAAG;SACf;QACD,QAAQ,EAAE,gBAAQ;QAClB,MAAM,EAAE;YACJ,IAAI,EAAE,SAAS;SAClB;QACD,UAAU,EAAE;YACR,IAAI,EAAE,SAAS;SAClB;QACD,eAAe,EAAE;YACb,KAAK,EAAE;gBACH;oBACI,GAAG,4BAAoB;oBACvB,UAAU,EAAE,QAAQ;iBACvB;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,KAAK,EAAE,4BAAoB;oBAC3B,UAAU,EAAE,MAAM;iBACrB;aACJ;SACJ;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport metaInfo from '../../components/MetaInfo/schema';\nimport {BaseProps, CardLayoutProps, MediaProps} from '../../schema/validators/common';\nimport {AnalyticsEventSchema} from '../../schema/validators/event';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\n\nexport const LayoutItem = {\n    type: 'object',\n    additionalProperties: false,\n    required: ['content', 'media'],\n    properties: {\n        ...BaseProps,\n        ...CardLayoutProps,\n        media: MediaProps,\n        content: omit(ContentBase, ['colSize', 'centered']),\n        contentMargin: {\n            type: 'string',\n            enum: ['m', 'l'],\n            default: 'm',\n        },\n        metaInfo: metaInfo,\n        border: {\n            type: 'boolean',\n        },\n        fullscreen: {\n            type: 'boolean',\n        },\n        analyticsEvents: {\n            oneOf: [\n                {\n                    ...AnalyticsEventSchema,\n                    optionName: 'single',\n                },\n                {\n                    type: 'array',\n                    items: AnalyticsEventSchema,\n                    optionName: 'list',\n                },\n            ],\n        },\n    },\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["sub-blocks/LayoutItem/schema.ts"],"names":[],"mappings":";;;;AAAA,kEAA+B;AAE/B,yFAAwD;AACxD,8DAAsF;AACtF,4DAAmE;AACnE,iDAA4D;AAE/C,QAAA,UAAU,GAAG;IACtB,IAAI,EAAE,QAAQ;IACd,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC;IAC9B,UAAU,EAAE;QACR,GAAG,kBAAS;QACZ,GAAG,wBAAe;QAClB,KAAK,EAAE,mBAAU;QACjB,OAAO,EAAE,IAAA,cAAI,EAAC,oBAAW,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;QACnD,aAAa,EAAE;YACX,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC;YAChB,OAAO,EAAE,GAAG;SACf;QACD,QAAQ,EAAE,gBAAQ;QAClB,MAAM,EAAE;YACJ,IAAI,EAAE,SAAS;SAClB;QACD,UAAU,EAAE;YACR,IAAI,EAAE,SAAS;SAClB;QACD,GAAG,EAAE;YACD,IAAI,EAAE,QAAQ;SACjB;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,QAAQ;SACjB;QACD,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC;SAC/C;QACD,eAAe,EAAE;YACb,KAAK,EAAE;gBACH;oBACI,GAAG,4BAAoB;oBACvB,UAAU,EAAE,QAAQ;iBACvB;gBACD;oBACI,IAAI,EAAE,OAAO;oBACb,KAAK,EAAE,4BAAoB;oBAC3B,UAAU,EAAE,MAAM;iBACrB;aACJ;SACJ;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport metaInfo from '../../components/MetaInfo/schema';\nimport {BaseProps, CardLayoutProps, MediaProps} from '../../schema/validators/common';\nimport {AnalyticsEventSchema} from '../../schema/validators/event';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\n\nexport const LayoutItem = {\n    type: 'object',\n    additionalProperties: false,\n    required: ['content', 'media'],\n    properties: {\n        ...BaseProps,\n        ...CardLayoutProps,\n        media: MediaProps,\n        content: omit(ContentBase, ['colSize', 'centered']),\n        contentMargin: {\n            type: 'string',\n            enum: ['m', 'l'],\n            default: 'm',\n        },\n        metaInfo: metaInfo,\n        border: {\n            type: 'boolean',\n        },\n        fullscreen: {\n            type: 'boolean',\n        },\n        url: {\n            type: 'string',\n        },\n        urlTitle: {\n            type: 'string',\n        },\n        target: {\n            type: 'string',\n            enum: ['_blank', '_parent', '_top', '_self'],\n        },\n        analyticsEvents: {\n            oneOf: [\n                {\n                    ...AnalyticsEventSchema,\n                    optionName: 'single',\n                },\n                {\n                    type: 'array',\n                    items: AnalyticsEventSchema,\n                    optionName: 'list',\n                },\n            ],\n        },\n    },\n};\n"]}