@mantine-bites/lightbox 1.3.0 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/cjs/Lightbox.cjs +2 -2
- package/dist/cjs/Lightbox.cjs.map +1 -1
- package/dist/cjs/components/LightboxAutoplayButton.cjs +1 -2
- package/dist/cjs/components/LightboxAutoplayButton.cjs.map +1 -1
- package/dist/cjs/components/LightboxCaption.cjs +14 -17
- package/dist/cjs/components/LightboxCaption.cjs.map +1 -1
- package/dist/cjs/components/LightboxCloseButton.cjs +1 -2
- package/dist/cjs/components/LightboxCloseButton.cjs.map +1 -1
- package/dist/cjs/components/LightboxControls.cjs +43 -61
- package/dist/cjs/components/LightboxControls.cjs.map +1 -1
- package/dist/cjs/components/LightboxCounter.cjs +17 -20
- package/dist/cjs/components/LightboxCounter.cjs.map +1 -1
- package/dist/cjs/components/LightboxFullscreenButton.cjs +1 -2
- package/dist/cjs/components/LightboxFullscreenButton.cjs.map +1 -1
- package/dist/cjs/components/LightboxRoot.cjs +50 -10
- package/dist/cjs/components/LightboxRoot.cjs.map +1 -1
- package/dist/cjs/components/LightboxSlide.cjs +1 -2
- package/dist/cjs/components/LightboxSlide.cjs.map +1 -1
- package/dist/cjs/components/LightboxSlides.cjs +3 -8
- package/dist/cjs/components/LightboxSlides.cjs.map +1 -1
- package/dist/cjs/components/LightboxThumbnail.cjs +23 -26
- package/dist/cjs/components/LightboxThumbnail.cjs.map +1 -1
- package/dist/cjs/components/LightboxThumbnails.cjs +3 -3
- package/dist/cjs/components/LightboxThumbnails.cjs.map +1 -1
- package/dist/cjs/components/LightboxToolbar.cjs +72 -75
- package/dist/cjs/components/LightboxToolbar.cjs.map +1 -1
- package/dist/cjs/components/LightboxZoomButton.cjs +1 -2
- package/dist/cjs/components/LightboxZoomButton.cjs.map +1 -1
- package/dist/cjs/context/LightboxContext.cjs.map +1 -1
- package/dist/cjs/hooks/useZoom.cjs +36 -1
- package/dist/cjs/hooks/useZoom.cjs.map +1 -1
- package/dist/esm/Lightbox.mjs +2 -2
- package/dist/esm/Lightbox.mjs.map +1 -1
- package/dist/esm/components/LightboxAutoplayButton.mjs +1 -2
- package/dist/esm/components/LightboxAutoplayButton.mjs.map +1 -1
- package/dist/esm/components/LightboxCaption.mjs +14 -17
- package/dist/esm/components/LightboxCaption.mjs.map +1 -1
- package/dist/esm/components/LightboxCloseButton.mjs +1 -2
- package/dist/esm/components/LightboxCloseButton.mjs.map +1 -1
- package/dist/esm/components/LightboxControls.mjs +43 -61
- package/dist/esm/components/LightboxControls.mjs.map +1 -1
- package/dist/esm/components/LightboxCounter.mjs +17 -20
- package/dist/esm/components/LightboxCounter.mjs.map +1 -1
- package/dist/esm/components/LightboxFullscreenButton.mjs +1 -2
- package/dist/esm/components/LightboxFullscreenButton.mjs.map +1 -1
- package/dist/esm/components/LightboxRoot.mjs +51 -11
- package/dist/esm/components/LightboxRoot.mjs.map +1 -1
- package/dist/esm/components/LightboxSlide.mjs +1 -2
- package/dist/esm/components/LightboxSlide.mjs.map +1 -1
- package/dist/esm/components/LightboxSlides.mjs +3 -8
- package/dist/esm/components/LightboxSlides.mjs.map +1 -1
- package/dist/esm/components/LightboxThumbnail.mjs +23 -26
- package/dist/esm/components/LightboxThumbnail.mjs.map +1 -1
- package/dist/esm/components/LightboxThumbnails.mjs +3 -3
- package/dist/esm/components/LightboxThumbnails.mjs.map +1 -1
- package/dist/esm/components/LightboxToolbar.mjs +72 -75
- package/dist/esm/components/LightboxToolbar.mjs.map +1 -1
- package/dist/esm/components/LightboxZoomButton.mjs +1 -2
- package/dist/esm/components/LightboxZoomButton.mjs.map +1 -1
- package/dist/esm/context/LightboxContext.mjs.map +1 -1
- package/dist/esm/hooks/useZoom.mjs +36 -1
- package/dist/esm/hooks/useZoom.mjs.map +1 -1
- package/dist/types/Lightbox.d.ts +1 -1
- package/dist/types/Lightbox.d.ts.map +1 -1
- package/dist/types/components/LightboxAutoplayButton.d.ts.map +1 -1
- package/dist/types/components/LightboxCaption.d.ts.map +1 -1
- package/dist/types/components/LightboxCloseButton.d.ts.map +1 -1
- package/dist/types/components/LightboxControls.d.ts.map +1 -1
- package/dist/types/components/LightboxCounter.d.ts.map +1 -1
- package/dist/types/components/LightboxFullscreenButton.d.ts.map +1 -1
- package/dist/types/components/LightboxRoot.d.ts +2 -0
- package/dist/types/components/LightboxRoot.d.ts.map +1 -1
- package/dist/types/components/LightboxSlide.d.ts.map +1 -1
- package/dist/types/components/LightboxSlides.d.ts +0 -2
- package/dist/types/components/LightboxSlides.d.ts.map +1 -1
- package/dist/types/components/LightboxThumbnail.d.ts.map +1 -1
- package/dist/types/components/LightboxThumbnails.d.ts.map +1 -1
- package/dist/types/components/LightboxToolbar.d.ts.map +1 -1
- package/dist/types/components/LightboxZoomButton.d.ts.map +1 -1
- package/dist/types/context/LightboxContext.d.ts +3 -5
- package/dist/types/context/LightboxContext.d.ts.map +1 -1
- package/dist/types/context/LightboxSlideContext.d.ts +1 -4
- package/dist/types/context/LightboxSlideContext.d.ts.map +1 -1
- package/dist/types/context/LightboxThumbnailContext.d.ts +1 -4
- package/dist/types/context/LightboxThumbnailContext.d.ts.map +1 -1
- package/dist/types/hooks/useZoom.d.ts +1 -0
- package/dist/types/hooks/useZoom.d.ts.map +1 -1
- package/package.json +20 -16
- package/dist/cjs/Lightbox.context-value.cjs +0 -47
- package/dist/cjs/Lightbox.context-value.cjs.map +0 -1
- package/dist/cjs/Lightbox.context.cjs +0 -12
- package/dist/cjs/Lightbox.context.cjs.map +0 -1
- package/dist/cjs/Lightbox.defaults.cjs +0 -29
- package/dist/cjs/Lightbox.defaults.cjs.map +0 -1
- package/dist/cjs/Lightbox.module.css.cjs +0 -7
- package/dist/cjs/Lightbox.module.css.cjs.map +0 -1
- package/dist/cjs/LightboxSlide.cjs +0 -93
- package/dist/cjs/LightboxSlide.cjs.map +0 -1
- package/dist/cjs/LightboxSlide.context.cjs +0 -12
- package/dist/cjs/LightboxSlide.context.cjs.map +0 -1
- package/dist/cjs/components/EnterFullscreen.cjs +0 -30
- package/dist/cjs/components/EnterFullscreen.cjs.map +0 -1
- package/dist/cjs/components/ExitFullscreen.cjs +0 -30
- package/dist/cjs/components/ExitFullscreen.cjs.map +0 -1
- package/dist/cjs/components/LightboxCarousel.cjs +0 -29
- package/dist/cjs/components/LightboxCarousel.cjs.map +0 -1
- package/dist/cjs/components/LightboxCarouselSlide.context.cjs +0 -12
- package/dist/cjs/components/LightboxCarouselSlide.context.cjs.map +0 -1
- package/dist/cjs/components/LightboxContent.cjs +0 -38
- package/dist/cjs/components/LightboxContent.cjs.map +0 -1
- package/dist/cjs/components/LightboxOverlay.cjs +0 -40
- package/dist/cjs/components/LightboxOverlay.cjs.map +0 -1
- package/dist/cjs/components/LightboxPreset.cjs +0 -32
- package/dist/cjs/components/LightboxPreset.cjs.map +0 -1
- package/dist/cjs/components/LightboxSlide.context.cjs +0 -12
- package/dist/cjs/components/LightboxSlide.context.cjs.map +0 -1
- package/dist/cjs/components/LightboxThumbnail.context.cjs +0 -12
- package/dist/cjs/components/LightboxThumbnail.context.cjs.map +0 -1
- package/dist/cjs/components/LightboxThumbnailsButton.cjs +0 -41
- package/dist/cjs/components/LightboxThumbnailsButton.cjs.map +0 -1
- package/dist/cjs/components/Pause.cjs +0 -28
- package/dist/cjs/components/Pause.cjs.map +0 -1
- package/dist/cjs/components/Play.cjs +0 -22
- package/dist/cjs/components/Play.cjs.map +0 -1
- package/dist/cjs/components/QuestionMark.cjs +0 -28
- package/dist/cjs/components/QuestionMark.cjs.map +0 -1
- package/dist/cjs/components/ZoomIn.cjs +0 -30
- package/dist/cjs/components/ZoomIn.cjs.map +0 -1
- package/dist/cjs/components/ZoomOut.cjs +0 -29
- package/dist/cjs/components/ZoomOut.cjs.map +0 -1
- package/dist/cjs/components/icons/HideThumbnails.cjs +0 -28
- package/dist/cjs/components/icons/HideThumbnails.cjs.map +0 -1
- package/dist/cjs/components/icons/ShowThumbnails.cjs +0 -28
- package/dist/cjs/components/icons/ShowThumbnails.cjs.map +0 -1
- package/dist/cjs/hooks/useCarouselOptions.cjs +0 -30
- package/dist/cjs/hooks/useCarouselOptions.cjs.map +0 -1
- package/dist/cjs/hooks/useFullscreen.cjs +0 -39
- package/dist/cjs/hooks/useFullscreen.cjs.map +0 -1
- package/dist/cjs/hooks/useKeyboardNavigation.cjs +0 -29
- package/dist/cjs/hooks/useKeyboardNavigation.cjs.map +0 -1
- package/dist/cjs/hooks/useLightbox.cjs +0 -116
- package/dist/cjs/hooks/useLightbox.cjs.map +0 -1
- package/dist/cjs/hooks/useLightboxRootOptions.cjs +0 -20
- package/dist/cjs/hooks/useLightboxRootOptions.cjs.map +0 -1
- package/dist/cjs/hooks/useSlideInteractions.cjs +0 -94
- package/dist/cjs/hooks/useSlideInteractions.cjs.map +0 -1
- package/dist/cjs/hooks/useThumbnails.cjs +0 -61
- package/dist/cjs/hooks/useThumbnails.cjs.map +0 -1
- package/dist/cjs/utils/fullscreen.cjs +0 -41
- package/dist/cjs/utils/fullscreen.cjs.map +0 -1
- package/dist/esm/Lightbox.context-value.mjs +0 -45
- package/dist/esm/Lightbox.context-value.mjs.map +0 -1
- package/dist/esm/Lightbox.context.mjs +0 -9
- package/dist/esm/Lightbox.context.mjs.map +0 -1
- package/dist/esm/Lightbox.defaults.mjs +0 -27
- package/dist/esm/Lightbox.defaults.mjs.map +0 -1
- package/dist/esm/Lightbox.module.css.mjs +0 -5
- package/dist/esm/Lightbox.module.css.mjs.map +0 -1
- package/dist/esm/LightboxSlide.context.mjs +0 -9
- package/dist/esm/LightboxSlide.context.mjs.map +0 -1
- package/dist/esm/LightboxSlide.mjs +0 -91
- package/dist/esm/LightboxSlide.mjs.map +0 -1
- package/dist/esm/components/EnterFullscreen.mjs +0 -28
- package/dist/esm/components/EnterFullscreen.mjs.map +0 -1
- package/dist/esm/components/ExitFullscreen.mjs +0 -28
- package/dist/esm/components/ExitFullscreen.mjs.map +0 -1
- package/dist/esm/components/LightboxCarousel.mjs +0 -27
- package/dist/esm/components/LightboxCarousel.mjs.map +0 -1
- package/dist/esm/components/LightboxCarouselSlide.context.mjs +0 -9
- package/dist/esm/components/LightboxCarouselSlide.context.mjs.map +0 -1
- package/dist/esm/components/LightboxContent.mjs +0 -36
- package/dist/esm/components/LightboxContent.mjs.map +0 -1
- package/dist/esm/components/LightboxOverlay.mjs +0 -38
- package/dist/esm/components/LightboxOverlay.mjs.map +0 -1
- package/dist/esm/components/LightboxPreset.mjs +0 -30
- package/dist/esm/components/LightboxPreset.mjs.map +0 -1
- package/dist/esm/components/LightboxSlide.context.mjs +0 -9
- package/dist/esm/components/LightboxSlide.context.mjs.map +0 -1
- package/dist/esm/components/LightboxThumbnail.context.mjs +0 -9
- package/dist/esm/components/LightboxThumbnail.context.mjs.map +0 -1
- package/dist/esm/components/LightboxThumbnailsButton.mjs +0 -39
- package/dist/esm/components/LightboxThumbnailsButton.mjs.map +0 -1
- package/dist/esm/components/Pause.mjs +0 -26
- package/dist/esm/components/Pause.mjs.map +0 -1
- package/dist/esm/components/Play.mjs +0 -20
- package/dist/esm/components/Play.mjs.map +0 -1
- package/dist/esm/components/QuestionMark.mjs +0 -26
- package/dist/esm/components/QuestionMark.mjs.map +0 -1
- package/dist/esm/components/ZoomIn.mjs +0 -28
- package/dist/esm/components/ZoomIn.mjs.map +0 -1
- package/dist/esm/components/ZoomOut.mjs +0 -27
- package/dist/esm/components/ZoomOut.mjs.map +0 -1
- package/dist/esm/components/icons/HideThumbnails.mjs +0 -26
- package/dist/esm/components/icons/HideThumbnails.mjs.map +0 -1
- package/dist/esm/components/icons/ShowThumbnails.mjs +0 -26
- package/dist/esm/components/icons/ShowThumbnails.mjs.map +0 -1
- package/dist/esm/hooks/useCarouselOptions.mjs +0 -28
- package/dist/esm/hooks/useCarouselOptions.mjs.map +0 -1
- package/dist/esm/hooks/useFullscreen.mjs +0 -37
- package/dist/esm/hooks/useFullscreen.mjs.map +0 -1
- package/dist/esm/hooks/useKeyboardNavigation.mjs +0 -27
- package/dist/esm/hooks/useKeyboardNavigation.mjs.map +0 -1
- package/dist/esm/hooks/useLightbox.mjs +0 -114
- package/dist/esm/hooks/useLightbox.mjs.map +0 -1
- package/dist/esm/hooks/useLightboxRootOptions.mjs +0 -18
- package/dist/esm/hooks/useLightboxRootOptions.mjs.map +0 -1
- package/dist/esm/hooks/useSlideInteractions.mjs +0 -92
- package/dist/esm/hooks/useSlideInteractions.mjs.map +0 -1
- package/dist/esm/hooks/useThumbnails.mjs +0 -59
- package/dist/esm/hooks/useThumbnails.mjs.map +0 -1
- package/dist/esm/utils/fullscreen.mjs +0 -36
- package/dist/esm/utils/fullscreen.mjs.map +0 -1
- package/dist/types/Lightbox.context-value.d.ts +0 -16
- package/dist/types/Lightbox.context-value.d.ts.map +0 -1
- package/dist/types/Lightbox.context.d.ts +0 -39
- package/dist/types/Lightbox.context.d.ts.map +0 -1
- package/dist/types/Lightbox.defaults.d.ts +0 -24
- package/dist/types/Lightbox.defaults.d.ts.map +0 -1
- package/dist/types/Lightbox.story.d.ts +0 -10
- package/dist/types/Lightbox.story.d.ts.map +0 -1
- package/dist/types/Lightbox.test.d.ts +0 -2
- package/dist/types/Lightbox.test.d.ts.map +0 -1
- package/dist/types/LightboxSlide.context.d.ts +0 -8
- package/dist/types/LightboxSlide.context.d.ts.map +0 -1
- package/dist/types/LightboxSlide.d.ts +0 -17
- package/dist/types/LightboxSlide.d.ts.map +0 -1
- package/dist/types/components/EnterFullscreen.d.ts +0 -3
- package/dist/types/components/EnterFullscreen.d.ts.map +0 -1
- package/dist/types/components/ExitFullscreen.d.ts +0 -3
- package/dist/types/components/ExitFullscreen.d.ts.map +0 -1
- package/dist/types/components/LightboxCarousel.d.ts +0 -6
- package/dist/types/components/LightboxCarousel.d.ts.map +0 -1
- package/dist/types/components/LightboxCarouselSlide.context.d.ts +0 -10
- package/dist/types/components/LightboxCarouselSlide.context.d.ts.map +0 -1
- package/dist/types/components/LightboxContent.d.ts +0 -14
- package/dist/types/components/LightboxContent.d.ts.map +0 -1
- package/dist/types/components/LightboxOverlay.d.ts +0 -4
- package/dist/types/components/LightboxOverlay.d.ts.map +0 -1
- package/dist/types/components/LightboxPreset.d.ts +0 -10
- package/dist/types/components/LightboxPreset.d.ts.map +0 -1
- package/dist/types/components/LightboxSlide.context.d.ts +0 -8
- package/dist/types/components/LightboxSlide.context.d.ts.map +0 -1
- package/dist/types/components/LightboxThumbnail.context.d.ts +0 -8
- package/dist/types/components/LightboxThumbnail.context.d.ts.map +0 -1
- package/dist/types/components/LightboxThumbnailsButton.d.ts +0 -17
- package/dist/types/components/LightboxThumbnailsButton.d.ts.map +0 -1
- package/dist/types/components/Pause.d.ts +0 -3
- package/dist/types/components/Pause.d.ts.map +0 -1
- package/dist/types/components/Play.d.ts +0 -3
- package/dist/types/components/Play.d.ts.map +0 -1
- package/dist/types/components/QuestionMark.d.ts +0 -3
- package/dist/types/components/QuestionMark.d.ts.map +0 -1
- package/dist/types/components/ZoomIn.d.ts +0 -3
- package/dist/types/components/ZoomIn.d.ts.map +0 -1
- package/dist/types/components/ZoomOut.d.ts +0 -3
- package/dist/types/components/ZoomOut.d.ts.map +0 -1
- package/dist/types/components/icons/HideThumbnails.d.ts +0 -3
- package/dist/types/components/icons/HideThumbnails.d.ts.map +0 -1
- package/dist/types/components/icons/ShowThumbnails.d.ts +0 -3
- package/dist/types/components/icons/ShowThumbnails.d.ts.map +0 -1
- package/dist/types/hooks/useAutoPlay.test.d.ts +0 -2
- package/dist/types/hooks/useAutoPlay.test.d.ts.map +0 -1
- package/dist/types/hooks/useCarouselOptions.d.ts +0 -20
- package/dist/types/hooks/useCarouselOptions.d.ts.map +0 -1
- package/dist/types/hooks/useFullscreen.d.ts +0 -11
- package/dist/types/hooks/useFullscreen.d.ts.map +0 -1
- package/dist/types/hooks/useKeyboardNavigation.d.ts +0 -10
- package/dist/types/hooks/useKeyboardNavigation.d.ts.map +0 -1
- package/dist/types/hooks/useLightbox.d.ts +0 -30
- package/dist/types/hooks/useLightbox.d.ts.map +0 -1
- package/dist/types/hooks/useLightboxRootOptions.d.ts +0 -12
- package/dist/types/hooks/useLightboxRootOptions.d.ts.map +0 -1
- package/dist/types/hooks/useSlideInteractions.d.ts +0 -26
- package/dist/types/hooks/useSlideInteractions.d.ts.map +0 -1
- package/dist/types/hooks/useThumbnails.d.ts +0 -15
- package/dist/types/hooks/useThumbnails.d.ts.map +0 -1
- package/dist/types/utils/fullscreen.d.ts +0 -21
- package/dist/types/utils/fullscreen.d.ts.map +0 -1
- package/dist/types/utils/zoom.test.d.ts +0 -2
- package/dist/types/utils/zoom.test.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LightboxCloseButton.mjs","sources":["../../../src/components/LightboxCloseButton.tsx"],"sourcesContent":["import {\n\tActionIcon,\n\ttype BoxProps,\n\tCloseIcon,\n\ttype CompoundStylesApiProps,\n\ttype ElementProps,\n\ttype Factory,\n\tfactory,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxCloseButtonStylesNames = \"closeButton\";\n\nexport interface LightboxCloseButtonProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxCloseButtonFactory>,\n\t\tElementProps<\"button\"> {}\n\nexport type LightboxCloseButtonFactory = Factory<{\n\tprops: LightboxCloseButtonProps;\n\tref: HTMLButtonElement;\n\tstylesNames: LightboxCloseButtonStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxCloseButton = factory<LightboxCloseButtonFactory>(\n\t(_props
|
|
1
|
+
{"version":3,"file":"LightboxCloseButton.mjs","sources":["../../../src/components/LightboxCloseButton.tsx"],"sourcesContent":["import {\n\tActionIcon,\n\ttype BoxProps,\n\tCloseIcon,\n\ttype CompoundStylesApiProps,\n\ttype ElementProps,\n\ttype Factory,\n\tfactory,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxCloseButtonStylesNames = \"closeButton\";\n\nexport interface LightboxCloseButtonProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxCloseButtonFactory>,\n\t\tElementProps<\"button\"> {}\n\nexport type LightboxCloseButtonFactory = Factory<{\n\tprops: LightboxCloseButtonProps;\n\tref: HTMLButtonElement;\n\tstylesNames: LightboxCloseButtonStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxCloseButton = factory<LightboxCloseButtonFactory>(\n\t(_props) => {\n\t\tconst props = useProps(\"LightboxCloseButton\", null, _props);\n\n\t\tconst { classNames, className, style, styles, vars, ...others } = props;\n\n\t\tconst { onClose, getStyles } = useLightboxContext();\n\n\t\treturn (\n\t\t\t<ActionIcon\n\t\t\t\tvariant=\"default\"\n\t\t\t\tsize=\"lg\"\n\t\t\t\tonClick={onClose}\n\t\t\t\taria-label=\"Close lightbox\"\n\t\t\t\t{...getStyles(\"closeButton\", { className, style, classNames, styles })}\n\t\t\t\t{...others}\n\t\t\t>\n\t\t\t\t<CloseIcon />\n\t\t\t</ActionIcon>\n\t\t);\n\t},\n);\n\nLightboxCloseButton.classes = classes;\n\nLightboxCloseButton.displayName = \"LightboxCloseButton\";\n"],"names":[],"mappings":"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"}
|
|
@@ -8,67 +8,49 @@ import classes from '../styles/Lightbox.module.css.mjs';
|
|
|
8
8
|
const defaultProps = {
|
|
9
9
|
size: 36
|
|
10
10
|
};
|
|
11
|
-
const LightboxControls = factory(
|
|
12
|
-
(
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
{
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
classNames,
|
|
55
|
-
styles
|
|
56
|
-
}),
|
|
57
|
-
"data-direction": "next",
|
|
58
|
-
"aria-label": "Next slide",
|
|
59
|
-
disabled: nextBtnDisabled,
|
|
60
|
-
onClick: onScrollNext,
|
|
61
|
-
children: /* @__PURE__ */ jsx(
|
|
62
|
-
AccordionChevron,
|
|
63
|
-
{
|
|
64
|
-
style: { transform: `rotate(${nextRotation}deg)` }
|
|
65
|
-
}
|
|
66
|
-
)
|
|
67
|
-
}
|
|
68
|
-
)
|
|
69
|
-
] });
|
|
70
|
-
}
|
|
71
|
-
);
|
|
11
|
+
const LightboxControls = factory((_props) => {
|
|
12
|
+
const props = useProps("LightboxControls", defaultProps, _props);
|
|
13
|
+
const { classNames, styles, size } = props;
|
|
14
|
+
const { onScrollPrev, onScrollNext, getStyles, orientation, slidesEmblaApi } = useLightboxContext();
|
|
15
|
+
const { prevBtnDisabled, nextBtnDisabled } = useScrollButtons(slidesEmblaApi);
|
|
16
|
+
const { dir } = useDirection();
|
|
17
|
+
const prevRotation = orientation === "horizontal" ? 90 * (dir === "ltr" ? 1 : -1) : -180;
|
|
18
|
+
const nextRotation = orientation === "horizontal" ? 90 * (dir === "ltr" ? -1 : 1) : 0;
|
|
19
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
20
|
+
/* @__PURE__ */ jsx(
|
|
21
|
+
UnstyledButton,
|
|
22
|
+
{
|
|
23
|
+
...getStyles("control", {
|
|
24
|
+
style: { "--lightbox-control-size": rem(size) },
|
|
25
|
+
classNames,
|
|
26
|
+
styles
|
|
27
|
+
}),
|
|
28
|
+
"data-direction": "prev",
|
|
29
|
+
"aria-label": "Previous slide",
|
|
30
|
+
disabled: prevBtnDisabled,
|
|
31
|
+
onClick: onScrollPrev,
|
|
32
|
+
children: /* @__PURE__ */ jsx(AccordionChevron, { style: { transform: `rotate(${prevRotation}deg)` } })
|
|
33
|
+
}
|
|
34
|
+
),
|
|
35
|
+
/* @__PURE__ */ jsx(
|
|
36
|
+
UnstyledButton,
|
|
37
|
+
{
|
|
38
|
+
...getStyles("control", {
|
|
39
|
+
style: {
|
|
40
|
+
"--lightbox-control-size": rem(size)
|
|
41
|
+
},
|
|
42
|
+
classNames,
|
|
43
|
+
styles
|
|
44
|
+
}),
|
|
45
|
+
"data-direction": "next",
|
|
46
|
+
"aria-label": "Next slide",
|
|
47
|
+
disabled: nextBtnDisabled,
|
|
48
|
+
onClick: onScrollNext,
|
|
49
|
+
children: /* @__PURE__ */ jsx(AccordionChevron, { style: { transform: `rotate(${nextRotation}deg)` } })
|
|
50
|
+
}
|
|
51
|
+
)
|
|
52
|
+
] });
|
|
53
|
+
});
|
|
72
54
|
LightboxControls.classes = classes;
|
|
73
55
|
LightboxControls.displayName = "LightboxControls";
|
|
74
56
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LightboxControls.mjs","sources":["../../../src/components/LightboxControls.tsx"],"sourcesContent":["import {\n\tAccordionChevron,\n\ttype CompoundStylesApiProps,\n\ttype Factory,\n\tfactory,\n\trem,\n\tUnstyledButton,\n\tuseDirection,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport { useScrollButtons } from \"../hooks/useScrollButtons.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxControlsStylesNames = \"control\";\n\nexport interface LightboxControlsProps\n\textends CompoundStylesApiProps<LightboxControlsFactory> {\n\t/** Size of the prev/next navigation buttons in px, `36` by default */\n\tsize?: number;\n}\n\nconst defaultProps = {\n\tsize: 36,\n} satisfies Partial<LightboxControlsProps>;\n\nexport type LightboxControlsFactory = Factory<{\n\tprops: LightboxControlsProps;\n\tref: HTMLElement;\n\tstylesNames: LightboxControlsStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxControls = factory<LightboxControlsFactory>(\n\t(_props, _ref) => {\n\t\tconst props = useProps(\"LightboxControls\", defaultProps, _props);\n\n\t\tconst { classNames, styles, size } = props;\n\n\t\tconst {\n\t\t\tonScrollPrev,\n\t\t\tonScrollNext,\n\t\t\tgetStyles,\n\t\t\torientation,\n\t\t\tslidesEmblaApi,\n\t\t} = useLightboxContext();\n\n\t\tconst { prevBtnDisabled, nextBtnDisabled } =\n\t\t\tuseScrollButtons(slidesEmblaApi);\n\n\t\tconst { dir } = useDirection();\n\n\t\tconst prevRotation =\n\t\t\torientation === \"horizontal\" ? 90 * (dir === \"ltr\" ? 1 : -1) : -180;\n\t\tconst nextRotation =\n\t\t\torientation === \"horizontal\" ? 90 * (dir === \"ltr\" ? -1 : 1) : 0;\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<UnstyledButton\n\t\t\t\t\t{...getStyles(\"control\", {\n\t\t\t\t\t\tstyle: { \"--lightbox-control-size\": rem(size) },\n\t\t\t\t\t\tclassNames,\n\t\t\t\t\t\tstyles,\n\t\t\t\t\t})}\n\t\t\t\t\tdata-direction=\"prev\"\n\t\t\t\t\taria-label=\"Previous slide\"\n\t\t\t\t\tdisabled={prevBtnDisabled}\n\t\t\t\t\tonClick={onScrollPrev}\n\t\t\t\t>\n\t\t\t\t\t<AccordionChevron\n\t\t\t\t\t\tstyle={{ transform: `rotate(${prevRotation}deg)` }}\n\t\t\t\t\t/>\n\t\t\t\t</UnstyledButton>\n\t\t\t\t<UnstyledButton\n\t\t\t\t\t{...getStyles(\"control\", {\n\t\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\t\"--lightbox-control-size\": rem(size),\n\t\t\t\t\t\t} as React.CSSProperties,\n\t\t\t\t\t\tclassNames,\n\t\t\t\t\t\tstyles,\n\t\t\t\t\t})}\n\t\t\t\t\tdata-direction=\"next\"\n\t\t\t\t\taria-label=\"Next slide\"\n\t\t\t\t\tdisabled={nextBtnDisabled}\n\t\t\t\t\tonClick={onScrollNext}\n\t\t\t\t>\n\t\t\t\t\t<AccordionChevron\n\t\t\t\t\t\tstyle={{ transform: `rotate(${nextRotation}deg)` }}\n\t\t\t\t\t/>\n\t\t\t\t</UnstyledButton>\n\t\t\t</>\n\t\t);\n\t},\n);\n\nLightboxControls.classes = classes;\n\nLightboxControls.displayName = \"LightboxControls\";\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LightboxControls.mjs","sources":["../../../src/components/LightboxControls.tsx"],"sourcesContent":["import {\n\tAccordionChevron,\n\ttype CompoundStylesApiProps,\n\ttype Factory,\n\tfactory,\n\trem,\n\tUnstyledButton,\n\tuseDirection,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport { useScrollButtons } from \"../hooks/useScrollButtons.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxControlsStylesNames = \"control\";\n\nexport interface LightboxControlsProps\n\textends CompoundStylesApiProps<LightboxControlsFactory> {\n\t/** Size of the prev/next navigation buttons in px, `36` by default */\n\tsize?: number;\n}\n\nconst defaultProps = {\n\tsize: 36,\n} satisfies Partial<LightboxControlsProps>;\n\nexport type LightboxControlsFactory = Factory<{\n\tprops: LightboxControlsProps;\n\tref: HTMLElement;\n\tstylesNames: LightboxControlsStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxControls = factory<LightboxControlsFactory>((_props) => {\n\tconst props = useProps(\"LightboxControls\", defaultProps, _props);\n\n\tconst { classNames, styles, size } = props;\n\n\tconst { onScrollPrev, onScrollNext, getStyles, orientation, slidesEmblaApi } =\n\t\tuseLightboxContext();\n\n\tconst { prevBtnDisabled, nextBtnDisabled } = useScrollButtons(slidesEmblaApi);\n\n\tconst { dir } = useDirection();\n\n\tconst prevRotation =\n\t\torientation === \"horizontal\" ? 90 * (dir === \"ltr\" ? 1 : -1) : -180;\n\tconst nextRotation =\n\t\torientation === \"horizontal\" ? 90 * (dir === \"ltr\" ? -1 : 1) : 0;\n\n\treturn (\n\t\t<>\n\t\t\t<UnstyledButton\n\t\t\t\t{...getStyles(\"control\", {\n\t\t\t\t\tstyle: { \"--lightbox-control-size\": rem(size) },\n\t\t\t\t\tclassNames,\n\t\t\t\t\tstyles,\n\t\t\t\t})}\n\t\t\t\tdata-direction=\"prev\"\n\t\t\t\taria-label=\"Previous slide\"\n\t\t\t\tdisabled={prevBtnDisabled}\n\t\t\t\tonClick={onScrollPrev}\n\t\t\t>\n\t\t\t\t<AccordionChevron style={{ transform: `rotate(${prevRotation}deg)` }} />\n\t\t\t</UnstyledButton>\n\t\t\t<UnstyledButton\n\t\t\t\t{...getStyles(\"control\", {\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\t\"--lightbox-control-size\": rem(size),\n\t\t\t\t\t} as React.CSSProperties,\n\t\t\t\t\tclassNames,\n\t\t\t\t\tstyles,\n\t\t\t\t})}\n\t\t\t\tdata-direction=\"next\"\n\t\t\t\taria-label=\"Next slide\"\n\t\t\t\tdisabled={nextBtnDisabled}\n\t\t\t\tonClick={onScrollNext}\n\t\t\t>\n\t\t\t\t<AccordionChevron style={{ transform: `rotate(${nextRotation}deg)` }} />\n\t\t\t</UnstyledButton>\n\t\t</>\n\t);\n});\n\nLightboxControls.classes = classes;\n\nLightboxControls.displayName = \"LightboxControls\";\n"],"names":[],"mappings":"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"}
|
|
@@ -4,27 +4,24 @@ import { factory, useProps, Text } from '@mantine/core';
|
|
|
4
4
|
import { useLightboxContext } from '../context/LightboxContext.mjs';
|
|
5
5
|
import classes from '../styles/Lightbox.module.css.mjs';
|
|
6
6
|
|
|
7
|
-
const LightboxCounter = factory(
|
|
8
|
-
(
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
return null;
|
|
14
|
-
}
|
|
15
|
-
const label = formatter ? formatter(currentIndex, slideCount) : `${currentIndex + 1} / ${slideCount}`;
|
|
16
|
-
return /* @__PURE__ */ jsx(
|
|
17
|
-
Text,
|
|
18
|
-
{
|
|
19
|
-
ref,
|
|
20
|
-
size: "sm",
|
|
21
|
-
...getStyles("counter", { className, style, classNames, styles }),
|
|
22
|
-
...others,
|
|
23
|
-
children: label
|
|
24
|
-
}
|
|
25
|
-
);
|
|
7
|
+
const LightboxCounter = factory((_props) => {
|
|
8
|
+
const props = useProps("LightboxCounter", null, _props);
|
|
9
|
+
const { classNames, className, style, styles, vars, formatter, ...others } = props;
|
|
10
|
+
const { currentIndex, slideCount, getStyles } = useLightboxContext();
|
|
11
|
+
if (slideCount === null) {
|
|
12
|
+
return null;
|
|
26
13
|
}
|
|
27
|
-
)
|
|
14
|
+
const label = formatter ? formatter(currentIndex, slideCount) : `${currentIndex + 1} / ${slideCount}`;
|
|
15
|
+
return /* @__PURE__ */ jsx(
|
|
16
|
+
Text,
|
|
17
|
+
{
|
|
18
|
+
size: "sm",
|
|
19
|
+
...getStyles("counter", { className, style, classNames, styles }),
|
|
20
|
+
...others,
|
|
21
|
+
children: label
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
});
|
|
28
25
|
LightboxCounter.classes = classes;
|
|
29
26
|
LightboxCounter.displayName = "LightboxCounter";
|
|
30
27
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LightboxCounter.mjs","sources":["../../../src/components/LightboxCounter.tsx"],"sourcesContent":["import {\n\ttype BoxProps,\n\ttype CompoundStylesApiProps,\n\ttype Factory,\n\tfactory,\n\tText,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxCounterStylesNames = \"counter\";\n\nexport interface LightboxCounterProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxCounterFactory> {\n\t/** Custom formatter for the counter label, `(i, t) => \\`${i + 1} / ${t}\\`` by default */\n\tformatter?: (index: number, total: number) => string;\n}\n\nexport type LightboxCounterFactory = Factory<{\n\tprops: LightboxCounterProps;\n\tref: HTMLParagraphElement;\n\tstylesNames: LightboxCounterStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxCounter = factory<LightboxCounterFactory>(
|
|
1
|
+
{"version":3,"file":"LightboxCounter.mjs","sources":["../../../src/components/LightboxCounter.tsx"],"sourcesContent":["import {\n\ttype BoxProps,\n\ttype CompoundStylesApiProps,\n\ttype Factory,\n\tfactory,\n\tText,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\n\nexport type LightboxCounterStylesNames = \"counter\";\n\nexport interface LightboxCounterProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxCounterFactory> {\n\t/** Custom formatter for the counter label, `(i, t) => \\`${i + 1} / ${t}\\`` by default */\n\tformatter?: (index: number, total: number) => string;\n}\n\nexport type LightboxCounterFactory = Factory<{\n\tprops: LightboxCounterProps;\n\tref: HTMLParagraphElement;\n\tstylesNames: LightboxCounterStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxCounter = factory<LightboxCounterFactory>((_props) => {\n\tconst props = useProps(\"LightboxCounter\", null, _props);\n\n\tconst { classNames, className, style, styles, vars, formatter, ...others } =\n\t\tprops;\n\n\tconst { currentIndex, slideCount, getStyles } = useLightboxContext();\n\n\tif (slideCount === null) {\n\t\treturn null;\n\t}\n\n\tconst label = formatter\n\t\t? formatter(currentIndex, slideCount)\n\t\t: `${currentIndex + 1} / ${slideCount}`;\n\n\treturn (\n\t\t<Text\n\t\t\tsize=\"sm\"\n\t\t\t{...getStyles(\"counter\", { className, style, classNames, styles })}\n\t\t\t{...others}\n\t\t>\n\t\t\t{label}\n\t\t</Text>\n\t);\n});\n\nLightboxCounter.classes = classes;\n\nLightboxCounter.displayName = \"LightboxCounter\";\n"],"names":[],"mappings":"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"}
|
|
@@ -6,7 +6,7 @@ import classes from '../styles/Lightbox.module.css.mjs';
|
|
|
6
6
|
import { EnterFullscreen } from './icons/EnterFullscreen.mjs';
|
|
7
7
|
import { ExitFullscreen } from './icons/ExitFullscreen.mjs';
|
|
8
8
|
|
|
9
|
-
const LightboxFullscreenButton = factory((_props
|
|
9
|
+
const LightboxFullscreenButton = factory((_props) => {
|
|
10
10
|
const props = useProps("LightboxFullscreenButton", null, _props);
|
|
11
11
|
const { classNames, className, style, styles, vars, ...others } = props;
|
|
12
12
|
const { withFullscreen, isFullscreen, toggleFullscreen, getStyles } = useLightboxContext();
|
|
@@ -16,7 +16,6 @@ const LightboxFullscreenButton = factory((_props, ref) => {
|
|
|
16
16
|
return /* @__PURE__ */ jsx(
|
|
17
17
|
ActionIcon,
|
|
18
18
|
{
|
|
19
|
-
ref,
|
|
20
19
|
variant: "default",
|
|
21
20
|
size: "lg",
|
|
22
21
|
onClick: toggleFullscreen,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LightboxFullscreenButton.mjs","sources":["../../../src/components/LightboxFullscreenButton.tsx"],"sourcesContent":["import {\n\tActionIcon,\n\ttype BoxProps,\n\ttype CompoundStylesApiProps,\n\ttype ElementProps,\n\ttype Factory,\n\tfactory,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\nimport { EnterFullscreen } from \"./icons/EnterFullscreen.js\";\nimport { ExitFullscreen } from \"./icons/ExitFullscreen.js\";\n\nexport type LightboxFullscreenButtonStylesNames = \"fullscreenButton\";\n\nexport interface LightboxFullscreenButtonProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxFullscreenButtonFactory>,\n\t\tElementProps<\"button\"> {}\n\nexport type LightboxFullscreenButtonFactory = Factory<{\n\tprops: LightboxFullscreenButtonProps;\n\tref: HTMLButtonElement;\n\tstylesNames: LightboxFullscreenButtonStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxFullscreenButton =\n\tfactory<LightboxFullscreenButtonFactory>((_props
|
|
1
|
+
{"version":3,"file":"LightboxFullscreenButton.mjs","sources":["../../../src/components/LightboxFullscreenButton.tsx"],"sourcesContent":["import {\n\tActionIcon,\n\ttype BoxProps,\n\ttype CompoundStylesApiProps,\n\ttype ElementProps,\n\ttype Factory,\n\tfactory,\n\tuseProps,\n} from \"@mantine/core\";\nimport { useLightboxContext } from \"../context/LightboxContext.js\";\nimport classes from \"../styles/Lightbox.module.css\";\nimport { EnterFullscreen } from \"./icons/EnterFullscreen.js\";\nimport { ExitFullscreen } from \"./icons/ExitFullscreen.js\";\n\nexport type LightboxFullscreenButtonStylesNames = \"fullscreenButton\";\n\nexport interface LightboxFullscreenButtonProps\n\textends BoxProps,\n\t\tCompoundStylesApiProps<LightboxFullscreenButtonFactory>,\n\t\tElementProps<\"button\"> {}\n\nexport type LightboxFullscreenButtonFactory = Factory<{\n\tprops: LightboxFullscreenButtonProps;\n\tref: HTMLButtonElement;\n\tstylesNames: LightboxFullscreenButtonStylesNames;\n\tcompound: true;\n}>;\n\nexport const LightboxFullscreenButton =\n\tfactory<LightboxFullscreenButtonFactory>((_props) => {\n\t\tconst props = useProps(\"LightboxFullscreenButton\", null, _props);\n\n\t\tconst { classNames, className, style, styles, vars, ...others } = props;\n\n\t\tconst { withFullscreen, isFullscreen, toggleFullscreen, getStyles } =\n\t\t\tuseLightboxContext();\n\n\t\tif (!withFullscreen) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<ActionIcon\n\t\t\t\tvariant=\"default\"\n\t\t\t\tsize=\"lg\"\n\t\t\t\tonClick={toggleFullscreen}\n\t\t\t\taria-label={`${isFullscreen ? \"Exit\" : \"Enter\"} fullscreen`}\n\t\t\t\t{...getStyles(\"fullscreenButton\", {\n\t\t\t\t\tclassName,\n\t\t\t\t\tstyle,\n\t\t\t\t\tclassNames,\n\t\t\t\t\tstyles,\n\t\t\t\t})}\n\t\t\t\t{...others}\n\t\t\t>\n\t\t\t\t{isFullscreen ? <ExitFullscreen /> : <EnterFullscreen />}\n\t\t\t</ActionIcon>\n\t\t);\n\t});\n\nLightboxFullscreenButton.classes = classes;\n\nLightboxFullscreenButton.displayName = \"LightboxFullscreenButton\";\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import { getDefaultZIndex, factory, useProps, useStyles, OptionalPortal, RemoveScroll, Transition, Overlay, Box } from '@mantine/core';
|
|
4
|
-
import { useFocusTrap, useMergedRef, useFocusReturn,
|
|
4
|
+
import { useFocusTrap, useMergedRef, useFocusReturn, useFullscreenDocument, useHotkeys } from '@mantine/hooks';
|
|
5
5
|
import { useRef, useState, useCallback, useEffect } from 'react';
|
|
6
6
|
import { LightboxProvider } from '../context/LightboxContext.mjs';
|
|
7
7
|
import { useAutoPlay } from '../hooks/useAutoPlay.mjs';
|
|
@@ -30,6 +30,7 @@ const defaultProps = {
|
|
|
30
30
|
withZoom: true,
|
|
31
31
|
withFullscreen: true,
|
|
32
32
|
orientation: "horizontal",
|
|
33
|
+
initialSlide: 0,
|
|
33
34
|
transitionProps: {
|
|
34
35
|
transition: "fade",
|
|
35
36
|
duration: 250
|
|
@@ -41,9 +42,10 @@ const defaultProps = {
|
|
|
41
42
|
zIndex: getDefaultZIndex("modal")
|
|
42
43
|
}
|
|
43
44
|
};
|
|
44
|
-
const LightboxRoot = factory((_props
|
|
45
|
+
const LightboxRoot = factory((_props) => {
|
|
45
46
|
const props = useProps("Lightbox", defaultProps, _props);
|
|
46
47
|
const {
|
|
48
|
+
ref,
|
|
47
49
|
opened,
|
|
48
50
|
onClose,
|
|
49
51
|
classNames,
|
|
@@ -53,6 +55,7 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
53
55
|
unstyled,
|
|
54
56
|
vars,
|
|
55
57
|
children,
|
|
58
|
+
initialSlide,
|
|
56
59
|
closeOnClickOutside,
|
|
57
60
|
keepMounted,
|
|
58
61
|
trapFocus,
|
|
@@ -87,7 +90,6 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
87
90
|
useFocusReturn({ opened, shouldReturnFocus: returnFocus });
|
|
88
91
|
const slidesEmblaRef = useRef(null);
|
|
89
92
|
const thumbnailsEmblaRef = useRef(null);
|
|
90
|
-
const initialSlideRef = useRef(0);
|
|
91
93
|
const [currentIndex, setCurrentIndex] = useState(0);
|
|
92
94
|
const [slideCount, setSlideCount] = useState(null);
|
|
93
95
|
const [slidesEmblaApi, setSlidesEmblaApi] = useState(null);
|
|
@@ -104,7 +106,8 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
104
106
|
updateCanZoomAvailability,
|
|
105
107
|
handleZoomPointerDown,
|
|
106
108
|
handleZoomPointerMove,
|
|
107
|
-
handleZoomPointerEnd
|
|
109
|
+
handleZoomPointerEnd,
|
|
110
|
+
panZoom
|
|
108
111
|
} = useZoom({ opened, withZoom });
|
|
109
112
|
const {
|
|
110
113
|
canAutoPlay,
|
|
@@ -120,7 +123,7 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
120
123
|
},
|
|
121
124
|
[handleEmblaApiForAutoPlay]
|
|
122
125
|
);
|
|
123
|
-
const { fullscreen: isFullscreen, toggle: toggleFullscreen } =
|
|
126
|
+
const { fullscreen: isFullscreen, toggle: toggleFullscreen } = useFullscreenDocument();
|
|
124
127
|
useEffect(() => {
|
|
125
128
|
if (opened || typeof document === "undefined" || !document.fullscreenElement || typeof document.exitFullscreen !== "function") {
|
|
126
129
|
return;
|
|
@@ -130,19 +133,55 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
130
133
|
useHotkeys([
|
|
131
134
|
[
|
|
132
135
|
"ArrowLeft",
|
|
133
|
-
() =>
|
|
136
|
+
() => {
|
|
137
|
+
if (!opened) {
|
|
138
|
+
return;
|
|
139
|
+
}
|
|
140
|
+
if (isZoomedRef.current) {
|
|
141
|
+
panZoom("left");
|
|
142
|
+
} else if (orientation === "horizontal") {
|
|
143
|
+
slidesEmblaRef.current?.scrollPrev();
|
|
144
|
+
}
|
|
145
|
+
}
|
|
134
146
|
],
|
|
135
147
|
[
|
|
136
148
|
"ArrowRight",
|
|
137
|
-
() =>
|
|
149
|
+
() => {
|
|
150
|
+
if (!opened) {
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
if (isZoomedRef.current) {
|
|
154
|
+
panZoom("right");
|
|
155
|
+
} else if (orientation === "horizontal") {
|
|
156
|
+
slidesEmblaRef.current?.scrollNext();
|
|
157
|
+
}
|
|
158
|
+
}
|
|
138
159
|
],
|
|
139
160
|
[
|
|
140
161
|
"ArrowUp",
|
|
141
|
-
() =>
|
|
162
|
+
() => {
|
|
163
|
+
if (!opened) {
|
|
164
|
+
return;
|
|
165
|
+
}
|
|
166
|
+
if (isZoomedRef.current) {
|
|
167
|
+
panZoom("up");
|
|
168
|
+
} else if (orientation === "vertical") {
|
|
169
|
+
slidesEmblaRef.current?.scrollPrev();
|
|
170
|
+
}
|
|
171
|
+
}
|
|
142
172
|
],
|
|
143
173
|
[
|
|
144
174
|
"ArrowDown",
|
|
145
|
-
() =>
|
|
175
|
+
() => {
|
|
176
|
+
if (!opened) {
|
|
177
|
+
return;
|
|
178
|
+
}
|
|
179
|
+
if (isZoomedRef.current) {
|
|
180
|
+
panZoom("down");
|
|
181
|
+
} else if (orientation === "vertical") {
|
|
182
|
+
slidesEmblaRef.current?.scrollNext();
|
|
183
|
+
}
|
|
184
|
+
}
|
|
146
185
|
],
|
|
147
186
|
["Escape", () => opened && onClose()]
|
|
148
187
|
]);
|
|
@@ -196,7 +235,7 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
196
235
|
slideCount,
|
|
197
236
|
slidesEmblaRef,
|
|
198
237
|
thumbnailsEmblaRef,
|
|
199
|
-
|
|
238
|
+
initialSlide,
|
|
200
239
|
setCurrentIndex: handleSlideChange,
|
|
201
240
|
setSlideCount,
|
|
202
241
|
onClose,
|
|
@@ -225,7 +264,8 @@ const LightboxRoot = factory((_props, ref) => {
|
|
|
225
264
|
updateCanZoomAvailability,
|
|
226
265
|
handleZoomPointerDown,
|
|
227
266
|
handleZoomPointerMove,
|
|
228
|
-
handleZoomPointerEnd
|
|
267
|
+
handleZoomPointerEnd,
|
|
268
|
+
panZoom
|
|
229
269
|
},
|
|
230
270
|
children: [
|
|
231
271
|
/* @__PURE__ */ jsx(
|