@gravity-ui/page-constructor 4.31.1 → 4.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/build/cjs/blocks/Form/Form.css +136 -0
  2. package/build/cjs/blocks/Form/Form.d.ts +4 -0
  3. package/build/cjs/blocks/Form/Form.js +59 -0
  4. package/build/cjs/blocks/Form/InnerForm/InnerForm.d.ts +9 -0
  5. package/build/cjs/blocks/Form/InnerForm/InnerForm.js +28 -0
  6. package/build/cjs/blocks/Form/schema.d.ts +202 -0
  7. package/build/cjs/blocks/Form/schema.js +44 -0
  8. package/build/cjs/blocks/Header/Header.js +6 -2
  9. package/build/cjs/blocks/Tabs/Tabs.js +8 -1
  10. package/build/cjs/blocks/index.d.ts +1 -0
  11. package/build/cjs/blocks/index.js +3 -1
  12. package/build/cjs/components/BackLink/BackLink.d.ts +3 -2
  13. package/build/cjs/components/BackLink/BackLink.js +2 -2
  14. package/build/cjs/components/Button/Button.d.ts +0 -1
  15. package/build/cjs/components/DefaultVideo/DefaultVideo.css +5 -0
  16. package/build/cjs/components/DefaultVideo/DefaultVideo.d.ts +11 -0
  17. package/build/cjs/components/DefaultVideo/DefaultVideo.js +60 -0
  18. package/build/cjs/components/FileLink/FileLink.js +2 -2
  19. package/build/cjs/components/FullscreenImage/FullscreenImage.d.ts +2 -1
  20. package/build/cjs/components/FullscreenImage/FullscreenImage.js +2 -2
  21. package/build/cjs/components/Image/Image.js +2 -2
  22. package/build/cjs/components/Link/Link.js +4 -4
  23. package/build/cjs/components/Media/Video/Video.css +0 -5
  24. package/build/cjs/components/Media/Video/Video.js +3 -7
  25. package/build/cjs/components/Title/Title.d.ts +2 -1
  26. package/build/cjs/components/Title/Title.js +2 -2
  27. package/build/cjs/components/Title/TitleItem.css +3 -3
  28. package/build/cjs/components/YandexForm/YandexForm.d.ts +2 -17
  29. package/build/cjs/components/YandexForm/YandexForm.js +6 -4
  30. package/build/cjs/components/YandexForm/schema.d.ts +16 -0
  31. package/build/cjs/components/YandexForm/schema.js +13 -0
  32. package/build/cjs/constructor-items.d.ts +1 -0
  33. package/build/cjs/constructor-items.js +1 -0
  34. package/build/cjs/editor/data/templates/form-block.json +20 -0
  35. package/build/cjs/models/constructor-items/blocks.d.ts +33 -4
  36. package/build/cjs/models/constructor-items/blocks.js +13 -1
  37. package/build/cjs/models/constructor-items/common.d.ts +22 -3
  38. package/build/cjs/models/guards.d.ts +3 -1
  39. package/build/cjs/models/guards.js +9 -1
  40. package/build/cjs/schema/constants.js +2 -1
  41. package/build/cjs/schema/validators/blocks.d.ts +1 -0
  42. package/build/cjs/schema/validators/blocks.js +1 -0
  43. package/build/cjs/sub-blocks/BasicCard/BasicCard.js +5 -2
  44. package/build/cjs/sub-blocks/Content/Content.js +12 -5
  45. package/build/cjs/sub-blocks/HubspotForm/HubspotForm.css +10 -10
  46. package/build/cjs/sub-blocks/HubspotForm/schema.d.ts +22 -0
  47. package/build/cjs/sub-blocks/HubspotForm/schema.js +17 -0
  48. package/build/cjs/sub-blocks/LayoutItem/utils.d.ts +1 -0
  49. package/build/cjs/sub-blocks/Quote/Quote.css +0 -2
  50. package/build/esm/blocks/Form/Form.css +136 -0
  51. package/build/esm/blocks/Form/Form.d.ts +5 -0
  52. package/build/esm/blocks/Form/Form.js +57 -0
  53. package/build/esm/blocks/Form/InnerForm/InnerForm.d.ts +9 -0
  54. package/build/esm/blocks/Form/InnerForm/InnerForm.js +26 -0
  55. package/build/esm/blocks/Form/schema.d.ts +202 -0
  56. package/build/esm/blocks/Form/schema.js +40 -0
  57. package/build/esm/blocks/Header/Header.js +6 -2
  58. package/build/esm/blocks/Tabs/Tabs.js +8 -1
  59. package/build/esm/blocks/index.d.ts +1 -0
  60. package/build/esm/blocks/index.js +1 -0
  61. package/build/esm/components/BackLink/BackLink.d.ts +3 -2
  62. package/build/esm/components/BackLink/BackLink.js +2 -2
  63. package/build/esm/components/Button/Button.d.ts +0 -1
  64. package/build/esm/components/DefaultVideo/DefaultVideo.css +5 -0
  65. package/build/esm/components/DefaultVideo/DefaultVideo.d.ts +12 -0
  66. package/build/esm/components/DefaultVideo/DefaultVideo.js +57 -0
  67. package/build/esm/components/FileLink/FileLink.js +2 -2
  68. package/build/esm/components/FullscreenImage/FullscreenImage.d.ts +2 -1
  69. package/build/esm/components/FullscreenImage/FullscreenImage.js +2 -2
  70. package/build/esm/components/Image/Image.js +3 -2
  71. package/build/esm/components/Link/Link.js +4 -4
  72. package/build/esm/components/Media/Video/Video.css +0 -5
  73. package/build/esm/components/Media/Video/Video.js +3 -7
  74. package/build/esm/components/Title/Title.d.ts +2 -1
  75. package/build/esm/components/Title/Title.js +2 -2
  76. package/build/esm/components/Title/TitleItem.css +3 -3
  77. package/build/esm/components/YandexForm/YandexForm.d.ts +2 -17
  78. package/build/esm/components/YandexForm/YandexForm.js +5 -3
  79. package/build/esm/components/YandexForm/schema.d.ts +16 -0
  80. package/build/esm/components/YandexForm/schema.js +10 -0
  81. package/build/esm/constructor-items.d.ts +1 -0
  82. package/build/esm/constructor-items.js +2 -1
  83. package/build/esm/editor/data/templates/form-block.json +20 -0
  84. package/build/esm/models/constructor-items/blocks.d.ts +33 -4
  85. package/build/esm/models/constructor-items/blocks.js +12 -0
  86. package/build/esm/models/constructor-items/common.d.ts +22 -3
  87. package/build/esm/models/guards.d.ts +3 -1
  88. package/build/esm/models/guards.js +7 -1
  89. package/build/esm/schema/constants.js +3 -2
  90. package/build/esm/schema/validators/blocks.d.ts +1 -0
  91. package/build/esm/schema/validators/blocks.js +1 -0
  92. package/build/esm/sub-blocks/BasicCard/BasicCard.js +5 -2
  93. package/build/esm/sub-blocks/Content/Content.js +12 -5
  94. package/build/esm/sub-blocks/HubspotForm/HubspotForm.css +10 -10
  95. package/build/esm/sub-blocks/HubspotForm/schema.d.ts +22 -0
  96. package/build/esm/sub-blocks/HubspotForm/schema.js +14 -0
  97. package/build/esm/sub-blocks/LayoutItem/utils.d.ts +1 -0
  98. package/build/esm/sub-blocks/Quote/Quote.css +0 -2
  99. package/package.json +1 -1
  100. package/server/models/constructor-items/blocks.d.ts +33 -4
  101. package/server/models/constructor-items/blocks.js +13 -1
  102. package/server/models/constructor-items/common.d.ts +22 -3
  103. package/server/models/guards.d.ts +3 -1
  104. package/server/models/guards.js +9 -1
  105. package/widget/index.js +1 -1
