@doyourjob/gravity-ui-page-constructor 5.31.286 → 5.31.287

package/build/esm/blocks/HeaderSlider/schema.d.ts

@@ -738,7 +738,33 @@ export declare const HeaderSliderBlock: {
                                                 type: string;
                                             };
                                             height: {
-                                                type: string;
+                                                oneOf: ({
+                                                    type: string;
+                                                    optionName: string;
+                                                    additionalProperties?: undefined;
+                                                    properties?: undefined;
+                                                } | {
+                                                    type: string;
+                                                    additionalProperties: boolean;
+                                                    optionName: string;
+                                                    properties: {
+                                                        all: {
+                                                            type: string;
+                                                        };
+                                                        sm: {
+                                                            type: string;
+                                                        };
+                                                        md: {
+                                                            type: string;
+                                                        };
+                                                        lg: {
+                                                            type: string;
+                                                        };
+                                                        xl: {
+                                                            type: string;
+                                                        };
+                                                    };
+                                                })[];
                                             };
                                             width: {
                                                 type: string;

package/build/esm/blocks/Media/schema.d.ts

@@ -299,7 +299,33 @@ export declare const Media: {
                     type: string;
                 };
                 height: {
-                    type: string;
+                    oneOf: ({
+                        type: string;
+                        optionName: string;
+                        additionalProperties?: undefined;
+                        properties?: undefined;
+                    } | {
+                        type: string;
+                        additionalProperties: boolean;
+                        optionName: string;
+                        properties: {
+                            all: {
+                                type: string;
+                            };
+                            sm: {
+                                type: string;
+                            };
+                            md: {
+                                type: string;
+                            };
+                            lg: {
+                                type: string;
+                            };
+                            xl: {
+                                type: string;
+                            };
+                        };
+                    })[];
                 };
                 width: {
                     type: string;
@@ -1178,7 +1204,33 @@ export declare const MediaBlock: {
                                     type: string;
                                 };
                                 height: {
-                                    type: string;
+                                    oneOf: ({
+                                        type: string;
+                                        optionName: string;
+                                        additionalProperties?: undefined;
+                                        properties?: undefined;
+                                    } | {
+                                        type: string;
+                                        additionalProperties: boolean;
+                                        optionName: string;
+                                        properties: {
+                                            all: {
+                                                type: string;
+                                            };
+                                            sm: {
+                                                type: string;
+                                            };
+                                            md: {
+                                                type: string;
+                                            };
+                                            lg: {
+                                                type: string;
+                                            };
+                                            xl: {
+                                                type: string;
+                                            };
+                                        };
+                                    })[];
                                 };
                                 width: {
                                     type: string;

package/build/esm/blocks/PromoFeaturesBlock/schema.d.ts

@@ -315,7 +315,33 @@ export declare const PromoFeaturesItem: {
                             type: string;
                         };
                         height: {
-                            type: string;
+                            oneOf: ({
+                                type: string;
+                                optionName: string;
+                                additionalProperties?: undefined;
+                                properties?: undefined;
+                            } | {
+                                type: string;
+                                additionalProperties: boolean;
+                                optionName: string;
+                                properties: {
+                                    all: {
+                                        type: string;
+                                    };
+                                    sm: {
+                                        type: string;
+                                    };
+                                    md: {
+                                        type: string;
+                                    };
+                                    lg: {
+                                        type: string;
+                                    };
+                                    xl: {
+                                        type: string;
+                                    };
+                                };
+                            })[];
                         };
                         width: {
                             type: string;

package/build/esm/blocks/Tabs/schema.d.ts

@@ -314,7 +314,33 @@ export declare const tabsItem: {
                                 type: string;
                             };
                             height: {
-                                type: string;
+                                oneOf: ({
+                                    type: string;
+                                    optionName: string;
+                                    additionalProperties?: undefined;
+                                    properties?: undefined;
+                                } | {
+                                    type: string;
+                                    additionalProperties: boolean;
+                                    optionName: string;
+                                    properties: {
+                                        all: {
+                                            type: string;
+                                        };
+                                        sm: {
+                                            type: string;
+                                        };
+                                        md: {
+                                            type: string;
+                                        };
+                                        lg: {
+                                            type: string;
+                                        };
+                                        xl: {
+                                            type: string;
+                                        };
+                                    };
+                                })[];
                             };
                             width: {
                                 type: string;

package/build/esm/components/Media/Iframe/Iframe.js

@@ -1,13 +1,27 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { block } from '../../../utils';
 import { i18n } from './i18n';
+import { getIframeHeight } from './utils';
 import './Iframe.css';
 const b = block('media-component-iframe');
+const getViewportWidth = () => (typeof window === 'undefined' ? 0 : window.innerWidth);
 const Iframe = (props) => {
     const { iframe, margins = true } = props;
-    const { height = 400, src, width, name, title } = iframe;
-    return iframe ? (React.createElement("div", { className: b({ margins }), style: { height } },
-        React.createElement("iframe", { className: b('item'), loading: "lazy", title: title || i18n('iframe-title'), frameBorder: 0, src: src, width: width, height: height, name: name, 
+    const { height, src, width, name, title } = iframe;
+    const shouldTrackViewportWidth = typeof height === 'object';
+    const [viewportWidth, setViewportWidth] = useState(() => shouldTrackViewportWidth ? getViewportWidth() : 0);
+    const resolvedHeight = getIframeHeight(height, viewportWidth);
+    useEffect(() => {
+        if (!shouldTrackViewportWidth) {
+            return undefined;
+        }
+        const handleResize = () => setViewportWidth(getViewportWidth());
+        handleResize();
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, [shouldTrackViewportWidth]);
+    return iframe ? (React.createElement("div", { className: b({ margins }), style: { height: resolvedHeight } },
+        React.createElement("iframe", { className: b('item'), loading: "lazy", title: title || i18n('iframe-title'), frameBorder: 0, src: src, width: width, height: resolvedHeight, name: name, 
             /*
               1. allow: дает права на камеру, микрофон, полноэкранный режим
                  и демонстрацию экрана (необходимы для Zoom).

package/build/esm/components/Media/Iframe/utils.d.ts

@@ -0,0 +1,2 @@
+import { ResponsiveIframeHeight } from '../../../models';
+export declare const getIframeHeight: (height: number | ResponsiveIframeHeight | undefined, viewportWidth: number) => number;

package/build/esm/components/Media/Iframe/utils.js

@@ -0,0 +1,25 @@
+import { BREAKPOINTS } from '../../../constants';
+const responsiveHeightBreakpoints = [
+    ['all', BREAKPOINTS.xs],
+    ['sm', BREAKPOINTS.sm],
+    ['md', BREAKPOINTS.md],
+    ['lg', BREAKPOINTS.lg],
+    ['xl', BREAKPOINTS.xl],
+];
+export const getIframeHeight = (height, viewportWidth) => {
+    var _a;
+    if (height === undefined) {
+        return 400;
+    }
+    if (typeof height === 'number') {
+        return height;
+    }
+    let result = (_a = height.all) !== null && _a !== void 0 ? _a : 400;
+    responsiveHeightBreakpoints.forEach(([breakpoint, minWidth]) => {
+        const breakpointHeight = height[breakpoint];
+        if (viewportWidth >= minWidth && breakpointHeight !== undefined) {
+            result = breakpointHeight;
+        }
+    });
+    return result;
+};

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

@@ -258,10 +258,11 @@ export interface DataLensObjectProps {
     id: string;
     theme: 'dark' | 'light';
 }
+export type ResponsiveIframeHeight = Partial<Record<'all' | 'sm' | 'md' | 'lg' | 'xl', number>>;
 export interface IframeProps {
     src: string;
     width?: number;
-    height?: number;
+    height?: number | ResponsiveIframeHeight;
     title?: string;
     name?: string;
 }

package/build/esm/schema/constants.d.ts

@@ -4207,7 +4207,33 @@ export declare const cardSchemas: {
                         type: string;
                     };
                     height: {
-                        type: string;
+                        oneOf: ({
+                            type: string;
+                            optionName: string;
+                            additionalProperties?: undefined;
+                            properties?: undefined;
+                        } | {
+                            type: string;
+                            additionalProperties: boolean;
+                            optionName: string;
+                            properties: {
+                                all: {
+                                    type: string;
+                                };
+                                sm: {
+                                    type: string;
+                                };
+                                md: {
+                                    type: string;
+                                };
+                                lg: {
+                                    type: string;
+                                };
+                                xl: {
+                                    type: string;
+                                };
+                            };
+                        })[];
                     };
                     width: {
                         type: string;

package/build/esm/schema/validators/common.d.ts

@@ -1502,7 +1502,33 @@ export declare const MediaProps: {
                 type: string;
             };
             height: {
-                type: string;
+                oneOf: ({
+                    type: string;
+                    optionName: string;
+                    additionalProperties?: undefined;
+                    properties?: undefined;
+                } | {
+                    type: string;
+                    additionalProperties: boolean;
+                    optionName: string;
+                    properties: {
+                        all: {
+                            type: string;
+                        };
+                        sm: {
+                            type: string;
+                        };
+                        md: {
+                            type: string;
+                        };
+                        lg: {
+                            type: string;
+                        };
+                        xl: {
+                            type: string;
+                        };
+                    };
+                })[];
             };
             width: {
                 type: string;

package/build/esm/schema/validators/common.js

@@ -608,7 +608,34 @@ const IframeProps = {
             type: 'string',
         },
         height: {
-            type: 'number',
+            oneOf: [
+                {
+                    type: 'number',
+                    optionName: 'constant',
+                },
+                {
+                    type: 'object',
+                    additionalProperties: false,
+                    optionName: 'responsive',
+                    properties: {
+                        all: {
+                            type: 'number',
+                        },
+                        sm: {
+                            type: 'number',
+                        },
+                        md: {
+                            type: 'number',
+                        },
+                        lg: {
+                            type: 'number',
+                        },
+                        xl: {
+                            type: 'number',
+                        },
+                    },
+                },
+            ],
         },
         width: {
             type: 'number',

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

@@ -347,7 +347,33 @@ export declare const LayoutItem: {
                         type: string;
                     };
                     height: {
-                        type: string;
+                        oneOf: ({
+                            type: string;
+                            optionName: string;
+                            additionalProperties?: undefined;
+                            properties?: undefined;
+                        } | {
+                            type: string;
+                            additionalProperties: boolean;
+                            optionName: string;
+                            properties: {
+                                all: {
+                                    type: string;
+                                };
+                                sm: {
+                                    type: string;
+                                };
+                                md: {
+                                    type: string;
+                                };
+                                lg: {
+                                    type: string;
+                                };
+                                xl: {
+                                    type: string;
+                                };
+                            };
+                        })[];
                     };
                     width: {
                         type: string;

package/build/esm/sub-blocks/MediaCard/schema.d.ts

@@ -341,7 +341,33 @@ export declare const MediaCardBlock: {
                         type: string;
                     };
                     height: {
-                        type: string;
+                        oneOf: ({
+                            type: string;
+                            optionName: string;
+                            additionalProperties?: undefined;
+                            properties?: undefined;
+                        } | {
+                            type: string;
+                            additionalProperties: boolean;
+                            optionName: string;
+                            properties: {
+                                all: {
+                                    type: string;
+                                };
+                                sm: {
+                                    type: string;
+                                };
+                                md: {
+                                    type: string;
+                                };
+                                lg: {
+                                    type: string;
+                                };
+                                xl: {
+                                    type: string;
+                                };
+                            };
+                        })[];
                     };
                     width: {
                         type: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@doyourjob/gravity-ui-page-constructor",
-  "version": "5.31.286",
+  "version": "5.31.287",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {