@mantine/carousel 6.0.17 → 7.0.0-alpha.21

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 (45) hide show
  1. package/cjs/Carousel.context.js +4 -3
  2. package/cjs/Carousel.context.js.map +1 -1
  3. package/cjs/Carousel.js +150 -118
  4. package/cjs/Carousel.js.map +1 -1
  5. package/cjs/Carousel.module.css.js +8 -0
  6. package/cjs/Carousel.module.css.js.map +1 -0
  7. package/cjs/CarouselSlide/CarouselSlide.js +17 -21
  8. package/cjs/CarouselSlide/CarouselSlide.js.map +1 -1
  9. package/cjs/CarouselVariables/CarouselVariables.js +45 -0
  10. package/cjs/CarouselVariables/CarouselVariables.js.map +1 -0
  11. package/cjs/get-chevron-rotation.js.map +1 -1
  12. package/cjs/index.css +205 -0
  13. package/cjs/index.js +3 -0
  14. package/cjs/index.js.map +1 -1
  15. package/cjs/use-animation-offset-effect.js.map +1 -1
  16. package/esm/Carousel.context.js +4 -3
  17. package/esm/Carousel.context.js.map +1 -1
  18. package/esm/Carousel.js +151 -118
  19. package/esm/Carousel.js.map +1 -1
  20. package/esm/Carousel.module.css.js +4 -0
  21. package/esm/Carousel.module.css.js.map +1 -0
  22. package/esm/CarouselSlide/CarouselSlide.js +19 -23
  23. package/esm/CarouselSlide/CarouselSlide.js.map +1 -1
  24. package/esm/CarouselVariables/CarouselVariables.js +37 -0
  25. package/esm/CarouselVariables/CarouselVariables.js.map +1 -0
  26. package/esm/get-chevron-rotation.js.map +1 -1
  27. package/esm/index.css +205 -0
  28. package/esm/index.js +2 -0
  29. package/esm/index.js.map +1 -1
  30. package/esm/use-animation-offset-effect.js.map +1 -1
  31. package/lib/Carousel.context.d.ts +8 -16
  32. package/lib/Carousel.context.d.ts.map +1 -1
  33. package/lib/Carousel.d.ts +54 -43
  34. package/lib/Carousel.d.ts.map +1 -1
  35. package/lib/CarouselSlide/CarouselSlide.d.ts +15 -12
  36. package/lib/CarouselSlide/CarouselSlide.d.ts.map +1 -1
  37. package/lib/CarouselVariables/CarouselVariables.d.ts +8 -0
  38. package/lib/CarouselVariables/CarouselVariables.d.ts.map +1 -0
  39. package/lib/get-chevron-rotation.d.ts +1 -2
  40. package/lib/get-chevron-rotation.d.ts.map +1 -1
  41. package/lib/index.d.ts +4 -2
  42. package/lib/index.d.ts.map +1 -1
  43. package/lib/use-animation-offset-effect.d.ts +2 -2
  44. package/lib/use-animation-offset-effect.d.ts.map +1 -1
  45. package/package.json +18 -11
