@alfalab/core-components-gallery 7.0.6 → 7.1.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.
Files changed (222) hide show
  1. package/Component.d.ts +1 -1
  2. package/Component.js.map +1 -1
  3. package/components/bottom-button/Component.d.ts +1 -1
  4. package/components/bottom-button/Component.js.map +1 -1
  5. package/components/bottom-button/index.css +5 -5
  6. package/components/bottom-button/index.module.css.js +1 -1
  7. package/components/buttons/index.css +5 -5
  8. package/components/buttons/index.d.ts +1 -1
  9. package/components/buttons/index.js +1 -1
  10. package/components/buttons/index.js.map +1 -1
  11. package/components/buttons/index.module.css.js +1 -1
  12. package/components/header/Component.js.map +1 -1
  13. package/components/header/index.css +1 -1
  14. package/components/header/index.module.css.js +1 -1
  15. package/components/header-info-block/Component.d.ts +1 -1
  16. package/components/header-info-block/index.css +4 -4
  17. package/components/header-info-block/index.module.css.js +1 -1
  18. package/components/header-mobile/Component.js +5 -3
  19. package/components/header-mobile/Component.js.map +1 -1
  20. package/components/header-mobile/index.css +6 -6
  21. package/components/header-mobile/index.module.css.js +1 -1
  22. package/components/image-preview/Component.d.ts +1 -1
  23. package/components/image-preview/Component.js.map +1 -1
  24. package/components/image-preview/index.css +17 -17
  25. package/components/image-preview/index.module.css.js +1 -1
  26. package/components/image-viewer/component.js.map +1 -1
  27. package/components/image-viewer/hooks.d.ts +1 -1
  28. package/components/image-viewer/hooks.js.map +1 -1
  29. package/components/image-viewer/index.css +25 -25
  30. package/components/image-viewer/index.module.css.js +1 -1
  31. package/components/image-viewer/slide.d.ts +1 -1
  32. package/components/image-viewer/slide.js.map +1 -1
  33. package/components/image-viewer/video/index.css +7 -7
  34. package/components/image-viewer/video/index.d.ts +1 -1
  35. package/components/image-viewer/video/index.js +109 -25
  36. package/components/image-viewer/video/index.js.map +1 -1
  37. package/components/image-viewer/video/index.module.css.js +1 -1
  38. package/components/info-bar/Component.js.map +1 -1
  39. package/components/info-bar/index.css +3 -3
  40. package/components/info-bar/index.module.css.js +1 -1
  41. package/components/navigation-bar/Component.js.map +1 -1
  42. package/components/navigation-bar/index.css +8 -8
  43. package/components/navigation-bar/index.module.css.js +1 -1
  44. package/components/subtitles/index.css +3 -3
  45. package/components/subtitles/index.js.map +1 -1
  46. package/components/subtitles/index.module.css.js +1 -1
  47. package/context.d.ts +1 -2
  48. package/cssm/Component.d.ts +1 -1
  49. package/cssm/Component.js.map +1 -1
  50. package/cssm/components/bottom-button/Component.d.ts +1 -1
  51. package/cssm/components/bottom-button/Component.js.map +1 -1
  52. package/cssm/components/buttons/index.d.ts +1 -1
  53. package/cssm/components/buttons/index.js +1 -1
  54. package/cssm/components/buttons/index.js.map +1 -1
  55. package/cssm/components/header/Component.js.map +1 -1
  56. package/cssm/components/header-info-block/Component.d.ts +1 -1
  57. package/cssm/components/header-mobile/Component.js +5 -3
  58. package/cssm/components/header-mobile/Component.js.map +1 -1
  59. package/cssm/components/image-preview/Component.d.ts +1 -1
  60. package/cssm/components/image-preview/Component.js.map +1 -1
  61. package/cssm/components/image-viewer/component.js.map +1 -1
  62. package/cssm/components/image-viewer/hooks.d.ts +1 -1
  63. package/cssm/components/image-viewer/hooks.js.map +1 -1
  64. package/cssm/components/image-viewer/slide.d.ts +1 -1
  65. package/cssm/components/image-viewer/slide.js.map +1 -1
  66. package/cssm/components/image-viewer/video/index.d.ts +1 -1
  67. package/cssm/components/image-viewer/video/index.js +109 -25
  68. package/cssm/components/image-viewer/video/index.js.map +1 -1
  69. package/cssm/components/info-bar/Component.js.map +1 -1
  70. package/cssm/components/navigation-bar/Component.js.map +1 -1
  71. package/cssm/components/subtitles/index.js.map +1 -1
  72. package/cssm/context.d.ts +1 -2
  73. package/cssm/hooks/use-custom-subtitles.js.map +1 -1
  74. package/cssm/types.d.ts +4 -3
  75. package/cssm/utils/split-filename.js.map +1 -1
  76. package/cssm/utils/utils.js.map +1 -1
  77. package/esm/Component.d.ts +1 -1
  78. package/esm/Component.js.map +1 -1
  79. package/esm/components/bottom-button/Component.d.ts +1 -1
  80. package/esm/components/bottom-button/Component.js.map +1 -1
  81. package/esm/components/bottom-button/index.css +5 -5
  82. package/esm/components/bottom-button/index.module.css.js +1 -1
  83. package/esm/components/buttons/index.css +5 -5
  84. package/esm/components/buttons/index.d.ts +1 -1
  85. package/esm/components/buttons/index.js +1 -1
  86. package/esm/components/buttons/index.js.map +1 -1
  87. package/esm/components/buttons/index.module.css.js +1 -1
  88. package/esm/components/header/Component.js.map +1 -1
  89. package/esm/components/header/index.css +1 -1
  90. package/esm/components/header/index.module.css.js +1 -1
  91. package/esm/components/header-info-block/Component.d.ts +1 -1
  92. package/esm/components/header-info-block/index.css +4 -4
  93. package/esm/components/header-info-block/index.module.css.js +1 -1
  94. package/esm/components/header-mobile/Component.js +5 -3
  95. package/esm/components/header-mobile/Component.js.map +1 -1
  96. package/esm/components/header-mobile/index.css +6 -6
  97. package/esm/components/header-mobile/index.module.css.js +1 -1
  98. package/esm/components/image-preview/Component.d.ts +1 -1
  99. package/esm/components/image-preview/Component.js.map +1 -1
  100. package/esm/components/image-preview/index.css +17 -17
  101. package/esm/components/image-preview/index.module.css.js +1 -1
  102. package/esm/components/image-viewer/component.js.map +1 -1
  103. package/esm/components/image-viewer/hooks.d.ts +1 -1
  104. package/esm/components/image-viewer/hooks.js.map +1 -1
  105. package/esm/components/image-viewer/index.css +25 -25
  106. package/esm/components/image-viewer/index.module.css.js +1 -1
  107. package/esm/components/image-viewer/slide.d.ts +1 -1
  108. package/esm/components/image-viewer/slide.js.map +1 -1
  109. package/esm/components/image-viewer/video/index.css +7 -7
  110. package/esm/components/image-viewer/video/index.d.ts +1 -1
  111. package/esm/components/image-viewer/video/index.js +92 -25
  112. package/esm/components/image-viewer/video/index.js.map +1 -1
  113. package/esm/components/image-viewer/video/index.module.css.js +1 -1
  114. package/esm/components/info-bar/Component.js.map +1 -1
  115. package/esm/components/info-bar/index.css +3 -3
  116. package/esm/components/info-bar/index.module.css.js +1 -1
  117. package/esm/components/navigation-bar/Component.js.map +1 -1
  118. package/esm/components/navigation-bar/index.css +8 -8
  119. package/esm/components/navigation-bar/index.module.css.js +1 -1
  120. package/esm/components/subtitles/index.css +3 -3
  121. package/esm/components/subtitles/index.js.map +1 -1
  122. package/esm/components/subtitles/index.module.css.js +1 -1
  123. package/esm/context.d.ts +1 -2
  124. package/esm/hooks/use-custom-subtitles.js.map +1 -1
  125. package/esm/index.css +9 -9
  126. package/esm/index.module.css.js +1 -1
  127. package/esm/types.d.ts +4 -3
  128. package/esm/utils/split-filename.js.map +1 -1
  129. package/esm/utils/utils.js.map +1 -1
  130. package/hooks/use-custom-subtitles.js.map +1 -1
  131. package/index.css +9 -9
  132. package/index.module.css.js +1 -1
  133. package/modern/Component.d.ts +1 -1
  134. package/modern/Component.js.map +1 -1
  135. package/modern/components/bottom-button/Component.d.ts +1 -1
  136. package/modern/components/bottom-button/Component.js.map +1 -1
  137. package/modern/components/bottom-button/index.css +5 -5
  138. package/modern/components/bottom-button/index.module.css.js +1 -1
  139. package/modern/components/buttons/index.css +5 -5
  140. package/modern/components/buttons/index.d.ts +1 -1
  141. package/modern/components/buttons/index.js +1 -1
  142. package/modern/components/buttons/index.js.map +1 -1
  143. package/modern/components/buttons/index.module.css.js +1 -1
  144. package/modern/components/header/Component.js.map +1 -1
  145. package/modern/components/header/index.css +1 -1
  146. package/modern/components/header/index.module.css.js +1 -1
  147. package/modern/components/header-info-block/Component.d.ts +1 -1
  148. package/modern/components/header-info-block/index.css +4 -4
  149. package/modern/components/header-info-block/index.module.css.js +1 -1
  150. package/modern/components/header-mobile/Component.js +3 -1
  151. package/modern/components/header-mobile/Component.js.map +1 -1
  152. package/modern/components/header-mobile/index.css +6 -6
  153. package/modern/components/header-mobile/index.module.css.js +1 -1
  154. package/modern/components/image-preview/Component.d.ts +1 -1
  155. package/modern/components/image-preview/Component.js.map +1 -1
  156. package/modern/components/image-preview/index.css +17 -17
  157. package/modern/components/image-preview/index.module.css.js +1 -1
  158. package/modern/components/image-viewer/component.js.map +1 -1
  159. package/modern/components/image-viewer/hooks.d.ts +1 -1
  160. package/modern/components/image-viewer/hooks.js.map +1 -1
  161. package/modern/components/image-viewer/index.css +25 -25
  162. package/modern/components/image-viewer/index.module.css.js +1 -1
  163. package/modern/components/image-viewer/slide.d.ts +1 -1
  164. package/modern/components/image-viewer/slide.js.map +1 -1
  165. package/modern/components/image-viewer/video/index.css +7 -7
  166. package/modern/components/image-viewer/video/index.d.ts +1 -1
  167. package/modern/components/image-viewer/video/index.js +60 -23
  168. package/modern/components/image-viewer/video/index.js.map +1 -1
  169. package/modern/components/image-viewer/video/index.module.css.js +1 -1
  170. package/modern/components/info-bar/Component.js.map +1 -1
  171. package/modern/components/info-bar/index.css +3 -3
  172. package/modern/components/info-bar/index.module.css.js +1 -1
  173. package/modern/components/navigation-bar/Component.js.map +1 -1
  174. package/modern/components/navigation-bar/index.css +8 -8
  175. package/modern/components/navigation-bar/index.module.css.js +1 -1
  176. package/modern/components/subtitles/index.css +3 -3
  177. package/modern/components/subtitles/index.js.map +1 -1
  178. package/modern/components/subtitles/index.module.css.js +1 -1
  179. package/modern/context.d.ts +1 -2
  180. package/modern/hooks/use-custom-subtitles.js.map +1 -1
  181. package/modern/index.css +9 -9
  182. package/modern/index.module.css.js +1 -1
  183. package/modern/types.d.ts +4 -3
  184. package/modern/utils/split-filename.js.map +1 -1
  185. package/modern/utils/utils.js.map +1 -1
  186. package/moderncssm/Component.d.ts +1 -1
  187. package/moderncssm/Component.js.map +1 -1
  188. package/moderncssm/components/bottom-button/Component.d.ts +1 -1
  189. package/moderncssm/components/bottom-button/Component.js.map +1 -1
  190. package/moderncssm/components/buttons/index.d.ts +1 -1
  191. package/moderncssm/components/buttons/index.js +1 -1
  192. package/moderncssm/components/buttons/index.js.map +1 -1
  193. package/moderncssm/components/header/Component.js.map +1 -1
  194. package/moderncssm/components/header-info-block/Component.d.ts +1 -1
  195. package/moderncssm/components/header-mobile/Component.js +3 -1
  196. package/moderncssm/components/header-mobile/Component.js.map +1 -1
  197. package/moderncssm/components/image-preview/Component.d.ts +1 -1
  198. package/moderncssm/components/image-preview/Component.js.map +1 -1
  199. package/moderncssm/components/image-viewer/component.js.map +1 -1
  200. package/moderncssm/components/image-viewer/hooks.d.ts +1 -1
  201. package/moderncssm/components/image-viewer/hooks.js.map +1 -1
  202. package/moderncssm/components/image-viewer/slide.d.ts +1 -1
  203. package/moderncssm/components/image-viewer/slide.js.map +1 -1
  204. package/moderncssm/components/image-viewer/video/index.d.ts +1 -1
  205. package/moderncssm/components/image-viewer/video/index.js +60 -23
  206. package/moderncssm/components/image-viewer/video/index.js.map +1 -1
  207. package/moderncssm/components/info-bar/Component.js.map +1 -1
  208. package/moderncssm/components/navigation-bar/Component.js.map +1 -1
  209. package/moderncssm/components/subtitles/index.js.map +1 -1
  210. package/moderncssm/context.d.ts +1 -2
  211. package/moderncssm/hooks/use-custom-subtitles.js.map +1 -1
  212. package/moderncssm/types.d.ts +4 -3
  213. package/moderncssm/utils/split-filename.js.map +1 -1
  214. package/moderncssm/utils/utils.js.map +1 -1
  215. package/package.json +1 -1
  216. package/src/components/buttons/index.tsx +1 -1
  217. package/src/components/header-mobile/Component.tsx +3 -1
  218. package/src/components/image-viewer/video/index.tsx +80 -24
  219. package/src/types.ts +1 -0
  220. package/types.d.ts +4 -3
  221. package/utils/split-filename.js.map +1 -1
  222. package/utils/utils.js.map +1 -1
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"videoWrapper":"gallery__videoWrapper_izbf6","video":"gallery__video_izbf6","mobile":"gallery__mobile_izbf6","videoButton":"gallery__videoButton_izbf6","icon":"gallery__icon_izbf6","iconShape":"gallery__iconShape_izbf6","bottomButton":"gallery__bottomButton_izbf6"};
3
+ const styles = {"videoWrapper":"gallery__videoWrapper_c9p57","video":"gallery__video_c9p57","mobile":"gallery__mobile_c9p57","videoButton":"gallery__videoButton_c9p57","icon":"gallery__icon_c9p57","iconShape":"gallery__iconShape_c9p57","bottomButton":"gallery__bottomButton_c9p57"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../../src/components/info-bar/Component.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { isVideo } from '../../utils';\nimport * as Buttons from '../buttons';\n\nimport styles from './index.module.css';\n\nexport const InfoBar = () => {\n const { getCurrentImage, mutedVideo, setMutedVideo, playingVideo, setPlayingVideo } =\n useContext(GalleryContext);\n\n const image = getCurrentImage();\n\n const handleMuteVideo = useCallback(() => {\n if (image) {\n if (mutedVideo && image.onUnmute) {\n image.onUnmute();\n } else if (image.onMute) {\n image.onMute();\n }\n }\n setMutedVideo(!mutedVideo);\n }, [image, mutedVideo, setMutedVideo]);\n\n const handlePlayVideo = useCallback(() => {\n setPlayingVideo(!playingVideo);\n }, [playingVideo, setPlayingVideo]);\n\n return isVideo(image?.src) ? (\n <section className={cn(styles.infoWrapper, styles.video)}>\n {playingVideo ? (\n <Buttons.Pause onClick={handlePlayVideo} />\n ) : (\n <Buttons.Play onClick={handlePlayVideo} />\n )}\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {image?.name}\n </TypographyText>\n {mutedVideo ? (\n <Buttons.UnmuteVideo onClick={handleMuteVideo} />\n ) : (\n <Buttons.MuteVideo onClick={handleMuteVideo} />\n )}\n </section>\n ) : (\n <section className={styles.infoWrapper}>\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {image?.name}\n </TypographyText>\n </section>\n );\n};\n"],"names":["Buttons.Pause","Buttons.Play","Buttons.UnmuteVideo","Buttons.MuteVideo"],"mappings":";;;;;;;;AAWO,MAAM,OAAO,GAAG,MAAK;AACxB,IAAA,MAAM,EAAE,eAAe,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,GAC/E,UAAU,CAAC,cAAc,CAAC;AAE9B,IAAA,MAAM,KAAK,GAAG,eAAe,EAAE;AAE/B,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,MAAK;AACrC,QAAA,IAAI,KAAK,EAAE;AACP,YAAA,IAAI,UAAU,IAAI,KAAK,CAAC,QAAQ,EAAE;gBAC9B,KAAK,CAAC,QAAQ,EAAE;AACnB;iBAAM,IAAI,KAAK,CAAC,MAAM,EAAE;gBACrB,KAAK,CAAC,MAAM,EAAE;AACjB;AACJ;AACD,QAAA,aAAa,CAAC,CAAC,UAAU,CAAC;KAC7B,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;AAEtC,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,MAAK;AACrC,QAAA,eAAe,CAAC,CAAC,YAAY,CAAC;AAClC,KAAC,EAAE,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC;IAEnC,OAAO,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,IACtB,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAS,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,EAAA;QACnD,YAAY,IACT,KAAA,CAAA,aAAA,CAACA,KAAa,EAAA,EAAC,OAAO,EAAE,eAAe,EAAA,CAAI,KAE3C,KAAA,CAAA,aAAA,CAACC,IAAY,EAAA,EAAC,OAAO,EAAE,eAAe,EAAA,CAAI,CAC7C;QACD,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,GAAG,EAAC,KAAK,EACT,IAAI,EAAC,mBAAmB,EACxB,KAAK,EAAC,sBAAsB,EAE3B,EAAA,KAAK,EAAE,IAAI,CACC;AAChB,QAAA,UAAU,IACP,KAAA,CAAA,aAAA,CAACC,WAAmB,EAAC,EAAA,OAAO,EAAE,eAAe,EAAA,CAAI,KAEjD,KAAA,CAAA,aAAA,CAACC,SAAiB,EAAC,EAAA,OAAO,EAAE,eAAe,EAAA,CAAI,CAClD,CACK,KAEV,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAS,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA;QAClC,KAAC,CAAA,aAAA,CAAA,cAAc,EACX,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,GAAG,EAAC,KAAK,EACT,IAAI,EAAC,mBAAmB,EACxB,KAAK,EAAC,sBAAsB,EAAA,EAE3B,KAAK,EAAE,IAAI,CACC,CACX,CACb;AACL;;;;"}
1
+ {"version":3,"file":"Component.js","sources":["../../../src/components/info-bar/Component.tsx"],"sourcesContent":["import React, { useCallback, useContext } from 'react';\nimport cn from 'classnames';\n\nimport { TypographyText } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { isVideo } from '../../utils';\nimport * as Buttons from '../buttons';\n\nimport styles from './index.module.css';\n\nexport const InfoBar = () => {\n const { getCurrentImage, mutedVideo, setMutedVideo, playingVideo, setPlayingVideo } =\n useContext(GalleryContext);\n\n const image = getCurrentImage();\n\n const handleMuteVideo = useCallback(() => {\n if (image) {\n if (mutedVideo && image.onUnmute) {\n image.onUnmute();\n } else if (image.onMute) {\n image.onMute();\n }\n }\n setMutedVideo(!mutedVideo);\n }, [image, mutedVideo, setMutedVideo]);\n\n const handlePlayVideo = useCallback(() => {\n setPlayingVideo(!playingVideo);\n }, [playingVideo, setPlayingVideo]);\n\n return isVideo(image?.src) ? (\n <section className={cn(styles.infoWrapper, styles.video)}>\n {playingVideo ? (\n <Buttons.Pause onClick={handlePlayVideo} />\n ) : (\n <Buttons.Play onClick={handlePlayVideo} />\n )}\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {image?.name}\n </TypographyText>\n {mutedVideo ? (\n <Buttons.UnmuteVideo onClick={handleMuteVideo} />\n ) : (\n <Buttons.MuteVideo onClick={handleMuteVideo} />\n )}\n </section>\n ) : (\n <section className={styles.infoWrapper}>\n <TypographyText\n className={styles.description}\n tag='div'\n view='component-primary'\n color='static-primary-light'\n >\n {image?.name}\n </TypographyText>\n </section>\n );\n};\n"],"names":["Buttons.Pause","Buttons.Play","Buttons.UnmuteVideo","Buttons.MuteVideo"],"mappings":";;;;;;;;AAWO,MAAM,OAAO,GAAG,MAAK;AACxB,IAAA,MAAM,EAAE,eAAe,EAAE,UAAU,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,GAC/E,UAAU,CAAC,cAAc,CAAC;AAE9B,IAAA,MAAM,KAAK,GAAG,eAAe,EAAE;AAE/B,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,MAAK;QACrC,IAAI,KAAK,EAAE;AACP,YAAA,IAAI,UAAU,IAAI,KAAK,CAAC,QAAQ,EAAE;gBAC9B,KAAK,CAAC,QAAQ,EAAE;;AACb,iBAAA,IAAI,KAAK,CAAC,MAAM,EAAE;gBACrB,KAAK,CAAC,MAAM,EAAE;;;AAGtB,QAAA,aAAa,CAAC,CAAC,UAAU,CAAC;KAC7B,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;AAEtC,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,MAAK;AACrC,QAAA,eAAe,CAAC,CAAC,YAAY,CAAC;AAClC,KAAC,EAAE,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC;IAEnC,OAAO,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,IACtB,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAS,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,EAAA;QACnD,YAAY,IACT,KAAA,CAAA,aAAA,CAACA,KAAa,EAAA,EAAC,OAAO,EAAE,eAAe,EAAA,CAAI,KAE3C,KAAA,CAAA,aAAA,CAACC,IAAY,EAAA,EAAC,OAAO,EAAE,eAAe,EAAA,CAAI,CAC7C;QACD,KAAC,CAAA,aAAA,CAAA,cAAc,IACX,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,GAAG,EAAC,KAAK,EACT,IAAI,EAAC,mBAAmB,EACxB,KAAK,EAAC,sBAAsB,EAE3B,EAAA,KAAK,EAAE,IAAI,CACC;AAChB,QAAA,UAAU,IACP,KAAA,CAAA,aAAA,CAACC,WAAmB,EAAC,EAAA,OAAO,EAAE,eAAe,EAAA,CAAI,KAEjD,KAAA,CAAA,aAAA,CAACC,SAAiB,EAAC,EAAA,OAAO,EAAE,eAAe,EAAA,CAAI,CAClD,CACK,KAEV,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAS,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA;QAClC,KAAC,CAAA,aAAA,CAAA,cAAc,EACX,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,GAAG,EAAC,KAAK,EACT,IAAI,EAAC,mBAAmB,EACxB,KAAK,EAAC,sBAAsB,EAAA,EAE3B,KAAK,EAAE,IAAI,CACC,CACX,CACb;AACL;;;;"}
@@ -7,10 +7,10 @@
7
7
  --gap-4: var(--gap-2xs);
8
8
  --gap-8: var(--gap-xs);
9
9
  }