@@ -1,7 +1,7 @@
1
- import React, { CSSProperties, ReactNode } from 'react';
1
+ import React, { CSSProperties, HTMLProps, ReactNode } from 'react';
2
2
  import { ButtonView, ButtonProps as UikitButtonProps } from '@gravity-ui/uikit';
3
3
  import { ThemeSupporting } from '../../utils';
4
- import { AnalyticsEventsBase, ClassNameProps, PixelEventType, QAProps } from '../common';
4
+ import { AnalyticsEventsBase, ClassNameProps, PixelEvent, PixelEventType, QAProps } from '../common';
5
5
  export declare enum AuthorType {
6
6
  Column = "column",
7
7
  Line = "line"
@@ -95,7 +95,7 @@ interface LoopProps {
95
95
  start: number;
96
96
  end?: number;
97
97
  }
98
- export interface ImageInfoProps {
98
+ export interface ImageInfoProps extends Pick<HTMLProps<HTMLImageElement>, 'aria-describedby'> {
99
99
  alt?: string;
100
100
  disableCompress?: boolean;
101
101
  }
@@ -138,6 +138,7 @@ export interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {
138
138
  target?: string;
139
139
  metrikaGoals?: MetrikaGoal;
140
140
  pixelEvents?: ButtonPixel;
141
+ extraProps?: HTMLProps<HTMLAnchorElement>;
141
142
  }
142
143
  export interface FileLinkProps extends ClassNameProps, Tabbable {
143
144
  href: string;
@@ -147,11 +148,13 @@ export interface FileLinkProps extends ClassNameProps, Tabbable {
147
148
  theme?: ContentTheme;
148
149
  urlTitle?: string;
149
150
  onClick?: () => void;
151
+ extraProps?: HTMLProps<HTMLAnchorElement>;
150
152
  }
151
153
  export type ButtonTheme = ButtonView | 'github' | 'app-store' | 'google-play' | 'scale' | 'monochrome';
152
154
  export interface ButtonProps extends AnalyticsEventsBase, Pick<UikitButtonProps, 'size' | 'width' | 'extraProps'> {
153
155
  text: string;
154
156
  url: string;
157
+ urlTitle?: string;
155
158
  primary?: boolean;
156
159
  theme?: ButtonTheme;
157
160
  img?: ButtonImageProps | string;
@@ -337,4 +340,20 @@ export interface TitleProps {
337
340
  title?: TitleItemProps | string;
338
341
  subtitle?: string;
339
342
  }
343
+ export interface YandexFormProps extends AnalyticsEventsBase {
344
+ id: number | string;
345
+ containerId?: string;
346
+ theme?: string;
347
+ className?: string;
348
+ headerHeight?: number;
349
+ customFormOrigin?: string;
350
+ customFormSection?: string;
351
+ params?: {
352
+ [key: string]: string;
353
+ };
354
+ onSubmit?: () => void;
355
+ onLoad?: () => void;
356
+ metrikaGoals?: string | string[];
357
+ pixelEvents?: string | string[] | PixelEvent | PixelEvent[];
358
+ }
340
359
  export {};
@@ -1,4 +1,6 @@
1
- import { Block, ConstructorItem } from './';
1
+ import { Block, ConstructorItem, FormBlockData, FormBlockHubspotData, FormBlockYandexData } from './';
2
2
  import { MetrikaGoal, NewMetrikaGoal } from './index';
3
3
  export declare function isBlock(block: ConstructorItem): block is Block;
4
4
  export declare function isNewMetrikaFormat(metrika: MetrikaGoal): metrika is NewMetrikaGoal[];
5
+ export declare function isYandexDataForm(data: FormBlockData): data is FormBlockYandexData;
6
+ export declare function isHubspotDataForm(data: FormBlockData): data is FormBlockHubspotData;
@@ -1,7 +1,13 @@
1
- import { BlockTypes } from './';
1
+ import { BlockTypes, } from './';
2
2
  export function isBlock(block) {
3
3
  return block.type in BlockTypes;
4
4
  }
5
5
  export function isNewMetrikaFormat(metrika) {
6
6
  return Boolean(Array.isArray(metrika) && metrika.length && typeof metrika[0] === 'object');
7
7
  }
8
+ export function isYandexDataForm(data) {
9
+ return Boolean(data.yandex);
10
+ }
11
+ export function isHubspotDataForm(data) {
12
+ return Boolean(data.hubspot);
13
+ }
@@ -1,6 +1,6 @@
1
- import { BannerBlock, BannerCard, CardLayoutBlock, CompaniesBlock, ContentLayoutBlock, ExtendedFeaturesBlock, FilterBlock, HeaderBlock, HeaderSliderBlock, IconsBlock, InfoBlock, MapBlock, MediaBlock, PromoFeaturesBlock, QuestionsBlock, ShareBlock, SliderBlock, TableBlock, TabsBlock, } from './validators/blocks';
1
+ import { BannerBlock, BannerCard, CardLayoutBlock, CompaniesBlock, ContentLayoutBlock, ExtendedFeaturesBlock, FilterBlock, FormBlock, HeaderBlock, HeaderSliderBlock, IconsBlock, InfoBlock, MapBlock, MediaBlock, PromoFeaturesBlock, QuestionsBlock, ShareBlock, SliderBlock, TableBlock, TabsBlock, } from './validators/blocks';
2
2
  import { BackgroundCard, BasicCard, Divider, MediaCardBlock, PriceDetailedBlock, Quote, } from './validators/sub-blocks';
3
- export const blockSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, Divider), ExtendedFeaturesBlock), PromoFeaturesBlock), SliderBlock), QuestionsBlock), HeaderBlock), BannerBlock), CompaniesBlock), MediaBlock), MapBlock), InfoBlock), TableBlock), TabsBlock), HeaderSliderBlock), IconsBlock), CardLayoutBlock), ContentLayoutBlock), ShareBlock), FilterBlock);
3
+ export const blockSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, Divider), ExtendedFeaturesBlock), PromoFeaturesBlock), SliderBlock), QuestionsBlock), HeaderBlock), BannerBlock), CompaniesBlock), MediaBlock), MapBlock), InfoBlock), TableBlock), TabsBlock), HeaderSliderBlock), IconsBlock), CardLayoutBlock), ContentLayoutBlock), ShareBlock), FilterBlock), FormBlock);
4
4
  export const cardSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, MediaCardBlock), BannerCard), PriceDetailedBlock), BackgroundCard), Quote), BasicCard);
