@gravity-ui/page-constructor 4.25.0-alpha.0 → 4.25.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.
@@ -16,7 +16,7 @@ const sub_blocks_1 = require("../../sub-blocks");
16
16
  const utils_2 = require("../../utils");
17
17
  const b = (0, utils_2.block)('tabs-block');
18
18
  const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', contentSize = 's', }) => {
19
- var _a, _b;
19
+ var _a;
20
20
  const [activeTab, setActiveTab] = (0, react_1.useState)(items[0].tabName);
21
21
  const [play, setPlay] = (0, react_1.useState)(false);
22
22
  const theme = (0, theme_1.useTheme)();
@@ -45,7 +45,7 @@ const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered
45
45
  all: grid_1.GridColumnOrderClasses.Last,
46
46
  md: grid_1.GridColumnOrderClasses.First,
47
47
  }, className: b('col', { centered: centered }) },
48
- react_1.default.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (react_1.default.createElement(Media_1.default, Object.assign({}, (0, utils_2.getThemedValue)(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: ((_b = activeTabData.media) === null || _b === void 0 ? void 0 : _b.video) && mediaHeight, imageClassName: b('image') })))),
48
+ react_1.default.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (react_1.default.createElement(Media_1.default, Object.assign({}, (0, utils_2.getThemedValue)(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight })))),
49
49
  imageProps && (react_1.default.createElement(react_1.Fragment, null,
50
50
  react_1.default.createElement(FullscreenImage_1.default, Object.assign({}, imageProps, { imageClassName: b('image') })))),
51
51
  (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && react_1.default.createElement("p", { className: b('caption') }, activeTabData.caption)));
@@ -14,7 +14,6 @@ unpredictable css rules order in build */
14
14
  bottom: 0;
15
15
  opacity: 0;
16
16
  transition: opacity 300ms ease 3s;
17
- z-index: 1;
18
17
  }
19
18
  .pc-CustomBarControls__wrapper_shown {
20
19
  opacity: 1;
@@ -38,7 +38,7 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
38
38
  const [started, setStarted] = (0, react_1.useState)(autoPlay);
39
39
  const [ended, setEnded] = (0, react_1.useState)(false);
40
40
  const [isMounted, setIsMounted] = (0, react_1.useState)(false);
41
- const [hovered, setHovered] = (0, react_1.useState)(isMobile);
41
+ const [hovered, setHovered] = (0, react_1.useState)(false);
42
42
  (0, hooks_1.useMount)(() => setIsMounted(true));
43
43
  const videoSrc = (0, react_1.useMemo)(() => (0, utils_2.checkYoutubeVideos)(src), [src]);
44
44
  const eventsArray = (0, react_1.useMemo)(() => {
@@ -213,14 +213,13 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
213
213
  }, [changeMute, customControlsType, muted, onPlayClick]);
214
214
  const onFocusIn = (0, react_1.useCallback)(() => setHovered(true), []);
215
215
  const onFocusOut = (0, react_1.useCallback)(() => setHovered(false), []);
216
- const pictureInPictureEnabled = !isMobile || !autoPlay;
217
216
  return (react_1.default.createElement("div", { className: b({
218
217
  wrapper: !currentHeight,
219
218
  controls,
220
219
  }, className), ref: ref, onClick: handleClick, onMouseEnter: onFocusIn, onMouseLeave: onFocusOut, onFocus: onFocusIn, onBlur: onFocusOut }, isMounted ? (react_1.default.createElement(react_1.Fragment, null,
221
220
  react_1.default.createElement(react_player_1.default, { className: b('player'), url: videoSrc, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: autoPlay && customControlsType !== models_1.CustomControlsType.WithMuteButton
222
221
  ? undefined
223
- : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel, pip: pictureInPictureEnabled, playsinline: autoPlay }),
222
+ : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel }),
224
223
  controls === models_1.MediaVideoControlsType.Custom && (react_1.default.createElement(CustomBarControls_1.default, { className: customBarControlsClassName, mute: {
225
224
  isMuted: muted,
226
225
  changeMute: (event) => {
@@ -13,7 +13,7 @@ import { block, getThemedValue } from '../../utils';
13
13
  import './Tabs.css';
14
14
  const b = block('tabs-block');
15
15
  export const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', contentSize = 's', }) => {
16
- var _a, _b;
16
+ var _a;
17
17
  const [activeTab, setActiveTab] = useState(items[0].tabName);
18
18
  const [play, setPlay] = useState(false);
19
19
  const theme = useTheme();
@@ -42,7 +42,7 @@ export const TabsBlock = ({ items, title, description, animated, tabsColSizes, c
42
42
  all: GridColumnOrderClasses.Last,
43
43
  md: GridColumnOrderClasses.First,
44
44
  }, className: b('col', { centered: centered }) },
45
- React.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: ((_b = activeTabData.media) === null || _b === void 0 ? void 0 : _b.video) && mediaHeight, imageClassName: b('image') })))),
45
+ React.createElement("div", { ref: ref }, (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (React.createElement(Media, Object.assign({}, getThemedValue(activeTabData.media, theme), { key: activeTab, className: b('media'), playVideo: play, height: mediaHeight })))),
46
46
  imageProps && (React.createElement(Fragment, null,
47
47
  React.createElement(FullscreenImage, Object.assign({}, imageProps, { imageClassName: b('image') })))),
48
48
  (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && React.createElement("p", { className: b('caption') }, activeTabData.caption)));
@@ -14,7 +14,6 @@ unpredictable css rules order in build */
14
14
  bottom: 0;
15
15
  opacity: 0;
16
16
  transition: opacity 300ms ease 3s;
17
- z-index: 1;
18
17
  }
19
18
  .pc-CustomBarControls__wrapper_shown {
20
19
  opacity: 1;
@@ -35,7 +35,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
35
35
  const [started, setStarted] = useState(autoPlay);
36
36
  const [ended, setEnded] = useState(false);
37
37
  const [isMounted, setIsMounted] = useState(false);
38
- const [hovered, setHovered] = useState(isMobile);
38
+ const [hovered, setHovered] = useState(false);
39
39
  useMount(() => setIsMounted(true));
40
40
  const videoSrc = useMemo(() => checkYoutubeVideos(src), [src]);
41
41
  const eventsArray = useMemo(() => {
@@ -210,14 +210,13 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
210
210
  }, [changeMute, customControlsType, muted, onPlayClick]);
211
211
  const onFocusIn = useCallback(() => setHovered(true), []);
212
212
  const onFocusOut = useCallback(() => setHovered(false), []);
213
- const pictureInPictureEnabled = !isMobile || !autoPlay;
214
213
  return (React.createElement("div", { className: b({
215
214
  wrapper: !currentHeight,
216
215
  controls,
217
216
  }, className), ref: ref, onClick: handleClick, onMouseEnter: onFocusIn, onMouseLeave: onFocusOut, onFocus: onFocusIn, onBlur: onFocusOut }, isMounted ? (React.createElement(Fragment, null,
218
217
  React.createElement(ReactPlayer, { className: b('player'), url: videoSrc, muted: muted, controls: controls === MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: autoPlay && customControlsType !== CustomControlsType.WithMuteButton
219
218
  ? undefined
220
- : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel, pip: pictureInPictureEnabled, playsinline: autoPlay }),
219
+ : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel }),
221
220
  controls === MediaVideoControlsType.Custom && (React.createElement(CustomBarControls, { className: customBarControlsClassName, mute: {
222
221
  isMuted: muted,
223
222
  changeMute: (event) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/page-constructor",
3
- "version": "4.25.0-alpha.0",
3
+ "version": "4.25.0",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {