@gravity-ui/page-constructor 7.15.0 → 7.16.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.
- package/build/cjs/blocks/Map/Map.js.map +1 -1
- package/build/cjs/blocks/Map/schema.d.ts +96 -0
- package/build/cjs/components/DefaultVideo/DefaultVideo.js +16 -15
- package/build/cjs/components/DefaultVideo/DefaultVideo.js.map +1 -1
- package/build/cjs/components/Map/GoogleMap.js +6 -2
- package/build/cjs/components/Map/GoogleMap.js.map +1 -1
- package/build/cjs/components/Map/YMap/YMap.d.ts +3 -3
- package/build/cjs/components/Map/YMap/YMap.js +13 -1
- package/build/cjs/components/Map/YMap/YMap.js.map +1 -1
- package/build/cjs/components/Map/YMap/YandexMap.js +35 -6
- package/build/cjs/components/Map/YMap/YandexMap.js.map +1 -1
- package/build/cjs/components/Media/Video/Video.js +1 -13
- package/build/cjs/components/Media/Video/Video.js.map +1 -1
- package/build/cjs/components/ReactPlayer/ReactPlayer.d.ts +1 -2
- package/build/cjs/components/ReactPlayer/ReactPlayer.js +19 -13
- package/build/cjs/components/ReactPlayer/ReactPlayer.js.map +1 -1
- package/build/cjs/components/index.d.ts +1 -0
- package/build/cjs/components/index.js +3 -1
- package/build/cjs/components/index.js.map +1 -1
- package/build/cjs/internal-typings/global.d.ts +4 -2
- package/build/cjs/models/constructor-items/blocks.d.ts +1 -1
- package/build/cjs/models/constructor-items/blocks.js.map +1 -1
- package/build/cjs/models/constructor-items/common.d.ts +16 -0
- package/build/cjs/models/constructor-items/common.js.map +1 -1
- package/build/cjs/schema/validators/common.d.ts +126 -0
- package/build/cjs/schema/validators/common.js +33 -0
- package/build/cjs/schema/validators/common.js.map +1 -1
- package/build/esm/blocks/Map/Map.js.map +1 -1
- package/build/esm/blocks/Map/schema.d.ts +96 -0
- package/build/esm/components/DefaultVideo/DefaultVideo.js +16 -15
- package/build/esm/components/DefaultVideo/DefaultVideo.js.map +1 -1
- package/build/esm/components/Map/GoogleMap.js +6 -2
- package/build/esm/components/Map/GoogleMap.js.map +1 -1
- package/build/esm/components/Map/YMap/YMap.d.ts +3 -3
- package/build/esm/components/Map/YMap/YMap.js +13 -1
- package/build/esm/components/Map/YMap/YMap.js.map +1 -1
- package/build/esm/components/Map/YMap/YandexMap.js +35 -6
- package/build/esm/components/Map/YMap/YandexMap.js.map +1 -1
- package/build/esm/components/Media/Video/Video.js +1 -13
- package/build/esm/components/Media/Video/Video.js.map +1 -1
- package/build/esm/components/ReactPlayer/ReactPlayer.d.ts +1 -2
- package/build/esm/components/ReactPlayer/ReactPlayer.js +19 -13
- package/build/esm/components/ReactPlayer/ReactPlayer.js.map +1 -1
- package/build/esm/components/index.d.ts +1 -0
- package/build/esm/components/index.js +1 -0
- package/build/esm/components/index.js.map +1 -1
- package/build/esm/internal-typings/global.d.ts +4 -2
- package/build/esm/models/constructor-items/blocks.d.ts +1 -1
- package/build/esm/models/constructor-items/blocks.js.map +1 -1
- package/build/esm/models/constructor-items/common.d.ts +16 -0
- package/build/esm/models/constructor-items/common.js.map +1 -1
- package/build/esm/schema/validators/common.d.ts +126 -0
- package/build/esm/schema/validators/common.js +33 -0
- package/build/esm/schema/validators/common.js.map +1 -1
- package/package.json +1 -1
- package/schema/index.js +1 -1
- package/server/models/constructor-items/blocks.d.ts +1 -1
- package/server/models/constructor-items/common.d.ts +16 -0
- package/widget/index.js +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Map.js","sourceRoot":"../../../../src","sources":["blocks/Map/Map.tsx"],"names":[],"mappings":";;;;;AAAA,8EAA2C;AAC3C,gGAA6D;AAE7D,gDAAkC;AAClC,kEAA0D;AAI1D,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,WAAW,CAAC,CAAC;AAEtB,MAAM,QAAQ,GAAG,CAAC,EAAC,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC9E,MAAM,cAAc,GAAG,IAAA,+BAAc,EAAC;QAClC,MAAM;QACN,aAAa;KAChB,CAAC,CAAC;IAEH,OAAO,CACH,uBAAC,mBAAS,OAAK,KAAK,YAChB,uBAAC,mBAAS,CAAC,IAAI,cACX,uBAAC,aAAG,
|
|
1
|
+
{"version":3,"file":"Map.js","sourceRoot":"../../../../src","sources":["blocks/Map/Map.tsx"],"names":[],"mappings":";;;;;AAAA,8EAA2C;AAC3C,gGAA6D;AAE7D,gDAAkC;AAClC,kEAA0D;AAI1D,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,WAAW,CAAC,CAAC;AAEtB,MAAM,QAAQ,GAAG,CAAC,EAAC,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC9E,MAAM,cAAc,GAAG,IAAA,+BAAc,EAAC;QAClC,MAAM;QACN,aAAa;KAChB,CAAC,CAAC;IAEH,OAAO,CACH,uBAAC,mBAAS,OAAK,KAAK,YAChB,uBAAC,mBAAS,CAAC,IAAI,cACX,uBAAC,aAAG,OAAM,GAAgB,EAAE,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,cAAc,EAAC,CAAC,GAAI,GACzD,GACT,CACf,CAAC;AACN,CAAC,CAAC;AAbW,QAAA,QAAQ,YAanB;AAEF,kBAAe,gBAAQ,CAAC","sourcesContent":["import Map from '../../components/Map/Map';\nimport MediaBase from '../../components/MediaBase/MediaBase';\nimport {MapBlockProps, MapProps} from '../../models';\nimport {block} from '../../utils';\nimport {getMediaBorder} from '../../utils/borderSelector';\n\nimport './Map.scss';\n\nconst b = block('map-block');\n\nexport const MapBlock = ({map, border, disableShadow, ...props}: MapBlockProps) => {\n const borderSelected = getMediaBorder({\n border,\n disableShadow,\n });\n\n return (\n <MediaBase {...props}>\n <MediaBase.Card>\n <Map {...(map as MapProps)} className={b({border: borderSelected})} />\n </MediaBase.Card>\n </MediaBase>\n );\n};\n\nexport default MapBlock;\n"]}
|
|
@@ -41,6 +41,45 @@ export declare const Map: {
|
|
|
41
41
|
iconColor: {
|
|
42
42
|
type: string;
|
|
43
43
|
};
|
|
44
|
+
iconImageHref: {
|
|
45
|
+
type: string;
|
|
46
|
+
};
|
|
47
|
+
iconImageSize: {
|
|
48
|
+
type: string;
|
|
49
|
+
items: {
|
|
50
|
+
type: string;
|
|
51
|
+
};
|
|
52
|
+
minItems: number;
|
|
53
|
+
maxItems: number;
|
|
54
|
+
};
|
|
55
|
+
iconImageOffset: {
|
|
56
|
+
type: string;
|
|
57
|
+
items: {
|
|
58
|
+
type: string;
|
|
59
|
+
};
|
|
60
|
+
minItems: number;
|
|
61
|
+
maxItems: number;
|
|
62
|
+
};
|
|
63
|
+
iconImageClipRect: {
|
|
64
|
+
type: string;
|
|
65
|
+
items: {
|
|
66
|
+
type: string;
|
|
67
|
+
items: {
|
|
68
|
+
type: string;
|
|
69
|
+
};
|
|
70
|
+
minItems: number;
|
|
71
|
+
maxItems: number;
|
|
72
|
+
};
|
|
73
|
+
minItems: number;
|
|
74
|
+
maxItems: number;
|
|
75
|
+
};
|
|
76
|
+
iconLayout: {
|
|
77
|
+
type: string;
|
|
78
|
+
};
|
|
79
|
+
iconShape: {
|
|
80
|
+
type: string;
|
|
81
|
+
additionalProperties: boolean;
|
|
82
|
+
};
|
|
44
83
|
preset: {
|
|
45
84
|
type: string;
|
|
46
85
|
};
|
|
@@ -49,6 +88,15 @@ export declare const Map: {
|
|
|
49
88
|
};
|
|
50
89
|
};
|
|
51
90
|
};
|
|
91
|
+
forceAspectRatio: {
|
|
92
|
+
type: string;
|
|
93
|
+
};
|
|
94
|
+
disableControls: {
|
|
95
|
+
type: string;
|
|
96
|
+
};
|
|
97
|
+
disableBalloons: {
|
|
98
|
+
type: string;
|
|
99
|
+
};
|
|
52
100
|
};
|
|
53
101
|
};
|
|
54
102
|
export declare const MapBlock: {
|
|
@@ -99,6 +147,45 @@ export declare const MapBlock: {
|
|
|
99
147
|
iconColor: {
|
|
100
148
|
type: string;
|
|
101
149
|
};
|
|
150
|
+
iconImageHref: {
|
|
151
|
+
type: string;
|
|
152
|
+
};
|
|
153
|
+
iconImageSize: {
|
|
154
|
+
type: string;
|
|
155
|
+
items: {
|
|
156
|
+
type: string;
|
|
157
|
+
};
|
|
158
|
+
minItems: number;
|
|
159
|
+
maxItems: number;
|
|
160
|
+
};
|
|
161
|
+
iconImageOffset: {
|
|
162
|
+
type: string;
|
|
163
|
+
items: {
|
|
164
|
+
type: string;
|
|
165
|
+
};
|
|
166
|
+
minItems: number;
|
|
167
|
+
maxItems: number;
|
|
168
|
+
};
|
|
169
|
+
iconImageClipRect: {
|
|
170
|
+
type: string;
|
|
171
|
+
items: {
|
|
172
|
+
type: string;
|
|
173
|
+
items: {
|
|
174
|
+
type: string;
|
|
175
|
+
};
|
|
176
|
+
minItems: number;
|
|
177
|
+
maxItems: number;
|
|
178
|
+
};
|
|
179
|
+
minItems: number;
|
|
180
|
+
maxItems: number;
|
|
181
|
+
};
|
|
182
|
+
iconLayout: {
|
|
183
|
+
type: string;
|
|
184
|
+
};
|
|
185
|
+
iconShape: {
|
|
186
|
+
type: string;
|
|
187
|
+
additionalProperties: boolean;
|
|
188
|
+
};
|
|
102
189
|
preset: {
|
|
103
190
|
type: string;
|
|
104
191
|
};
|
|
@@ -107,6 +194,15 @@ export declare const MapBlock: {
|
|
|
107
194
|
};
|
|
108
195
|
};
|
|
109
196
|
};
|
|
197
|
+
forceAspectRatio: {
|
|
198
|
+
type: string;
|
|
199
|
+
};
|
|
200
|
+
disableControls: {
|
|
201
|
+
type: string;
|
|
202
|
+
};
|
|
203
|
+
disableBalloons: {
|
|
204
|
+
type: string;
|
|
205
|
+
};
|
|
110
206
|
};
|
|
111
207
|
};
|
|
112
208
|
description: {
|
|
@@ -11,7 +11,7 @@ const CustomBarControls_1 = tslib_1.__importDefault(require("../ReactPlayer/Cust
|
|
|
11
11
|
const b = (0, utils_1.block)('default-video');
|
|
12
12
|
exports.DefaultVideo = React.forwardRef((props, ref) => {
|
|
13
13
|
const { video, qa, customBarControlsClassName } = props;
|
|
14
|
-
const { controls, customControlsOptions, muted: initiallyMuted = true, onVideoEnd } = video;
|
|
14
|
+
const { controls, customControlsOptions, muted: initiallyMuted = true, onVideoEnd, loop, } = video;
|
|
15
15
|
const { muteButtonShown, positioning, type: customControlsType, } = customControlsOptions || {};
|
|
16
16
|
const [isPaused, setIsPaused] = React.useState(false);
|
|
17
17
|
const [isMuted, setIsMuted] = React.useState(initiallyMuted);
|
|
@@ -28,19 +28,6 @@ exports.DefaultVideo = React.forwardRef((props, ref) => {
|
|
|
28
28
|
}
|
|
29
29
|
return videoRef.current;
|
|
30
30
|
}, [videoRef]);
|
|
31
|
-
React.useEffect(() => {
|
|
32
|
-
const videoElement = videoRef.current;
|
|
33
|
-
if (!videoElement || !onVideoEnd) {
|
|
34
|
-
return undefined;
|
|
35
|
-
}
|
|
36
|
-
const handleVideoEnd = () => {
|
|
37
|
-
onVideoEnd?.();
|
|
38
|
-
};
|
|
39
|
-
videoElement.addEventListener('ended', handleVideoEnd);
|
|
40
|
-
return () => {
|
|
41
|
-
videoElement.removeEventListener('ended', handleVideoEnd);
|
|
42
|
-
};
|
|
43
|
-
}, [videoRef, onVideoEnd]);
|
|
44
31
|
// to guarantee setting a muted attribute in HTML. https://github.com/facebook/react/issues/10389
|
|
45
32
|
React.useEffect(() => {
|
|
46
33
|
const videoElement = videoRef.current;
|
|
@@ -67,10 +54,24 @@ exports.DefaultVideo = React.forwardRef((props, ref) => {
|
|
|
67
54
|
onPlayToggle();
|
|
68
55
|
}
|
|
69
56
|
}, [onPlayToggle, customControlsType]);
|
|
57
|
+
const onEnded = React.useCallback(() => {
|
|
58
|
+
const videoElement = videoRef.current;
|
|
59
|
+
if (!videoElement) {
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
if (loop) {
|
|
63
|
+
const { start = 0, end = videoElement.duration } = typeof loop === 'boolean' ? {} : loop;
|
|
64
|
+
if (videoElement.currentTime >= end) {
|
|
65
|
+
videoElement.currentTime = start;
|
|
66
|
+
videoElement.play();
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
onVideoEnd?.();
|
|
70
|
+
}, [loop, onVideoEnd]);
|
|
70
71
|
return ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsxs)("video", { disablePictureInPicture: true, playsInline: true,
|
|
71
72
|
// @ts-ignore
|
|
72
73
|
// eslint-disable-next-line react/no-unknown-property
|
|
73
|
-
pip: "false", className: b(), ref: videoRef, preload: "metadata", muted: isMuted, "aria-label": video.ariaLabel, onClick: onClick, children: [(0, utils_2.getVideoTypesWithPriority)(video.src).map(({ src, type }, index) => ((0, jsx_runtime_1.jsx)("source", { src: src, type: type, "data-qa": qa }, index))), (0, jsx_runtime_1.jsx)("track", { default: true, kind: "captions" })] }), controls === models_1.MediaVideoControlsType.Custom && ((0, jsx_runtime_1.jsx)(CustomBarControls_1.default, { className: customBarControlsClassName, type: customControlsType, isPaused: isPaused, onPlayClick: onPlayToggle, muteButtonShown: muteButtonShown, shown: true, positioning: positioning, mute: {
|
|
74
|
+
pip: "false", className: b(), ref: videoRef, preload: "metadata", muted: isMuted, "aria-label": video.ariaLabel, onClick: onClick, onEnded: onEnded, children: [(0, utils_2.getVideoTypesWithPriority)(video.src).map(({ src, type }, index) => ((0, jsx_runtime_1.jsx)("source", { src: src, type: type, "data-qa": qa }, index))), (0, jsx_runtime_1.jsx)("track", { default: true, kind: "captions" })] }), controls === models_1.MediaVideoControlsType.Custom && ((0, jsx_runtime_1.jsx)(CustomBarControls_1.default, { className: customBarControlsClassName, type: customControlsType, isPaused: isPaused, onPlayClick: onPlayToggle, muteButtonShown: muteButtonShown, shown: true, positioning: positioning, mute: {
|
|
74
75
|
isMuted: Boolean(isMuted),
|
|
75
76
|
changeMute: onMuteToggle,
|
|
76
77
|
} }))] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultVideo.js","sourceRoot":"../../../../src","sources":["components/DefaultVideo/DefaultVideo.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,kDAAyF;AACzF,gDAAkC;AAClC,mDAA+D;AAC/D,oGAAiE;AAIjE,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,eAAe,CAAC,CAAC;AAWpB,QAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CACxC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACX,MAAM,EAAC,KAAK,EAAE,EAAE,EAAE,0BAA0B,EAAC,GAAG,KAAK,CAAC;IACtD,MAAM,
|
|
1
|
+
{"version":3,"file":"DefaultVideo.js","sourceRoot":"../../../../src","sources":["components/DefaultVideo/DefaultVideo.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {CustomControlsType, MediaVideoControlsType, MediaVideoProps} from '../../models';\nimport {block} from '../../utils';\nimport {getVideoTypesWithPriority} from '../Media/Video/utils';\nimport CustomBarControls from '../ReactPlayer/CustomBarControls';\n\nimport './DefaultVideo.scss';\n\nconst b = block('default-video');\n\ntype DefaultVideoRefType = HTMLVideoElement | undefined;\n\ninterface DefaultVideoProps {\n video: MediaVideoProps;\n qa?: string;\n customBarControlsClassName?: string;\n className?: string;\n}\n\nexport const DefaultVideo = React.forwardRef<DefaultVideoRefType, DefaultVideoProps>(\n (props, ref) => {\n const {video, qa, customBarControlsClassName} = props;\n const {\n controls,\n customControlsOptions,\n muted: initiallyMuted = true,\n onVideoEnd,\n loop,\n } = video;\n const {\n muteButtonShown,\n positioning,\n type: customControlsType,\n } = customControlsOptions || {};\n const [isPaused, setIsPaused] = React.useState(false);\n const [isMuted, setIsMuted] = React.useState(initiallyMuted);\n const videoRef = React.useRef<HTMLVideoElement>(null);\n\n // one may not use this hook and work with `ref` variable only, but\n // in this case one should support both function type and object type,\n // according to ForwardedRef type.\n // Currently used way with extra ref and useImperativeHandle is more\n // convenient and allows us to work with object typed ref only,\n // avoiding typeof ref === 'function' statements\n React.useImperativeHandle(ref, () => {\n if (!videoRef?.current) {\n return undefined;\n }\n\n return videoRef.current;\n }, [videoRef]);\n\n // to guarantee setting a muted attribute in HTML. https://github.com/facebook/react/issues/10389\n React.useEffect(() => {\n const videoElement = videoRef.current;\n\n if (videoElement && initiallyMuted) {\n videoElement.defaultMuted = true;\n }\n }, [videoRef, initiallyMuted]);\n\n const onPlayToggle = React.useCallback(() => {\n setIsPaused((value) => {\n if (value) {\n videoRef?.current?.play();\n } else {\n videoRef?.current?.pause();\n }\n\n return !value;\n });\n }, [videoRef]);\n\n const onMuteToggle = React.useCallback(() => {\n setIsMuted((value) => !value);\n }, []);\n\n const onClick = React.useCallback(() => {\n if (customControlsType === CustomControlsType.WithPlayPauseButton) {\n onPlayToggle();\n }\n }, [onPlayToggle, customControlsType]);\n\n const onEnded = React.useCallback(() => {\n const videoElement = videoRef.current;\n if (!videoElement) {\n return;\n }\n\n if (loop) {\n const {start = 0, end = videoElement.duration} =\n typeof loop === 'boolean' ? {} : loop;\n\n if (videoElement.currentTime >= end) {\n videoElement.currentTime = start;\n videoElement.play();\n }\n }\n\n onVideoEnd?.();\n }, [loop, onVideoEnd]);\n\n return (\n <React.Fragment>\n <video\n disablePictureInPicture\n playsInline\n // @ts-ignore\n // eslint-disable-next-line react/no-unknown-property\n pip=\"false\"\n className={b()}\n ref={videoRef}\n preload=\"metadata\"\n muted={isMuted}\n aria-label={video.ariaLabel}\n onClick={onClick}\n onEnded={onEnded}\n >\n {getVideoTypesWithPriority(video.src).map(({src, type}, index) => (\n <source key={index} src={src} type={type} data-qa={qa} />\n ))}\n <track default kind=\"captions\" />\n </video>\n\n {controls === MediaVideoControlsType.Custom && (\n <CustomBarControls\n className={customBarControlsClassName}\n type={customControlsType}\n isPaused={isPaused}\n onPlayClick={onPlayToggle}\n muteButtonShown={muteButtonShown}\n shown\n positioning={positioning}\n mute={{\n isMuted: Boolean(isMuted),\n changeMute: onMuteToggle,\n }}\n />\n )}\n </React.Fragment>\n );\n },\n);\n\nDefaultVideo.displayName = 'DefaultVideo';\n"]}
|
|
@@ -16,7 +16,7 @@ function getScriptSrc(params) {
|
|
|
16
16
|
return `${scriptSrc}?key=${apiKey}&language=${lang}${zoom ? '&zoom=' + zoom : ''}&q=${encodeURI(address)}`;
|
|
17
17
|
}
|
|
18
18
|
const GoogleMap = (props) => {
|
|
19
|
-
const { address, zoom, className } = props;
|
|
19
|
+
const { address, zoom, className, forceAspectRatio = true } = props;
|
|
20
20
|
const { apiKey, scriptSrc } = React.useContext(mapsContext_1.MapsContext);
|
|
21
21
|
const { lang = uikit_1.Lang.Ru } = React.useContext(localeContext_1.LocaleContext);
|
|
22
22
|
const isMobile = React.useContext(mobileContext_1.MobileContext);
|
|
@@ -24,6 +24,9 @@ const GoogleMap = (props) => {
|
|
|
24
24
|
const ref = React.useRef(null);
|
|
25
25
|
const src = React.useMemo(() => getScriptSrc({ apiKey, scriptSrc, address, lang, zoom }), [apiKey, scriptSrc, address, lang, zoom]);
|
|
26
26
|
React.useEffect(() => {
|
|
27
|
+
if (!forceAspectRatio) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
27
30
|
const updateSize = (0, debounce_1.default)(() => {
|
|
28
31
|
if (ref.current) {
|
|
29
32
|
setHeight(Math.round((0, helpers_1.getMapHeight)(ref.current.offsetWidth, isMobile)));
|
|
@@ -31,10 +34,11 @@ const GoogleMap = (props) => {
|
|
|
31
34
|
}, 100);
|
|
32
35
|
updateSize();
|
|
33
36
|
window.addEventListener('resize', updateSize, { passive: true });
|
|
37
|
+
// eslint-disable-next-line consistent-return
|
|
34
38
|
return () => {
|
|
35
39
|
window.removeEventListener('resize', updateSize);
|
|
36
40
|
};
|
|
37
|
-
}, [isMobile]);
|
|
41
|
+
}, [forceAspectRatio, isMobile]);
|
|
38
42
|
if (!apiKey || !address) {
|
|
39
43
|
return null;
|
|
40
44
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GoogleMap.js","sourceRoot":"../../../../src","sources":["components/Map/GoogleMap.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAAuC;AACvC,0EAAuC;AAEvC,gFAAwE;AACxE,0EAAkE;AAClE,wEAA0D;AAE1D,gDAAkC;AAElC,0CAAuC;AAEvC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,KAAK,CAAC,CAAC;AAUvB,SAAS,YAAY,CAAC,MAA2B;IAC7C,MAAM,EAAC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAC,GAAG,MAAM,CAAC;IAExD,OAAO,GAAG,SAAS,QAAQ,MAAM,aAAa,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,MAAM,SAAS,CAC3F,OAAO,CACV,EAAE,CAAC;AACR,CAAC;AAED,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;IACnC,MAAM,EAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAC,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"GoogleMap.js","sourceRoot":"../../../../src","sources":["components/Map/GoogleMap.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Lang} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../context/localeContext/localeContext';\nimport {MapsContext} from '../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../context/mobileContext';\nimport {GMapProps} from '../../models';\nimport {block} from '../../utils';\n\nimport {getMapHeight} from './helpers';\n\nconst b = block('map');\n\ninterface GoogleMapLinkParams {\n apiKey: string;\n scriptSrc: string;\n address: string;\n lang: `${Lang}`;\n zoom?: number;\n}\n\nfunction getScriptSrc(params: GoogleMapLinkParams) {\n const {apiKey, scriptSrc, address, lang, zoom} = params;\n\n return `${scriptSrc}?key=${apiKey}&language=${lang}${zoom ? '&zoom=' + zoom : ''}&q=${encodeURI(\n address,\n )}`;\n}\n\nconst GoogleMap = (props: GMapProps) => {\n const {address, zoom, className, forceAspectRatio = true} = props;\n const {apiKey, scriptSrc} = React.useContext(MapsContext);\n const {lang = Lang.Ru} = React.useContext(LocaleContext);\n const isMobile = React.useContext(MobileContext);\n\n const [height, setHeight] = React.useState<number | undefined>(undefined);\n const ref = React.useRef<HTMLIFrameElement>(null);\n const src = React.useMemo(\n () => getScriptSrc({apiKey, scriptSrc, address, lang, zoom}),\n [apiKey, scriptSrc, address, lang, zoom],\n );\n\n React.useEffect(() => {\n if (!forceAspectRatio) {\n return;\n }\n\n const updateSize = debounce(() => {\n if (ref.current) {\n setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n }\n }, 100);\n\n updateSize();\n window.addEventListener('resize', updateSize, {passive: true});\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [forceAspectRatio, isMobile]);\n\n if (!apiKey || !address) {\n return null;\n }\n\n return (\n <iframe\n className={b(null, className)}\n ref={ref}\n style={{\n height,\n }}\n title=\"Google Map\"\n loading=\"lazy\"\n allowFullScreen\n referrerPolicy=\"no-referrer-when-downgrade\"\n src={src}\n />\n );\n};\n\nexport default GoogleMap;\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { YMapMarkerPrivate, YMapProps } from "../../../models/index.js";
|
|
2
2
|
type PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers'>;
|
|
3
3
|
export declare class YMap {
|
|
4
4
|
private ymap;
|
|
@@ -6,8 +6,8 @@ export declare class YMap {
|
|
|
6
6
|
private coords;
|
|
7
7
|
constructor(ymap: Ymaps.Map, mapRef: HTMLDivElement | null);
|
|
8
8
|
showPlacemarks(props: PlacemarksProps): Promise<void>;
|
|
9
|
-
findAddress(marker:
|
|
10
|
-
findCoordinate(marker:
|
|
9
|
+
findAddress(marker: YMapMarkerPrivate): Promise<void>;
|
|
10
|
+
findCoordinate(marker: YMapMarkerPrivate): void;
|
|
11
11
|
private drawPlaceMarkStyle;
|
|
12
12
|
private recalcZoomAndCenter;
|
|
13
13
|
private clearOldPlacemarks;
|
|
@@ -11,9 +11,17 @@ const DEFAULT_PLACEMARKS_COLOR = '#dc534b';
|
|
|
11
11
|
const DEFAULT_PLACEMARKS_PRESET = 'islands#dotIcon';
|
|
12
12
|
const DEFAULT_MAP_CONTROL_BUTTON_HEIGHT = 30;
|
|
13
13
|
const geoObjectPropsAndOptions = {
|
|
14
|
+
cursor: GeoObjectTypes.Options,
|
|
14
15
|
iconCaption: GeoObjectTypes.Properties,
|
|
15
16
|
iconContent: GeoObjectTypes.Properties,
|
|
16
17
|
iconColor: GeoObjectTypes.Options,
|
|
18
|
+
iconImageHref: GeoObjectTypes.Options,
|
|
19
|
+
iconImageSize: GeoObjectTypes.Options,
|
|
20
|
+
iconImageOffset: GeoObjectTypes.Options,
|
|
21
|
+
iconImageClipRect: GeoObjectTypes.Options,
|
|
22
|
+
iconLayout: GeoObjectTypes.Options,
|
|
23
|
+
iconShape: GeoObjectTypes.Options,
|
|
24
|
+
interactivityModel: GeoObjectTypes.Options,
|
|
17
25
|
preset: GeoObjectTypes.Options,
|
|
18
26
|
};
|
|
19
27
|
class YMap {
|
|
@@ -60,7 +68,11 @@ class YMap {
|
|
|
60
68
|
if (!preset.includes('Stretchy') && !iconColor) {
|
|
61
69
|
localIconColor = DEFAULT_PLACEMARKS_COLOR;
|
|
62
70
|
}
|
|
63
|
-
Object.entries({
|
|
71
|
+
Object.entries({
|
|
72
|
+
...marker.label,
|
|
73
|
+
iconColor: localIconColor,
|
|
74
|
+
preset,
|
|
75
|
+
}).forEach(([key, value]) => {
|
|
64
76
|
const geoObjectParamType = geoObjectPropsAndOptions[key];
|
|
65
77
|
if (value && geoObjectParamType) {
|
|
66
78
|
geoObject[geoObjectParamType].set(key, value);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YMap.ts"],"names":[],"mappings":";;;AAGA,IAAK,cAGJ;AAHD,WAAK,cAAc;IACf,2CAAyB,CAAA;IACzB,qCAAmB,CAAA;AACvB,CAAC,EAHI,cAAc,KAAd,cAAc,QAGlB;AAED,MAAM,wBAAwB,GAAG,SAAS,CAAC;AAC3C,mGAAmG;AACnG,MAAM,yBAAyB,GAAG,iBAAiB,CAAC;AACpD,MAAM,iCAAiC,GAAG,EAAE,CAAC;AAE7C,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"YMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YMap.ts"],"names":[],"mappings":"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","sourcesContent":["import {YMapMarkerLabelPrivate, YMapMarkerPrivate, YMapProps} from '../../../models';\nimport {Coordinate} from '../../../models/constructor-items/common';\n\nenum GeoObjectTypes {\n Properties = 'properties',\n Options = 'options',\n}\n\nconst DEFAULT_PLACEMARKS_COLOR = '#dc534b';\n// presetStorage: https://yandex.com/dev/maps/jsapi/doc/2.1/ref/reference/option.presetStorage.html\nconst DEFAULT_PLACEMARKS_PRESET = 'islands#dotIcon';\nconst DEFAULT_MAP_CONTROL_BUTTON_HEIGHT = 30;\n\nconst geoObjectPropsAndOptions: Record<keyof YMapMarkerLabelPrivate, GeoObjectTypes> = {\n cursor: GeoObjectTypes.Options,\n iconCaption: GeoObjectTypes.Properties,\n iconContent: GeoObjectTypes.Properties,\n iconColor: GeoObjectTypes.Options,\n iconImageHref: GeoObjectTypes.Options,\n iconImageSize: GeoObjectTypes.Options,\n iconImageOffset: GeoObjectTypes.Options,\n iconImageClipRect: GeoObjectTypes.Options,\n iconLayout: GeoObjectTypes.Options,\n iconShape: GeoObjectTypes.Options,\n interactivityModel: GeoObjectTypes.Options,\n preset: GeoObjectTypes.Options,\n};\n\ntype PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers'>;\n\nexport class YMap {\n private ymap: Ymaps.Map;\n private mapRef: HTMLDivElement | null;\n private coords: Coordinate[] = [];\n\n constructor(ymap: Ymaps.Map, mapRef: HTMLDivElement | null) {\n this.ymap = ymap;\n this.mapRef = mapRef;\n }\n\n async showPlacemarks(props: PlacemarksProps) {\n this.clearOldPlacemarks();\n\n for (const marker of props.markers) {\n if (marker.address) {\n await this.findAddress(marker);\n } else if (marker.coordinate) {\n this.findCoordinate(marker);\n }\n }\n\n this.recalcZoomAndCenter(props);\n }\n\n async findAddress(marker: YMapMarkerPrivate) {\n try {\n const res = await window.ymaps.geocode(marker.address, {results: 1});\n const geoObject = res.geoObjects.get(0);\n const coordinate = geoObject.geometry.getCoordinates();\n\n this.coords.push(coordinate);\n\n this.drawPlaceMarkStyle(geoObject, marker);\n\n this.ymap.geoObjects.add(geoObject);\n } catch {} // If error - placemark will not be displayed\n }\n\n findCoordinate(marker: YMapMarkerPrivate) {\n const geoObject = new window.ymaps.Placemark(marker.coordinate, {});\n\n this.coords.push(marker.coordinate as Coordinate);\n this.drawPlaceMarkStyle(geoObject, marker);\n this.ymap.geoObjects.add(geoObject);\n }\n\n private drawPlaceMarkStyle(geoObject: Ymaps.GeoObject, marker: YMapMarkerPrivate) {\n const {iconColor, preset = DEFAULT_PLACEMARKS_PRESET} = marker.label || {};\n let localIconColor: string | undefined = iconColor;\n\n // You can set the preset option together with the iconColor option only if it not a 'Stretchy' preset\n if (!preset.includes('Stretchy') && !iconColor) {\n localIconColor = DEFAULT_PLACEMARKS_COLOR;\n }\n\n Object.entries({\n ...marker.label,\n iconColor: localIconColor,\n preset,\n }).forEach(([key, value]) => {\n const geoObjectParamType: GeoObjectTypes | undefined =\n geoObjectPropsAndOptions[key as keyof YMapMarkerLabelPrivate];\n\n if (value && geoObjectParamType) {\n geoObject[geoObjectParamType].set(key, value);\n }\n });\n }\n\n private recalcZoomAndCenter(props: PlacemarksProps) {\n const coordsLength = this.coords.length;\n const {zoom = 0} = props;\n\n if (!coordsLength) {\n return;\n }\n\n let leftBottom = [Infinity, Infinity],\n rightTop = [-Infinity, -Infinity];\n\n this.coords.forEach((point) => {\n leftBottom = [Math.min(leftBottom[0], point[0]), Math.min(leftBottom[1], point[1])];\n rightTop = [Math.max(rightTop[0], point[0]), Math.max(rightTop[1], point[1])];\n });\n\n let newMapParams = {\n zoom,\n center: [],\n };\n\n if (zoom) {\n // compute only the center\n newMapParams.center = window.ymaps.util.bounds.getCenter([leftBottom, rightTop]);\n } else {\n newMapParams = window.ymaps.util.bounds.getCenterAndZoom(\n [leftBottom, rightTop],\n [this.mapRef?.clientWidth, this.mapRef?.clientHeight],\n undefined,\n {margin: DEFAULT_MAP_CONTROL_BUTTON_HEIGHT},\n );\n }\n\n this.ymap.setCenter(newMapParams.center);\n\n // Use default zoom for one placemark\n if (coordsLength > 1 && !zoom) {\n this.ymap.setZoom(newMapParams.zoom);\n }\n }\n\n private clearOldPlacemarks() {\n if (this.coords.length === 0) {\n return;\n }\n\n this.ymap.geoObjects.removeAll();\n this.coords = [];\n }\n}\n"]}
|
|
@@ -21,8 +21,12 @@ const DEFAULT_ZOOM = 9;
|
|
|
21
21
|
// We use this init center to create a map
|
|
22
22
|
// The real center of the map will be calculated later, using the coordinates of the markers
|
|
23
23
|
const INITIAL_CENTER = [0, 0];
|
|
24
|
+
const BALLOON_DISABLING_MARKER_OPTIONS = {
|
|
25
|
+
cursor: 'drag',
|
|
26
|
+
interactivityModel: 'default#silent',
|
|
27
|
+
};
|
|
24
28
|
const YandexMap = (props) => {
|
|
25
|
-
const { markers, zoom, id, className } = props;
|
|
29
|
+
const { markers, zoom, id, disableControls = false, disableBalloons = false, className, forceAspectRatio = true, } = props;
|
|
26
30
|
const { apiKey, scriptSrc, nonce } = React.useContext(mapsContext_1.MapsContext);
|
|
27
31
|
const isMobile = React.useContext(mobileContext_1.MobileContext);
|
|
28
32
|
const { lang = 'ru' } = React.useContext(localeContext_1.LocaleContext);
|
|
@@ -44,12 +48,30 @@ const YandexMap = (props) => {
|
|
|
44
48
|
setYmaps(new YMap_1.YMap(new window.ymaps.Map(containerId, {
|
|
45
49
|
center: INITIAL_CENTER,
|
|
46
50
|
zoom: zoom || DEFAULT_ZOOM,
|
|
47
|
-
|
|
51
|
+
controls: disableControls ? [] : undefined,
|
|
52
|
+
}, {
|
|
53
|
+
autoFitToViewport: 'always',
|
|
54
|
+
suppressMapOpenBlock: disableControls,
|
|
55
|
+
yandexMapDisablePoiInteractivity: disableControls,
|
|
56
|
+
}), ref.current));
|
|
48
57
|
});
|
|
49
58
|
setLoading(false);
|
|
50
59
|
})();
|
|
51
|
-
}, [
|
|
60
|
+
}, [
|
|
61
|
+
apiKey,
|
|
62
|
+
lang,
|
|
63
|
+
scriptSrc,
|
|
64
|
+
containerId,
|
|
65
|
+
zoom,
|
|
66
|
+
nonce,
|
|
67
|
+
attemptsIndex,
|
|
68
|
+
setLoading,
|
|
69
|
+
disableControls,
|
|
70
|
+
]);
|
|
52
71
|
React.useEffect(() => {
|
|
72
|
+
if (!forceAspectRatio) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
53
75
|
const updateSize = (0, debounce_1.default)(() => {
|
|
54
76
|
if (ref.current) {
|
|
55
77
|
setHeight(Math.round((0, helpers_1.getMapHeight)(ref.current.offsetWidth, isMobile)));
|
|
@@ -57,20 +79,27 @@ const YandexMap = (props) => {
|
|
|
57
79
|
}, 100);
|
|
58
80
|
updateSize();
|
|
59
81
|
window.addEventListener('resize', updateSize, { passive: true });
|
|
82
|
+
// eslint-disable-next-line consistent-return
|
|
60
83
|
return () => {
|
|
61
84
|
window.removeEventListener('resize', updateSize);
|
|
62
85
|
};
|
|
63
|
-
}, [
|
|
86
|
+
}, [isMobile, forceAspectRatio]);
|
|
64
87
|
React.useEffect(() => {
|
|
65
88
|
if (ymap) {
|
|
66
89
|
// show with computed center and placemarks
|
|
67
90
|
const showPlacemarks = async () => {
|
|
68
|
-
|
|
91
|
+
const privateMarkers = disableBalloons
|
|
92
|
+
? markers.map(({ label, ...marker }) => ({
|
|
93
|
+
...marker,
|
|
94
|
+
label: { ...label, ...BALLOON_DISABLING_MARKER_OPTIONS },
|
|
95
|
+
}))
|
|
96
|
+
: markers;
|
|
97
|
+
await ymap.showPlacemarks({ markers: privateMarkers, zoom });
|
|
69
98
|
setReady(true);
|
|
70
99
|
};
|
|
71
100
|
showPlacemarks();
|
|
72
101
|
}
|
|
73
|
-
});
|
|
102
|
+
}, [ymap, markers, zoom, disableBalloons]);
|
|
74
103
|
if (!markers)
|
|
75
104
|
return null;
|
|
76
105
|
return ((0, jsx_runtime_1.jsx)(ErrorWrapper_1.default, { isError: YandexMapApiLoader_1.YMapsApiLoader.status === YandexMapApiLoader_1.MapApiStatus.Error, text: (0, i18n_1.i18n)('map-load-error'), buttonText: (0, i18n_1.i18n)('map-try-again'), handler: onTryAgain, className: b('wrapper'), children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), children: [(0, jsx_runtime_1.jsx)("div", { id: containerId, className: b({ hidden: !ready }, className), ref: ref, style: { height } }), loading ? (0, jsx_runtime_1.jsx)(uikit_1.Spin, { size: "xl", className: b('spinner') }) : null] }) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YandexMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YandexMap.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAAuC;AACvC,0EAAuC;AAEvC,mFAA2E;AAC3E,6EAAqE;AACrE,2EAA6D;AAE7D,mDAAqC;AACrC,8FAA2D;AAC3D,2CAAwC;AAExC,oCAA4B;AAC5B,gEAAkE;AAClE,0CAA4B;AAE5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,KAAK,CAAC,CAAC;AACvB,MAAM,oBAAoB,GAAG,MAAM,CAAC;AACpC,MAAM,YAAY,GAAG,CAAC,CAAC;AACvB,0DAA0D;AAC1D,0CAA0C;AAC1C,4FAA4F;AAC5F,MAAM,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAE9B,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;IACnC,MAAM,
|
|
1
|
+
{"version":3,"file":"YandexMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YandexMap.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Spin} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../../context/localeContext/localeContext';\nimport {MapsContext} from '../../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../../context/mobileContext';\nimport {YMapMarkerLabelPrivate, YMapMarkerPrivate, YMapProps} from '../../../models';\nimport {block} from '../../../utils';\nimport ErrorWrapper from '../../ErrorWrapper/ErrorWrapper';\nimport {getMapHeight} from '../helpers';\n\nimport {YMap} from './YMap';\nimport {MapApiStatus, YMapsApiLoader} from './YandexMapApiLoader';\nimport {i18n} from './i18n';\n\nconst b = block('map');\nconst DEFAULT_CONTAINER_ID = 'ymap';\nconst DEFAULT_ZOOM = 9;\n// Center - is a required parameter for creating a new map\n// We use this init center to create a map\n// The real center of the map will be calculated later, using the coordinates of the markers\nconst INITIAL_CENTER = [0, 0];\n\nconst BALLOON_DISABLING_MARKER_OPTIONS: YMapMarkerLabelPrivate = {\n cursor: 'drag',\n interactivityModel: 'default#silent',\n};\n\nconst YandexMap = (props: YMapProps) => {\n const {\n markers,\n zoom,\n id,\n disableControls = false,\n disableBalloons = false,\n className,\n forceAspectRatio = true,\n } = props;\n const {apiKey, scriptSrc, nonce} = React.useContext(MapsContext);\n const isMobile = React.useContext(MobileContext);\n\n const {lang = 'ru'} = React.useContext(LocaleContext);\n const containerId = `${DEFAULT_CONTAINER_ID}-${id}`;\n\n const [ymap, setYmaps] = React.useState<YMap | null>(null);\n const [height, setHeight] = React.useState<number | undefined>(undefined);\n const ref = React.useRef<HTMLDivElement>(null);\n\n const [loading, setLoading] = React.useState<boolean>(false);\n const [ready, setReady] = React.useState<boolean>(false);\n const [attemptsIndex, setAttemptsIndex] = React.useState<number>(0);\n const onTryAgain = React.useCallback(() => {\n setAttemptsIndex(attemptsIndex + 1);\n }, [attemptsIndex]);\n\n React.useEffect(() => {\n (async function () {\n setLoading(true);\n\n await YMapsApiLoader.loadApi(apiKey, scriptSrc, lang, nonce);\n\n window.ymaps?.ready(() => {\n setYmaps(\n new YMap(\n new window.ymaps.Map(\n containerId,\n {\n center: INITIAL_CENTER,\n zoom: zoom || DEFAULT_ZOOM,\n controls: disableControls ? [] : undefined,\n },\n {\n autoFitToViewport: 'always',\n suppressMapOpenBlock: disableControls,\n yandexMapDisablePoiInteractivity: disableControls,\n },\n ),\n ref.current,\n ),\n );\n });\n\n setLoading(false);\n })();\n }, [\n apiKey,\n lang,\n scriptSrc,\n containerId,\n zoom,\n nonce,\n attemptsIndex,\n setLoading,\n disableControls,\n ]);\n\n React.useEffect(() => {\n if (!forceAspectRatio) {\n return;\n }\n\n const updateSize = debounce(() => {\n if (ref.current) {\n setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n }\n }, 100);\n\n updateSize();\n window.addEventListener('resize', updateSize, {passive: true});\n\n // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [isMobile, forceAspectRatio]);\n\n React.useEffect(() => {\n if (ymap) {\n // show with computed center and placemarks\n const showPlacemarks = async () => {\n const privateMarkers: YMapMarkerPrivate[] = disableBalloons\n ? markers.map(({label, ...marker}) => ({\n ...marker,\n label: {...label, ...BALLOON_DISABLING_MARKER_OPTIONS},\n }))\n : markers;\n\n await ymap.showPlacemarks({markers: privateMarkers, zoom});\n\n setReady(true);\n };\n\n showPlacemarks();\n }\n }, [ymap, markers, zoom, disableBalloons]);\n\n if (!markers) return null;\n\n return (\n <ErrorWrapper\n isError={YMapsApiLoader.status === MapApiStatus.Error}\n text={i18n('map-load-error')}\n buttonText={i18n('map-try-again')}\n handler={onTryAgain}\n className={b('wrapper')}\n >\n <div className={b('wrapper')}>\n {/* hidden - to show the map after calculating the center */}\n <div\n id={containerId}\n className={b({hidden: !ready}, className)}\n ref={ref}\n style={{height}}\n />\n {loading ? <Spin size=\"xl\" className={b('spinner')} /> : null}\n </div>\n </ErrorWrapper>\n );\n};\n\nexport default YandexMap;\n"]}
|
|
@@ -15,18 +15,6 @@ const Video = (props) => {
|
|
|
15
15
|
React.useImperativeHandle(video.ref, () => ref.current, []);
|
|
16
16
|
React.useEffect(() => {
|
|
17
17
|
if (ref && ref.current) {
|
|
18
|
-
const { loop } = video;
|
|
19
|
-
if (loop && typeof loop !== 'boolean') {
|
|
20
|
-
const { start = 0, end } = loop;
|
|
21
|
-
ref.current.addEventListener('timeupdate', () => {
|
|
22
|
-
const videoRef = ref.current;
|
|
23
|
-
const endTime = end || (videoRef && videoRef.duration);
|
|
24
|
-
if (videoRef && videoRef.currentTime === endTime) {
|
|
25
|
-
videoRef.currentTime = start;
|
|
26
|
-
videoRef.play().catch(() => setHasVideoFallback(true));
|
|
27
|
-
}
|
|
28
|
-
}, { passive: true });
|
|
29
|
-
}
|
|
30
18
|
if (playVideo) {
|
|
31
19
|
ref.current.play().catch(() => setHasVideoFallback(true));
|
|
32
20
|
}
|
|
@@ -34,7 +22,7 @@ const Video = (props) => {
|
|
|
34
22
|
}, [playVideo, video, setHasVideoFallback]);
|
|
35
23
|
const reactPlayerBlock = React.useMemo(() => {
|
|
36
24
|
const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton, ariaLabel, customControlsOptions, contain, } = video;
|
|
37
|
-
return ((0, jsx_runtime_1.jsx)(ReactPlayer_1.default, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop:
|
|
25
|
+
return ((0, jsx_runtime_1.jsx)(ReactPlayer_1.default, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: loop, controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, analyticsEvents: analyticsEvents, height: height, ariaLabel: ariaLabel, customControlsOptions: customControlsOptions, ratio: ratio === 'auto' ? undefined : ratio, autoRatio: ratio === 'auto', contain: contain }));
|
|
38
26
|
}, [
|
|
39
27
|
video,
|
|
40
28
|
height,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Video.js","sourceRoot":"../../../../../src","sources":["components/Media/Video/Video.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,qDAAmG;AACnG,mDAAsD;AACtD,qEAA6D;AAC7D,2FAA6D;AAI7D,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,uBAAuB,CAAC,CAAC;AAmBzC,MAAM,KAAK,GAAG,CAAC,KAAoB,EAAE,EAAE;IACnC,MAAM,EACF,KAAK,EACL,MAAM,EACN,eAAe,EACf,UAAU,EACV,UAAU,EAAE,gBAAgB,EAC5B,0BAA0B,EAC1B,cAAc,EACd,SAAS,EACT,mBAAmB,EACnB,gBAAgB,EAChB,EAAE,EACF,KAAK,GACR,GAAG,KAAK,CAAC;IAEV,MAAM,YAAY,GAAG,IAAA,uBAAe,EAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;IAEnD,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEjD,KAAK,CAAC,mBAAmB,CAAC,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IAE5D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,GAAG,IAAI,GAAG,CAAC,OAAO,EAAE,CAAC;YACrB,
|
|
1
|
+
{"version":3,"file":"Video.js","sourceRoot":"../../../../../src","sources":["components/Media/Video/Video.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {MediaComponentVideoProps, MediaVideoType, PlayButtonProps, QAProps} from '../../../models';\nimport {block, getQaAttrubutes} from '../../../utils';\nimport {DefaultVideo} from '../../DefaultVideo/DefaultVideo';\nimport ReactPlayerBlock from '../../ReactPlayer/ReactPlayer';\n\nimport './Video.scss';\n\nconst b = block('media-component-video');\n\nexport interface VideoAdditionProps {\n playButton?: PlayButtonProps;\n customBarControlsClassName?: string;\n videoClassName?: string;\n playVideo?: boolean;\n}\n\ninterface InnerVideoProps {\n setHasVideoFallback: React.Dispatch<boolean>;\n hasVideoFallback: boolean;\n}\n\nexport type VideoAllProps = VideoAdditionProps &\n MediaComponentVideoProps &\n InnerVideoProps &\n QAProps;\n\nconst Video = (props: VideoAllProps) => {\n const {\n video,\n height,\n analyticsEvents,\n previewImg,\n playButton: commonPlayButton,\n customBarControlsClassName,\n videoClassName,\n playVideo,\n setHasVideoFallback,\n hasVideoFallback,\n qa,\n ratio,\n } = props;\n\n const qaAttributes = getQaAttrubutes(qa, 'source');\n\n const ref = React.useRef<HTMLVideoElement>(null);\n\n React.useImperativeHandle(video.ref, () => ref.current, []);\n\n React.useEffect(() => {\n if (ref && ref.current) {\n if (playVideo) {\n ref.current.play().catch(() => setHasVideoFallback(true));\n }\n }\n }, [playVideo, video, setHasVideoFallback]);\n\n const reactPlayerBlock = React.useMemo(() => {\n const {\n src,\n loop,\n controls,\n muted,\n autoplay = true,\n elapsedTime,\n playButton,\n ariaLabel,\n customControlsOptions,\n contain,\n } = video;\n\n return (\n <ReactPlayerBlock\n ref={ref}\n className={b('react-player', videoClassName)}\n src={src}\n previewImgUrl={previewImg}\n loop={loop}\n controls={controls}\n muted={muted}\n autoplay={autoplay && playVideo}\n elapsedTime={elapsedTime}\n playButton={playButton || commonPlayButton}\n customBarControlsClassName={customBarControlsClassName}\n analyticsEvents={analyticsEvents}\n height={height}\n ariaLabel={ariaLabel}\n customControlsOptions={customControlsOptions}\n ratio={ratio === 'auto' ? undefined : ratio}\n autoRatio={ratio === 'auto'}\n contain={contain}\n />\n );\n }, [\n video,\n height,\n videoClassName,\n previewImg,\n playVideo,\n commonPlayButton,\n customBarControlsClassName,\n analyticsEvents,\n ratio,\n ]);\n\n const defaultVideoBlock = React.useMemo(() => {\n return video.src.length && !hasVideoFallback ? (\n <div\n className={b('wrap', videoClassName)}\n style={{height}}\n data-qa={qaAttributes.default}\n >\n <DefaultVideo ref={ref} video={video} qa={qaAttributes.source} />\n </div>\n ) : null;\n }, [\n video,\n hasVideoFallback,\n videoClassName,\n height,\n qaAttributes.default,\n qaAttributes.source,\n ]);\n\n switch (video.type) {\n case MediaVideoType.Player:\n return reactPlayerBlock;\n case MediaVideoType.Default:\n default:\n return defaultVideoBlock;\n }\n};\n\nexport default Video;\n"]}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ClassNameProps, MediaVideoProps, ReactPlayerBlockHandler } from "../../models/index.js";
|
|
3
|
-
export interface ReactPlayerBlockProps extends Omit<MediaVideoProps, '
|
|
3
|
+
export interface ReactPlayerBlockProps extends Omit<MediaVideoProps, 'src' | 'ref'>, ClassNameProps {
|
|
4
4
|
src: string | string[];
|
|
5
5
|
previewImgUrl?: string;
|
|
6
|
-
loop?: boolean;
|
|
7
6
|
customBarControlsClassName?: string;
|
|
8
7
|
showPreview?: boolean;
|
|
9
8
|
onClickPreview?: () => void;
|