5
5
  export const constructorBlockSchemaNames = [
6
6
  'divider',
@@ -27,6 +27,7 @@ export const constructorBlockSchemaNames = [
27
27
  'content-layout-block',
28
28
  'share-block',
29
29
  'filter-block',
30
+ 'form-block',
30
31
  ];
31
32
  export const constructorCardSchemaNames = [
32
33
  'media-card',
@@ -16,3 +16,4 @@ export * from '../../blocks/CardLayout/schema';
16
16
  export * from '../../blocks/ContentLayout/schema';
17
17
  export * from '../../blocks/Share/schema';
18
18
  export * from '../../blocks/FilterBlock/schema';
19
+ export * from '../../blocks/Form/schema';
@@ -16,3 +16,4 @@ export * from '../../blocks/CardLayout/schema';
16
16
  export * from '../../blocks/ContentLayout/schema';
17
17
  export * from '../../blocks/Share/schema';
18
18
  export * from '../../blocks/FilterBlock/schema';
19
+ export * from '../../blocks/Form/schema';
@@ -1,5 +1,6 @@
1
1
  import { __rest } from "tslib";
2
2
  import React from 'react';
3
+ import { useUniqId } from '@gravity-ui/uikit';
3
4
  import { Content } from '../';
4
5
  import CardBase from '../../components/CardBase/CardBase';
5
6
  import Image from '../../components/Image/Image';
@@ -11,10 +12,12 @@ const b = block('basic-card');
11
12
  const BasicCard = (props) => {
12
13
  const { title, text, icon, additionalInfo, links, buttons, iconPosition = IconPosition.Top } = props, cardParams = __rest(props, ["title", "text", "icon", "additionalInfo", "links", "buttons", "iconPosition"]);
13
14
  const iconProps = icon && getMediaImage(icon);
14
- return (React.createElement(CardBase, Object.assign({ className: b() }, cardParams),
15
+ const titleId = useUniqId();
16
+ const descriptionId = useUniqId();
17
+ return (React.createElement(CardBase, Object.assign({ className: b() }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
15
18
  React.createElement(CardBase.Content, null,
16
19
  React.createElement("div", { className: b('content', { ['icon-position']: iconPosition }) },
17
20
  iconProps && (React.createElement(Image, Object.assign({}, iconProps, { className: b('icon', { ['icon-position']: iconPosition }) }))),
18
- React.createElement(Content, { title: title, text: text, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, size: "s", className: b({ ['content-layout']: iconPosition }) })))));
21
+ React.createElement(Content, { title: title, titleId: titleId, text: text, textId: descriptionId, additionalInfo: additionalInfo, links: links, buttons: buttons, colSizes: { all: 12, md: 12 }, size: "s", className: b({ ['content-layout']: iconPosition }) })))));
19
22
  };
20
23
  export default BasicCard;
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ import { useUniqId } from '@gravity-ui/uikit';
2
3
  import { Button, Title, YFMWrapper } from '../../components';
3
4
  import LinkBlock from '../../components/Link/Link';
4
5
  import { Col } from '../../grid';
@@ -35,16 +36,18 @@ function getButtonSize(size) {
35
36
  }
36
37
  }
