@gravity-ui/page-constructor 1.0.0

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

@@ -0,0 +1,8 @@
+import { PCShareSocialNetwork } from '../../models';
+import './Share.css';
+export interface ShareProps {
+    items: PCShareSocialNetwork[];
+    title?: string;
+}
+declare const Share: ({ items, title }: ShareProps) => JSX.Element;
+export default Share;

package/build/esm/components/Share/Share.js

@@ -0,0 +1,22 @@
+import React, { useContext } from 'react';
+import { ShareList, ShareSocialNetwork } from '@gravity-ui/uikit';
+import { block, getAbsolutePath } from '../../utils';
+import { PCShareSocialNetwork } from '../../models';
+import { LocationContext } from '../../context/locationContext';
+import i18n from './i18n';
+import './Share.css';
+const b = block('share-block');
+// TODO https://st.yandex-team.ru/CLOUDFRONT-11753
+const pcShareSocialNetwork = {
+    [PCShareSocialNetwork.Vk]: ShareSocialNetwork.VK,
+    [PCShareSocialNetwork.Telegram]: ShareSocialNetwork.Telegram,
+    [PCShareSocialNetwork.Twitter]: ShareSocialNetwork.Twitter,
+    [PCShareSocialNetwork.Facebook]: ShareSocialNetwork.Facebook,
+};
+const Share = ({ items, title }) => {
+    const { pathname, hostname } = useContext(LocationContext);
+    return (React.createElement("div", { className: b() },
+        React.createElement("h5", { className: b('title') }, title || i18n('constructor-share')),
+        React.createElement("div", { className: b('items') }, items.map((type) => (React.createElement(ShareList.Item, { key: type, url: getAbsolutePath(hostname, pathname), className: b('item', { type: type.toLowerCase() }), type: pcShareSocialNetwork[type] }))))));
+};
+export default Share;

package/build/esm/components/Share/i18n/en.json

@@ -0,0 +1,3 @@
+{
+  "constructor-share": "Share"
+}

package/build/esm/components/Share/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/esm/components/Share/i18n/index.js

@@ -0,0 +1,5 @@
+import { registerKeyset } from '../../../utils/registerKeyset';
+import en from './en.json';
+import ru from './ru.json';
+const COMPONENT = 'Share';
+export default registerKeyset({ en, ru }, COMPONENT);

package/build/esm/components/Share/i18n/ru.json

@@ -0,0 +1,3 @@
+{
+  "constructor-share": "Поделиться"
+}

package/build/esm/components/Table/Table.css

@@ -0,0 +1,82 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-table {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+  margin-top: 32px;
+}
+.pc-table__table {
+  width: 100%;
+  overflow-x: auto;
+}
+.pc-table__row {
+  display: flex;
+}
+.pc-table__row:first-child {
+  font-weight: 500;
+}
+.pc-table__row:first-child .pc-table__cell {
+  border-bottom-color: var(--yc-color-line-generic-active);
+  align-items: flex-end;
+  padding-top: 0;
+}
+.pc-table__cell {
+  padding: 12px 0;
+  display: flex;
+  flex: 1;
+  align-items: center;
+  border-bottom: 1px solid var(--yc-color-line-generic);
+}
+.pc-table__cell:first-child {
+  flex: 2;
+}
+.pc-table__cell_justify_center {
+  justify-content: center;
+  text-align: center;
+}
+.pc-table__cell_justify_right {
+  justify-content: flex-end;
+  text-align: right;
+}
+.pc-table__marker {
+  display: inline-block;
+}
+.pc-table__marker_type_disk {
+  width: 16px;
+  height: 16px;
+  border-radius: 100%;
+  flex-shrink: 0;
+  box-sizing: border-box;
+}
+.pc-table__marker_type_disk.pc-table__marker_index_0 {
+  background-color: var(--yc-color-infographics-neutral-light);
+}
+.pc-table__marker_type_disk.pc-table__marker_index_1 {
+  background-color: var(--yc-my-color-brand-normal);
+}
+.pc-table__marker_type_disk.pc-table__marker_index_2 {
+  border: 1px solid var(--yc-color-text-hint);
+}
+.pc-table__legend {
+  display: flex;
+  margin-top: 20px;
+  color: var(--yc-color-text-secondary);
+}
+.pc-table__legend-item {
+  display: flex;
+  align-items: center;
+}
+.pc-table__legend-item + .pc-table__legend-item {
+  margin-left: 32px;
+}
+.pc-table__legent-item-text {
+  margin-left: 6px;
+}
+@media (max-width: 577px) {
+  .pc-table__cell {
+    min-width: 120px;
+  }
+  .pc-table__cell:first-child {
+    min-width: 230px;
+  }
+}

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TableProps, ClassNameProps } from '../../models';
+import './Table.css';
+export default class Table extends React.Component<TableProps & ClassNameProps> {
+    render(): JSX.Element | null;
+    private renderTable;
+    private renderMarker;
+    private renderLegend;
+    private getDefaultJustify;
+}

