@alfalab/core-components-gallery 7.3.0 → 7.4.0-alfasans
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/Component.d.ts +5 -1
- package/Component.js +2 -1
- package/Component.js.map +1 -1
- package/components/bottom-button/index.css +5 -5
- package/components/bottom-button/index.module.css.js +1 -1
- package/components/buttons/index.css +5 -5
- package/components/buttons/index.d.ts +3 -0
- package/components/buttons/index.js +7 -0
- package/components/buttons/index.js.map +1 -1
- package/components/buttons/index.module.css.js +1 -1
- package/components/header/Component.js +3 -2
- package/components/header/Component.js.map +1 -1
- package/components/header/index.css +1 -1
- package/components/header/index.module.css.js +1 -1
- package/components/header-info-block/index.css +4 -4
- package/components/header-info-block/index.module.css.js +1 -1
- package/components/header-mobile/Component.js +2 -1
- package/components/header-mobile/Component.js.map +1 -1
- package/components/header-mobile/index.css +6 -6
- package/components/header-mobile/index.module.css.js +1 -1
- package/components/image-preview/index.css +17 -17
- package/components/image-preview/index.module.css.js +1 -1
- package/components/image-viewer/index.css +28 -28
- package/components/image-viewer/index.module.css.js +1 -1
- package/components/image-viewer/video/index.css +9 -9
- package/components/image-viewer/video/index.module.css.js +1 -1
- package/components/info-bar/index.css +3 -3
- package/components/info-bar/index.module.css.js +1 -1
- package/components/navigation-bar/index.css +10 -10
- package/components/navigation-bar/index.module.css.js +1 -1
- package/components/subtitles/index.css +3 -3
- package/components/subtitles/index.module.css.js +1 -1
- package/context.d.ts +2 -1
- package/context.js.map +1 -1
- package/cssm/Component.d.ts +5 -1
- package/cssm/Component.js +2 -1
- package/cssm/Component.js.map +1 -1
- package/cssm/components/buttons/index.d.ts +3 -0
- package/cssm/components/buttons/index.js +7 -0
- package/cssm/components/buttons/index.js.map +1 -1
- package/cssm/components/header/Component.js +3 -2
- package/cssm/components/header/Component.js.map +1 -1
- package/cssm/components/header-mobile/Component.js +2 -1
- package/cssm/components/header-mobile/Component.js.map +1 -1
- package/cssm/context.d.ts +2 -1
- package/cssm/context.js.map +1 -1
- package/cssm/index.d.ts +1 -0
- package/cssm/types.d.ts +6 -0
- package/cssm/utils/constants.d.ts +1 -0
- package/cssm/utils/constants.js +1 -0
- package/cssm/utils/constants.js.map +1 -1
- package/esm/Component.d.ts +5 -1
- package/esm/Component.js +2 -1
- package/esm/Component.js.map +1 -1
- package/esm/components/bottom-button/index.css +5 -5
- package/esm/components/bottom-button/index.module.css.js +1 -1
- package/esm/components/buttons/index.css +5 -5
- package/esm/components/buttons/index.d.ts +3 -0
- package/esm/components/buttons/index.js +7 -1
- package/esm/components/buttons/index.js.map +1 -1
- package/esm/components/buttons/index.module.css.js +1 -1
- package/esm/components/header/Component.js +4 -3
- package/esm/components/header/Component.js.map +1 -1
- package/esm/components/header/index.css +1 -1
- package/esm/components/header/index.module.css.js +1 -1
- package/esm/components/header-info-block/index.css +4 -4
- package/esm/components/header-info-block/index.module.css.js +1 -1
- package/esm/components/header-mobile/Component.js +4 -3
- package/esm/components/header-mobile/Component.js.map +1 -1
- package/esm/components/header-mobile/index.css +6 -6
- package/esm/components/header-mobile/index.module.css.js +1 -1
- package/esm/components/image-preview/index.css +17 -17
- package/esm/components/image-preview/index.module.css.js +1 -1
- package/esm/components/image-viewer/index.css +28 -28
- package/esm/components/image-viewer/index.module.css.js +1 -1
- package/esm/components/image-viewer/video/index.css +9 -9
- package/esm/components/image-viewer/video/index.module.css.js +1 -1
- package/esm/components/info-bar/index.css +3 -3
- package/esm/components/info-bar/index.module.css.js +1 -1
- package/esm/components/navigation-bar/index.css +10 -10
- package/esm/components/navigation-bar/index.module.css.js +1 -1
- package/esm/components/subtitles/index.css +3 -3
- package/esm/components/subtitles/index.module.css.js +1 -1
- package/esm/context.d.ts +2 -1
- package/esm/context.js.map +1 -1
- package/esm/index.css +9 -9
- package/esm/index.d.ts +1 -0
- package/esm/index.module.css.js +1 -1
- package/esm/types.d.ts +6 -0
- package/esm/utils/constants.d.ts +1 -0
- package/esm/utils/constants.js +1 -0
- package/esm/utils/constants.js.map +1 -1
- package/index.css +9 -9
- package/index.d.ts +1 -0
- package/index.module.css.js +1 -1
- package/modern/Component.d.ts +5 -1
- package/modern/Component.js +2 -1
- package/modern/Component.js.map +1 -1
- package/modern/components/bottom-button/index.css +5 -5
- package/modern/components/bottom-button/index.module.css.js +1 -1
- package/modern/components/buttons/index.css +5 -5
- package/modern/components/buttons/index.d.ts +3 -0
- package/modern/components/buttons/index.js +6 -1
- package/modern/components/buttons/index.js.map +1 -1
- package/modern/components/buttons/index.module.css.js +1 -1
- package/modern/components/header/Component.js +3 -2
- package/modern/components/header/Component.js.map +1 -1
- package/modern/components/header/index.css +1 -1
- package/modern/components/header/index.module.css.js +1 -1
- package/modern/components/header-info-block/index.css +4 -4
- package/modern/components/header-info-block/index.module.css.js +1 -1
- package/modern/components/header-mobile/Component.js +3 -2
- package/modern/components/header-mobile/Component.js.map +1 -1
- package/modern/components/header-mobile/index.css +6 -6
- package/modern/components/header-mobile/index.module.css.js +1 -1
- package/modern/components/image-preview/index.css +17 -17
- package/modern/components/image-preview/index.module.css.js +1 -1
- package/modern/components/image-viewer/index.css +28 -28
- package/modern/components/image-viewer/index.module.css.js +1 -1
- package/modern/components/image-viewer/video/index.css +9 -9
- package/modern/components/image-viewer/video/index.module.css.js +1 -1
- package/modern/components/info-bar/index.css +3 -3
- package/modern/components/info-bar/index.module.css.js +1 -1
- package/modern/components/navigation-bar/index.css +10 -10
- package/modern/components/navigation-bar/index.module.css.js +1 -1
- package/modern/components/subtitles/index.css +3 -3
- package/modern/components/subtitles/index.module.css.js +1 -1
- package/modern/context.d.ts +2 -1
- package/modern/context.js.map +1 -1
- package/modern/index.css +9 -9
- package/modern/index.d.ts +1 -0
- package/modern/index.module.css.js +1 -1
- package/modern/types.d.ts +6 -0
- package/modern/utils/constants.d.ts +1 -0
- package/modern/utils/constants.js +1 -0
- package/modern/utils/constants.js.map +1 -1
- package/moderncssm/Component.d.ts +5 -1
- package/moderncssm/Component.js +2 -1
- package/moderncssm/Component.js.map +1 -1
- package/moderncssm/components/buttons/index.d.ts +3 -0
- package/moderncssm/components/buttons/index.js +6 -1
- package/moderncssm/components/buttons/index.js.map +1 -1
- package/moderncssm/components/header/Component.js +3 -2
- package/moderncssm/components/header/Component.js.map +1 -1
- package/moderncssm/components/header-mobile/Component.js +3 -2
- package/moderncssm/components/header-mobile/Component.js.map +1 -1
- package/moderncssm/context.d.ts +2 -1
- package/moderncssm/context.js.map +1 -1
- package/moderncssm/index.d.ts +1 -0
- package/moderncssm/types.d.ts +6 -0
- package/moderncssm/utils/constants.d.ts +1 -0
- package/moderncssm/utils/constants.js +1 -0
- package/moderncssm/utils/constants.js.map +1 -1
- package/package.json +12 -12
- package/src/Component.tsx +8 -1
- package/src/components/buttons/index.tsx +24 -0
- package/src/components/header/Component.tsx +5 -0
- package/src/components/header-mobile/Component.tsx +4 -0
- package/src/context.ts +2 -1
- package/src/index.ts +1 -0
- package/src/types.ts +8 -0
- package/src/utils/constants.ts +1 -0
- package/types.d.ts +6 -0
- package/utils/constants.d.ts +1 -0
- package/utils/constants.js +1 -0
- package/utils/constants.js.map +1 -1
|
@@ -7,19 +7,19 @@
|
|
|
7
7
|
:root {
|
|
8
8
|
--gap-32: 32px;
|
|
9
9
|
}
|
|
10
|
-
.
|
|
10
|
+
.gallery__buttons_17tmt {
|
|
11
11
|
display: flex;
|
|
12
12
|
padding-left: var(--gap-32);
|
|
13
13
|
}
|
|
14
|
-
.
|
|
14
|
+
.gallery__buttons_17tmt path {
|
|
15
15
|
color: var(--color-static-neutral-translucent-1300-inverted);
|
|
16
16
|
}
|
|
17
|
-
.
|
|
17
|
+
.gallery__iconButton_17tmt path {
|
|
18
18
|
color: var(--color-static-neutral-100);
|
|
19
19
|
}
|
|
20
|
-
.
|
|
20
|
+
.gallery__iconButton_17tmt:hover path {
|
|
21
21
|
color: var(--color-static-neutral-100-hover);
|
|
22
22
|
}
|
|
23
|
-
.
|
|
23
|
+
.gallery__iconButton_17tmt:active path {
|
|
24
24
|
color: var(--color-static-neutral-100-press);
|
|
25
25
|
}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { type FC, type MutableRefObject } from 'react';
|
|
2
2
|
import { type IconButtonProps } from '@alfalab/core-components-icon-button/esm';
|
|
3
|
+
import { type GalleryCustomButton } from '../../types';
|
|
3
4
|
type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
|
|
4
5
|
buttonRef?: MutableRefObject<HTMLButtonElement | null>;
|
|
5
6
|
download?: string | boolean;
|
|
6
7
|
};
|
|
8
|
+
type CustomButtonProps = GalleryCustomButton & Props;
|
|
7
9
|
export declare const Fullscreen: FC<Props>;
|
|
8
10
|
export declare const BackArrow: FC<Props>;
|
|
9
11
|
export declare const Play: FC<Props>;
|
|
@@ -15,5 +17,6 @@ export declare const Download: FC<Props & {
|
|
|
15
17
|
href?: string;
|
|
16
18
|
}>;
|
|
17
19
|
export declare const Share: FC<Props>;
|
|
20
|
+
export declare const CustomButton: FC<CustomButtonProps>;
|
|
18
21
|
export declare const Exit: FC<Props>;
|
|
19
22
|
export {};
|
|
@@ -88,7 +88,13 @@ var Share = function (props) {
|
|
|
88
88
|
var iconButton = (React.createElement(IconButton, __assign({}, props, { icon: ShareMIcon, "aria-label": '\u041F\u043E\u0434\u0435\u043B\u0438\u0442\u044C\u0441\u044F', className: styles.iconButton })));
|
|
89
89
|
return isDesktop ? (React.createElement(TooltipDesktop, { view: 'hint', colors: 'inverted', trigger: 'hover', position: 'bottom', content: '\u041F\u043E\u0434\u0435\u043B\u0438\u0442\u044C\u0441\u044F', fallbackPlacements: ['bottom-end'] }, iconButton)) : (iconButton);
|
|
90
90
|
};
|
|
91
|
+
var CustomButton = function (_a) {
|
|
92
|
+
var text = _a.text, icon = _a.icon, restProps = __rest(_a, ["text", "icon"]);
|
|
93
|
+
var isDesktop = useIsDesktop();
|
|
94
|
+
var iconButton = (React.createElement(IconButton, __assign({}, restProps, { icon: icon, "aria-label": text, className: styles.iconButton })));
|
|
95
|
+
return isDesktop ? (React.createElement(TooltipDesktop, { trigger: 'hover', position: 'bottom', content: text, fallbackPlacements: ['bottom-end'] }, iconButton)) : (iconButton);
|
|
96
|
+
};
|
|
91
97
|
var Exit = function (props) { return (React.createElement(IconButton, __assign({}, props, { icon: CrossMIcon, "aria-label": '\u0417\u0430\u043A\u0440\u044B\u0442\u044C', className: styles.iconButton }))); };
|
|
92
98
|
|
|
93
|
-
export { BackArrow, Download, Exit, ExitFullscreen, Fullscreen, MuteVideo, Pause, Play, Share, UnmuteVideo };
|
|
99
|
+
export { BackArrow, CustomButton, Download, Exit, ExitFullscreen, Fullscreen, MuteVideo, Pause, Play, Share, UnmuteVideo };
|
|
94
100
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/components/buttons/index.tsx"],"sourcesContent":["import React, { type FC, type MutableRefObject } from 'react';\nimport cn from 'classnames';\n\nimport { IconButton, type IconButtonProps } from '@alfalab/core-components-icon-button';\nimport { useIsDesktop } from '@alfalab/core-components-mq';\nimport { TooltipDesktop } from '@alfalab/core-components-tooltip/desktop';\nimport { ArrowLeftMIcon } from '@alfalab/icons-glyph/ArrowLeftMIcon';\nimport { ArrowsInwardMIcon } from '@alfalab/icons-glyph/ArrowsInwardMIcon';\nimport { ArrowsOutwardMIcon } from '@alfalab/icons-glyph/ArrowsOutwardMIcon';\nimport { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';\nimport { PauseCompactMIcon } from '@alfalab/icons-glyph/PauseCompactMIcon';\nimport { PlayCompactMIcon } from '@alfalab/icons-glyph/PlayCompactMIcon';\nimport { PointerDownMIcon } from '@alfalab/icons-glyph/PointerDownMIcon';\nimport { ShareMIcon } from '@alfalab/icons-glyph/ShareMIcon';\nimport { SoundCrossMIcon } from '@alfalab/icons-glyph/SoundCrossMIcon';\nimport { SoundMIcon } from '@alfalab/icons-glyph/SoundMIcon';\n\nimport { downloadFile, isVideo } from '../../utils';\n\nimport styles from './index.module.css';\n\ntype Props = Omit<IconButtonProps, 'icon' | 'colors'> & {\n buttonRef?: MutableRefObject<HTMLButtonElement | null>;\n download?: string | boolean;\n};\n\nexport const Fullscreen: FC<Props> = ({ buttonRef, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsOutwardMIcon}\n aria-label='Открыть в полноэкранном режиме'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Открыть в полноэкранном режиме'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const BackArrow: FC<Props> = ({ buttonRef, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowLeftMIcon}\n aria-label='Вернуться назад'\n className={styles.iconButton}\n />\n);\n\nexport const Play: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={PlayCompactMIcon}\n aria-label='Проиграть видео'\n className={cn(styles.iconButton, className)}\n />\n);\n\nexport const Pause: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={PauseCompactMIcon}\n aria-label='Поставить паузу на видео'\n className={cn(styles.iconButton, className)}\n />\n);\n\nexport const ExitFullscreen: FC<Props> = ({ buttonRef, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsInwardMIcon}\n aria-label='Выйти из полноэкранного режима'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Выйти из полноэкранного режима'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const MuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundMIcon}\n aria-label='Выключить звук'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Выключить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const UnmuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundCrossMIcon}\n aria-label='Включить звук'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Включить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Download: FC<Props & { href?: string }> = ({ href, ...props }) => {\n const isDesktop = useIsDesktop();\n\n const handleMobileVideoDownload = async (e: React.MouseEvent) => {\n e.preventDefault();\n\n if (!href) return;\n\n const fileName = props.download?.toString() || 'video';\n const fileType = isVideo(href) ? 'video/*' : undefined;\n\n await downloadFile({\n url: href,\n fileName,\n fileType,\n });\n };\n\n const iconButtonProps = {\n ...props,\n icon: PointerDownMIcon,\n 'aria-label': 'Скачать' as const,\n className: styles.iconButton,\n };\n\n const iconButton =\n !isDesktop && isVideo(href) ? (\n <IconButton {...iconButtonProps} onClick={handleMobileVideoDownload} />\n ) : (\n <IconButton {...iconButtonProps} href={href} />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Скачать'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Share: FC<Props> = (props) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...props}\n icon={ShareMIcon}\n aria-label='Поделиться'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Поделиться'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Exit: FC<Props> = (props) => (\n <IconButton {...props} icon={CrossMIcon} aria-label='Закрыть' className={styles.iconButton} />\n);\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/buttons/index.tsx"],"sourcesContent":["import React, { type FC, type MutableRefObject } from 'react';\nimport cn from 'classnames';\n\nimport { IconButton, type IconButtonProps } from '@alfalab/core-components-icon-button';\nimport { useIsDesktop } from '@alfalab/core-components-mq';\nimport { TooltipDesktop } from '@alfalab/core-components-tooltip/desktop';\nimport { ArrowLeftMIcon } from '@alfalab/icons-glyph/ArrowLeftMIcon';\nimport { ArrowsInwardMIcon } from '@alfalab/icons-glyph/ArrowsInwardMIcon';\nimport { ArrowsOutwardMIcon } from '@alfalab/icons-glyph/ArrowsOutwardMIcon';\nimport { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';\nimport { PauseCompactMIcon } from '@alfalab/icons-glyph/PauseCompactMIcon';\nimport { PlayCompactMIcon } from '@alfalab/icons-glyph/PlayCompactMIcon';\nimport { PointerDownMIcon } from '@alfalab/icons-glyph/PointerDownMIcon';\nimport { ShareMIcon } from '@alfalab/icons-glyph/ShareMIcon';\nimport { SoundCrossMIcon } from '@alfalab/icons-glyph/SoundCrossMIcon';\nimport { SoundMIcon } from '@alfalab/icons-glyph/SoundMIcon';\n\nimport { type GalleryCustomButton } from '../../types';\nimport { downloadFile, isVideo } from '../../utils';\n\nimport styles from './index.module.css';\n\ntype Props = Omit<IconButtonProps, 'icon' | 'colors'> & {\n buttonRef?: MutableRefObject<HTMLButtonElement | null>;\n download?: string | boolean;\n};\n\ntype CustomButtonProps = GalleryCustomButton & Props;\n\nexport const Fullscreen: FC<Props> = ({ buttonRef, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsOutwardMIcon}\n aria-label='Открыть в полноэкранном режиме'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Открыть в полноэкранном режиме'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const BackArrow: FC<Props> = ({ buttonRef, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowLeftMIcon}\n aria-label='Вернуться назад'\n className={styles.iconButton}\n />\n);\n\nexport const Play: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={PlayCompactMIcon}\n aria-label='Проиграть видео'\n className={cn(styles.iconButton, className)}\n />\n);\n\nexport const Pause: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={PauseCompactMIcon}\n aria-label='Поставить паузу на видео'\n className={cn(styles.iconButton, className)}\n />\n);\n\nexport const ExitFullscreen: FC<Props> = ({ buttonRef, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsInwardMIcon}\n aria-label='Выйти из полноэкранного режима'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Выйти из полноэкранного режима'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const MuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundMIcon}\n aria-label='Выключить звук'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Выключить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const UnmuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundCrossMIcon}\n aria-label='Включить звук'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Включить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Download: FC<Props & { href?: string }> = ({ href, ...props }) => {\n const isDesktop = useIsDesktop();\n\n const handleMobileVideoDownload = async (e: React.MouseEvent) => {\n e.preventDefault();\n\n if (!href) return;\n\n const fileName = props.download?.toString() || 'video';\n const fileType = isVideo(href) ? 'video/*' : undefined;\n\n await downloadFile({\n url: href,\n fileName,\n fileType,\n });\n };\n\n const iconButtonProps = {\n ...props,\n icon: PointerDownMIcon,\n 'aria-label': 'Скачать' as const,\n className: styles.iconButton,\n };\n\n const iconButton =\n !isDesktop && isVideo(href) ? (\n <IconButton {...iconButtonProps} onClick={handleMobileVideoDownload} />\n ) : (\n <IconButton {...iconButtonProps} href={href} />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Скачать'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Share: FC<Props> = (props) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton\n {...props}\n icon={ShareMIcon}\n aria-label='Поделиться'\n className={styles.iconButton}\n />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n view='hint'\n colors='inverted'\n trigger='hover'\n position='bottom'\n content='Поделиться'\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const CustomButton: FC<CustomButtonProps> = ({ text, icon, ...restProps }) => {\n const isDesktop = useIsDesktop();\n\n const iconButton = (\n <IconButton {...restProps} icon={icon} aria-label={text} className={styles.iconButton} />\n );\n\n return isDesktop ? (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content={text}\n fallbackPlacements={['bottom-end']}\n >\n {iconButton}\n </TooltipDesktop>\n ) : (\n iconButton\n );\n};\n\nexport const Exit: FC<Props> = (props) => (\n <IconButton {...props} icon={CrossMIcon} aria-label='Закрыть' className={styles.iconButton} />\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AA6BO,IAAM,UAAU,GAAc,UAAC,EAA2B,EAAA;AAAzB,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EAAK,SAAS,GAAA,MAAA,CAAA,EAAA,EAAzB,aAA2B,CAAF;AAC3D,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAC,CAAA,aAAA,CAAA,UAAU,eACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,kBAAkB,EACb,YAAA,EAAA,uKAAgC,EAC3C,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA,CACL;AAED,IAAA,OAAO,SAAS,IACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,uKAAgC,EACxC,kBAAkB,EAAE,CAAC,YAAY,CAAC,IAEjC,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,SAAS,GAAc,UAAC,EAA2B,EAAA;AAAzB,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EAAK,SAAS,GAAA,MAAA,CAAA,EAAA,EAAzB,aAA2B,CAAF;IAAO,QACjE,oBAAC,UAAU,EAAA,QAAA,CAAA,EAAA,EACH,SAAS,EACb,EAAA,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,cAAc,EAAA,YAAA,EACT,uFAAiB,EAC5B,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA;;AAGC,IAAM,IAAI,GAAc,UAAC,EAAsC,EAAA;IAApC,IAAA,SAAS,eAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApC,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAsC,CAAF;AAAO,IAAA,QACvE,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,QAAA,CAAA,EAAA,EACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,gBAAgB,EAAA,YAAA,EACX,uFAAiB,EAC5B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,SAAS,CAAC,EAC7C,CAAA,CAAA;;AAGC,IAAM,KAAK,GAAc,UAAC,EAAsC,EAAA;IAApC,IAAA,SAAS,eAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApC,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAsC,CAAF;AAAO,IAAA,QACxE,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,QAAA,CAAA,EAAA,EACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,iBAAiB,EAAA,YAAA,EACZ,mIAA0B,EACrC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,UAAU,EAAE,SAAS,CAAC,EAC7C,CAAA,CAAA;;AAGC,IAAM,cAAc,GAAc,UAAC,EAA2B,EAAA;AAAzB,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EAAK,SAAS,GAAA,MAAA,CAAA,EAAA,EAAzB,aAA2B,CAAF;AAC/D,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAC,CAAA,aAAA,CAAA,UAAU,eACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,iBAAiB,EACZ,YAAA,EAAA,uKAAgC,EAC3C,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA,CACL;AAED,IAAA,OAAO,SAAS,IACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,uKAAgC,EACxC,kBAAkB,EAAE,CAAC,YAAY,CAAC,IAEjC,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,SAAS,GAAc,UAAC,EAAsC,EAAA;IAApC,IAAA,SAAS,eAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApC,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAsC,CAAF;AACrE,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAC,CAAA,aAAA,CAAA,UAAU,eACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,UAAU,EACL,YAAA,EAAA,iFAAgB,EAC3B,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA,CACL;IAED,OAAO,SAAS,IACZ,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,iFAAgB,EACxB,kBAAkB,EAAE,CAAC,YAAY,CAAC,EAClC,eAAe,EAAE,SAAS,EAEzB,EAAA,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,WAAW,GAAc,UAAC,EAAsC,EAAA;IAApC,IAAA,SAAS,eAAA,EAAE,SAAS,eAAA,EAAK,SAAS,GAApC,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,WAAA,CAAsC,CAAF;AACvE,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAC,CAAA,aAAA,CAAA,UAAU,eACH,SAAS,EAAA,EACb,GAAG,EAAE,SAAS,EACd,IAAI,EAAE,eAAe,EACV,YAAA,EAAA,2EAAe,EAC1B,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA,CACL;IAED,OAAO,SAAS,IACZ,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,2EAAe,EACvB,kBAAkB,EAAE,CAAC,YAAY,CAAC,EAClC,eAAe,EAAE,SAAS,EAEzB,EAAA,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,QAAQ,GAAkC,UAAC,EAAkB,EAAA;AAAhB,IAAA,IAAA,IAAI,GAAA,EAAA,CAAA,IAAA,EAAK,KAAK,GAAA,MAAA,CAAA,EAAA,EAAhB,QAAkB,CAAF;AACpE,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,yBAAyB,GAAG,UAAO,CAAmB,EAAA,EAAA,OAAA,SAAA,CAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,YAAA;;;;;;oBACxD,CAAC,CAAC,cAAc,EAAE;AAElB,oBAAA,IAAI,CAAC,IAAI;wBAAE,OAAO,CAAA,CAAA,YAAA;oBAEZ,QAAQ,GAAG,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,KAAI,OAAO;AAChD,oBAAA,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,SAAS,GAAG,SAAS;AAEtD,oBAAA,OAAA,CAAA,CAAA,YAAM,YAAY,CAAC;AACf,4BAAA,GAAG,EAAE,IAAI;AACT,4BAAA,QAAQ,EAAA,QAAA;AACR,4BAAA,QAAQ,EAAA,QAAA;AACX,yBAAA,CAAC,CAAA;;AAJF,oBAAA,EAAA,CAAA,IAAA,EAIE;;;;SACL;AAED,IAAA,IAAM,eAAe,GACd,QAAA,CAAA,QAAA,CAAA,EAAA,EAAA,KAAK,KACR,IAAI,EAAE,gBAAgB,EACtB,YAAY,EAAE,SAAkB,EAChC,SAAS,EAAE,MAAM,CAAC,UAAU,GAC/B;AAED,IAAA,IAAM,UAAU,GACZ,CAAC,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC,IACvB,KAAC,CAAA,aAAA,CAAA,UAAU,eAAK,eAAe,EAAA,EAAE,OAAO,EAAE,yBAAyB,EAAI,CAAA,CAAA,KAEvE,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,QAAA,CAAA,EAAA,EAAK,eAAe,EAAE,EAAA,IAAI,EAAE,IAAI,EAAA,CAAA,CAAI,CAClD;AAEL,IAAA,OAAO,SAAS,IACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,4CAAS,EACjB,kBAAkB,EAAE,CAAC,YAAY,CAAC,IAEjC,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,KAAK,GAAc,UAAC,KAAK,EAAA;AAClC,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAA,CAAA,aAAA,CAAC,UAAU,EACH,QAAA,CAAA,EAAA,EAAA,KAAK,IACT,IAAI,EAAE,UAAU,EACL,YAAA,EAAA,8DAAY,EACvB,SAAS,EAAE,MAAM,CAAC,UAAU,EAC9B,CAAA,CAAA,CACL;AAED,IAAA,OAAO,SAAS,IACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EACX,EAAA,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,UAAU,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,8DAAY,EACpB,kBAAkB,EAAE,CAAC,YAAY,CAAC,IAEjC,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,YAAY,GAA0B,UAAC,EAA4B,EAAA;IAA1B,IAAA,IAAI,UAAA,EAAE,IAAI,UAAA,EAAK,SAAS,GAA1B,MAAA,CAAA,EAAA,EAAA,CAAA,MAAA,EAAA,MAAA,CAA4B,CAAF;AAC1E,IAAA,IAAM,SAAS,GAAG,YAAY,EAAE;IAEhC,IAAM,UAAU,IACZ,KAAA,CAAA,aAAA,CAAC,UAAU,EAAK,QAAA,CAAA,EAAA,EAAA,SAAS,IAAE,IAAI,EAAE,IAAI,EAAc,YAAA,EAAA,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,EAAI,CAAA,CAAA,CAC5F;AAED,IAAA,OAAO,SAAS,IACZ,KAAC,CAAA,aAAA,CAAA,cAAc,EACX,EAAA,OAAO,EAAC,OAAO,EACf,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAE,IAAI,EACb,kBAAkB,EAAE,CAAC,YAAY,CAAC,EAEjC,EAAA,UAAU,CACE,KAEjB,UAAU,CACb;AACL;AAEO,IAAM,IAAI,GAAc,UAAC,KAAK,EAAK,EAAA,QACtC,KAAA,CAAA,aAAA,CAAC,UAAU,EAAA,QAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,IAAI,EAAE,UAAU,EAAA,YAAA,EAAa,4CAAS,EAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAA,CAAA,CAAI,EACjG;;;;"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
+
import { __assign } from 'tslib';
|
|
1
2
|
import React, { useContext, useRef, useEffect } from 'react';
|
|
2
3
|
import { GalleryContext } from '../../context.js';
|
|
3
4
|
import { isSmallImage, isVideo } from '../../utils/utils.js';
|
|
4
5
|
import { TestIds } from '../../utils/constants.js';
|
|
5
|
-
import '
|
|
6
|
-
import { Download, Exit, UnmuteVideo, MuteVideo, ExitFullscreen, Fullscreen } from '../buttons/index.js';
|
|
6
|
+
import { Download, CustomButton, Exit, UnmuteVideo, MuteVideo, ExitFullscreen, Fullscreen } from '../buttons/index.js';
|
|
7
7
|
import { HeaderInfoBlock } from '../header-info-block/Component.js';
|
|
8
8
|
import styles from './index.module.css.js';
|
|
9
9
|
|
|
10
10
|
var Header = function () {
|
|
11
11
|
var _a;
|
|
12
|
-
var _b = useContext(GalleryContext), currentSlideIndex = _b.currentSlideIndex, singleSlide = _b.singleSlide, images = _b.images, fullScreen = _b.fullScreen, getCurrentImageMeta = _b.getCurrentImageMeta, getCurrentImage = _b.getCurrentImage, setFullScreen = _b.setFullScreen, onClose = _b.onClose, mutedVideo = _b.mutedVideo, setMutedVideo = _b.setMutedVideo;
|
|
12
|
+
var _b = useContext(GalleryContext), currentSlideIndex = _b.currentSlideIndex, singleSlide = _b.singleSlide, images = _b.images, fullScreen = _b.fullScreen, getCurrentImageMeta = _b.getCurrentImageMeta, getCurrentImage = _b.getCurrentImage, setFullScreen = _b.setFullScreen, onClose = _b.onClose, mutedVideo = _b.mutedVideo, setMutedVideo = _b.setMutedVideo, customButton = _b.customButton;
|
|
13
13
|
var currentImage = getCurrentImage();
|
|
14
14
|
var meta = getCurrentImageMeta();
|
|
15
15
|
var toggleFullScreenButton = useRef(null);
|
|
@@ -52,6 +52,7 @@ var Header = function () {
|
|
|
52
52
|
isVideo(currentImage === null || currentImage === void 0 ? void 0 : currentImage.src) && renderToggleMuteVideo(),
|
|
53
53
|
showFullScreenButton && renderToggleFullScreenButton(),
|
|
54
54
|
showDownloadButton && (React.createElement(Download, { href: currentImage === null || currentImage === void 0 ? void 0 : currentImage.src, download: currentImage === null || currentImage === void 0 ? void 0 : currentImage.name, dataTestId: TestIds.DOWNLOAD_BUTTON })),
|
|
55
|
+
customButton && (React.createElement(CustomButton, __assign({}, customButton, { dataTestId: TestIds.CUSTOM_BUTTON }))),
|
|
55
56
|
React.createElement(Exit, { onClick: onClose, dataTestId: TestIds.CLOSE_BUTTON }))));
|
|
56
57
|
};
|
|
57
58
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/header/Component.tsx"],"sourcesContent":["import React, { type FC, useContext, useEffect, useRef } from 'react';\n\nimport { GalleryContext } from '../../context';\nimport { isSmallImage, isVideo, TestIds } from '../../utils';\nimport * as Buttons from '../buttons';\nimport { HeaderInfoBlock } from '../header-info-block';\n\nimport styles from './index.module.css';\n\nexport const Header: FC = () => {\n const {\n currentSlideIndex,\n singleSlide,\n images,\n fullScreen,\n getCurrentImageMeta,\n getCurrentImage,\n setFullScreen,\n onClose,\n mutedVideo,\n setMutedVideo,\n } = useContext(GalleryContext);\n\n const currentImage = getCurrentImage();\n const meta = getCurrentImageMeta();\n\n const toggleFullScreenButton = useRef<HTMLButtonElement>(null);\n\n const onMuteButtonClick = () => {\n if (currentImage) {\n if (mutedVideo && currentImage.onUnmute) {\n currentImage.onUnmute();\n } else if (currentImage.onMute) {\n currentImage.onMute();\n }\n }\n setMutedVideo(!mutedVideo);\n };\n\n const closeFullScreen = () => {\n setFullScreen(false);\n };\n\n const openFullScreen = () => {\n setFullScreen(true);\n };\n\n useEffect(() => {\n if (toggleFullScreenButton.current) {\n toggleFullScreenButton.current.focus();\n }\n }, [fullScreen]);\n\n const canDownload = currentImage?.canDownload ?? true;\n const filename = currentImage?.name || '';\n const description =\n singleSlide || !images.length ? '' : `${currentSlideIndex + 1} из ${images.length}`;\n\n const showFullScreenButton = !isSmallImage(meta) && !meta?.broken;\n const showDownloadButton = !meta?.broken && canDownload;\n\n const renderToggleFullScreenButton = () =>\n fullScreen ? (\n <Buttons.ExitFullscreen\n onClick={closeFullScreen}\n buttonRef={toggleFullScreenButton}\n dataTestId={TestIds.EXIT_FULLSCREEN_BUTTON}\n />\n ) : (\n <Buttons.Fullscreen\n onClick={openFullScreen}\n buttonRef={toggleFullScreenButton}\n dataTestId={TestIds.FULLSCREEN_BUTTON}\n />\n );\n\n const renderToggleMuteVideo = () =>\n mutedVideo ? (\n <Buttons.UnmuteVideo onClick={onMuteButtonClick} dataTestId={TestIds.UNMUTE_BUTTON} />\n ) : (\n <Buttons.MuteVideo onClick={onMuteButtonClick} dataTestId={TestIds.MUTE_BUTTON} />\n );\n\n return (\n <div className={styles.header}>\n <HeaderInfoBlock filename={filename} description={description} />\n\n <div className={styles.buttons}>\n {isVideo(currentImage?.src) && renderToggleMuteVideo()}\n {showFullScreenButton && renderToggleFullScreenButton()}\n\n {showDownloadButton && (\n <Buttons.Download\n href={currentImage?.src}\n download={currentImage?.name}\n dataTestId={TestIds.DOWNLOAD_BUTTON}\n />\n )}\n\n <Buttons.Exit onClick={onClose} dataTestId={TestIds.CLOSE_BUTTON} />\n </div>\n </div>\n );\n};\n"],"names":["Buttons.ExitFullscreen","Buttons.Fullscreen","Buttons.UnmuteVideo","Buttons.MuteVideo","Buttons.Download","Buttons.Exit"],"mappings":";;;;;;;;;AASa,IAAA,MAAM,GAAO,YAAA;;AAChB,IAAA,IAAA,
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/header/Component.tsx"],"sourcesContent":["import React, { type FC, useContext, useEffect, useRef } from 'react';\n\nimport { GalleryContext } from '../../context';\nimport { isSmallImage, isVideo, TestIds } from '../../utils';\nimport * as Buttons from '../buttons';\nimport { HeaderInfoBlock } from '../header-info-block';\n\nimport styles from './index.module.css';\n\nexport const Header: FC = () => {\n const {\n currentSlideIndex,\n singleSlide,\n images,\n fullScreen,\n getCurrentImageMeta,\n getCurrentImage,\n setFullScreen,\n onClose,\n mutedVideo,\n setMutedVideo,\n customButton,\n } = useContext(GalleryContext);\n\n const currentImage = getCurrentImage();\n const meta = getCurrentImageMeta();\n\n const toggleFullScreenButton = useRef<HTMLButtonElement>(null);\n\n const onMuteButtonClick = () => {\n if (currentImage) {\n if (mutedVideo && currentImage.onUnmute) {\n currentImage.onUnmute();\n } else if (currentImage.onMute) {\n currentImage.onMute();\n }\n }\n setMutedVideo(!mutedVideo);\n };\n\n const closeFullScreen = () => {\n setFullScreen(false);\n };\n\n const openFullScreen = () => {\n setFullScreen(true);\n };\n\n useEffect(() => {\n if (toggleFullScreenButton.current) {\n toggleFullScreenButton.current.focus();\n }\n }, [fullScreen]);\n\n const canDownload = currentImage?.canDownload ?? true;\n const filename = currentImage?.name || '';\n const description =\n singleSlide || !images.length ? '' : `${currentSlideIndex + 1} из ${images.length}`;\n\n const showFullScreenButton = !isSmallImage(meta) && !meta?.broken;\n const showDownloadButton = !meta?.broken && canDownload;\n\n const renderToggleFullScreenButton = () =>\n fullScreen ? (\n <Buttons.ExitFullscreen\n onClick={closeFullScreen}\n buttonRef={toggleFullScreenButton}\n dataTestId={TestIds.EXIT_FULLSCREEN_BUTTON}\n />\n ) : (\n <Buttons.Fullscreen\n onClick={openFullScreen}\n buttonRef={toggleFullScreenButton}\n dataTestId={TestIds.FULLSCREEN_BUTTON}\n />\n );\n\n const renderToggleMuteVideo = () =>\n mutedVideo ? (\n <Buttons.UnmuteVideo onClick={onMuteButtonClick} dataTestId={TestIds.UNMUTE_BUTTON} />\n ) : (\n <Buttons.MuteVideo onClick={onMuteButtonClick} dataTestId={TestIds.MUTE_BUTTON} />\n );\n\n return (\n <div className={styles.header}>\n <HeaderInfoBlock filename={filename} description={description} />\n\n <div className={styles.buttons}>\n {isVideo(currentImage?.src) && renderToggleMuteVideo()}\n {showFullScreenButton && renderToggleFullScreenButton()}\n\n {showDownloadButton && (\n <Buttons.Download\n href={currentImage?.src}\n download={currentImage?.name}\n dataTestId={TestIds.DOWNLOAD_BUTTON}\n />\n )}\n\n {customButton && (\n <Buttons.CustomButton {...customButton} dataTestId={TestIds.CUSTOM_BUTTON} />\n )}\n\n <Buttons.Exit onClick={onClose} dataTestId={TestIds.CLOSE_BUTTON} />\n </div>\n </div>\n );\n};\n"],"names":["Buttons.ExitFullscreen","Buttons.Fullscreen","Buttons.UnmuteVideo","Buttons.MuteVideo","Buttons.Download","Buttons.CustomButton","Buttons.Exit"],"mappings":"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"}
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--gap-4: 4px;
|
|
3
3
|
}
|
|
4
|
-
.
|
|
4
|
+
.gallery__info_guf6a {
|
|
5
5
|
height: 100%;
|
|
6
6
|
display: flex;
|
|
7
7
|
flex-direction: column;
|
|
8
8
|
justify-content: center;
|
|
9
9
|
overflow: hidden;
|
|
10
10
|
}
|
|
11
|
-
.
|
|
11
|
+
.gallery__filenameHead_guf6a {
|
|
12
12
|
display: inline;
|
|
13
13
|
text-overflow: ellipsis;
|
|
14
14
|
overflow: hidden;
|
|
15
15
|
white-space: nowrap;
|
|
16
16
|
}
|
|
17
|
-
.
|
|
17
|
+
.gallery__filenameContainer_guf6a {
|
|
18
18
|
overflow: hidden;
|
|
19
19
|
display: inline-flex;
|
|
20
20
|
}
|
|
21
|
-
.
|
|
21
|
+
.gallery__description_guf6a {
|
|
22
22
|
display: inline;
|
|
23
23
|
text-overflow: ellipsis;
|
|
24
24
|
overflow: hidden;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"info":"
|
|
3
|
+
var styles = {"info":"gallery__info_guf6a","filenameHead":"gallery__filenameHead_guf6a","filenameContainer":"gallery__filenameContainer_guf6a","description":"gallery__description_guf6a"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { __awaiter, __generator } from 'tslib';
|
|
1
|
+
import { __assign, __awaiter, __generator } from 'tslib';
|
|
2
2
|
import React, { useContext } from 'react';
|
|
3
3
|
import cn from 'classnames';
|
|
4
4
|
import { TypographyText } from '@alfalab/core-components-typography/esm';
|
|
5
5
|
import { GalleryContext } from '../../context.js';
|
|
6
6
|
import { isVideo } from '../../utils/utils.js';
|
|
7
7
|
import { TestIds } from '../../utils/constants.js';
|
|
8
|
-
import { BackArrow, Download, Share } from '../buttons/index.js';
|
|
8
|
+
import { BackArrow, CustomButton, Download, Share } from '../buttons/index.js';
|
|
9
9
|
import styles from './index.module.css.js';
|
|
10
10
|
|
|
11
11
|
var HeaderMobile = function () {
|
|
12
12
|
var _a;
|
|
13
13
|
var _b, _c;
|
|
14
|
-
var _d = useContext(GalleryContext), onClose = _d.onClose, images = _d.images, currentSlideIndex = _d.currentSlideIndex, getCurrentImage = _d.getCurrentImage, getCurrentImageMeta = _d.getCurrentImageMeta, hideNavigation = _d.hideNavigation;
|
|
14
|
+
var _d = useContext(GalleryContext), onClose = _d.onClose, images = _d.images, currentSlideIndex = _d.currentSlideIndex, getCurrentImage = _d.getCurrentImage, getCurrentImageMeta = _d.getCurrentImageMeta, hideNavigation = _d.hideNavigation, customButton = _d.customButton;
|
|
15
15
|
var currentImage = getCurrentImage();
|
|
16
16
|
var meta = getCurrentImageMeta();
|
|
17
17
|
var description = images.length > 1 && "".concat(currentSlideIndex + 1, " \u0438\u0437 ").concat(images.length);
|
|
@@ -96,6 +96,7 @@ var HeaderMobile = function () {
|
|
|
96
96
|
React.createElement(BackArrow, { onClick: onClose }),
|
|
97
97
|
React.createElement(TypographyText, { className: styles.description, tag: 'div', view: 'component-primary', color: 'static-primary-light' }, description),
|
|
98
98
|
React.createElement("div", { className: styles.rightButtons },
|
|
99
|
+
customButton && (React.createElement(CustomButton, __assign({}, customButton, { dataTestId: TestIds.CUSTOM_BUTTON }))),
|
|
99
100
|
showDownloadButton && (React.createElement(Download, { href: currentImage === null || currentImage === void 0 ? void 0 : currentImage.src, download: currentImage === null || currentImage === void 0 ? void 0 : currentImage.name, dataTestId: TestIds.DOWNLOAD_BUTTON })),
|
|
100
101
|
showShareButton && React.createElement(Share, { onClick: handleShareClick }))));
|
|
101
102
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Component.js","sources":["../../../src/components/header-mobile/Component.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { isVideo, TestIds } from '../../utils';\nimport * as Buttons from '../buttons';\n\nimport styles from './index.module.css';\n\nexport const HeaderMobile = () => {\n const {\n onClose,\n images,\n currentSlideIndex,\n getCurrentImage,\n getCurrentImageMeta,\n hideNavigation,\n } = useContext(GalleryContext);\n\n const currentImage = getCurrentImage();\n const meta = getCurrentImageMeta();\n\n const description = images.length > 1 && `${currentSlideIndex + 1} из ${images.length}`;\n\n const canDownload = currentImage?.canDownload ?? true;\n const showDownloadButton = !meta?.broken && canDownload;\n const canShare = currentImage?.canShare ?? true;\n const showShareButton = !meta?.broken && canShare;\n\n const handleShareClick = async () => {\n if (!currentImage || !navigator.share) {\n return;\n }\n\n const title = currentImage.name ?? new Date().toISOString().split('T')[0];\n const url = currentImage.src;\n\n try {\n if (isVideo(url)) {\n // Если видео — всегда делим ссылку\n await navigator.share({\n title,\n url,\n text: 'Видео',\n });\n\n return;\n }\n\n // Попробуем скачать изображение\n const response = await fetch(url, { mode: 'cors' });\n const blob = await response.blob();\n\n const file = new File([blob], `${title}.png`, {\n type: blob.type,\n lastModified: Date.now(),\n });\n\n const shareData: ShareData = {\n files: [file],\n title,\n text: 'Картинка',\n };\n\n // Попробуем поделиться файлом\n if (navigator.canShare?.(shareData) && response.ok) {\n await navigator.share(shareData);\n } else {\n // Fallback: делимся только ссылкой\n await navigator.share({\n title,\n text: 'Картинка',\n url,\n });\n }\n } catch {\n await navigator.share({\n title,\n url,\n });\n }\n };\n\n return (\n <div\n className={cn(styles.headerMobile, {\n [styles.video]: isVideo(currentImage?.src),\n [styles.hide]: hideNavigation,\n })}\n >\n <Buttons.BackArrow onClick={onClose} />\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {description}\n </TypographyText>\n <div className={styles.rightButtons}>\n {showDownloadButton && (\n <Buttons.Download\n href={currentImage?.src}\n download={currentImage?.name}\n dataTestId={TestIds.DOWNLOAD_BUTTON}\n />\n )}\n {showShareButton && <Buttons.Share onClick={handleShareClick} />}\n </div>\n </div>\n );\n};\n"],"names":["Buttons.BackArrow","Buttons.Download","Buttons.Share"],"mappings":";;;;;;;;;;AAWa,IAAA,YAAY,GAAG,YAAA;;;IAClB,IAAA,EAAA,
|
|
1
|
+
{"version":3,"file":"Component.js","sources":["../../../src/components/header-mobile/Component.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { isVideo, TestIds } from '../../utils';\nimport * as Buttons from '../buttons';\n\nimport styles from './index.module.css';\n\nexport const HeaderMobile = () => {\n const {\n onClose,\n images,\n currentSlideIndex,\n getCurrentImage,\n getCurrentImageMeta,\n hideNavigation,\n customButton,\n } = useContext(GalleryContext);\n\n const currentImage = getCurrentImage();\n const meta = getCurrentImageMeta();\n\n const description = images.length > 1 && `${currentSlideIndex + 1} из ${images.length}`;\n\n const canDownload = currentImage?.canDownload ?? true;\n const showDownloadButton = !meta?.broken && canDownload;\n const canShare = currentImage?.canShare ?? true;\n const showShareButton = !meta?.broken && canShare;\n\n const handleShareClick = async () => {\n if (!currentImage || !navigator.share) {\n return;\n }\n\n const title = currentImage.name ?? new Date().toISOString().split('T')[0];\n const url = currentImage.src;\n\n try {\n if (isVideo(url)) {\n // Если видео — всегда делим ссылку\n await navigator.share({\n title,\n url,\n text: 'Видео',\n });\n\n return;\n }\n\n // Попробуем скачать изображение\n const response = await fetch(url, { mode: 'cors' });\n const blob = await response.blob();\n\n const file = new File([blob], `${title}.png`, {\n type: blob.type,\n lastModified: Date.now(),\n });\n\n const shareData: ShareData = {\n files: [file],\n title,\n text: 'Картинка',\n };\n\n // Попробуем поделиться файлом\n if (navigator.canShare?.(shareData) && response.ok) {\n await navigator.share(shareData);\n } else {\n // Fallback: делимся только ссылкой\n await navigator.share({\n title,\n text: 'Картинка',\n url,\n });\n }\n } catch {\n await navigator.share({\n title,\n url,\n });\n }\n };\n\n return (\n <div\n className={cn(styles.headerMobile, {\n [styles.video]: isVideo(currentImage?.src),\n [styles.hide]: hideNavigation,\n })}\n >\n <Buttons.BackArrow onClick={onClose} />\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {description}\n </TypographyText>\n <div className={styles.rightButtons}>\n {customButton && (\n <Buttons.CustomButton {...customButton} dataTestId={TestIds.CUSTOM_BUTTON} />\n )}\n {showDownloadButton && (\n <Buttons.Download\n href={currentImage?.src}\n download={currentImage?.name}\n dataTestId={TestIds.DOWNLOAD_BUTTON}\n />\n )}\n {showShareButton && <Buttons.Share onClick={handleShareClick} />}\n </div>\n </div>\n );\n};\n"],"names":["Buttons.BackArrow","Buttons.CustomButton","Buttons.Download","Buttons.Share"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
--color-static-neutral-0-inverted: #262629;
|
|
3
3
|
}
|
|
4
|
-
.
|
|
4
|
+
.gallery__headerMobile_6worh {
|
|
5
5
|
position: relative;
|
|
6
6
|
height: 72px;
|
|
7
7
|
z-index: 3;
|
|
@@ -10,21 +10,21 @@
|
|
|
10
10
|
justify-content: space-between;
|
|
11
11
|
align-items: center;
|
|
12
12
|
}
|
|
13
|
-
.
|
|
13
|
+
.gallery__headerMobile_6worh.gallery__video_6worh {
|
|
14
14
|
position: absolute;
|
|
15
15
|
width: 100%;
|
|
16
16
|
background-color: var(--color-static-neutral-0-inverted);
|
|
17
17
|
transition: transform 0.3s ease-in-out;
|
|
18
18
|
}
|
|
19
|
-
.
|
|
19
|
+
.gallery__hide_6worh {
|
|
20
20
|
transform: translateY(-96px);
|
|
21
21
|
}
|
|
22
|
-
.
|
|
23
|
-
.
|
|
22
|
+
.gallery__leftButton_6worh,
|
|
23
|
+
.gallery__rightButtons_6worh {
|
|
24
24
|
display: flex;
|
|
25
25
|
align-items: center;
|
|
26
26
|
}
|
|
27
|
-
.
|
|
27
|
+
.gallery__description_6worh {
|
|
28
28
|
position: absolute;
|
|
29
29
|
left: 50%;
|
|
30
30
|
transform: translateX(-50%);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"headerMobile":"
|
|
3
|
+
var styles = {"headerMobile":"gallery__headerMobile_6worh","video":"gallery__video_6worh","hide":"gallery__hide_6worh","rightButtons":"gallery__rightButtons_6worh","description":"gallery__description_6worh"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|
|
@@ -10,23 +10,23 @@
|
|
|
10
10
|
:root {
|
|
11
11
|
--focus-color: var(--color-light-status-info);
|
|
12
12
|
}
|
|
13
|
-
.
|
|
13
|
+
.gallery__component_55vg5 {
|
|
14
14
|
display: flex;
|
|
15
15
|
z-index: 3;
|
|
16
16
|
overflow: hidden;
|
|
17
17
|
transition: border 0.15s ease-in-out;
|
|
18
18
|
outline: none;
|
|
19
19
|
}
|
|
20
|
-
.
|
|
20
|
+
.gallery__component_55vg5 .gallery__image_55vg5 {
|
|
21
21
|
opacity: 0.3;
|
|
22
22
|
}
|
|
23
|
-
.
|
|
23
|
+
.gallery__component_55vg5.gallery__mobile_55vg5 {
|
|
24
24
|
padding: 0;
|
|
25
25
|
}
|
|
26
|
-
.
|
|
26
|
+
.gallery__active_55vg5 > .gallery__image_55vg5 {
|
|
27
27
|
opacity: 1;
|
|
28
28
|
}
|
|
29
|
-
.
|
|
29
|
+
.gallery__preview_55vg5 {
|
|
30
30
|
width: 56px;
|
|
31
31
|
height: 56px;
|
|
32
32
|
flex-shrink: 0;
|
|
@@ -36,15 +36,15 @@
|
|
|
36
36
|
-moz-user-select: none;
|
|
37
37
|
user-select: none;
|
|
38
38
|
}
|
|
39
|
-
.
|
|
39
|
+
.gallery__preview_55vg5.gallery__mobile_55vg5 {
|
|
40
40
|
width: 46px;
|
|
41
41
|
height: 46px;
|
|
42
42
|
border-radius: var(--border-radius-8);
|
|
43
43
|
}
|
|
44
|
-
.
|
|
44
|
+
.gallery__image_55vg5 {
|
|
45
45
|
transition: opacity 0.15s ease-in-out;
|
|
46
46
|
}
|
|
47
|
-
.
|
|
47
|
+
.gallery__image_55vg5 > img {
|
|
48
48
|
display: block;
|
|
49
49
|
width: 100%;
|
|
50
50
|
height: 100%;
|
|
@@ -54,36 +54,36 @@
|
|
|
54
54
|
overflow: clip;
|
|
55
55
|
overflow-clip-margin: border-box;
|
|
56
56
|
}
|
|
57
|
-
.
|
|
57
|
+
.gallery__image_55vg5:hover {
|
|
58
58
|
opacity: 0.7;
|
|
59
59
|
}
|
|
60
|
-
.
|
|
60
|
+
.gallery__loading_55vg5 {
|
|
61
61
|
background-color: var(--color-static-neutral-100-inverted);
|
|
62
62
|
}
|
|
63
|
-
.
|
|
63
|
+
.gallery__loading_55vg5 .gallery__active_55vg5 {
|
|
64
64
|
background-color: var(--color-static-neutral-translucent-100-inverted);
|
|
65
65
|
}
|
|
66
|
-
.
|
|
66
|
+
.gallery__brokenImageWrapper_55vg5 {
|
|
67
67
|
display: flex;
|
|
68
68
|
justify-content: center;
|
|
69
69
|
align-items: center;
|
|
70
70
|
background-color: var(--color-static-neutral-translucent-100-inverted);
|
|
71
71
|
opacity: 0.3;
|
|
72
72
|
}
|
|
73
|
-
.
|
|
73
|
+
.gallery__brokenImageWrapper_55vg5.gallery__active_55vg5 {
|
|
74
74
|
opacity: 1;
|
|
75
75
|
}
|
|
76
|
-
.
|
|
76
|
+
.gallery__brokenIcon_55vg5 {
|
|
77
77
|
width: 40px;
|
|
78
78
|
height: 40px;
|
|
79
79
|
}
|
|
80
|
-
.
|
|
80
|
+
.gallery__focused_55vg5 {
|
|
81
81
|
outline: 2px solid var(--focus-color);
|
|
82
82
|
outline-offset: 2px;
|
|
83
83
|
}
|
|
84
|
-
.
|
|
84
|
+
.gallery__canvasPreview_55vg5 {
|
|
85
85
|
border-radius: var(--border-radius-12);
|
|
86
86
|
}
|
|
87
|
-
.
|
|
87
|
+
.gallery__canvasPreview_55vg5.gallery__mobile_55vg5 {
|
|
88
88
|
border-radius: var(--border-radius-8);
|
|
89
89
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"component":"
|
|
3
|
+
var styles = {"component":"gallery__component_55vg5","image":"gallery__image_55vg5","mobile":"gallery__mobile_55vg5","active":"gallery__active_55vg5","preview":"gallery__preview_55vg5","loading":"gallery__loading_55vg5","brokenImageWrapper":"gallery__brokenImageWrapper_55vg5","brokenIcon":"gallery__brokenIcon_55vg5","focused":"gallery__focused_55vg5","canvasPreview":"gallery__canvasPreview_55vg5"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
6
6
|
//# sourceMappingURL=index.module.css.js.map
|