37
38
  const Content = (props) => {
38
- const { title, text, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, } = props;
39
+ const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, } = props;
39
40
  const qaAttributes = getQaAttrubutes(qa, ['links', 'link', 'buttons', 'button', 'list']);
40
41
  const titleProps = !title || typeof title === 'string'
41
42
  ? { text: title, textSize: getTextSize(size) }
42
43
  : title;
43
44
  const hasTitle = Boolean(title);
45
+ const defaultTitleId = useUniqId();
46
+ const titleId = titleIdFromProps || defaultTitleId;
44
47
  return (React.createElement(Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
45
- title && React.createElement(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 } }),
48
+ title && (React.createElement(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })),
46
49
  text && (React.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
47
- React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true } }))),
50
+ React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId }))),
48
51
  (list === null || list === void 0 ? void 0 : list.length) ? React.createElement(ContentList, { list: list, size: size, qa: qaAttributes.list }) : null,
49
52
  additionalInfo && (React.createElement("div", { className: b('notice') },
50
53
  React.createElement(YFMWrapper, { content: additionalInfo, modifiers: {
@@ -52,7 +55,11 @@ const Content = (props) => {
52
55
  'constructor-notice': true,
53
56
  [`constructor-size-${size}`]: true,
54
57
  } }))),
55
- links && (React.createElement("div", { className: b('links'), "data-qa": qaAttributes.links }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url, qa: qaAttributes.link })))))),
56
- buttons && (React.createElement("div", { className: b('buttons'), "data-qa": qaAttributes.buttons }, buttons.map((item) => (React.createElement(Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size), qa: qaAttributes.button }))))))));
58
+ links && (React.createElement("div", { className: b('links'), "data-qa": qaAttributes.links }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url, qa: qaAttributes.link, extraProps: {
59
+ 'aria-describedby': link.urlTitle ? undefined : titleId,
60
+ } })))))),
61
+ buttons && (React.createElement("div", { className: b('buttons'), "data-qa": qaAttributes.buttons }, buttons.map((item) => (React.createElement(Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size), qa: qaAttributes.button, extraProps: {
62
+ 'aria-describedby': item.urlTitle ? undefined : titleId,
63
+ } }))))))));
57
64
  };