package/build/esm/components/Table/Table.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { block } from '../../utils';
+import { YFMWrapper, HTML } from '../';
+import './Table.css';
+const b = block('table');
+export default class Table extends React.Component {
+    render() {
+        const { content, legend, marker = 'disk', className } = this.props;
+        if (!content || !content.length || !content[0].length) {
+            return null;
+        }
+        return (React.createElement("div", { className: b(null, className) },
+            this.renderTable(content, marker, legend),
+            legend && this.renderLegend(legend, marker)));
+    }
+    renderTable(content, marker, legend) {
+        const justify = this.getDefaultJustify(content, this.props.justify);
+        return (React.createElement("div", { className: b('table') }, content.map((row, i) => (React.createElement("div", { key: i, className: b('row') }, row.map((cell, j) => (React.createElement("div", { key: j, className: b('cell', { justify: justify[j] }) }, legend && i && j ? (this.renderMarker(marker, cell)) : (React.createElement(HTML, null, cell))))))))));
+    }
+    renderMarker(type, cell) {
+        return React.createElement("div", { className: b('marker', { type, index: String(cell) }) });
+    }
+    renderLegend(legend, marker) {
+        return (React.createElement("div", { className: b('legend') }, legend.map((item, index) => (React.createElement("div", { key: item, className: b('legend-item') },
+            this.renderMarker(marker, String(index)),
+            React.createElement(YFMWrapper, { className: b('legent-item-text'), content: item, modifiers: { constructor: true } }))))));
+    }
+    getDefaultJustify(content, justify) {
+        return justify || new Array(content[0].length).fill('center');
+    }
+}

package/build/esm/components/Title/Title.css