@@ -1 +1 @@
1
- {"version":3,"file":"Carousel.js","sources":["../src/Carousel.tsx"],"sourcesContent":["/* eslint-disable react/no-unused-prop-types */\nimport {\n Box,\n ChevronIcon,\n DefaultProps,\n MantineNumberSize,\n Selectors,\n UnstyledButton,\n useComponentDefaultProps,\n} from '@mantine/core';\nimport { clamp } from '@mantine/hooks';\nimport { ForwardRefWithStaticComponents } from '@mantine/utils';\nimport useEmblaCarousel, { EmblaPluginType } from 'embla-carousel-react';\nimport React, { Children, forwardRef, useCallback, useEffect, useState } from 'react';\nimport { CarouselProvider } from './Carousel.context';\nimport useStyles, { CarouselStylesParams } from './Carousel.styles';\nimport { CarouselSlide, CarouselSlideStylesNames } from './CarouselSlide/CarouselSlide';\nimport { getChevronRotation } from './get-chevron-rotation';\nimport { CarouselBreakpoint, CarouselOrientation, Embla } from './types';\n\nexport type CarouselStylesNames = CarouselSlideStylesNames | Selectors<typeof useStyles>;\n\nexport interface CarouselProps\n extends DefaultProps<CarouselStylesNames, CarouselStylesParams>,\n React.ComponentPropsWithRef<'div'> {\n variant?: string;\n\n /** <Carousel.Slide /> components */\n children?: React.ReactNode;\n\n /** Called when user clicks next button */\n onNextSlide?(): void;\n\n /** Called when user clicks previous button */\n onPreviousSlide?(): void;\n\n /** Called with slide index when slide changes */\n onSlideChange?(index: number): void;\n\n /** Get embla API as ref */\n getEmblaApi?(embla: Embla): void;\n\n /** Next control aria-label */\n nextControlLabel?: string;\n\n /** Previous control aria-label */\n previousControlLabel?: string;\n\n /** Previous/next controls size */\n controlSize?: number;\n\n /** Key of theme.spacing or number to set space between next/previous control and carousel boundary */\n controlsOffset?: MantineNumberSize;\n\n /** Slide width, defaults to 100%, examples: 40rem 50% */\n slideSize?: string | number;\n\n /** Key of theme.spacing or number to set gap between slides */\n slideGap?: MantineNumberSize;\n\n /** Control slideSize and slideGap at different viewport sizes */\n breakpoints?: CarouselBreakpoint[];\n\n /** Carousel orientation, horizontal by default */\n orientation?: CarouselOrientation;\n\n /** Slides container height, required for vertical orientation */\n height?: React.CSSProperties['height'];\n\n /** Determines how slides will be aligned relative to the container. Use number between 0-1 to align slides based on percentage, where 0.5 equals 50% */\n align?: 'start' | 'center' | 'end' | number;\n\n /** Number of slides that should be scrolled with next/previous buttons */\n slidesToScroll?: number | 'auto';\n\n /** Determines whether gap should be treated as part of the slide size, true by default */\n includeGapInSize?: boolean;\n\n /** Determines whether carousel can be scrolled with mouse and touch interactions, true by default */\n draggable?: boolean;\n\n /** Determines whether momentum scrolling should be enabled, false by default */\n dragFree?: boolean;\n\n /** Enables infinite looping. Automatically falls back to false if slide content isn't enough to loop. */\n loop?: boolean;\n\n /** Adjusts scroll speed when triggered by any of the methods. Higher numbers enables faster scrolling. */\n speed?: number;\n\n /** Index of initial slide */\n initialSlide?: number;\n\n /** Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view. For example, 0.5 equals 50%. */\n inViewThreshold?: number;\n\n /** Determines whether next/previous controls should be displayed, true by default */\n withControls?: boolean;\n\n /** Determines whether indicators should be displayed, false by default */\n withIndicators?: boolean;\n\n /** An array of embla plugins */\n plugins?: EmblaPluginType[];\n\n /** Icon of next control */\n nextControlIcon?: React.ReactNode;\n\n /** Previous control icon */\n previousControlIcon?: React.ReactNode;\n\n /** Allow the carousel to skip scroll snaps if it's dragged vigorously. Note that this option will be ignored if the dragFree option is set to true, false by default */\n skipSnaps?: boolean;\n\n /** Clear leading and trailing empty space that causes excessive scrolling. Use trimSnaps to only use snap points that trigger scrolling or keepSnaps to keep them. */\n containScroll?: 'trimSnaps' | 'keepSnaps' | '';\n\n /** Determines whether arrow key should switch slides, true by default */\n withKeyboardEvents?: boolean;\n}\n\nconst defaultProps: Partial<CarouselProps> = {\n controlSize: 26,\n controlsOffset: 'sm',\n slideSize: '100%',\n slideGap: 0,\n orientation: 'horizontal',\n align: 'center',\n slidesToScroll: 1,\n includeGapInSize: true,\n draggable: true,\n dragFree: false,\n loop: false,\n speed: 10,\n initialSlide: 0,\n inViewThreshold: 0,\n withControls: true,\n withIndicators: false,\n skipSnaps: false,\n containScroll: '',\n withKeyboardEvents: true,\n};\n\nexport const _Carousel = forwardRef<HTMLDivElement, CarouselProps>((props, ref) => {\n const {\n children,\n className,\n getEmblaApi,\n onNextSlide,\n onPreviousSlide,\n onSlideChange,\n nextControlLabel,\n previousControlLabel,\n controlSize,\n controlsOffset,\n classNames,\n styles,\n unstyled,\n slideSize,\n slideGap,\n orientation,\n height,\n align,\n slidesToScroll,\n includeGapInSize,\n draggable,\n dragFree,\n loop,\n speed,\n initialSlide,\n inViewThreshold,\n withControls,\n withIndicators,\n plugins,\n nextControlIcon,\n previousControlIcon,\n breakpoints,\n skipSnaps,\n containScroll,\n withKeyboardEvents,\n variant,\n ...others\n } = useComponentDefaultProps('Carousel', defaultProps, props);\n\n const { classes, cx, theme } = useStyles(\n { controlSize, controlsOffset, orientation, height, includeGapInSize, breakpoints, slideGap },\n { name: 'Carousel', classNames, styles, unstyled, variant }\n );\n\n const [emblaRefElement, embla] = useEmblaCarousel(\n {\n axis: orientation === 'horizontal' ? 'x' : 'y',\n // keep direction undefined for vertical orientation if the current theme is RTL\n direction: orientation === 'horizontal' ? theme.dir : undefined,\n startIndex: initialSlide,\n loop,\n align,\n slidesToScroll,\n draggable,\n dragFree,\n speed,\n inViewThreshold,\n skipSnaps,\n containScroll,\n },\n plugins\n );\n\n const [selected, setSelected] = useState(0);\n const [slidesCount, setSlidesCount] = useState(0);\n\n const handleScroll = useCallback((index: number) => embla && embla.scrollTo(index), [embla]);\n\n const handleSelect = useCallback(() => {\n if (!embla) return;\n const slide = embla.selectedScrollSnap();\n setSelected(slide);\n onSlideChange?.(slide);\n }, [embla, setSelected]);\n\n const handlePrevious = useCallback(() => {\n embla?.scrollPrev();\n onPreviousSlide?.();\n }, [embla]);\n\n const handleNext = useCallback(() => {\n embla?.scrollNext();\n onNextSlide?.();\n }, [embla]);\n\n const handleKeydown = useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (withKeyboardEvents) {\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n handleNext();\n }\n\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n handlePrevious();\n }\n }\n },\n [embla]\n );\n\n useEffect(() => {\n if (embla) {\n getEmblaApi?.(embla);\n handleSelect();\n setSlidesCount(embla.scrollSnapList().length);\n embla.on('select', handleSelect);\n\n return () => {\n embla.off('select', handleSelect);\n };\n }\n\n return undefined;\n }, [embla, slidesToScroll]);\n\n useEffect(() => {\n if (embla) {\n embla.reInit();\n setSlidesCount(embla.scrollSnapList().length);\n setSelected((currentSelected) =>\n clamp(currentSelected, 0, Children.toArray(children).length - 1)\n );\n }\n }, [Children.toArray(children).length, slidesToScroll]);\n\n const canScrollPrev = embla?.canScrollPrev() || false;\n const canScrollNext = embla?.canScrollNext() || false;\n\n const indicators = Array(slidesCount)\n .fill(0)\n .map((_, index) => (\n <UnstyledButton\n key={index}\n data-active={index === selected || undefined}\n className={classes.indicator}\n aria-hidden\n tabIndex={-1}\n onClick={() => handleScroll(index)}\n />\n ));\n\n return (\n <CarouselProvider\n value={{\n slideGap,\n slideSize,\n embla,\n orientation,\n includeGapInSize,\n breakpoints,\n classNames,\n styles,\n unstyled,\n variant,\n }}\n >\n <Box\n className={cx(classes.root, className)}\n ref={ref}\n onKeyDownCapture={handleKeydown}\n {...others}\n >\n <div className={classes.viewport} ref={emblaRefElement}>\n <div className={classes.container}>{children}</div>\n </div>\n\n {withIndicators && <div className={classes.indicators}>{indicators}</div>}\n\n {withControls && (\n <div className={classes.controls}>\n <UnstyledButton\n onClick={handlePrevious}\n className={classes.control}\n aria-label={previousControlLabel}\n data-inactive={!canScrollPrev || undefined}\n tabIndex={canScrollPrev ? 0 : -1}\n >\n {typeof previousControlIcon !== 'undefined' ? (\n previousControlIcon\n ) : (\n <ChevronIcon\n style={{\n transform: `rotate(${getChevronRotation({\n dir: theme.dir,\n orientation,\n direction: 'previous',\n })}deg)`,\n }}\n />\n )}\n </UnstyledButton>\n\n <UnstyledButton\n onClick={handleNext}\n className={classes.control}\n aria-label={nextControlLabel}\n data-inactive={!canScrollNext || undefined}\n tabIndex={canScrollNext ? 0 : -1}\n >\n {typeof nextControlIcon !== 'undefined' ? (\n nextControlIcon\n ) : (\n <ChevronIcon\n style={{\n transform: `rotate(${getChevronRotation({\n dir: theme.dir,\n orientation,\n direction: 'next',\n })}deg)`,\n }}\n />\n )}\n </UnstyledButton>\n </div>\n )}\n </Box>\n </CarouselProvider>\n );\n}) as any;\n\n_Carousel.Slide = CarouselSlide;\n_Carousel.displayName = '@mantine/carousel/Carousel';\n\nexport const Carousel: ForwardRefWithStaticComponents<\n CarouselProps,\n { Slide: typeof CarouselSlide }\n> = _Carousel;\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Carousel.js","sources":["../src/Carousel.tsx"],"sourcesContent":["import React, { Children, useCallback, useEffect, useState } from 'react';\nimport {\n Box,\n BoxProps,\n StylesApiProps,\n factory,\n ElementProps,\n useProps,\n useStyles,\n createVarsResolver,\n Factory,\n MantineSpacing,\n StyleProp,\n useDirection,\n UnstyledButton,\n AccordionChevron,\n useRandomClassName,\n rem,\n getSpacing,\n} from '@mantine/core';\nimport { clamp } from '@mantine/hooks';\nimport useEmblaCarousel, { EmblaPluginType, EmblaCarouselType } from 'embla-carousel-react';\nimport { getChevronRotation } from './get-chevron-rotation';\nimport { CarouselProvider } from './Carousel.context';\nimport { CarouselSlide } from './CarouselSlide/CarouselSlide';\nimport { CarouselVariables } from './CarouselVariables/CarouselVariables';\nimport classes from './Carousel.module.css';\n\nexport type CarouselStylesNames =\n | 'slide'\n | 'root'\n | 'viewport'\n | 'container'\n | 'controls'\n | 'control'\n | 'indicators'\n | 'indicator';\n\nexport type CarouselCssVariables = {\n root: '--carousel-height' | '--carousel-control-size' | '--carousel-controls-offset';\n};\n\nexport interface CarouselProps\n extends BoxProps,\n StylesApiProps<CarouselFactory>,\n ElementProps<'div'> {\n /** <Carousel.Slide /> components */\n children?: React.ReactNode;\n\n /** Called when next slide is shown */\n onNextSlide?(): void;\n\n /** Called when previous slider is shown */\n onPreviousSlide?(): void;\n\n /** Called with slide index when slide changes */\n onSlideChange?(index: number): void;\n\n /** Get embla API as ref */\n getEmblaApi?(embla: EmblaCarouselType): void;\n\n /** Props passed down to next control */\n nextControlProps?: React.ComponentPropsWithoutRef<'button'>;\n\n /** Props passed down to previous control */\n previousControlProps?: React.ComponentPropsWithoutRef<'button'>;\n\n /** Controls size of the next and previous controls, `26` by default */\n controlSize?: React.CSSProperties['width'];\n\n /** Controls position of the next and previous controls, key of `theme.spacing` or any valid CSS value, `'sm'` by default */\n controlsOffset?: MantineSpacing | (string & {}) | number;\n\n /** Controls slide width based on viewport width, `'100%'` by default */\n slideSize?: StyleProp<string | number>;\n\n /** Key of theme.spacing or number to set gap between slides */\n slideGap?: StyleProp<MantineSpacing | (string & {}) | number>;\n\n /** Carousel orientation, `'horizontal'` by default */\n orientation?: 'horizontal' | 'vertical';\n\n /** Slides container `height`, required for vertical orientation */\n height?: React.CSSProperties['height'];\n\n /** Determines how slides will be aligned relative to the container. Use number between 0-1 to align slides based on percentage, where 0.5 is 50%, `'center'` by default */\n align?: 'start' | 'center' | 'end' | number;\n\n /** Number of slides that will be scrolled with next/previous buttons, `1` by default */\n slidesToScroll?: number | 'auto';\n\n /** Determines whether gap between slides should be treated as part of the slide size, `true` by default */\n includeGapInSize?: boolean;\n\n /** Determines whether the carousel can be scrolled with mouse and touch interactions, `true` by default */\n draggable?: boolean;\n\n /** Determines whether momentum scrolling should be enabled, `false` by default */\n dragFree?: boolean;\n\n /** Enables infinite looping. `true` by default, automatically falls back to `false` if slide content isn't enough to loop. */\n loop?: boolean;\n\n /** Adjusts scroll speed when triggered by any of the methods. Higher numbers enables faster scrolling. */\n speed?: number;\n\n /** Index of initial slide */\n initialSlide?: number;\n\n /** Choose a fraction representing the percentage portion of a slide that needs to be visible in order to be considered in view. For example, 0.5 equals 50%. */\n inViewThreshold?: number;\n\n /** Determines whether next/previous controls should be displayed, true by default */\n withControls?: boolean;\n\n /** Determines whether indicators should be displayed, `false` by default */\n withIndicators?: boolean;\n\n /** An array of embla plugins */\n plugins?: EmblaPluginType[];\n\n /** Icon of the next control */\n nextControlIcon?: React.ReactNode;\n\n /** Icon of the previous control */\n previousControlIcon?: React.ReactNode;\n\n /** Allow the carousel to skip scroll snaps if it is dragged vigorously. Note that this option will be ignored if the dragFree option is set to `true`, `false` by default */\n skipSnaps?: boolean;\n\n /** Clear leading and trailing empty space that causes excessive scrolling. Use `trimSnaps` to only use snap points that trigger scrolling or keepSnaps to keep them. */\n containScroll?: 'trimSnaps' | 'keepSnaps' | '';\n\n /** Determines whether arrow key should switch slides, `true` by default */\n withKeyboardEvents?: boolean;\n}\n\nexport type CarouselFactory = Factory<{\n props: CarouselProps;\n ref: HTMLDivElement;\n stylesNames: CarouselStylesNames;\n vars: CarouselCssVariables;\n staticComponents: {\n Slide: typeof CarouselSlide;\n };\n}>;\n\nconst defaultProps: Partial<CarouselProps> = {\n controlSize: 26,\n controlsOffset: 'sm',\n slideSize: '100%',\n slideGap: 0,\n orientation: 'horizontal',\n align: 'center',\n slidesToScroll: 1,\n includeGapInSize: true,\n draggable: true,\n dragFree: false,\n loop: false,\n speed: 10,\n initialSlide: 0,\n inViewThreshold: 0,\n withControls: true,\n withIndicators: false,\n skipSnaps: false,\n containScroll: '',\n withKeyboardEvents: true,\n};\n\nconst varsResolver = createVarsResolver<CarouselFactory>(\n (_, { height, controlSize, controlsOffset }) => ({\n root: {\n '--carousel-height': rem(height),\n '--carousel-control-size': rem(controlSize),\n '--carousel-controls-offset': getSpacing(controlsOffset),\n },\n })\n);\n\nexport const Carousel = factory<CarouselFactory>((_props, ref) => {\n const props = useProps('Carousel', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n children,\n getEmblaApi,\n onNextSlide,\n onPreviousSlide,\n onSlideChange,\n nextControlProps,\n previousControlProps,\n controlSize,\n controlsOffset,\n slideSize,\n slideGap,\n orientation,\n height,\n align,\n slidesToScroll,\n includeGapInSize,\n draggable,\n dragFree,\n loop,\n speed,\n initialSlide,\n inViewThreshold,\n withControls,\n withIndicators,\n plugins,\n nextControlIcon,\n previousControlIcon,\n skipSnaps,\n containScroll,\n withKeyboardEvents,\n ...others\n } = props;\n\n const getStyles = useStyles<CarouselFactory>({\n name: 'Carousel',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n varsResolver,\n });\n\n const responsiveClassName = useRandomClassName();\n const { dir } = useDirection();\n\n const [emblaRefElement, embla] = useEmblaCarousel(\n {\n axis: orientation === 'horizontal' ? 'x' : 'y',\n direction: orientation === 'horizontal' ? dir : undefined,\n startIndex: initialSlide,\n loop,\n align,\n slidesToScroll,\n draggable,\n dragFree,\n speed,\n inViewThreshold,\n skipSnaps,\n containScroll,\n },\n plugins\n );\n\n const [selected, setSelected] = useState(0);\n const [slidesCount, setSlidesCount] = useState(0);\n\n const handleScroll = useCallback((index: number) => embla && embla.scrollTo(index), [embla]);\n\n const handleSelect = useCallback(() => {\n if (!embla) return;\n const slide = embla.selectedScrollSnap();\n setSelected(slide);\n onSlideChange?.(slide);\n }, [embla, setSelected]);\n\n const handlePrevious = useCallback(() => {\n embla?.scrollPrev();\n onPreviousSlide?.();\n }, [embla]);\n\n const handleNext = useCallback(() => {\n embla?.scrollNext();\n onNextSlide?.();\n }, [embla]);\n\n const handleKeydown = useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (withKeyboardEvents) {\n if (event.key === 'ArrowRight') {\n event.preventDefault();\n handleNext();\n }\n\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n handlePrevious();\n }\n }\n },\n [embla]\n );\n\n useEffect(() => {\n if (embla) {\n getEmblaApi?.(embla);\n handleSelect();\n setSlidesCount(embla.scrollSnapList().length);\n embla.on('select', handleSelect);\n\n return () => {\n embla.off('select', handleSelect);\n };\n }\n\n return undefined;\n }, [embla, slidesToScroll]);\n\n useEffect(() => {\n if (embla) {\n embla.reInit();\n setSlidesCount(embla.scrollSnapList().length);\n setSelected((currentSelected) =>\n clamp(currentSelected, 0, Children.toArray(children).length - 1)\n );\n }\n }, [Children.toArray(children).length, slidesToScroll]);\n\n const canScrollPrev = embla?.canScrollPrev() || false;\n const canScrollNext = embla?.canScrollNext() || false;\n\n const indicators = Array(slidesCount)\n .fill(0)\n .map((_, index) => (\n <UnstyledButton\n {...getStyles('indicator')}\n key={index}\n data-active={index === selected || undefined}\n aria-hidden\n tabIndex={-1}\n onClick={() => handleScroll(index)}\n />\n ));\n\n return (\n <CarouselProvider value={{ getStyles, orientation }}>\n <CarouselVariables {...props} selector={`.${responsiveClassName}`} />\n <Box\n ref={ref}\n {...getStyles('root', { className: responsiveClassName })}\n {...others}\n mod={{ orientation, 'include-gap-in-size': includeGapInSize }}\n onKeyDownCapture={handleKeydown}\n >\n <div {...getStyles('viewport')} ref={emblaRefElement}>\n <div {...getStyles('container')} data-orientation={orientation}>\n {children}\n </div>\n </div>\n\n {withIndicators && <div {...getStyles('indicators')}>{indicators}</div>}\n\n {withControls && (\n <div {...getStyles('controls')}>\n <UnstyledButton\n {...previousControlProps}\n {...getStyles('control')}\n onClick={handlePrevious}\n data-inactive={!canScrollPrev || undefined}\n tabIndex={canScrollPrev ? 0 : -1}\n >\n {typeof previousControlIcon !== 'undefined' ? (\n previousControlIcon\n ) : (\n <AccordionChevron\n style={{\n transform: `rotate(${getChevronRotation({\n dir,\n orientation,\n direction: 'previous',\n })}deg)`,\n }}\n />\n )}\n </UnstyledButton>\n\n <UnstyledButton\n onClick={handleNext}\n {...getStyles('control')}\n {...nextControlProps}\n data-inactive={!canScrollNext || undefined}\n tabIndex={canScrollNext ? 0 : -1}\n >\n {typeof nextControlIcon !== 'undefined' ? (\n nextControlIcon\n ) : (\n <AccordionChevron\n style={{\n transform: `rotate(${getChevronRotation({\n dir,\n orientation,\n direction: 'next',\n })}deg)`,\n }}\n />\n )}\n </UnstyledButton>\n </div>\n )}\n </Box>\n </CarouselProvider>\n );\n});\n\nCarousel.classes = classes;\nCarousel.displayName = '@mantine/core/Carousel';\nCarousel.Slide = CarouselSlide;\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,4 @@
1
+ var classes = {"root":"m-17884d0f","viewport":"m-a2dae653","container":"m-fcd81474","controls":"m-39bc3463","control":"m-64f58e10","indicators":"m-71ea3ab1","indicator":"m-eae68602","slide":"m-d98df724"};
2
+
3
+ export default classes;
4
+ //# sourceMappingURL=Carousel.module.css.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Carousel.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,7 +1,7 @@
1
- import React, { forwardRef } from 'react';
2
- import { Box } from '@mantine/core';
1
+ import React from 'react';
2
+ import { factory, useProps, Box } from '@mantine/core';
3
3
  import { useCarouselContext } from '../Carousel.context.js';
4
- import useStyles from './CarouselSlide.styles.js';
4
+ import classes from '../Carousel.module.css.js';
5
5
 
6
6
  var __defProp = Object.defineProperty;
7
7
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -31,28 +31,24 @@ var __objRest = (source, exclude) => {
31
31
  }
32
32
  return target;
33
33
  };
34
- const CarouselSlide = forwardRef((_a, ref) => {
35
- var _b = _a, { children, className, size, gap } = _b, others = __objRest(_b, ["children", "className", "size", "gap"]);
34
+ const defaultProps = {};
35
+ const CarouselSlide = factory((props, ref) => {
36
+ const _a = useProps(
37
+ "CarouselSlide",
38
+ defaultProps,
39
+ props
40
+ ), { classNames, className, style, styles, unstyled, vars } = _a, others = __objRest(_a, ["classNames", "className", "style", "styles", "unstyled", "vars"]);
36
41
  const ctx = useCarouselContext();
37
- const { classes, cx } = useStyles({
38
- gap: typeof gap === "undefined" ? ctx.slideGap : gap,
39
- size: typeof size === "undefined" ? ctx.slideSize : size,
40
- orientation: ctx.orientation,
41
- includeGapInSize: ctx.includeGapInSize,
42
- breakpoints: ctx.breakpoints
43
- }, {
44
- name: "Carousel",
45
- classNames: ctx.classNames,
46
- styles: ctx.styles,
47
- unstyled: ctx.unstyled,
48
- variant: ctx.variant
49
- });
50
- return /* @__PURE__ */ React.createElement(Box, __spreadValues({
51
- className: cx(classes.slide, className),
52
- ref
53
- }, others), children);
42
+ return /* @__PURE__ */ React.createElement(
43
+ Box,
44
+ __spreadValues(__spreadValues({
45
+ ref,
46
+ mod: { orientation: ctx.orientation }
47
+ }, ctx.getStyles("slide", { className, style, classNames, styles })), others)
48
+ );
54
49
  });
55
- CarouselSlide.displayName = "@mantine/carousel/CarouselSlide";
50
+ CarouselSlide.classes = classes;
51
+ CarouselSlide.displayName = "@mantine/core/CarouselSlide";
56
52
 
57
53
  export { CarouselSlide };
58
54
  //# sourceMappingURL=CarouselSlide.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CarouselSlide.js","sources":["../../src/CarouselSlide/CarouselSlide.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Box, DefaultProps, Selectors, MantineNumberSize } from '@mantine/core';\nimport { useCarouselContext } from '../Carousel.context';\nimport useStyles from './CarouselSlide.styles';\n\nexport type CarouselSlideStylesNames = Selectors<typeof useStyles>;\n\nexport interface CarouselSlideProps extends DefaultProps, React.ComponentPropsWithoutRef<'div'> {\n /** Slide content */\n children?: React.ReactNode;\n\n /** Slide width, defaults to 100%, examples: 40rem, 50% */\n size?: string | number;\n\n /** Key of theme.spacing or number to set gap between slides */\n gap?: MantineNumberSize;\n}\n\nexport const CarouselSlide = forwardRef<HTMLDivElement, CarouselSlideProps>(\n ({ children, className, size, gap, ...others }, ref) => {\n const ctx = useCarouselContext();\n const { classes, cx } = useStyles(\n {\n gap: typeof gap === 'undefined' ? ctx.slideGap : gap,\n size: typeof size === 'undefined' ? ctx.slideSize : size,\n orientation: ctx.orientation,\n includeGapInSize: ctx.includeGapInSize,\n breakpoints: ctx.breakpoints,\n },\n {\n name: 'Carousel',\n classNames: ctx.classNames,\n styles: ctx.styles,\n unstyled: ctx.unstyled,\n variant: ctx.variant,\n }\n );\n\n return (\n <Box className={cx(classes.slide, className)} ref={ref} {...others}>\n {children}\n </Box>\n );\n }\n);\n\nCarouselSlide.displayName = '@mantine/carousel/CarouselSlide';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"CarouselSlide.js","sources":["../../src/CarouselSlide/CarouselSlide.tsx"],"sourcesContent":["import React from 'react';\nimport {\n Box,\n BoxProps,\n StylesApiProps,\n factory,\n ElementProps,\n useProps,\n Factory,\n} from '@mantine/core';\nimport { useCarouselContext } from '../Carousel.context';\nimport classes from '../Carousel.module.css';\n\nexport type CarouselSlideStylesNames = 'slide';\n\nexport interface CarouselSlideProps\n extends BoxProps,\n StylesApiProps<CarouselSlideFactory>,\n ElementProps<'div'> {}\n\nexport type CarouselSlideFactory = Factory<{\n props: CarouselSlideProps;\n ref: HTMLDivElement;\n stylesNames: CarouselSlideStylesNames;\n compound: true;\n}>;\n\nconst defaultProps: Partial<CarouselSlideProps> = {};\n\nexport const CarouselSlide = factory<CarouselSlideFactory>((props, ref) => {\n const { classNames, className, style, styles, unstyled, vars, ...others } = useProps(\n 'CarouselSlide',\n defaultProps,\n props\n );\n\n const ctx = useCarouselContext();\n\n return (\n <Box\n ref={ref}\n mod={{ orientation: ctx.orientation }}\n {...ctx.getStyles('slide', { className, style, classNames, styles })}\n {...others}\n />\n );\n});\n\nCarouselSlide.classes = classes;\nCarouselSlide.displayName = '@mantine/core/CarouselSlide';\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,37 @@
1
+ import React from 'react';
2
+ import { useMantineTheme, filterProps, getSpacing, getBaseValue, keys, getSortedBreakpoints, InlineStyles } from '@mantine/core';
3
+
4
+ function CarouselVariables({ slideGap, slideSize, selector }) {
5
+ var _a;
6
+ const theme = useMantineTheme();
7
+ const baseStyles = filterProps({
8
+ "--carousel-slide-gap": getSpacing(getBaseValue(slideGap)),
9
+ "--carousel-slide-size": (_a = getBaseValue(slideSize)) == null ? void 0 : _a.toString()
10
+ });
11
+ const queries = keys(theme.breakpoints).reduce(
12
+ (acc, breakpoint) => {
13
+ if (!acc[breakpoint]) {
14
+ acc[breakpoint] = {};
15
+ }
16
+ if (typeof slideGap === "object" && slideGap[breakpoint] !== void 0) {
17
+ acc[breakpoint]["--carousel-slide-gap"] = getSpacing(slideGap[breakpoint]);
18
+ }
19
+ if (typeof slideSize === "object" && slideSize[breakpoint] !== void 0) {
20
+ acc[breakpoint]["--carousel-slide-size"] = getSpacing(slideSize[breakpoint]);
21
+ }
22
+ return acc;
23
+ },
24
+ {}
25
+ );
26
+ const sortedBreakpoints = getSortedBreakpoints(keys(queries), theme).filter(
27
+ (breakpoint) => keys(queries[breakpoint.value]).length > 0
28
+ );
29
+ const media = sortedBreakpoints.map((breakpoint) => ({
30
+ query: `(min-width: ${theme.breakpoints[breakpoint.value]})`,
31
+ styles: queries[breakpoint.value]
32
+ }));
33
+ return /* @__PURE__ */ React.createElement(InlineStyles, { styles: baseStyles, media, selector });
34
+ }
35
+
36
+ export { CarouselVariables };
37
+ //# sourceMappingURL=CarouselVariables.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CarouselVariables.js","sources":["../../src/CarouselVariables/CarouselVariables.tsx"],"sourcesContent":["import React from 'react';\nimport {\n getSortedBreakpoints,\n useMantineTheme,\n keys,\n getSpacing,\n MantineBreakpoint,\n filterProps,\n InlineStyles,\n getBaseValue,\n} from '@mantine/core';\nimport type { CarouselProps } from '../Carousel';\n\ninterface CarouselVariablesProps extends CarouselProps {\n selector: string;\n}\n\nexport function CarouselVariables({ slideGap, slideSize, selector }: CarouselVariablesProps) {\n const theme = useMantineTheme();\n\n const baseStyles: Record<string, string | undefined> = filterProps({\n '--carousel-slide-gap': getSpacing(getBaseValue(slideGap)),\n '--carousel-slide-size': getBaseValue(slideSize)?.toString(),\n });\n\n const queries = keys(theme.breakpoints).reduce<Record<string, Record<string, any>>>(\n (acc, breakpoint) => {\n if (!acc[breakpoint]) {\n acc[breakpoint] = {};\n }\n\n if (typeof slideGap === 'object' && slideGap[breakpoint] !== undefined) {\n acc[breakpoint]['--carousel-slide-gap'] = getSpacing(slideGap[breakpoint]);\n }\n\n if (typeof slideSize === 'object' && slideSize[breakpoint] !== undefined) {\n acc[breakpoint]['--carousel-slide-size'] = getSpacing(slideSize[breakpoint]);\n }\n\n return acc;\n },\n {}\n );\n\n const sortedBreakpoints = getSortedBreakpoints(keys(queries), theme).filter(\n (breakpoint) => keys(queries[breakpoint.value]).length > 0\n );\n\n const media = sortedBreakpoints.map((breakpoint) => ({\n query: `(min-width: ${theme.breakpoints[breakpoint.value as MantineBreakpoint]})`,\n styles: queries[breakpoint.value],\n }));\n\n return <InlineStyles styles={baseStyles} media={media} selector={selector} />;\n}\n"],"names":[],"mappings":";;;AAUO,SAAS,iBAAiB,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE;AACrE,EAAE,IAAI,EAAE,CAAC;AACT,EAAE,MAAM,KAAK,GAAG,eAAe,EAAE,CAAC;AAClC,EAAE,MAAM,UAAU,GAAG,WAAW,CAAC;AACjC,IAAI,sBAAsB,EAAE,UAAU,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;AAC9D,IAAI,uBAAuB,EAAE,CAAC,EAAE,GAAG,YAAY,CAAC,SAAS,CAAC,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,QAAQ,EAAE;AAC5F,GAAG,CAAC,CAAC;AACL,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,MAAM;AAChD,IAAI,CAAC,GAAG,EAAE,UAAU,KAAK;AACzB,MAAM,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;AAC5B,QAAQ,GAAG,CAAC,UAAU,CAAC,GAAG,EAAE,CAAC;AAC7B,OAAO;AACP,MAAM,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,CAAC,UAAU,CAAC,KAAK,KAAK,CAAC,EAAE;AAC3E,QAAQ,GAAG,CAAC,UAAU,CAAC,CAAC,sBAAsB,CAAC,GAAG,UAAU,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC;AACnF,OAAO;AACP,MAAM,IAAI,OAAO,SAAS,KAAK,QAAQ,IAAI,SAAS,CAAC,UAAU,CAAC,KAAK,KAAK,CAAC,EAAE;AAC7E,QAAQ,GAAG,CAAC,UAAU,CAAC,CAAC,uBAAuB,CAAC,GAAG,UAAU,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;AACrF,OAAO;AACP,MAAM,OAAO,GAAG,CAAC;AACjB,KAAK;AACL,IAAI,EAAE;AACN,GAAG,CAAC;AACJ,EAAE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,CAAC,MAAM;AAC7E,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC;AAC9D,GAAG,CAAC;AACJ,EAAE,MAAM,KAAK,GAAG,iBAAiB,CAAC,GAAG,CAAC,CAAC,UAAU,MAAM;AACvD,IAAI,KAAK,EAAE,CAAC,YAAY,EAAE,KAAK,CAAC,WAAW,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AAChE,IAAI,MAAM,EAAE,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC;AACrC,GAAG,CAAC,CAAC,CAAC;AACN,EAAE,uBAAuB,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;AACpG;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"get-chevron-rotation.js","sources":["../src/get-chevron-rotation.ts"],"sourcesContent":["import { CarouselOrientation } from './types';\n\ninterface Options {\n dir: 'rtl' | 'ltr';\n orientation: CarouselOrientation;\n direction: 'next' | 'previous';\n}\n\nexport function getChevronRotation({ dir, orientation, direction }: Options) {\n if (direction === 'previous') {\n return orientation === 'horizontal' ? 90 * (dir === 'ltr' ? 1 : -1) : -180;\n }\n\n return orientation === 'horizontal' ? 90 * (dir === 'ltr' ? -1 : 1) : 0;\n}\n"],"names":[],"mappings":"AAAO,SAAS,kBAAkB,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE;AACpE,EAAE,IAAI,SAAS,KAAK,UAAU,EAAE;AAChC,IAAI,OAAO,WAAW,KAAK,YAAY,GAAG,EAAE,IAAI,GAAG,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;AAC/E,GAAG;AACH,EAAE,OAAO,WAAW,KAAK,YAAY,GAAG,EAAE,IAAI,GAAG,KAAK,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;AAC1E;;;;"}
1
+ {"version":3,"file":"get-chevron-rotation.js","sources":["../src/get-chevron-rotation.ts"],"sourcesContent":["interface Options {\n dir: 'rtl' | 'ltr';\n orientation: 'horizontal' | 'vertical' | undefined;\n direction: 'next' | 'previous';\n}\n\nexport function getChevronRotation({ dir, orientation, direction }: Options) {\n if (direction === 'previous') {\n return orientation === 'horizontal' ? 90 * (dir === 'ltr' ? 1 : -1) : -180;\n }\n\n return orientation === 'horizontal' ? 90 * (dir === 'ltr' ? -1 : 1) : 0;\n}\n"],"names":[],"mappings":"AAAO,SAAS,kBAAkB,CAAC,EAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE;AACpE,EAAE,IAAI,SAAS,KAAK,UAAU,EAAE;AAChC,IAAI,OAAO,WAAW,KAAK,YAAY,GAAG,EAAE,IAAI,GAAG,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;AAC/E,GAAG;AACH,EAAE,OAAO,WAAW,KAAK,YAAY,GAAG,EAAE,IAAI,GAAG,KAAK,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;AAC1E;;;;"}
package/esm/index.css ADDED
@@ -0,0 +1,205 @@
1
+ .m-17884d0f {
2
+ position: relative;
3
+ }
4
+
5
+ .m-a2dae653 {
6
+ height: var(--carousel-height, auto);
7
+ overflow: hidden;
8
+ }
9
+
10
+ .m-fcd81474 {
11
+ display: flex;
12
+ flex-direction: var(--_container-direction, row);
13
+ height: var(--carousel-height, auto);
14
+ margin-right: var(--_container-mr);
15
+ margin-left: var(--_container-ml);
16
+ margin-bottom: var(--_container-mb);
17
+ }
18
+
19
+ [data-include-gap-in-size] .m-fcd81474[data-orientation='vertical'] {
20
+ --_container-mb: calc(var(--carousel-slide-gap) * -1);
21
+ }
22
+
23
+ [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
24
+ --_container-mr: calc(var(--carousel-slide-gap) * -1);
25
+ }
26
+
27
+ [dir="rtl"] [data-include-gap-in-size] .m-fcd81474[data-orientation='horizontal'] {
28
+ --_container-ml: calc(var(--carousel-slide-gap) * -1);
29
+ --_container-mr: 0;
30
+ }
31
+
32
+ .m-fcd81474[data-orientation='vertical'] {
33
+ --_container-direction: column;
34
+ }
35
+
36
+ .m-39bc3463 {
37
+ position: absolute;
38
+ display: flex;
39
+ align-items: center;
40
+ justify-content: space-between;
41
+ z-index: 1;
42
+ pointer-events: none;
43
+ flex-direction: var(--_controls-direction);
44
+ left: var(--_controls-left);
45
+ right: var(--_controls-right);
46
+ top: var(--_controls-top);
47
+ bottom: var(--_controls-bottom);
48
+ padding: var(--_controls-padding);
49
+ }
50
+
51
+ .m-17884d0f[data-orientation='vertical'] .m-39bc3463 {
52
+ --_controls-left: calc(50% - var(--carousel-control-size) / 2);
53
+ --_controls-top: 0;
54
+ --_controls-bottom: 0;
55
+ --_controls-direction: column;
56
+ --_controls-padding: var(--carousel-controls-offset) 0;
57
+ }
58
+
59
+ .m-17884d0f[data-orientation='horizontal'] .m-39bc3463 {
60
+ --_controls-left: 0;
61
+ --_controls-right: 0;
62
+ --_controls-top: calc(50% - var(--carousel-control-size) / 2);
63
+ --_controls-direction: row;
64
+ --_controls-padding: 0 var(--carousel-controls-offset);
65
+ }
66
+
67
+ .m-64f58e10 {
68
+ display: flex;
69
+ justify-content: center;
70
+ align-items: center;
71
+ min-width: var(--carousel-control-size);
72
+ min-height: var(--carousel-control-size);
73
+ border-radius: var(--carousel-control-size);
74
+ pointer-events: all;
75
+ background-color: var(--mantine-color-white);
76
+ color: var(--mantine-color-black);
77
+ box-shadow: var(--mantine-shadow-md);
78
+ opacity: var(--_control-opacity);
79
+ border: calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-gray-3);
80
+ transition: opacity 100ms ease;
81
+ }
82
+
83
+ [data-mantine-color-scheme='light'] .m-64f58e10 {
84
+ --_control-opacity: 0.85;
85
+ }
86
+
87
+ [data-mantine-color-scheme='dark'] .m-64f58e10 {
88
+ --_control-opacity: 0.65;
89
+ }
90
+
91
+ @media (hover: hover) {
92
+
93
+ .m-64f58e10:hover {
94
+ --_control-opacity: 1;
95
+ }
96
+ }
97
+
98
+ @media (hover: none) {
99
+
100
+ .m-64f58e10:active {
101
+ --_control-opacity: 1;
102
+ }
103
+ }
104
+
105
+ .m-71ea3ab1 {
106
+ position: absolute;
107
+ display: flex;
108
+ justify-content: center;
109
+ gap: calc(0.5rem * var(--mantine-scale));
110
+ pointer-events: none;
111
+ flex-direction: var(--_indicators-direction);
112
+ bottom: var(--_indicators-bottom);
113
+ left: var(--_indicators-left);
114
+ right: var(--_indicators-right);
115
+ top: var(--_indicators-top);
116
+ }
117
+
118
+ .m-17884d0f[data-orientation='vertical'] .m-71ea3ab1 {
119
+ --_indicators-bottom: 0;
120
+ --_indicators-top: 0;
121
+ --_indicators-right: var(--mantine-spacing-md);
122
+ --_indicators-direction: column;
123
+ }
124
+
125
+ .m-17884d0f[data-orientation='horizontal'] .m-71ea3ab1 {
126
+ --_indicators-bottom: var(--mantine-spacing-md);
127
+ --_indicators-left: 0;
128
+ --_indicators-right: 0;
129
+ --_indicators-direction: row;
130
+ }
131
+
132
+ .m-eae68602 {
133
+ pointer-events: all;
134
+ width: var(--_indicator-width);
135
+ height: var(--_indicator-height);
136
+ border-radius: var(--mantine-radius-xl);
137
+ box-shadow: var(--mantine-shadow-sm);
138
+ opacity: var(--_indicator-opacity, 0.6);
139
+ background-color: var(--mantine-color-white);
140
+ }
141
+
142
+ @media (hover: hover) {
143
+
144
+ .m-eae68602:hover {
145
+ --_indicator-opacity: 1;
146
+ }
147
+ }
148
+
149
+ @media (hover: none) {
150
+
151
+ .m-eae68602:active {
152
+ --_indicator-opacity: 1;
153
+ }
154
+ }
155
+
156
+ .m-eae68602[data-active] {
157
+ --_indicator-opacity: 1;
158
+ }
159
+
160
+ .m-17884d0f[data-orientation='vertical'] .m-eae68602 {
161
+ --_indicator-width: calc(0.3125rem * var(--mantine-scale));
162
+ --_indicator-height: calc(1.5625rem * var(--mantine-scale));
163
+ }
164
+
165
+ .m-17884d0f[data-orientation='horizontal'] .m-eae68602 {
166
+ --_indicator-width: calc(1.5625rem * var(--mantine-scale));
167
+ --_indicator-height: calc(0.3125rem * var(--mantine-scale));
168
+ }
169
+
170
+ .m-d98df724 {
171
+ position: relative;
172
+ flex: 0 0 var(--carousel-slide-size);
173
+ padding-right: var(--_slide-pr, 0);
174
+ padding-left: var(--_slide-pl, 0);
175
+ padding-bottom: var(--_slide-pb, 0);
176
+ margin-right: var(--_slide-mr, 0);
177
+ margin-left: var(--_slide-ml, 0);
178
+ margin-bottom: var(--_slide-mb, 0);
179
+ }
180
+
181
+ .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='vertical'] {
182
+ --_slide-pb: var(--carousel-slide-gap);
183
+ }
184
+
185
+ .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
186
+ --_slide-pr: var(--carousel-slide-gap);
187
+ }
188
+
189
+ [dir="rtl"] .m-17884d0f[data-include-gap-in-size] .m-d98df724[data-orientation='horizontal'] {
190
+ --_slide-pl: var(--carousel-slide-gap);
191
+ --_slide-pr: 0;
192
+ }
193
+
194
+ .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='vertical'] {
195
+ --_slide-mb: var(--carousel-slide-gap);
196
+ }
197
+
198
+ .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
199
+ --_slide-mr: var(--carousel-slide-gap);
200
+ }
201
+
202
+ [dir="rtl"] .m-17884d0f:not([data-include-gap-in-size]) .m-d98df724[data-orientation='horizontal'] {
203
+ --_slide-ml: var(--carousel-slide-gap);
204
+ --_slide-mr: 0;
205
+ }
package/esm/index.js CHANGED
@@ -1,3 +1,5 @@
1
+ 'use client';
1
2
  export { Carousel } from './Carousel.js';
2
3
  export { useAnimationOffsetEffect } from './use-animation-offset-effect.js';
4
+ export { CarouselSlide } from './CarouselSlide/CarouselSlide.js';
3
5
  //# sourceMappingURL=index.js.map
package/esm/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"use-animation-offset-effect.js","sources":["../src/use-animation-offset-effect.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { Embla } from './types';\n\nexport function useAnimationOffsetEffect(\n embla: Embla | null | undefined,\n transitionDuration: number\n) {\n useEffect(() => {\n if (embla) {\n window.setTimeout(() => {\n embla.reInit();\n }, transitionDuration);\n }\n }, [embla, transitionDuration]);\n}\n"],"names":[],"mappings":";;AACO,SAAS,wBAAwB,CAAC,KAAK,EAAE,kBAAkB,EAAE;AACpE,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,IAAI,KAAK,EAAE;AACf,MAAM,MAAM,CAAC,UAAU,CAAC,MAAM;AAC9B,QAAQ,KAAK,CAAC,MAAM,EAAE,CAAC;AACvB,OAAO,EAAE,kBAAkB,CAAC,CAAC;AAC7B,KAAK;AACL,GAAG,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC;AAClC;;;;"}
1
+ {"version":3,"file":"use-animation-offset-effect.js","sources":["../src/use-animation-offset-effect.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport type { EmblaCarouselType } from 'embla-carousel-react';\n\nexport function useAnimationOffsetEffect(\n embla: EmblaCarouselType | null | undefined,\n transitionDuration: number\n) {\n useEffect(() => {\n if (embla) {\n window.setTimeout(() => {\n embla.reInit();\n }, transitionDuration);\n }\n }, [embla, transitionDuration]);\n}\n"],"names":[],"mappings":";;AACO,SAAS,wBAAwB,CAAC,KAAK,EAAE,kBAAkB,EAAE;AACpE,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,IAAI,KAAK,EAAE;AACf,MAAM,MAAM,CAAC,UAAU,CAAC,MAAM;AAC9B,QAAQ,KAAK,CAAC,MAAM,EAAE,CAAC;AACvB,OAAO,EAAE,kBAAkB,CAAC,CAAC;AAC7B,KAAK;AACL,GAAG,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC;AAClC;;;;"}
@@ -1,21 +1,13 @@
1
- import { MantineNumberSize, Styles, ClassNames } from '@mantine/core';
2
- import { CarouselOrientation, Embla, CarouselBreakpoint } from './types';
3
- import type { CarouselStylesNames } from './Carousel';
4
- interface CarouselContext {
5
- embla: Embla;
6
- slideSize: string | number;
7
- slideGap: MantineNumberSize;
8
- orientation: CarouselOrientation;
9
- includeGapInSize: boolean;
10
- breakpoints: CarouselBreakpoint[];
11
- classNames: ClassNames<CarouselStylesNames>;
12
- styles: Styles<CarouselStylesNames>;
13
- unstyled: boolean;
14
- variant: string;
1
+ /// <reference types="react" />
2
+ import { GetStylesApi } from '@mantine/core';
3
+ import type { CarouselFactory } from './Carousel';
4
+ interface CarouselContextValue {
5
+ getStyles: GetStylesApi<CarouselFactory>;
6
+ orientation: 'horizontal' | 'vertical' | undefined;
15
7
  }
16
8
  export declare const CarouselProvider: ({ children, value }: {
17
- value: CarouselContext;
9
+ value: CarouselContextValue;
18
10
  children: import("react").ReactNode;
19
- }) => JSX.Element, useCarouselContext: () => CarouselContext;
11
+ }) => import("react/jsx-runtime").JSX.Element, useCarouselContext: () => CarouselContextValue;
20
12
  export {};
21
13
  //# sourceMappingURL=Carousel.context.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Carousel.context.d.ts","sourceRoot":"","sources":["../src/Carousel.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAGtE,OAAO,EAAE,mBAAmB,EAAE,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAEtD,UAAU,eAAe;IACvB,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,WAAW,EAAE,mBAAmB,CAAC;IACjC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,WAAW,EAAE,kBAAkB,EAAE,CAAC;IAClC,UAAU,EAAE,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAC5C,MAAM,EAAE,MAAM,CAAC,mBAAmB,CAAC,CAAC;IACpC,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAO,gBAAgB;;;mBAAE,kBAAkB,uBAEjD,CAAC"}
1
+ {"version":3,"file":"Carousel.context.d.ts","sourceRoot":"","sources":["../src/Carousel.context.ts"],"names":[],"mappings":";AAAA,OAAO,EAAqB,YAAY,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAElD,UAAU,oBAAoB;IAC5B,SAAS,EAAE,YAAY,CAAC,eAAe,CAAC,CAAC;IACzC,WAAW,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC;CACpD;AAED,eAAO,MAAO,gBAAgB;;;+CAAE,kBAAkB,4BAEjD,CAAC"}