58
65
  export default Content;
@@ -239,16 +239,6 @@ unpredictable css rules order in build */
239
239
  font-weight: var(--g-text-body-font-weight);
240
240
  margin: 20px 0;
241
241
  }
242
- .pc-hubspot-form .hs-richtext a:focus {
243
- box-shadow: 0 0 0 2px var(--g-color-line-focus);
244
- }
245
- .pc-hubspot-form .hs-richtext a:focus:not(:focus-visible) {
246
- box-shadow: none;
247
- }
248
- .pc-hubspot-form .hs-richtext a:focus {
249
- outline: 0;
250
- border-radius: var(--g-focus-border-radius);
251
- }
252
242
  .pc-hubspot-form .hs_error_rollup {
253
243
  padding-left: 10px;
254
244
  font-size: var(--g-text-body-1-font-size);
@@ -390,6 +380,16 @@ unpredictable css rules order in build */
390
380
  .pc-hubspot-form_mobile .hs-button.primary {
391
381
  width: 80%;
392
382
  }
383
+ .pc-hubspot-form a:focus {
384
+ box-shadow: 0 0 0 2px var(--g-color-line-focus);
385
+ }
386
+ .pc-hubspot-form a:focus:not(:focus-visible) {
387
+ box-shadow: none;
388
+ }
389
+ .pc-hubspot-form a:focus {
390
+ outline: 0;
391
+ border-radius: var(--g-focus-border-radius);
392
+ }
393
393
  .pc-hubspot-form_theme_dark {
394
394
  --g-color-line-focus: var(--pc-color-line-focus-dark);
395
395
  }
@@ -0,0 +1,22 @@
1
+ export declare const HubspotFormProps: {
2
+ type: string;
3
+ required: string[];
4
+ properties: {
5
+ region: {
6
+ type: string;
7
+ };
8
+ portalId: {
9
+ type: string;
10
+ };
11
+ formId: {
12
+ type: string;
13
+ };
14
+ formInstanceId: {
15
+ type: string;
16
+ };
17
+ type: {};
18
+ when: {
19
+ type: string;
20
+ };
21
+ };
22
+ };
@@ -0,0 +1,14 @@
1
+ import { BaseProps } from '../../schema/validators/common';
2
+ export const HubspotFormProps = {
3
+ type: 'object',
4
+ required: ['portalId', 'formId'],
5
+ properties: Object.assign(Object.assign({}, BaseProps), { region: {
6
+ type: 'string',
7
+ }, portalId: {
8
+ type: 'string',
9
+ }, formId: {
10
+ type: 'string',
11
+ }, formInstanceId: {
12
+ type: 'string',
13
+ } }),
14
+ };
@@ -10,6 +10,7 @@ export declare const getLayoutItemLinks: (links: LayoutItemProps['content']['lin
10
10
  target?: string | undefined;
11
11
  metrikaGoals?: import("../../models").MetrikaGoal | undefined;
12
12
  pixelEvents?: import("../../models").ButtonPixel | undefined;
13
+ extraProps?: import("react").HTMLProps<HTMLAnchorElement> | undefined;
13
14
  analyticsEvents?: {
14
15
  name: string;
15
16
  type?: string | undefined;
@@ -62,7 +62,6 @@ unpredictable css rules order in build */
62
62
  }
63
63
  .pc-quote__content_quote-type_chevron::before {
64
64
  position: absolute;
65
- top: -1px;
66
65
  left: -10px;
67
66
  content: "«";
68
67
  }
@@ -71,7 +70,6 @@ unpredictable css rules order in build */
71
70
  }
72
71
  .pc-quote__content_quote-type_english-double::before {
73
72
  position: absolute;
74
- top: -1px;
75
73
  left: -8px;
76
74
  content: "“";
77
75
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/page-constructor",
3
- "version": "4.31.1",
3
+ "version": "4.34.0",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -3,8 +3,8 @@ import { ButtonSize } from '@gravity-ui/uikit';
3
3
  import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
4
4
  import { ThemeSupporting } from '../../utils';
5
5
  import { AnalyticsEventsBase } from '../common';
6
- import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps } from './common';
7
- import { BannerCardProps, SubBlock, SubBlockModels } from './sub-blocks';
6
+ import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, YandexFormProps } from './common';
7
+ import { BannerCardProps, HubspotFormProps, SubBlock, SubBlockModels } from './sub-blocks';
8
8
  export declare enum BlockType {
9
9
  PromoFeaturesBlock = "promo-features-block",
10
10
  ExtendedFeaturesBlock = "extended-features-block",
@@ -23,7 +23,8 @@ export declare enum BlockType {
23
23
  ContentLayoutBlock = "content-layout-block",
24
24
  ShareBlock = "share-block",
25
25
  MapBlock = "map-block",
26
- FilterBlock = "filter-block"
26
+ FilterBlock = "filter-block",
27
+ FormBlock = "form-block"
27
28
  }
28
29
  export declare const BlockTypes: BlockType[];
29
30
  export declare const HeaderBlockTypes: BlockType[];
@@ -274,7 +275,9 @@ export interface ContentItemProps {
274
275
  }
275
276
  export interface ContentBlockProps {
276
277
  title?: TitleItemBaseProps | string;
278
+ titleId?: string;
277
279
  text?: string;
280
+ textId?: string;
278
281
  additionalInfo?: string;
279
282
  links?: LinkProps[];
280
283
  buttons?: ButtonProps[];
@@ -295,6 +298,29 @@ export interface ShareBlockProps {
295
298
  items: PCShareSocialNetwork[];
296
299
  title?: string;
297
300
  }
301
+ export declare enum FormBlockDataTypes {
302
+ YANDEX = "yandex",
303
+ HUBSPOT = "hubspot"
304
+ }
305
+ export declare enum FormBlockDirection {
306
+ FormContent = "form-content",
307
+ ContentForm = "content-form",
308
+ Center = "center"
309
+ }
310
+ export interface FormBlockYandexData {
311
+ yandex: YandexFormProps;
312
+ }
313
+ export interface FormBlockHubspotData {
314
+ hubspot: HubspotFormProps;
315
+ }
316
+ export type FormBlockData = FormBlockYandexData | FormBlockHubspotData;
317
+ export interface FormBlockProps {
318
+ formData: FormBlockData;
319
+ title?: string;
320
+ textContent?: Omit<ContentBlockProps, 'centered' | 'colSizes' | 'size'>;
321
+ direction?: FormBlockDirection;
322
+ background?: BackgroundImageProps;
323
+ }
298
324
  export type HeaderBlockModel = {
299
325
  type: BlockType.HeaderBlock;
300
326
  } & HeaderBlockProps;
@@ -349,6 +375,9 @@ export type ContentLayoutBlockModel = {
349
375
  export type ShareBLockModel = {
350
376
  type: BlockType.ShareBlock;
351
377
  } & ShareBlockProps;
352
- type BlockModels = SliderBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | TableBlockModel | TabsBlockModel | HeaderBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel;
378
+ export type FormBlockModel = {
379
+ type: BlockType.FormBlock;
380
+ } & FormBlockProps;
381
+ type BlockModels = SliderBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | TableBlockModel | TabsBlockModel | HeaderBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel | FormBlockModel;
353
382
  export type Block = BlockModels & BlockBaseProps;
354
383
  export {};
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.PCShareSocialNetwork = exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
3
+ exports.FormBlockDirection = exports.FormBlockDataTypes = exports.PCShareSocialNetwork = exports.SliderType = exports.SliderBreakpointNames = exports.HeaderBlockTypes = exports.BlockTypes = exports.BlockType = void 0;
4
4
  var BlockType;
5
5
  (function (BlockType) {
6
6
  BlockType["PromoFeaturesBlock"] = "promo-features-block";
@@ -21,6 +21,7 @@ var BlockType;
21
21
  BlockType["ShareBlock"] = "share-block";
22
22
  BlockType["MapBlock"] = "map-block";
23
23
  BlockType["FilterBlock"] = "filter-block";
24
+ BlockType["FormBlock"] = "form-block";
24
25
  })(BlockType = exports.BlockType || (exports.BlockType = {}));
25
26
  exports.BlockTypes = Object.values(BlockType);
26
27
  exports.HeaderBlockTypes = [BlockType.HeaderBlock, BlockType.HeaderSliderBlock];
@@ -44,3 +45,14 @@ var PCShareSocialNetwork;
44
45
  PCShareSocialNetwork["Facebook"] = "facebook";
45
46
  PCShareSocialNetwork["LinkedIn"] = "linkedin";
46
47
  })(PCShareSocialNetwork = exports.PCShareSocialNetwork || (exports.PCShareSocialNetwork = {}));
48
+ var FormBlockDataTypes;
49
+ (function (FormBlockDataTypes) {
50
+ FormBlockDataTypes["YANDEX"] = "yandex";
51
+ FormBlockDataTypes["HUBSPOT"] = "hubspot";
52
+ })(FormBlockDataTypes = exports.FormBlockDataTypes || (exports.FormBlockDataTypes = {}));
53
+ var FormBlockDirection;
54
+ (function (FormBlockDirection) {
55
+ FormBlockDirection["FormContent"] = "form-content";
56
+ FormBlockDirection["ContentForm"] = "content-form";
57
+ FormBlockDirection["Center"] = "center";
58
+ })(FormBlockDirection = exports.FormBlockDirection || (exports.FormBlockDirection = {}));
@@ -1,7 +1,7 @@
1
- import React, { CSSProperties, ReactNode } from 'react';
1
+ import React, { CSSProperties, HTMLProps, ReactNode } from 'react';
2
2
  import { ButtonView, ButtonProps as UikitButtonProps } from '@gravity-ui/uikit';
3
3
  import { ThemeSupporting } from '../../utils';
4
- import { AnalyticsEventsBase, ClassNameProps, PixelEventType, QAProps } from '../common';
4
+ import { AnalyticsEventsBase, ClassNameProps, PixelEvent, PixelEventType, QAProps } from '../common';
5
5
  export declare enum AuthorType {
6
6
  Column = "column",
7
7
  Line = "line"
@@ -95,7 +95,7 @@ interface LoopProps {
95
95
  start: number;
96
96
  end?: number;
97
97
  }
98
- export interface ImageInfoProps {
98
+ export interface ImageInfoProps extends Pick<HTMLProps<HTMLImageElement>, 'aria-describedby'> {
99
99
  alt?: string;
100
100
  disableCompress?: boolean;
101
101
  }
@@ -138,6 +138,7 @@ export interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {
138
138
  target?: string;
139
139
  metrikaGoals?: MetrikaGoal;
140
140
  pixelEvents?: ButtonPixel;
141
+ extraProps?: HTMLProps<HTMLAnchorElement>;
141
142
  }
142
143
  export interface FileLinkProps extends ClassNameProps, Tabbable {
143
144
  href: string;
@@ -147,11 +148,13 @@ export interface FileLinkProps extends ClassNameProps, Tabbable {
147
148
  theme?: ContentTheme;
148
149
  urlTitle?: string;
149
150
  onClick?: () => void;
151
+ extraProps?: HTMLProps<HTMLAnchorElement>;
150
152
  }
151
153
  export type ButtonTheme = ButtonView | 'github' | 'app-store' | 'google-play' | 'scale' | 'monochrome';
152
154
  export interface ButtonProps extends AnalyticsEventsBase, Pick<UikitButtonProps, 'size' | 'width' | 'extraProps'> {
153
155
  text: string;
154
156
  url: string;
157
+ urlTitle?: string;
155
158
  primary?: boolean;
156
159
  theme?: ButtonTheme;
157
160
  img?: ButtonImageProps | string;
@@ -337,4 +340,20 @@ export interface TitleProps {
337
340
  title?: TitleItemProps | string;
338
341
  subtitle?: string;
339
342
  }
343
+ export interface YandexFormProps extends AnalyticsEventsBase {
344
+ id: number | string;
345
+ containerId?: string;
346
+ theme?: string;
347
+ className?: string;
348
+ headerHeight?: number;
349
+ customFormOrigin?: string;
350
+ customFormSection?: string;
351
+ params?: {
352
+ [key: string]: string;
353
+ };
354
+ onSubmit?: () => void;
355
+ onLoad?: () => void;
356
+ metrikaGoals?: string | string[];
357
+ pixelEvents?: string | string[] | PixelEvent | PixelEvent[];
358
+ }
340
359
  export {};
@@ -1,4 +1,6 @@
1
- import { Block, ConstructorItem } from './';
1
+ import { Block, ConstructorItem, FormBlockData, FormBlockHubspotData, FormBlockYandexData } from './';
2
2
  import { MetrikaGoal, NewMetrikaGoal } from './index';
3
3
  export declare function isBlock(block: ConstructorItem): block is Block;
4
4
  export declare function isNewMetrikaFormat(metrika: MetrikaGoal): metrika is NewMetrikaGoal[];
5
+ export declare function isYandexDataForm(data: FormBlockData): data is FormBlockYandexData;
6
+ export declare function isHubspotDataForm(data: FormBlockData): data is FormBlockHubspotData;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.isNewMetrikaFormat = exports.isBlock = void 0;
3
+ exports.isHubspotDataForm = exports.isYandexDataForm = exports.isNewMetrikaFormat = exports.isBlock = void 0;
4
4
  const _1 = require("./");
5
5
  function isBlock(block) {
6
6
  return block.type in _1.BlockTypes;
@@ -10,3 +10,11 @@ function isNewMetrikaFormat(metrika) {
10
10
  return Boolean(Array.isArray(metrika) && metrika.length && typeof metrika[0] === 'object');
11
11
  }
12
12
  exports.isNewMetrikaFormat = isNewMetrikaFormat;
13
+ function isYandexDataForm(data) {
14
+ return Boolean(data.yandex);
15
+ }
16
+ exports.isYandexDataForm = isYandexDataForm;
17
+ function isHubspotDataForm(data) {
18
+ return Boolean(data.hubspot);
19
+ }
20
+ exports.isHubspotDataForm = isHubspotDataForm;