@@ -0,0 +1,96 @@
+.pc-title-block_size_l, .pc-title-block_size_m, .pc-title-block_size_s {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-title-block_justify_center {
+  text-align: center;
+}
+.pc-title-block_justify_end {
+  text-align: right;
+}
+.pc-title-block_size_s {
+  font-size: var(--yc-text-header-1-font-size);
+  line-height: var(--yc-text-header-1-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+  margin-top: 32px;
+}
+.pc-title-block_size_m {
+  font-size: var(--yc-text-display-2-font-size);
+  line-height: var(--yc-text-display-2-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+  margin-top: 48px;
+}
+@media (max-width: 576px) {
+  .pc-title-block_size_m {
+    font-size: var(--yc-text-display-1-font-size);
+    line-height: var(--yc-text-display-1-line-height);
+  }
+}
+.pc-title-block_size_l {
+  font-size: var(--yc-text-display-4-font-size);
+  line-height: var(--yc-text-display-4-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+  margin-top: 96px;
+}
+@media (max-width: 577px) {
+  .pc-title-block_size_l {
+    font-size: var(--yc-text-display-2-font-size);
+    line-height: var(--yc-text-display-2-line-height);
+  }
+}
+.pc-title-block__arrow {
+  margin: 8px 0 0 4px;
+}
+.pc-title-block__arrow_size_s {
+  margin: 4px 0 0 4px;
+}
+.pc-title-block__link {
+  color: inherit;
+  text-decoration: none;
+  padding-right: 8px;
+}
+.pc-title-block__link:hover, .pc-title-block__link:active {
+  --pc-text-header-color: inherit;
+  color: inherit;
+}
+.pc-title-block__link:hover {
+  cursor: pointer;
+}
+.pc-title-block__link:hover .pc-title-block__arrow {
+  margin-left: 12px;
+}
+.pc-title-block__link:hover .pc-title-block__arrow_size_s {
+  margin-left: 8px;
+}
+.pc-title-block__text {
+  white-space: normal;
+}
+.pc-title-block__text a {
+  outline: none;
+  color: var(--yc-color-text-link);
+  text-decoration: none;
+  cursor: pointer;
+}
+.utilityfocus .pc-title-block__text a:focus {
+  outline: 2px solid #ffdb4d;
+}
+.pc-title-block__text a:hover, .pc-title-block__text a:active {
+  --pc-text-header-color: var(--yc-color-text-link-hover);
+  color: var(--yc-color-text-link-hover);
+}
+.pc-title-block__wrapper {
+  white-space: nowrap;
+}
+.pc-title-block_reset-margin {
+  margin-top: 0;
+}
+@media (max-width: 577px) {
+  .pc-title-block_size_l {
+    margin-top: 48px;
+  }
+}

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

@@ -0,0 +1,11 @@
+import { TextSize, TitleProps } from '../../models';
+import './Title.css';
+export declare function getArrowSize(size: TextSize, isMobile: boolean): 16 | 20 | 24;
+export interface TitleFullProps extends TitleProps {
+    className?: string;
+    onClick?: () => void;
+    dataQa?: string;
+    resetMargin?: boolean;
+}
+declare const Title: (props: TitleFullProps) => JSX.Element;
+export default Title;

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

@@ -0,0 +1,51 @@
+import React, { Fragment, useContext } from 'react';
+import { block, getHeaderTag, getLinkProps } from '../../utils';
+import Anchor from '../Anchor/Anchor';
+import { ToggleArrow, HTML } from '../';
+import { LocationContext } from '../../context/locationContext';
+import { MobileContext } from '../../context/mobileContext';
+import './Title.css';
+const b = block('title-block');
+export function getArrowSize(size, isMobile) {
+    switch (size) {
+        case 's':
+            return 16;
+        case 'm':
+            return isMobile ? 20 : 24;
+        case 'l':
+            return isMobile ? 20 : 24;
+        default:
+            return 20;
+    }
+}
+const Title = (props) => {
+    const isMobile = useContext(MobileContext);
+    const { textSize = 'm', text, anchor, justify, url, onClick, custom, className, dataQa, resetMargin = true, } = props;
+    const { hostname } = useContext(LocationContext);
+    const textMarkup = (React.createElement(React.Fragment, null,
+        React.createElement(HTML, { className: b('text') }, text),
+        custom && (React.createElement(React.Fragment, null,
+            "\u00A0",
+            React.createElement("span", { className: b('custom') }, custom)))));
+    let content;
+    const insideClickableContent = (React.createElement("span", { className: b('wrapper') },
+        textMarkup,
+        "\u00A0",
+        React.createElement(ToggleArrow, { className: b('arrow', { size: textSize }), size: getArrowSize(textSize, isMobile), type: 'horizontal', iconType: "navigation", open: false })));
+    if (!url && !onClick) {
+        content = textMarkup;
+    }
+    else if (url) {
+        content = (React.createElement("a", Object.assign({ className: b('link'), href: url }, getLinkProps(url, hostname), { onClick: onClick }), insideClickableContent));
+    }
+    else if (onClick) {
+        content = (React.createElement("span", { className: b('link'), onClick: onClick }, insideClickableContent));
+    }
+    return (React.createElement(Fragment, null,
+        anchor && React.createElement(Anchor, { id: anchor, className: b('anchor') }),
+        React.createElement(getHeaderTag(textSize), {
+            className: b({ size: textSize, justify, 'reset-margin': resetMargin }, className),
+            'data-qa': `${dataQa}-header`,
+        }, content)));
+};
+export default Title;

package/build/esm/components/ToggleArrow/ToggleArrow.css

@@ -0,0 +1,23 @@
+.pc-ToggleArrow {
+  transition: transform 0.15s;
+  stroke-width: 2px;
+}
+.pc-ToggleArrow_type_horizontal {
+  transition: margin-left 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
+  transform: rotate(-90deg);
+}
+.pc-ToggleArrow_type_vertical {
+  transform: rotate(0deg);
+}
+.pc-ToggleArrow_open.pc-ToggleArrow_type_horizontal {
+  transform: rotate(0deg);
+}
+.pc-ToggleArrow_open.pc-ToggleArrow_type_vertical {
+  transform: rotate(180deg);
+}
+.pc-ToggleArrow_thin {
+  stroke-width: 1px;
+}
+.pc-ToggleArrow_slow {
+  transition-duration: 0.3s;
+}

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

@@ -0,0 +1,12 @@
+import './ToggleArrow.css';
+export interface ToggleArrowProps {
+    type?: 'horizontal' | 'vertical';
+    iconType?: 'navigation' | 'default';
+    open?: boolean;
+    size?: number;
+    thin?: boolean;
+    slow?: boolean;
+    className?: string;
+}
+declare const ToggleArrow: ({ type, iconType, open, size, thin, slow, className, }: ToggleArrowProps) => JSX.Element;
+export default ToggleArrow;

package/build/esm/components/ToggleArrow/ToggleArrow.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Icon } from '@gravity-ui/uikit';
+import { block } from '../../utils';
+import { Chevron, NavigationChevron } from '../../icons';
+import './ToggleArrow.css';
+const b = block('ToggleArrow');
+const ToggleArrow = ({ type = 'horizontal', iconType = 'default', open = false, size = 16, thin = false, slow = false, className, }) => (React.createElement(Icon, { className: b({ type, open, thin, slow }, className), data: iconType === 'navigation' ? NavigationChevron : Chevron, size: size }));
+export default ToggleArrow;

package/build/esm/components/UnpublishedLabel/UnpublishedLabel.css

@@ -0,0 +1,19 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-unpublished-label {
+  background-color: var(--yc-color-base-danger-heavy);
+}
+.pc-unpublished-label_type_line {
+  font-size: var(--yc-text-body-3-font-size);
+  line-height: var(--yc-text-body-3-line-height);
+  padding: 15px;
+}
+.pc-unpublished-label_type_label {
+  font-size: var(--yc-text-body-1-font-size);
+  line-height: var(--yc-text-body-1-line-height);
+  display: inline-block;
+  padding: 0 8px;
+  border-radius: 2px;
+  height: 20px;
+  line-height: 20px;
+}

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

@@ -0,0 +1,9 @@
+import { WithChildren } from '../../models';
+import './UnpublishedLabel.css';
+export declare type LabeLType = 'label' | 'line';
+export interface UnpublishedLabelProps {
+    type?: LabeLType;
+    className?: string;
+}
+declare const UnpublishedLabel: ({ className, children, type, }: WithChildren<UnpublishedLabelProps>) => JSX.Element;
+export default UnpublishedLabel;

package/build/esm/components/UnpublishedLabel/UnpublishedLabel.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { block } from '../../utils';
+import i18n from './i18n';
+import './UnpublishedLabel.css';
+const b = block('unpublished-label');
+const UnpublishedLabel = ({ className, children, type = 'line', }) => (React.createElement("div", { className: b({ type }, className) }, children || i18n('label_non_published')));
+export default UnpublishedLabel;

package/build/esm/components/UnpublishedLabel/i18n/en.json

@@ -0,0 +1,3 @@
+{
+  "label_non_published": "Unpublished"
+}

package/build/esm/components/UnpublishedLabel/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/esm/components/UnpublishedLabel/i18n/index.js

@@ -0,0 +1,5 @@
+import { registerKeyset } from '../../../utils/registerKeyset';
+import en from './en.json';
+import ru from './ru.json';
+const COMPONENT = 'UnpublishedLabel';
+export default registerKeyset({ en, ru }, COMPONENT);

package/build/esm/components/UnpublishedLabel/i18n/ru.json

@@ -0,0 +1,3 @@
+{
+  "label_non_published": "Не опубликовано"
+}

package/build/esm/components/VideoBlock/VideoBlock.css

@@ -0,0 +1,44 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-VideoBlock {
+  position: relative;
+}
+.pc-VideoBlock__preview {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.pc-VideoBlock__image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+.pc-VideoBlock__button {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  border: none;
+  outline: none;
+  color: inherit;
+  background: none;
+  cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  width: 64px;
+  height: 64px;
+  color: var(--yc-color-base-background);
+  background-color: var(--yc-color-base-special);
+  border-radius: 50%;
+}
+.pc-VideoBlock__icon {
+  margin-left: 6px;
+}

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

@@ -0,0 +1,17 @@
+import React from 'react';
+import './VideoBlock.css';
+export declare const AUTOPLAY_ATTRIBUTES: {
+    autoplay: number;
+    mute: number;
+};
+export interface VideoBlockProps {
+    id?: string;
+    stream?: string;
+    record?: string;
+    attributes?: Record<string, string>;
+    className?: string;
+    previewImg?: string;
+    playButton?: React.ReactNode;
+}
+declare const VideoBlock: (props: VideoBlockProps) => JSX.Element | null;
+export default VideoBlock;

package/build/esm/components/VideoBlock/VideoBlock.js

@@ -0,0 +1,94 @@
+import React, { useRef, useState, useCallback, useEffect } from 'react';
+import _ from 'lodash';
+import { Icon } from '@gravity-ui/uikit';
+import { block, getPageSearchParams } from '../../utils';
+import Image from '../Image/Image';
+import { PlayVideo } from '../../icons';
+import './VideoBlock.css';
+const RECORD_URL = 'https://www.youtube.com/embed/';
+const STREAM_URL = 'https://www.youtube.com/embed/live_stream?channel=';
+const RECORD_RE = /[0-9A-Za-z_-]{11}/;
+const STREAM_RE = /[0-9A-Za-z_-]{23,25}/;
+const AUTOPLAY_DELAY = 300;
+export const AUTOPLAY_ATTRIBUTES = {
+    autoplay: 1,
+    mute: 1,
+};
+const b = block('VideoBlock');
+const iframeId = 'video-block';
+function getVideoSrc(stream, record) {
+    if (!stream && !record) {
+        return null;
+    }
+    const [videoLink, url, re] = stream
+        ? [stream, STREAM_URL, STREAM_RE]
+        : [record, RECORD_URL, RECORD_RE];
+    const match = videoLink === null || videoLink === void 0 ? void 0 : videoLink.match(re);
+    let src;
+    if (match && match.length) {
+        src = url + match[0];
+    }
+    return src;
+}
+function getHeight(width) {
+    return (width / 16) * 9;
+}
+const VideoBlock = (props) => {
+    const { stream, record, attributes, className, id, previewImg, playButton } = props;
+    const src = getVideoSrc(stream, record);
+    const ref = useRef(null);
+    const iframeRef = useRef();
+    const [hidePreview, setHidePreview] = useState(false);
+    const norender = (!stream && !record) || !src;
+    const [height, setHeight] = useState();
+    const fullId = `${iframeId}-${id || src}`;
+    const onPreviewClick = useCallback(() => {
+        if (iframeRef.current) {
+            iframeRef.current.src = `${src}?${getPageSearchParams(Object.assign(Object.assign({}, AUTOPLAY_ATTRIBUTES), (attributes || {})))}`;
+        }
+        setTimeout(() => setHidePreview(true), AUTOPLAY_DELAY);
+    }, [src, attributes]);
+    useEffect(() => {
+        const updateSize = _.debounce(() => {
+            setHeight(ref.current ? Math.round(getHeight(ref.current.offsetWidth)) : undefined);
+        }, 100);
+        updateSize();
+        window.addEventListener('resize', updateSize);
+        return () => {
+            window.removeEventListener('resize', updateSize);
+        };
+    }, []);
+    useEffect(() => {
+        if (norender) {
+            return;
+        }
+        const prevPageVideo = document.getElementById(fullId);
+        const fullSrc = `${src}?${getPageSearchParams(attributes || {})}`;
+        if (prevPageVideo) {
+            prevPageVideo.src = fullSrc;
+        }
+        else if (ref.current) {
+            const iframe = document.createElement('iframe');
+            iframe.id = fullId;
+            iframe.src = fullSrc;
+            iframe.width = '100%';
+            iframe.height = '100%';
+            iframe.frameBorder = '0';
+            iframe.setAttribute('allowfullscreen', 'true');
+            iframe.setAttribute('allow', 'autoplay');
+            ref.current.appendChild(iframe);
+            iframeRef.current = iframe;
+        }
+    }, [stream, record, norender, src, fullId, attributes, iframeRef]);
+    useEffect(() => {
+        setHidePreview(false);
+    }, [src, setHidePreview]);
+    if (norender) {
+        return null;
+    }
+    return (React.createElement("div", { className: b(null, className), ref: ref, style: { height } }, previewImg && !hidePreview && (React.createElement("div", { className: b('preview'), onClick: onPreviewClick },
+        React.createElement(Image, { src: previewImg, className: b('image') }),
+        playButton || (React.createElement("button", { className: b('button') },
+            React.createElement(Icon, { className: b('icon'), data: PlayVideo, size: 24 })))))));
+};
+export default VideoBlock;

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

@@ -0,0 +1,8 @@
+import { Modifiers, ClassNameProps } from '../../models';
+export interface YFMWrapperProps {
+    className?: string;
+    content: string;
+    modifiers?: Modifiers;
+}
+declare const YFMWrapper: ({ content, modifiers, className }: YFMWrapperProps & ClassNameProps) => JSX.Element;
+export default YFMWrapper;

package/build/esm/components/YFMWrapper/YFMWrapper.js

@@ -0,0 +1,9 @@
+import React from 'react';
+/* we won't use 'pc' class prefix here to let you opportunity to define yfm styles
+in your project via global 'yfm' class */
+import block from 'bem-cn-lite';
+import toSnakeCase from 'snakecase-keys';
+import { HTML } from '../../components';
+const yfm = block('yfm');
+const YFMWrapper = ({ content, modifiers, className }) => (React.createElement(HTML, { className: yfm(modifiers ? toSnakeCase(modifiers) : {}, className) }, content));
+export default YFMWrapper;

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

@@ -0,0 +1,19 @@
+import { PixelEvent } from '../../models';
+export declare const YANDEX_FORM_ORIGIN = "https://forms.yandex.ru";
+export interface YandexFormProps {
+    id: number | string;
+    containerId?: string;
+    theme?: string;
+    className?: string;
+    headerHeight?: number;
+    customFormOrigin?: string;
+    params?: {
+        [key: string]: string;
+    };
+    onSubmit?: () => void;
+    onLoad?: () => void;
+    metrikaGoals?: string | string[];
+    pixelEvents?: string | string[] | PixelEvent | PixelEvent[];
+}
+declare const YandexForm: (props: YandexFormProps) => JSX.Element;
+export default YandexForm;