= (args) => (
+
+
Iframe with margins (default)
+
+ Iframe without margins
+
+
+);
+
export const Image = DefaultTemplate.bind({});
export const ImageSlider = DefaultTemplate.bind({});
export const Video = DefaultTemplate.bind({});
export const Youtube = DefaultTemplate.bind({});
export const DataLens = DefaultTemplate.bind({});
export const DataLensDarkTheme = DefaultTemplate.bind({});
+export const Iframe = IframeTemplate.bind({});
Image.args = data.image.content;
ImageSlider.args = data.imageSlider.content;
@@ -31,3 +41,4 @@ Video.args = data.video.content;
Youtube.args = data.youtube.content;
DataLens.args = data.dataLens.content;
DataLensDarkTheme.args = data.dataLensDarkTheme.content as MediaProps;
+Iframe.args = data.iframe.content as MediaProps;
diff --git a/src/components/Media/__stories__/data.json b/src/components/Media/__stories__/data.json
index ee8e0cc7d..810aa4f81 100644
--- a/src/components/Media/__stories__/data.json
+++ b/src/components/Media/__stories__/data.json
@@ -18,6 +18,14 @@
"dataLens": "m2bzon9y39lck"
}
},
+ "iframe": {
+ "content": {
+ "iframe": {
+ "src": "https://www.google.com/maps/embed/",
+ "name": "iframe"
+ }
+ }
+ },
"youtube": {
"content": {
"youtube": "https://youtu.be/0Qd3T6skprA",
diff --git a/src/models/constructor-items/common.ts b/src/models/constructor-items/common.ts
index 634a08f76..7ad962e6d 100644
--- a/src/models/constructor-items/common.ts
+++ b/src/models/constructor-items/common.ts
@@ -263,11 +263,17 @@ export interface MediaComponentDataLensProps {
dataLens: DataLensProps;
}
+export interface MediaComponentIframeProps {
+ iframe: IframeProps;
+ margins?: boolean;
+}
+
export interface MediaProps
extends Animatable,
Partial,
Partial,
Partial,
+ Partial,
Partial {
color?: string;
}
@@ -338,6 +344,14 @@ export interface DataLensObjectProps {
theme: 'dark' | 'light';
}
+export interface IframeProps {
+ src: string;
+ width?: number;
+ height?: number;
+ title?: string;
+ name?: string;
+}
+
export type DataLensProps = string | DataLensObjectProps;
export interface AuthorItem {
diff --git a/src/schema/validators/common.ts b/src/schema/validators/common.ts
index fccb99b30..2d249fe87 100644
--- a/src/schema/validators/common.ts
+++ b/src/schema/validators/common.ts
@@ -575,6 +575,24 @@ export const ButtonBlock = {
},
};
+const IframeProps = {
+ src: {
+ type: 'string',
+ },
+ name: {
+ type: 'string',
+ },
+ title: {
+ type: 'string',
+ },
+ height: {
+ type: 'number',
+ },
+ width: {
+ type: 'number',
+ },
+};
+
export const MediaProps = {
color: {
type: 'string',
@@ -608,6 +626,12 @@ export const MediaProps = {
ratio: {
type: 'number',
},
+ iframe: {
+ ...IframeProps,
+ },
+ margins: {
+ type: 'number',
+ },
};
export const YMapMarkerLabel = {