10
- .gallery__description_1yae2 {
10
+ .gallery__description_e4exg {
11
11
  text-align: center;
12
12
  }
13
- .gallery__infoWrapper_1yae2 {
13
+ .gallery__infoWrapper_e4exg {
14
14
  background-color: var(--color-static-neutral-0-inverted);
15
15
  display: flex;
16
16
  align-items: center;
@@ -19,7 +19,7 @@
19
19
  position: relative;
20
20
  height: 48px;
21
21
  }
22
- .gallery__infoWrapper_1yae2.gallery__video_1yae2 {
22
+ .gallery__infoWrapper_e4exg.gallery__video_e4exg {
23
23
  padding: 0 var(--gap-4) var(--gap-4);
24
24
  justify-content: space-between;
25
25
  }
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"description":"gallery__description_1yae2","infoWrapper":"gallery__infoWrapper_1yae2","video":"gallery__video_1yae2"};
3
+ const styles = {"description":"gallery__description_e4exg","infoWrapper":"gallery__infoWrapper_e4exg","video":"gallery__video_e4exg"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../../src/components/navigation-bar/Component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\nimport throttle from 'lodash/throttle';\n\nimport { GalleryContext } from '../../context';\nimport { getImageKey, TestIds } from '../../utils';\nimport { ImagePreview } from '../image-preview';\n\nimport styles from './index.module.css';\n\nconst MIN_SCROLL_STEP = 24;\nconst SCROLL_SPEED = 2; // Коэффициент скорости прокрутки (можно настроить)\nconst SCROLL_THRESHOLD = 150; // Расстояние от границы, при котором начинается прокрутка\n\nexport const NavigationBar: FC = () => {\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [isNavMouseDowned, setIsNavMouseDowned] = useState<boolean>(false);\n\n const { images, currentSlideIndex, setCurrentSlideIndex, getSwiper, setPlayingVideo, view } =\n useContext(GalleryContext);\n\n const swiper = getSwiper();\n\n const handlePreviewSelect = (index: number) => {\n setCurrentSlideIndex?.(index);\n\n if (swiper) {\n setPlayingVideo(true);\n swiper.slideTo(index);\n }\n };\n\n const scroll = useCallback((scrollValue: number) => {\n if (containerRef.current) {\n containerRef.current.scroll({\n top: 0,\n left: containerRef.current.scrollLeft + scrollValue,\n behavior: 'smooth',\n });\n }\n }, []);\n\n const handlePreviewMouseDown = () => {\n setIsNavMouseDowned(true);\n };\n\n const handlePreviewMouseUp = () => {\n setIsNavMouseDowned(false);\n if (containerRef.current) {\n containerRef.current.style.scrollBehavior = 'auto'; // Отключаем плавность для резкой остановки\n }\n };\n\n const handleMouseNavigationMove = throttle((e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current || !isNavMouseDowned) return;\n\n const container = containerRef.current;\n const { width: containerWidth, left: containerLeft } = container.getBoundingClientRect();\n const mouseX = e.clientX;\n\n // Если курсор близко к правой границе\n if (mouseX > containerWidth + containerLeft - SCROLL_THRESHOLD) {\n const scrollValue =\n (mouseX - (containerWidth + containerLeft - SCROLL_THRESHOLD)) * SCROLL_SPEED;\n\n container.scrollBy({ left: scrollValue, behavior: 'smooth' });\n }\n // Если курсор близко к левой границе\n else if (mouseX < containerLeft + SCROLL_THRESHOLD) {\n const scrollValue = (mouseX - (containerLeft + SCROLL_THRESHOLD)) * SCROLL_SPEED;\n\n container.scrollBy({ left: scrollValue, behavior: 'smooth' });\n }\n }, 150);\n\n const handlePreviewPosition = useCallback(\n (preview: Element, containerWidth: number) => {\n const { right, left, x } = preview.getBoundingClientRect();\n\n if (view === 'mobile') {\n scroll(x - containerWidth / 2 + MIN_SCROLL_STEP); // Передвигаем в центр активное превью\n }\n\n if (right > containerWidth) {\n const scrollValue = right - containerWidth + MIN_SCROLL_STEP;\n\n scroll(scrollValue);\n } else if (left < 0) {\n const scrollValue = left - MIN_SCROLL_STEP;\n\n scroll(scrollValue);\n }\n },\n [scroll, view],\n );\n\n useEffect(() => {\n if (containerRef.current) {\n const { width: containerWidth } = containerRef.current.getBoundingClientRect();\n\n const activePreview = containerRef.current.children[currentSlideIndex];\n\n if (activePreview) {\n handlePreviewPosition(activePreview, containerWidth);\n }\n }\n }, [currentSlideIndex, handlePreviewPosition, scroll]);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n className={cn(styles.component, { [styles.mobile]: view === 'mobile' })}\n ref={containerRef}\n data-test-id={TestIds.NAVIGATION_BAR}\n onMouseDown={handlePreviewMouseDown}\n onMouseUp={handlePreviewMouseUp}\n onMouseMove={handleMouseNavigationMove}\n >\n {images.map((image, index) => {\n const active = index === currentSlideIndex;\n\n return (\n <ImagePreview\n key={getImageKey(image, index)}\n image={image}\n active={active}\n index={index}\n onSelect={handlePreviewSelect}\n className={cn(styles.preview, { [styles.mobile]: view === 'mobile' })}\n />\n );\n })}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Component.js","sources":["../../../src/components/navigation-bar/Component.tsx"],"sourcesContent":["import React, { type FC, useCallback, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\nimport throttle from 'lodash/throttle';\n\nimport { GalleryContext } from '../../context';\nimport { getImageKey, TestIds } from '../../utils';\nimport { ImagePreview } from '../image-preview';\n\nimport styles from './index.module.css';\n\nconst MIN_SCROLL_STEP = 24;\nconst SCROLL_SPEED = 2; // Коэффициент скорости прокрутки (можно настроить)\nconst SCROLL_THRESHOLD = 150; // Расстояние от границы, при котором начинается прокрутка\n\nexport const NavigationBar: FC = () => {\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [isNavMouseDowned, setIsNavMouseDowned] = useState<boolean>(false);\n\n const { images, currentSlideIndex, setCurrentSlideIndex, getSwiper, setPlayingVideo, view } =\n useContext(GalleryContext);\n\n const swiper = getSwiper();\n\n const handlePreviewSelect = (index: number) => {\n setCurrentSlideIndex?.(index);\n\n if (swiper) {\n setPlayingVideo(true);\n swiper.slideTo(index);\n }\n };\n\n const scroll = useCallback((scrollValue: number) => {\n if (containerRef.current) {\n containerRef.current.scroll({\n top: 0,\n left: containerRef.current.scrollLeft + scrollValue,\n behavior: 'smooth',\n });\n }\n }, []);\n\n const handlePreviewMouseDown = () => {\n setIsNavMouseDowned(true);\n };\n\n const handlePreviewMouseUp = () => {\n setIsNavMouseDowned(false);\n if (containerRef.current) {\n containerRef.current.style.scrollBehavior = 'auto'; // Отключаем плавность для резкой остановки\n }\n };\n\n const handleMouseNavigationMove = throttle((e: React.MouseEvent<HTMLDivElement>) => {\n if (!containerRef.current || !isNavMouseDowned) return;\n\n const container = containerRef.current;\n const { width: containerWidth, left: containerLeft } = container.getBoundingClientRect();\n const mouseX = e.clientX;\n\n // Если курсор близко к правой границе\n if (mouseX > containerWidth + containerLeft - SCROLL_THRESHOLD) {\n const scrollValue =\n (mouseX - (containerWidth + containerLeft - SCROLL_THRESHOLD)) * SCROLL_SPEED;\n\n container.scrollBy({ left: scrollValue, behavior: 'smooth' });\n }\n // Если курсор близко к левой границе\n else if (mouseX < containerLeft + SCROLL_THRESHOLD) {\n const scrollValue = (mouseX - (containerLeft + SCROLL_THRESHOLD)) * SCROLL_SPEED;\n\n container.scrollBy({ left: scrollValue, behavior: 'smooth' });\n }\n }, 150);\n\n const handlePreviewPosition = useCallback(\n (preview: Element, containerWidth: number) => {\n const { right, left, x } = preview.getBoundingClientRect();\n\n if (view === 'mobile') {\n scroll(x - containerWidth / 2 + MIN_SCROLL_STEP); // Передвигаем в центр активное превью\n }\n\n if (right > containerWidth) {\n const scrollValue = right - containerWidth + MIN_SCROLL_STEP;\n\n scroll(scrollValue);\n } else if (left < 0) {\n const scrollValue = left - MIN_SCROLL_STEP;\n\n scroll(scrollValue);\n }\n },\n [scroll, view],\n );\n\n useEffect(() => {\n if (containerRef.current) {\n const { width: containerWidth } = containerRef.current.getBoundingClientRect();\n\n const activePreview = containerRef.current.children[currentSlideIndex];\n\n if (activePreview) {\n handlePreviewPosition(activePreview, containerWidth);\n }\n }\n }, [currentSlideIndex, handlePreviewPosition, scroll]);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n className={cn(styles.component, { [styles.mobile]: view === 'mobile' })}\n ref={containerRef}\n data-test-id={TestIds.NAVIGATION_BAR}\n onMouseDown={handlePreviewMouseDown}\n onMouseUp={handlePreviewMouseUp}\n onMouseMove={handleMouseNavigationMove}\n >\n {images.map((image, index) => {\n const active = index === currentSlideIndex;\n\n return (\n <ImagePreview\n key={getImageKey(image, index)}\n image={image}\n active={active}\n index={index}\n onSelect={handlePreviewSelect}\n className={cn(styles.preview, { [styles.mobile]: view === 'mobile' })}\n />\n );\n })}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -13,7 +13,7 @@
13
13
  --gap-12: var(--gap-s);
14
14
  --gap-24: var(--gap-xl);
15
15
  }
16
- .gallery__component_m6zcb {
16
+ .gallery__component_fhd2d {
17
17
  display: flex;
18
18
  flex-wrap: nowrap;
19
19
  align-content: center;
@@ -25,25 +25,25 @@
25
25
  scrollbar-width: none;
26
26
  background-color: var(--color-static-neutral-0-inverted);
27
27
  }
28
- .gallery__component_m6zcb.gallery__mobile_m6zcb {
28
+ .gallery__component_fhd2d.gallery__mobile_fhd2d {
29
29
  padding: var(--gap-8) var(--gap-24);
30
30
  }
31
- .gallery__component_m6zcb::-webkit-scrollbar {
31
+ .gallery__component_fhd2d::-webkit-scrollbar {
32
32
  display: none;
33
33
  }
34
- .gallery__previews_m6zcb {
34
+ .gallery__previews_fhd2d {
35
35
  display: flex;
36
36
  }
37
- .gallery__preview_m6zcb {
37
+ .gallery__preview_fhd2d {
38
38
  flex-shrink: 0;
39
39
  margin-right: var(--gap-4);
40
40
  }
41
- .gallery__preview_m6zcb.gallery__mobile_m6zcb {
41
+ .gallery__preview_fhd2d.gallery__mobile_fhd2d {
42
42
  margin-right: var(--gap-2);
43
43
  }
44
- .gallery__preview_m6zcb:first-child {
44
+ .gallery__preview_fhd2d:first-child {
45
45
  margin-left: auto;
46
46
  }
47
- .gallery__preview_m6zcb:last-child {
47
+ .gallery__preview_fhd2d:last-child {
48
48
  margin-right: auto;
49
49
  }
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"component":"gallery__component_m6zcb","mobile":"gallery__mobile_m6zcb","preview":"gallery__preview_m6zcb"};
3
+ const styles = {"component":"gallery__component_fhd2d","mobile":"gallery__mobile_fhd2d","preview":"gallery__preview_fhd2d"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -5,7 +5,7 @@
5
5
  --gap-16: var(--gap-m);
6
6
  --gap-32: var(--gap-2xl);
7
7
  }
8
- .gallery__subtitles_13dww {
8
+ .gallery__subtitles_1yg4j {
9
9
  position: absolute;
10
10
  align-self: flex-end;
11
11
  padding: var(--gap-0) var(--gap-32);
@@ -18,10 +18,10 @@
18
18
  opacity 500ms ease-in-out,
19
19
  margin-bottom 270ms ease-in-out;
20
20
  }
21
- .gallery__subtitles_13dww.gallery__mobile_13dww {
21
+ .gallery__subtitles_1yg4j.gallery__mobile_1yg4j {
22
22
  position: static;
23
23
  position: initial;
24
24
  }
25
- .gallery__hideSubtitles_13dww {
25
+ .gallery__hideSubtitles_1yg4j {
26
26
  opacity: 0;
27
27
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/subtitles/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Typography } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { useCustomSubtitles } from '../../hooks';\n\nimport styles from './index.module.css';\n\nexport const Subtitles = () => {\n const { view } = useContext(GalleryContext);\n\n const { showSub, currentSub } = useCustomSubtitles();\n\n if (showSub) {\n return (\n <Typography.Text\n className={cn(styles.subtitles, {\n [styles.hideSubtitles]: !showSub,\n [styles.mobile]: view === 'mobile',\n })}\n color='static-primary-light'\n >\n {currentSub}\n </Typography.Text>\n );\n }\n\n return null;\n};\n"],"names":[],"mappings":";;;;;;;AAUO,MAAM,SAAS,GAAG,MAAK;IAC1B,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;IAE3C,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,kBAAkB,EAAE;AAEpD,IAAA,IAAI,OAAO,EAAE;AACT,QAAA,QACI,KAAA,CAAA,aAAA,CAAC,UAAU,CAAC,IAAI,EAAA,EACZ,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE;AAC5B,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,CAAC,OAAO;AAChC,gBAAA,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,KAAK,QAAQ;aACrC,CAAC,EACF,KAAK,EAAC,sBAAsB,IAE3B,UAAU,CACG;AAEzB;AAED,IAAA,OAAO,IAAI;AACf;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/subtitles/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport cn from 'classnames';\n\nimport { Typography } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { useCustomSubtitles } from '../../hooks';\n\nimport styles from './index.module.css';\n\nexport const Subtitles = () => {\n const { view } = useContext(GalleryContext);\n\n const { showSub, currentSub } = useCustomSubtitles();\n\n if (showSub) {\n return (\n <Typography.Text\n className={cn(styles.subtitles, {\n [styles.hideSubtitles]: !showSub,\n [styles.mobile]: view === 'mobile',\n })}\n color='static-primary-light'\n >\n {currentSub}\n </Typography.Text>\n );\n }\n\n return null;\n};\n"],"names":[],"mappings":";;;;;;;AAUO,MAAM,SAAS,GAAG,MAAK;IAC1B,MAAM,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;IAE3C,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,kBAAkB,EAAE;IAEpD,IAAI,OAAO,EAAE;AACT,QAAA,QACI,KAAA,CAAA,aAAA,CAAC,UAAU,CAAC,IAAI,EAAA,EACZ,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE;AAC5B,gBAAA,CAAC,MAAM,CAAC,aAAa,GAAG,CAAC,OAAO;AAChC,gBAAA,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,KAAK,QAAQ;aACrC,CAAC,EACF,KAAK,EAAC,sBAAsB,IAE3B,UAAU,CACG;;AAI1B,IAAA,OAAO,IAAI;AACf;;;;"}
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"subtitles":"gallery__subtitles_13dww","mobile":"gallery__mobile_13dww","hideSubtitles":"gallery__hideSubtitles_13dww"};
3
+ const styles = {"subtitles":"gallery__subtitles_1yg4j","mobile":"gallery__mobile_1yg4j","hideSubtitles":"gallery__hideSubtitles_1yg4j"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
@@ -1,7 +1,6 @@
1
- /// <reference types="react" />
2
1
  import type SwiperCore from 'swiper';
3
2
  import { type GalleryImage, type ImageMeta } from './types';
4
- export declare type GalleryContext = {
3
+ export type GalleryContext = {
5
4
  view: 'desktop' | 'mobile';
6
5
  singleSlide: boolean;
7
6
  currentSlideIndex: number;
@@ -1 +1 @@
1
- {"version":3,"file":"use-custom-subtitles.js","sources":["../../src/hooks/use-custom-subtitles.ts"],"sourcesContent":["import { useContext, useEffect, useState } from 'react';\n\nimport { GalleryContext } from '../context';\n\nconst SUBTITLES_ANIMATION_SPEED = 0.5;\n\nexport const useCustomSubtitles = () => {\n const { getCurrentImageMeta } = useContext(GalleryContext);\n\n const meta = getCurrentImageMeta();\n\n const [showSub, setShowSub] = useState(false);\n const [currentSub, setCurrentSub] = useState('');\n\n const player = meta?.player?.current;\n\n useEffect(() => {\n const intervalId = setInterval(() => {\n if (!player) {\n return;\n }\n\n const textTrack = [...(Array.from(player.textTracks) || [])].find(\n (track) => track.kind === 'subtitles',\n );\n const activeCue = textTrack?.activeCues?.[0] as VTTCue | undefined;\n\n if (!activeCue?.text) {\n setShowSub(false);\n\n return;\n }\n\n const isVisible =\n player?.currentTime >= activeCue.startTime &&\n player?.currentTime <= activeCue.endTime - SUBTITLES_ANIMATION_SPEED;\n\n setCurrentSub(activeCue.text);\n setShowSub(isVisible);\n });\n\n return () => {\n clearInterval(intervalId);\n };\n }, [player]);\n\n return {\n showSub,\n currentSub,\n };\n};\n"],"names":[],"mappings":";;;AAIA,MAAM,yBAAyB,GAAG,GAAG;AAE9B,MAAM,kBAAkB,GAAG,MAAK;IACnC,MAAM,EAAE,mBAAmB,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;AAE1D,IAAA,MAAM,IAAI,GAAG,mBAAmB,EAAE;IAElC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC;AAEhD,IAAA,MAAM,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,OAAO;IAEpC,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,UAAU,GAAG,WAAW,CAAC,MAAK;YAChC,IAAI,CAAC,MAAM,EAAE;gBACT;AACH;AAED,YAAA,MAAM,SAAS,GAAG,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAC7D,CAAC,KAAK,KAAK,KAAK,CAAC,IAAI,KAAK,WAAW,CACxC;YACD,MAAM,SAAS,GAAG,SAAS,EAAE,UAAU,GAAG,CAAC,CAAuB;AAElE,YAAA,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE;gBAClB,UAAU,CAAC,KAAK,CAAC;gBAEjB;AACH;YAED,MAAM,SAAS,GACX,MAAM,EAAE,WAAW,IAAI,SAAS,CAAC,SAAS;gBAC1C,MAAM,EAAE,WAAW,IAAI,SAAS,CAAC,OAAO,GAAG,yBAAyB;AAExE,YAAA,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC;YAC7B,UAAU,CAAC,SAAS,CAAC;AACzB,SAAC,CAAC;AAEF,QAAA,OAAO,MAAK;YACR,aAAa,CAAC,UAAU,CAAC;AAC7B,SAAC;AACL,KAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IAEZ,OAAO;QACH,OAAO;QACP,UAAU;KACb;AACL;;;;"}
1
+ {"version":3,"file":"use-custom-subtitles.js","sources":["../../src/hooks/use-custom-subtitles.ts"],"sourcesContent":["import { useContext, useEffect, useState } from 'react';\n\nimport { GalleryContext } from '../context';\n\nconst SUBTITLES_ANIMATION_SPEED = 0.5;\n\nexport const useCustomSubtitles = () => {\n const { getCurrentImageMeta } = useContext(GalleryContext);\n\n const meta = getCurrentImageMeta();\n\n const [showSub, setShowSub] = useState(false);\n const [currentSub, setCurrentSub] = useState('');\n\n const player = meta?.player?.current;\n\n useEffect(() => {\n const intervalId = setInterval(() => {\n if (!player) {\n return;\n }\n\n const textTrack = [...(Array.from(player.textTracks) || [])].find(\n (track) => track.kind === 'subtitles',\n );\n const activeCue = textTrack?.activeCues?.[0] as VTTCue | undefined;\n\n if (!activeCue?.text) {\n setShowSub(false);\n\n return;\n }\n\n const isVisible =\n player?.currentTime >= activeCue.startTime &&\n player?.currentTime <= activeCue.endTime - SUBTITLES_ANIMATION_SPEED;\n\n setCurrentSub(activeCue.text);\n setShowSub(isVisible);\n });\n\n return () => {\n clearInterval(intervalId);\n };\n }, [player]);\n\n return {\n showSub,\n currentSub,\n };\n};\n"],"names":[],"mappings":";;;AAIA,MAAM,yBAAyB,GAAG,GAAG;AAE9B,MAAM,kBAAkB,GAAG,MAAK;IACnC,MAAM,EAAE,mBAAmB,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;AAE1D,IAAA,MAAM,IAAI,GAAG,mBAAmB,EAAE;IAElC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC;AAEhD,IAAA,MAAM,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,OAAO;IAEpC,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,UAAU,GAAG,WAAW,CAAC,MAAK;YAChC,IAAI,CAAC,MAAM,EAAE;gBACT;;AAGJ,YAAA,MAAM,SAAS,GAAG,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,CAC7D,CAAC,KAAK,KAAK,KAAK,CAAC,IAAI,KAAK,WAAW,CACxC;YACD,MAAM,SAAS,GAAG,SAAS,EAAE,UAAU,GAAG,CAAC,CAAuB;AAElE,YAAA,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE;gBAClB,UAAU,CAAC,KAAK,CAAC;gBAEjB;;YAGJ,MAAM,SAAS,GACX,MAAM,EAAE,WAAW,IAAI,SAAS,CAAC,SAAS;gBAC1C,MAAM,EAAE,WAAW,IAAI,SAAS,CAAC,OAAO,GAAG,yBAAyB;AAExE,YAAA,aAAa,CAAC,SAAS,CAAC,IAAI,CAAC;YAC7B,UAAU,CAAC,SAAS,CAAC;AACzB,SAAC,CAAC;AAEF,QAAA,OAAO,MAAK;YACR,aAAa,CAAC,UAAU,CAAC;AAC7B,SAAC;AACL,KAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IAEZ,OAAO;QACH,OAAO;QACP,UAAU;KACb;AACL;;;;"}
package/modern/index.css CHANGED
@@ -13,7 +13,7 @@
13
13
  --sat: env(safe-area-inset-top, var(--gap-0));
14
14
  --sab: env(safe-area-inset-bottom, var(--gap-0));
15
15
  }
16
- .gallery__container_j5zem {
16
+ .gallery__container_83eok {
17
17
  position: relative;
18
18
  overflow-x: hidden;
19
19
  overflow-y: auto;
@@ -26,16 +26,16 @@
26
26
  padding-top: var(--sat);
27
27
  padding-bottom: var(--sab);
28
28
  }
29
- .gallery__container_j5zem.gallery__mobile_j5zem {
29
+ .gallery__container_83eok.gallery__mobile_83eok {
30
30
  overflow: hidden;
31
31
  }
32
- .gallery__modal_j5zem {
32
+ .gallery__modal_83eok {
33
33
  flex-grow: 1;
34
34
  width: 100vw;
35
35
  height: 100vh;
36
36
  background: transparent;
37
37
  }
38
- .gallery__navigationVideo_j5zem {
38
+ .gallery__navigationVideo_83eok {
39
39
  z-index: 3;
40
40
  width: 100%;
41
41
  position: absolute;
@@ -44,18 +44,18 @@
44
44
  transition: transform 0.3s ease-in-out;
45
45
  text-align: center;
46
46
  }
47
- .gallery__hide_j5zem {
47
+ .gallery__hide_83eok {
48
48
  transform: translateY(114px);
49
49
  }
50
- .gallery__hideInfo_j5zem {
50
+ .gallery__hideInfo_83eok {
51
51
  transform: translateY(48px);
52
52
  }
53
- .gallery__bottomButton_j5zem {
53
+ .gallery__bottomButton_83eok {
54
54
  width: calc(100% - var(--gap-32));
55
55
  margin: var(--gap-16);
56
56
  background-color: var(--color-static-neutral-translucent-500-inverted);
57
57
  }
58
- .gallery__subtitles_j5zem {
58
+ .gallery__subtitles_83eok {
59
59
  padding: var(--gap-0) var(--gap-32);
60
60
  margin-bottom: var(--gap-16);
61
61
  width: 100%;
@@ -66,6 +66,6 @@
66
66
  opacity 500ms ease-in-out,
67
67
  margin-bottom 270ms ease-in-out;
68
68
  }
69
- .gallery__hideSubtitles_j5zem {
69
+ .gallery__hideSubtitles_83eok {
70
70
  opacity: 0;
71
71
  }
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"container":"gallery__container_j5zem","mobile":"gallery__mobile_j5zem","modal":"gallery__modal_j5zem","navigationVideo":"gallery__navigationVideo_j5zem","hide":"gallery__hide_j5zem","hideInfo":"gallery__hideInfo_j5zem","bottomButton":"gallery__bottomButton_j5zem"};
3
+ const styles = {"container":"gallery__container_83eok","mobile":"gallery__mobile_83eok","modal":"gallery__modal_83eok","navigationVideo":"gallery__navigationVideo_83eok","hide":"gallery__hide_83eok","hideInfo":"gallery__hideInfo_83eok","bottomButton":"gallery__bottomButton_83eok"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { type MouseEvent, type RefObject } from 'react';
2
- export declare type TBottomButton = {
2
+ export type TBottomButton = {
3
3
  text: string;
4
4
  onClick: (e: MouseEvent) => void;
5
5
  /**
@@ -7,12 +7,13 @@ export declare type TBottomButton = {
7
7
  */
8
8
  timeout?: number;
9
9
  };
10
- export declare type GalleryImage = {
10
+ export type GalleryImage = {
11
11
  src: string;
12
12
  name?: string;
13
13
  previewSrc?: string;
14
14
  alt?: string;
15
15
  canDownload?: boolean;
16
+ canShare?: boolean;
16
17
  /**
17
18
  * Нижняя кнопка, есть только у видео
18
19
  */
@@ -34,7 +35,7 @@ export declare type GalleryImage = {
34
35
  */
35
36
  onUnmute?: () => void;
36
37
  };
37
- export declare type ImageMeta = {
38
+ export type ImageMeta = {
38
39
  width: number;
39
40
  height: number;
40
41
  broken?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"split-filename.js","sources":["../../src/utils/split-filename.ts"],"sourcesContent":["const SEPARATION_POSITION_SHIFT = 3;\n\nexport function splitFilename(filename: string): [string, string] {\n const dotPosition = filename.lastIndexOf('.');\n\n let head = filename;\n let tail = '';\n\n const splitPosition = dotPosition - SEPARATION_POSITION_SHIFT;\n\n if (splitPosition > 0) {\n head = filename.slice(0, splitPosition);\n tail = filename.slice(splitPosition);\n }\n\n return [head, tail];\n}\n"],"names":[],"mappings":"AAAA,MAAM,yBAAyB,GAAG,CAAC;AAE7B,SAAU,aAAa,CAAC,QAAgB,EAAA;IAC1C,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,CAAC,GAAG,CAAC;IAE7C,IAAI,IAAI,GAAG,QAAQ;IACnB,IAAI,IAAI,GAAG,EAAE;AAEb,IAAA,MAAM,aAAa,GAAG,WAAW,GAAG,yBAAyB;IAE7D,IAAI,aAAa,GAAG,CAAC,EAAE;QACnB,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,aAAa,CAAC;AACvC,QAAA,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC;AACvC;AAED,IAAA,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC;AACvB;;;;"}
1
+ {"version":3,"file":"split-filename.js","sources":["../../src/utils/split-filename.ts"],"sourcesContent":["const SEPARATION_POSITION_SHIFT = 3;\n\nexport function splitFilename(filename: string): [string, string] {\n const dotPosition = filename.lastIndexOf('.');\n\n let head = filename;\n let tail = '';\n\n const splitPosition = dotPosition - SEPARATION_POSITION_SHIFT;\n\n if (splitPosition > 0) {\n head = filename.slice(0, splitPosition);\n tail = filename.slice(splitPosition);\n }\n\n return [head, tail];\n}\n"],"names":[],"mappings":"AAAA,MAAM,yBAAyB,GAAG,CAAC;AAE7B,SAAU,aAAa,CAAC,QAAgB,EAAA;IAC1C,MAAM,WAAW,GAAG,QAAQ,CAAC,WAAW,CAAC,GAAG,CAAC;IAE7C,IAAI,IAAI,GAAG,QAAQ;IACnB,IAAI,IAAI,GAAG,EAAE;AAEb,IAAA,MAAM,aAAa,GAAG,WAAW,GAAG,yBAAyB;AAE7D,IAAA,IAAI,aAAa,GAAG,CAAC,EAAE;QACnB,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,aAAa,CAAC;AACvC,QAAA,IAAI,GAAG,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC;;AAGxC,IAAA,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC;AACvB;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"utils.js","sources":["../../src/utils/utils.ts"],"sourcesContent":["import { type GalleryImage, type ImageMeta } from '../types';\n\nexport const PLACEHOLDER_WIDTH = 400;\nexport const PLACEHOLDER_HEIGHT = 300;\n\nexport const getImageKey = ({ name = '', src }: GalleryImage, index: number): string =>\n `${name}-${index}-${src}`;\n\nexport const getImageAlt = ({ alt, name }: GalleryImage, index: number): string =>\n alt || name || `Изображение ${index + 1}`;\n\nexport const isSmallImage = (meta?: ImageMeta) => {\n if (meta?.width && meta.height) {\n return meta.width < PLACEHOLDER_WIDTH && meta.height < PLACEHOLDER_HEIGHT;\n }\n\n return false;\n};\n\nexport const isVideo = (url: string | undefined) =>\n ['.webm', '.mp4', '.m3u8'].some((item) => url?.endsWith(item));\n"],"names":[],"mappings":"AAEO,MAAM,iBAAiB,GAAG;AAC1B,MAAM,kBAAkB,GAAG;AAErB,MAAA,WAAW,GAAG,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,EAAgB,EAAE,KAAa,KACvE,CAAG,EAAA,IAAI,IAAI,KAAK,CAAA,CAAA,EAAI,GAAG,CAAA;AAEd,MAAA,WAAW,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,EAAgB,EAAE,KAAa,KAClE,GAAG,IAAI,IAAI,IAAI,eAAe,KAAK,GAAG,CAAC,CAAA;AAE9B,MAAA,YAAY,GAAG,CAAC,IAAgB,KAAI;AAC7C,IAAA,IAAI,IAAI,EAAE,KAAK,IAAI,IAAI,CAAC,MAAM,EAAE;QAC5B,OAAO,IAAI,CAAC,KAAK,GAAG,iBAAiB,IAAI,IAAI,CAAC,MAAM,GAAG,kBAAkB;AAC5E;AAED,IAAA,OAAO,KAAK;AAChB;AAEO,MAAM,OAAO,GAAG,CAAC,GAAuB,KAC3C,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,GAAG,EAAE,QAAQ,CAAC,IAAI,CAAC;;;;"}
1
+ {"version":3,"file":"utils.js","sources":["../../src/utils/utils.ts"],"sourcesContent":["import { type GalleryImage, type ImageMeta } from '../types';\n\nexport const PLACEHOLDER_WIDTH = 400;\nexport const PLACEHOLDER_HEIGHT = 300;\n\nexport const getImageKey = ({ name = '', src }: GalleryImage, index: number): string =>\n `${name}-${index}-${src}`;\n\nexport const getImageAlt = ({ alt, name }: GalleryImage, index: number): string =>\n alt || name || `Изображение ${index + 1}`;\n\nexport const isSmallImage = (meta?: ImageMeta) => {\n if (meta?.width && meta.height) {\n return meta.width < PLACEHOLDER_WIDTH && meta.height < PLACEHOLDER_HEIGHT;\n }\n\n return false;\n};\n\nexport const isVideo = (url: string | undefined) =>\n ['.webm', '.mp4', '.m3u8'].some((item) => url?.endsWith(item));\n"],"names":[],"mappings":"AAEO,MAAM,iBAAiB,GAAG;AAC1B,MAAM,kBAAkB,GAAG;AAErB,MAAA,WAAW,GAAG,CAAC,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,EAAgB,EAAE,KAAa,KACvE,CAAG,EAAA,IAAI,IAAI,KAAK,CAAA,CAAA,EAAI,GAAG,CAAA;AAEd,MAAA,WAAW,GAAG,CAAC,EAAE,GAAG,EAAE,IAAI,EAAgB,EAAE,KAAa,KAClE,GAAG,IAAI,IAAI,IAAI,eAAe,KAAK,GAAG,CAAC,CAAA;AAE9B,MAAA,YAAY,GAAG,CAAC,IAAgB,KAAI;IAC7C,IAAI,IAAI,EAAE,KAAK,IAAI,IAAI,CAAC,MAAM,EAAE;QAC5B,OAAO,IAAI,CAAC,KAAK,GAAG,iBAAiB,IAAI,IAAI,CAAC,MAAM,GAAG,kBAAkB;;AAG7E,IAAA,OAAO,KAAK;AAChB;AAEO,MAAM,OAAO,GAAG,CAAC,GAAuB,KAC3C,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,KAAK,GAAG,EAAE,QAAQ,CAAC,IAAI,CAAC;;;;"}
@@ -1,6 +1,6 @@
1
1
  import { type FC } from 'react';
2
2
  import { type GalleryImage } from './types';
3
- export declare type GalleryProps = {
3
+ export type GalleryProps = {
4
4
  /**
5
5
  * Управление видимостью
6
6
  */
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { type FC, type MouseEvent, useCallback, useEffect, useState } from 'react';\nimport cn from 'classnames';\nimport type SwiperCore from 'swiper';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { BottomButton } from './components/bottom-button';\nimport { Single } from './components/image-viewer/single';\nimport { Subtitles } from './components/subtitles';\nimport { Header, HeaderMobile, ImageViewer, InfoBar, NavigationBar } from './components';\nimport { SWIPE_THRESHOLD } from './constants';\nimport { GalleryContext } from './context';\nimport { type GalleryImage, type ImageMeta } from './types';\n\nimport styles from './index.module.css';\n\nexport type GalleryProps = {\n /**\n * Управление видимостью\n */\n open: boolean;\n\n /**\n * Массив изображений\n */\n images: GalleryImage[];\n\n /**\n * Зациклить галерею\n * @default true\n */\n loop?: boolean;\n\n /**\n * Индекс открытого изображение\n * @default 0\n */\n initialSlide?: number;\n\n /**\n * Обработчик закрытия\n */\n onClose: () => void;\n\n /**\n * Индекс текущего изображения\n */\n slideIndex?: number;\n\n /**\n * Обработчик изменения текущего изображения\n */\n onSlideIndexChange?: (index: number) => void;\n\n /**\n * Дополнительный класс для попапа\n */\n popupClassName?: string;\n};\n\nconst DEFAULT_FULL_SCREEN = false;\nconst DEFAULT_MUTED_VIDEO = true;\nconst DEFAULT_PLAYING_VIDEO = true;\nconst DEFAULT_HIDE_NAVIGATION = false;\n\nconst Backdrop = () => null;\n\nexport const Gallery: FC<GalleryProps> = ({\n open,\n images,\n slideIndex,\n initialSlide = 0,\n loop = true,\n onClose,\n onSlideIndexChange,\n popupClassName,\n}) => {\n const currentSlideIndexState = useState(initialSlide);\n const uncontrolled = slideIndex === undefined;\n const [currentSlideIndex, setCurrentSlideIndex] = uncontrolled\n ? currentSlideIndexState\n : [slideIndex, onSlideIndexChange];\n\n const [swiper, setSwiper] = useState<SwiperCore>();\n const [imagesMeta, setImagesMeta] = useState<ImageMeta[]>([]);\n const [fullScreen, setFullScreen] = useState<boolean>(DEFAULT_FULL_SCREEN);\n const [mutedVideo, setMutedVideo] = useState<boolean>(DEFAULT_MUTED_VIDEO);\n const [playingVideo, setPlayingVideo] = useState<boolean>(DEFAULT_PLAYING_VIDEO);\n const [hideNavigation, setHideNavigation] = useState<boolean>(DEFAULT_HIDE_NAVIGATION);\n\n const isDesktop = useIsDesktop();\n\n const isCurrentVideo = !!imagesMeta[currentSlideIndex]?.player?.current;\n\n const bottomButton = images[currentSlideIndex]?.bottomButton;\n\n const slideTo = useCallback(\n (index: number) => {\n if (images[index]) {\n setCurrentSlideIndex?.(index);\n\n if (swiper) {\n setPlayingVideo(true);\n swiper.slideTo(index);\n }\n }\n },\n [images, setCurrentSlideIndex, swiper],\n );\n\n const slideNext = useCallback(() => {\n const lastIndex = images.length - 1;\n\n let nextIndex = currentSlideIndex + 1;\n\n if (nextIndex >= images.length) {\n nextIndex = loop ? 0 : lastIndex;\n }\n\n slideTo(nextIndex);\n }, [images.length, loop, currentSlideIndex, slideTo]);\n\n const slidePrev = useCallback(() => {\n const lastIndex = images.length - 1;\n\n let nextIndex = currentSlideIndex - 1;\n\n if (nextIndex < 0) {\n nextIndex = loop ? lastIndex : 0;\n }\n\n slideTo(nextIndex);\n }, [images.length, loop, currentSlideIndex, slideTo]);\n\n const setImageMeta = useCallback(\n (meta: ImageMeta, index: number) => {\n imagesMeta[index] = meta;\n\n setImagesMeta(imagesMeta.slice());\n },\n [imagesMeta],\n );\n\n const handleBottomButtonClick = useCallback(\n (e: MouseEvent) => {\n e.stopPropagation();\n if (bottomButton?.onClick) {\n bottomButton.onClick(e);\n }\n },\n [bottomButton],\n );\n\n const handleClose = useCallback(() => {\n onClose();\n\n if (uncontrolled) {\n setCurrentSlideIndex?.(initialSlide);\n }\n\n setFullScreen(false);\n }, [initialSlide, onClose, setCurrentSlideIndex, uncontrolled]);\n\n const handleEscapeKeyDown = () => {\n if (fullScreen) {\n setFullScreen(false);\n } else {\n handleClose();\n }\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (!open || fullScreen) {\n return;\n }\n\n switch (event.key) {\n case 'ArrowLeft':\n slidePrev();\n break;\n case 'ArrowRight':\n slideNext();\n break;\n }\n },\n [fullScreen, open, slideNext, slidePrev],\n );\n\n const onUnmount = useCallback(() => {\n setPlayingVideo(DEFAULT_PLAYING_VIDEO);\n setMutedVideo(DEFAULT_MUTED_VIDEO);\n }, [setPlayingVideo]);\n\n useEffect(() => {\n if (!uncontrolled && !swiper?.destroyed) {\n swiper?.slideTo(currentSlideIndex);\n }\n }, [uncontrolled, currentSlideIndex, swiper]);\n\n useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [handleKeyDown]);\n\n useEffect(() => {\n let startY: number;\n const abortController = new AbortController();\n const { signal } = abortController;\n\n document.addEventListener(\n 'touchstart',\n (e) => {\n startY = e.touches[0].clientY;\n },\n { signal },\n );\n\n document.addEventListener(\n 'touchmove',\n (e) => {\n const endY = e.changedTouches[0].clientY;\n const deltaY = startY - endY;\n\n // Если свайп вниз, закрываем галерею\n if (deltaY < SWIPE_THRESHOLD) {\n onClose();\n }\n },\n { signal },\n );\n\n return () => {\n abortController.abort();\n };\n }, [onClose]);\n\n const singleSlide = images.length === 1;\n\n const showNavigationBar = !singleSlide && !fullScreen;\n\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n const galleryContext: GalleryContext = {\n view: isDesktop ? 'desktop' : 'mobile',\n singleSlide,\n currentSlideIndex,\n images,\n imagesMeta,\n fullScreen,\n initialSlide: uncontrolled ? initialSlide : currentSlideIndex,\n setFullScreen,\n playingVideo,\n setPlayingVideo,\n mutedVideo,\n setMutedVideo,\n hideNavigation,\n setHideNavigation,\n setImageMeta,\n slideNext,\n slidePrev,\n slideTo,\n getSwiper: () => swiper,\n setSwiper,\n onClose: handleClose,\n setCurrentSlideIndex,\n getCurrentImage: () => images[currentSlideIndex],\n getCurrentImageMeta: () => imagesMeta[currentSlideIndex],\n };\n\n return (\n <GalleryContext.Provider value={galleryContext}>\n <BaseModal\n open={open}\n className={cn(styles.modal, popupClassName)}\n onEscapeKeyDown={handleEscapeKeyDown}\n Backdrop={Backdrop}\n onUnmount={onUnmount}\n >\n <div\n className={cn(styles.container, {\n [styles.mobile]: !isDesktop,\n })}\n >\n {isDesktop ? <Header /> : <HeaderMobile />}\n {images.length === 1 ? <Single /> : <ImageViewer />}\n <nav\n className={cn({\n [styles.navigationVideo]: isCurrentVideo && !isDesktop,\n [styles.hide]: showNavigationBar && hideNavigation && !isDesktop,\n [styles.hideInfo]: !showNavigationBar && hideNavigation && !isDesktop,\n })}\n >\n {!isDesktop && <Subtitles />}\n {isCurrentVideo && !isDesktop && bottomButton && (\n <BottomButton\n bottomButton={bottomButton}\n onClick={handleBottomButtonClick}\n className={styles.bottomButton}\n />\n )}\n\n {showNavigationBar && <NavigationBar />}\n {!isDesktop && <InfoBar />}\n </nav>\n </div>\n </BaseModal>\n </GalleryContext.Provider>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Component.js","sources":["../src/Component.tsx"],"sourcesContent":["import React, { type FC, type MouseEvent, useCallback, useEffect, useState } from 'react';\nimport cn from 'classnames';\nimport type SwiperCore from 'swiper';\n\nimport { BaseModal } from '@alfalab/core-components-base-modal';\nimport { useIsDesktop } from '@alfalab/core-components-mq';\n\nimport { BottomButton } from './components/bottom-button';\nimport { Single } from './components/image-viewer/single';\nimport { Subtitles } from './components/subtitles';\nimport { Header, HeaderMobile, ImageViewer, InfoBar, NavigationBar } from './components';\nimport { SWIPE_THRESHOLD } from './constants';\nimport { GalleryContext } from './context';\nimport { type GalleryImage, type ImageMeta } from './types';\n\nimport styles from './index.module.css';\n\nexport type GalleryProps = {\n /**\n * Управление видимостью\n */\n open: boolean;\n\n /**\n * Массив изображений\n */\n images: GalleryImage[];\n\n /**\n * Зациклить галерею\n * @default true\n */\n loop?: boolean;\n\n /**\n * Индекс открытого изображение\n * @default 0\n */\n initialSlide?: number;\n\n /**\n * Обработчик закрытия\n */\n onClose: () => void;\n\n /**\n * Индекс текущего изображения\n */\n slideIndex?: number;\n\n /**\n * Обработчик изменения текущего изображения\n */\n onSlideIndexChange?: (index: number) => void;\n\n /**\n * Дополнительный класс для попапа\n */\n popupClassName?: string;\n};\n\nconst DEFAULT_FULL_SCREEN = false;\nconst DEFAULT_MUTED_VIDEO = true;\nconst DEFAULT_PLAYING_VIDEO = true;\nconst DEFAULT_HIDE_NAVIGATION = false;\n\nconst Backdrop = () => null;\n\nexport const Gallery: FC<GalleryProps> = ({\n open,\n images,\n slideIndex,\n initialSlide = 0,\n loop = true,\n onClose,\n onSlideIndexChange,\n popupClassName,\n}) => {\n const currentSlideIndexState = useState(initialSlide);\n const uncontrolled = slideIndex === undefined;\n const [currentSlideIndex, setCurrentSlideIndex] = uncontrolled\n ? currentSlideIndexState\n : [slideIndex, onSlideIndexChange];\n\n const [swiper, setSwiper] = useState<SwiperCore>();\n const [imagesMeta, setImagesMeta] = useState<ImageMeta[]>([]);\n const [fullScreen, setFullScreen] = useState<boolean>(DEFAULT_FULL_SCREEN);\n const [mutedVideo, setMutedVideo] = useState<boolean>(DEFAULT_MUTED_VIDEO);\n const [playingVideo, setPlayingVideo] = useState<boolean>(DEFAULT_PLAYING_VIDEO);\n const [hideNavigation, setHideNavigation] = useState<boolean>(DEFAULT_HIDE_NAVIGATION);\n\n const isDesktop = useIsDesktop();\n\n const isCurrentVideo = !!imagesMeta[currentSlideIndex]?.player?.current;\n\n const bottomButton = images[currentSlideIndex]?.bottomButton;\n\n const slideTo = useCallback(\n (index: number) => {\n if (images[index]) {\n setCurrentSlideIndex?.(index);\n\n if (swiper) {\n setPlayingVideo(true);\n swiper.slideTo(index);\n }\n }\n },\n [images, setCurrentSlideIndex, swiper],\n );\n\n const slideNext = useCallback(() => {\n const lastIndex = images.length - 1;\n\n let nextIndex = currentSlideIndex + 1;\n\n if (nextIndex >= images.length) {\n nextIndex = loop ? 0 : lastIndex;\n }\n\n slideTo(nextIndex);\n }, [images.length, loop, currentSlideIndex, slideTo]);\n\n const slidePrev = useCallback(() => {\n const lastIndex = images.length - 1;\n\n let nextIndex = currentSlideIndex - 1;\n\n if (nextIndex < 0) {\n nextIndex = loop ? lastIndex : 0;\n }\n\n slideTo(nextIndex);\n }, [images.length, loop, currentSlideIndex, slideTo]);\n\n const setImageMeta = useCallback(\n (meta: ImageMeta, index: number) => {\n imagesMeta[index] = meta;\n\n setImagesMeta(imagesMeta.slice());\n },\n [imagesMeta],\n );\n\n const handleBottomButtonClick = useCallback(\n (e: MouseEvent) => {\n e.stopPropagation();\n if (bottomButton?.onClick) {\n bottomButton.onClick(e);\n }\n },\n [bottomButton],\n );\n\n const handleClose = useCallback(() => {\n onClose();\n\n if (uncontrolled) {\n setCurrentSlideIndex?.(initialSlide);\n }\n\n setFullScreen(false);\n }, [initialSlide, onClose, setCurrentSlideIndex, uncontrolled]);\n\n const handleEscapeKeyDown = () => {\n if (fullScreen) {\n setFullScreen(false);\n } else {\n handleClose();\n }\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (!open || fullScreen) {\n return;\n }\n\n switch (event.key) {\n case 'ArrowLeft':\n slidePrev();\n break;\n case 'ArrowRight':\n slideNext();\n break;\n }\n },\n [fullScreen, open, slideNext, slidePrev],\n );\n\n const onUnmount = useCallback(() => {\n setPlayingVideo(DEFAULT_PLAYING_VIDEO);\n setMutedVideo(DEFAULT_MUTED_VIDEO);\n }, [setPlayingVideo]);\n\n useEffect(() => {\n if (!uncontrolled && !swiper?.destroyed) {\n swiper?.slideTo(currentSlideIndex);\n }\n }, [uncontrolled, currentSlideIndex, swiper]);\n\n useEffect(() => {\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [handleKeyDown]);\n\n useEffect(() => {\n let startY: number;\n const abortController = new AbortController();\n const { signal } = abortController;\n\n document.addEventListener(\n 'touchstart',\n (e) => {\n startY = e.touches[0].clientY;\n },\n { signal },\n );\n\n document.addEventListener(\n 'touchmove',\n (e) => {\n const endY = e.changedTouches[0].clientY;\n const deltaY = startY - endY;\n\n // Если свайп вниз, закрываем галерею\n if (deltaY < SWIPE_THRESHOLD) {\n onClose();\n }\n },\n { signal },\n );\n\n return () => {\n abortController.abort();\n };\n }, [onClose]);\n\n const singleSlide = images.length === 1;\n\n const showNavigationBar = !singleSlide && !fullScreen;\n\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n const galleryContext: GalleryContext = {\n view: isDesktop ? 'desktop' : 'mobile',\n singleSlide,\n currentSlideIndex,\n images,\n imagesMeta,\n fullScreen,\n initialSlide: uncontrolled ? initialSlide : currentSlideIndex,\n setFullScreen,\n playingVideo,\n setPlayingVideo,\n mutedVideo,\n setMutedVideo,\n hideNavigation,\n setHideNavigation,\n setImageMeta,\n slideNext,\n slidePrev,\n slideTo,\n getSwiper: () => swiper,\n setSwiper,\n onClose: handleClose,\n setCurrentSlideIndex,\n getCurrentImage: () => images[currentSlideIndex],\n getCurrentImageMeta: () => imagesMeta[currentSlideIndex],\n };\n\n return (\n <GalleryContext.Provider value={galleryContext}>\n <BaseModal\n open={open}\n className={cn(styles.modal, popupClassName)}\n onEscapeKeyDown={handleEscapeKeyDown}\n Backdrop={Backdrop}\n onUnmount={onUnmount}\n >\n <div\n className={cn(styles.container, {\n [styles.mobile]: !isDesktop,\n })}\n >\n {isDesktop ? <Header /> : <HeaderMobile />}\n {images.length === 1 ? <Single /> : <ImageViewer />}\n <nav\n className={cn({\n [styles.navigationVideo]: isCurrentVideo && !isDesktop,\n [styles.hide]: showNavigationBar && hideNavigation && !isDesktop,\n [styles.hideInfo]: !showNavigationBar && hideNavigation && !isDesktop,\n })}\n >\n {!isDesktop && <Subtitles />}\n {isCurrentVideo && !isDesktop && bottomButton && (\n <BottomButton\n bottomButton={bottomButton}\n onClick={handleBottomButtonClick}\n className={styles.bottomButton}\n />\n )}\n\n {showNavigationBar && <NavigationBar />}\n {!isDesktop && <InfoBar />}\n </nav>\n </div>\n </BaseModal>\n </GalleryContext.Provider>\n );\n};\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import React, { type MouseEvent } from 'react';
2
2
  import { type TBottomButton } from '../../types';
3
- declare type Props = {
3
+ type Props = {
4
4
  onClick: (e: MouseEvent) => void;
5
5
  className?: string;
6
6
  bottomButton: TBottomButton;
@@ -1 +1 @@
1
- {"version":3,"file":"Component.js","sources":["../../../src/components/bottom-button/Component.tsx"],"sourcesContent":["import React, { type MouseEvent, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { Button } from '@alfalab/core-components-button';\nimport { Typography } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { type TBottomButton } from '../../types';\n\nimport styles from './index.module.css';\n\ntype Props = {\n onClick: (e: MouseEvent) => void;\n className?: string;\n bottomButton: TBottomButton;\n};\n\nexport const BottomButton = ({ onClick, className, bottomButton }: Props) => {\n const timer = useRef<ReturnType<typeof setTimeout>>();\n\n const [visible, setVisible] = useState<boolean>(false);\n const { currentSlideIndex, getSwiper, singleSlide } = useContext(GalleryContext);\n\n useEffect(() => {\n const swiper = getSwiper();\n\n if ((currentSlideIndex === swiper?.activeIndex || singleSlide) && bottomButton.timeout) {\n if (timer.current) {\n clearTimeout(timer.current);\n }\n setVisible(false);\n timer.current = setTimeout(() => setVisible(true), bottomButton.timeout * 1000);\n }\n /* eslint-disable-next-line react-hooks/exhaustive-deps */\n }, [bottomButton.timeout, currentSlideIndex, singleSlide]);\n\n return (\n <Button\n size={56}\n className={cn(\n styles.component,\n { [styles.notVisible]: !visible && bottomButton.timeout },\n className,\n )}\n onClick={onClick}\n >\n <Typography.Text color='static-primary-light'>{bottomButton.text}</Typography.Text>\n </Button>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAiBO,MAAM,YAAY,GAAG,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAS,KAAI;AACxE,IAAA,MAAM,KAAK,GAAG,MAAM,EAAiC;IAErD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC;AACtD,IAAA,MAAM,EAAE,iBAAiB,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;IAEhF,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,MAAM,GAAG,SAAS,EAAE;AAE1B,QAAA,IAAI,CAAC,iBAAiB,KAAK,MAAM,EAAE,WAAW,IAAI,WAAW,KAAK,YAAY,CAAC,OAAO,EAAE;YACpF,IAAI,KAAK,CAAC,OAAO,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC;AAC9B;YACD,UAAU,CAAC,KAAK,CAAC;AACjB,YAAA,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC,MAAM,UAAU,CAAC,IAAI,CAAC,EAAE,YAAY,CAAC,OAAO,GAAG,IAAI,CAAC;AAClF;;KAEJ,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,iBAAiB,EAAE,WAAW,CAAC,CAAC;AAE1D,IAAA,QACI,KAAC,CAAA,aAAA,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,EAAE,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,EAAE,CAAC,MAAM,CAAC,UAAU,GAAG,CAAC,OAAO,IAAI,YAAY,CAAC,OAAO,EAAE,EACzD,SAAS,CACZ,EACD,OAAO,EAAE,OAAO,EAAA;AAEhB,QAAA,KAAA,CAAA,aAAA,CAAC,UAAU,CAAC,IAAI,EAAA,EAAC,KAAK,EAAC,sBAAsB,EAAE,EAAA,YAAY,CAAC,IAAI,CAAmB,CAC9E;AAEjB;;;;"}
1
+ {"version":3,"file":"Component.js","sources":["../../../src/components/bottom-button/Component.tsx"],"sourcesContent":["import React, { type MouseEvent, useContext, useEffect, useRef, useState } from 'react';\nimport cn from 'classnames';\n\nimport { Button } from '@alfalab/core-components-button';\nimport { Typography } from '@alfalab/core-components-typography';\n\nimport { GalleryContext } from '../../context';\nimport { type TBottomButton } from '../../types';\n\nimport styles from './index.module.css';\n\ntype Props = {\n onClick: (e: MouseEvent) => void;\n className?: string;\n bottomButton: TBottomButton;\n};\n\nexport const BottomButton = ({ onClick, className, bottomButton }: Props) => {\n const timer = useRef<ReturnType<typeof setTimeout>>();\n\n const [visible, setVisible] = useState<boolean>(false);\n const { currentSlideIndex, getSwiper, singleSlide } = useContext(GalleryContext);\n\n useEffect(() => {\n const swiper = getSwiper();\n\n if ((currentSlideIndex === swiper?.activeIndex || singleSlide) && bottomButton.timeout) {\n if (timer.current) {\n clearTimeout(timer.current);\n }\n setVisible(false);\n timer.current = setTimeout(() => setVisible(true), bottomButton.timeout * 1000);\n }\n /* eslint-disable-next-line react-hooks/exhaustive-deps */\n }, [bottomButton.timeout, currentSlideIndex, singleSlide]);\n\n return (\n <Button\n size={56}\n className={cn(\n styles.component,\n { [styles.notVisible]: !visible && bottomButton.timeout },\n className,\n )}\n onClick={onClick}\n >\n <Typography.Text color='static-primary-light'>{bottomButton.text}</Typography.Text>\n </Button>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAiBO,MAAM,YAAY,GAAG,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAS,KAAI;AACxE,IAAA,MAAM,KAAK,GAAG,MAAM,EAAiC;IAErD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC;AACtD,IAAA,MAAM,EAAE,iBAAiB,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,UAAU,CAAC,cAAc,CAAC;IAEhF,SAAS,CAAC,MAAK;AACX,QAAA,MAAM,MAAM,GAAG,SAAS,EAAE;AAE1B,QAAA,IAAI,CAAC,iBAAiB,KAAK,MAAM,EAAE,WAAW,IAAI,WAAW,KAAK,YAAY,CAAC,OAAO,EAAE;AACpF,YAAA,IAAI,KAAK,CAAC,OAAO,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC;;YAE/B,UAAU,CAAC,KAAK,CAAC;AACjB,YAAA,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC,MAAM,UAAU,CAAC,IAAI,CAAC,EAAE,YAAY,CAAC,OAAO,GAAG,IAAI,CAAC;;;KAGtF,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,iBAAiB,EAAE,WAAW,CAAC,CAAC;AAE1D,IAAA,QACI,KAAC,CAAA,aAAA,CAAA,MAAM,EACH,EAAA,IAAI,EAAE,EAAE,EACR,SAAS,EAAE,EAAE,CACT,MAAM,CAAC,SAAS,EAChB,EAAE,CAAC,MAAM,CAAC,UAAU,GAAG,CAAC,OAAO,IAAI,YAAY,CAAC,OAAO,EAAE,EACzD,SAAS,CACZ,EACD,OAAO,EAAE,OAAO,EAAA;AAEhB,QAAA,KAAA,CAAA,aAAA,CAAC,UAAU,CAAC,IAAI,EAAA,EAAC,KAAK,EAAC,sBAAsB,EAAE,EAAA,YAAY,CAAC,IAAI,CAAmB,CAC9E;AAEjB;;;;"}
@@ -1,6 +1,6 @@
1
1
  import { type FC, type MutableRefObject } from 'react';
2
2
  import { type IconButtonProps } from '@alfalab/core-components-icon-button/moderncssm';
3
- declare type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
3
+ type Props = Omit<IconButtonProps, 'icon' | 'colors'> & {
4
4
  buttonRef?: MutableRefObject<HTMLButtonElement | null>;
5
5
  download?: string | boolean;
6
6
  };
@@ -28,7 +28,7 @@ const UnmuteVideo = ({ buttonRef, className, ...restProps }) => (React.createEle
28
28
  const Download = (props) => (React.createElement(TooltipDesktop, { trigger: 'hover', position: 'bottom', content: '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', fallbackPlacements: ['bottom-end'] },
29
29
  React.createElement(IconButton, { ...props, icon: PointerDownMIcon, "aria-label": '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', className: styles.iconButton })));
30
30
  const Share = (props) => (React.createElement(TooltipDesktop, { trigger: 'hover', position: 'bottom', content: '\u041F\u043E\u0434\u0435\u043B\u0438\u0442\u044C\u0441\u044F', fallbackPlacements: ['bottom-end'] },
31
- React.createElement(IconButton, { ...props, icon: ShareMIcon, "aria-label": '\u0421\u043A\u0430\u0447\u0430\u0442\u044C', className: styles.iconButton })));
31
+ React.createElement(IconButton, { ...props, icon: ShareMIcon, "aria-label": '\u041F\u043E\u0434\u0435\u043B\u0438\u0442\u044C\u0441\u044F', className: styles.iconButton })));
32
32
  const Exit = (props) => (React.createElement(IconButton, { ...props, icon: CrossMIcon, "aria-label": '\u0417\u0430\u043A\u0440\u044B\u0442\u044C', className: styles.iconButton }));
33
33
 
34
34
  export { BackArrow, Download, Exit, ExitFullscreen, Fullscreen, MuteVideo, Pause, Play, Share, UnmuteVideo };
@@ -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 { 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 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 <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Открыть в полноэкранном режиме'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsOutwardMIcon}\n aria-label='Открыть в полноэкранном режиме'\n className={styles.iconButton}\n />\n </TooltipDesktop>\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 <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Выйти из полноэкранного режима'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsInwardMIcon}\n aria-label='Выйти из полноэкранного режима'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const MuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Выключить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundMIcon}\n aria-label='Выключить звук'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const UnmuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Включить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundCrossMIcon}\n aria-label='Включить звук'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const Download: FC<Props> = (props) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Скачать'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...props}\n icon={PointerDownMIcon}\n aria-label='Скачать'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const Share: FC<Props> = (props) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Поделиться'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...props}\n icon={ShareMIcon}\n aria-label='Скачать'\n className={styles.iconButton}\n />\n </TooltipDesktop>\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 { 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 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 <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Открыть в полноэкранном режиме'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsOutwardMIcon}\n aria-label='Открыть в полноэкранном режиме'\n className={styles.iconButton}\n />\n </TooltipDesktop>\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 <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Выйти из полноэкранного режима'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={ArrowsInwardMIcon}\n aria-label='Выйти из полноэкранного режима'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const MuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Выключить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundMIcon}\n aria-label='Выключить звук'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const UnmuteVideo: FC<Props> = ({ buttonRef, className, ...restProps }) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Включить звук'\n fallbackPlacements={['bottom-end']}\n targetClassName={className}\n >\n <IconButton\n {...restProps}\n ref={buttonRef}\n icon={SoundCrossMIcon}\n aria-label='Включить звук'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const Download: FC<Props> = (props) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Скачать'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...props}\n icon={PointerDownMIcon}\n aria-label='Скачать'\n className={styles.iconButton}\n />\n </TooltipDesktop>\n);\n\nexport const Share: FC<Props> = (props) => (\n <TooltipDesktop\n trigger='hover'\n position='bottom'\n content='Поделиться'\n fallbackPlacements={['bottom-end']}\n >\n <IconButton\n {...props}\n icon={ShareMIcon}\n aria-label='Поделиться'\n className={styles.iconButton}\n />\n </TooltipDesktop>\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 +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":"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"}
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":"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"}
@@ -1,5 +1,5 @@
1
1
  import { type FC } from 'react';
2
- export declare type HeaderInfoBlockProps = {
2
+ export type HeaderInfoBlockProps = {
3
3
  filename: string;
4
4
  description?: string;
5
5
  };
@@ -14,6 +14,8 @@ const HeaderMobile = () => {
14
14
  const description = images.length > 1 && `${currentSlideIndex + 1} из ${images.length}`;
15
15
  const canDownload = currentImage?.canDownload ?? true;
16
16
  const showDownloadButton = !meta?.broken && canDownload;
17
+ const canShare = currentImage?.canShare ?? true;
18
+ const showShareButton = !meta?.broken && canShare;
17
19
  const handleShareClick = async () => {
18
20
  if (!currentImage || !navigator.share) {
19
21
  return;
@@ -70,7 +72,7 @@ const HeaderMobile = () => {
70
72
  React.createElement(TypographyText, { className: styles.description, tag: 'div', view: 'component-primary', color: 'static-primary-light' }, description),
71
73
  React.createElement("div", { className: styles.rightButtons },
72
74
  showDownloadButton && (React.createElement(Download, { href: currentImage?.src, download: currentImage?.name, dataTestId: TestIds.DOWNLOAD_BUTTON })),
73
- !meta?.broken && React.createElement(Share, { onClick: handleShareClick }))));
75
+ showShareButton && React.createElement(Share, { onClick: handleShareClick }))));
74
76
  };
75
77
 
76
78
  export { HeaderMobile };