@mantine-vue/carousel 2.4.0 → 3.1.0

package/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../src/Carousel.context.ts","../src/Carousel.module.css","../src/CarouselSlide.ts","../src/CarouselVariables.ts","../src/get-chevron-rotation.ts","../src/get-indicator-navigation.ts","../src/Carousel.ts"],"sourcesContent":["import { createSafeContext } from '@mantine-vue/core'\n\nexport interface CarouselContextValue {\n  getStyles: (selector: string, options?: Record<string, any>) => Record<string, any>\n  orientation: 'horizontal' | 'vertical' | undefined\n}\n\nexport const [provideCarouselContext, useCarouselContext] = createSafeContext<CarouselContextValue>(\n  'Carousel component was not found in tree',\n)\n",".root {\n  --carousel-height: auto;\n  position: relative;\n}\n\n.viewport {\n  height: var(--carousel-height);\n  overflow: hidden;\n\n  &[data-type='container'] {\n    container: carousel / inline-size;\n  }\n}\n\n.container {\n  display: flex;\n  flex-direction: row;\n  height: var(--carousel-height);\n\n  :where([data-include-gap-in-size]) & {\n    &:where([data-orientation='vertical']) {\n      margin-bottom: calc(var(--carousel-slide-gap) * -1);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      margin-inline-end: calc(var(--carousel-slide-gap) * -1);\n    }\n  }\n\n  &:where([data-orientation='vertical']) {\n    flex-direction: column;\n  }\n}\n\n.controls {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  z-index: 1;\n  pointer-events: none;\n\n  &:where([data-orientation='vertical']) {\n    inset-inline-start: calc(50% - var(--carousel-control-size) / 2);\n    top: 0;\n    bottom: 0;\n    flex-direction: column;\n    padding: var(--carousel-controls-offset) 0;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    top: calc(50% - var(--carousel-control-size) / 2);\n    flex-direction: row;\n    padding: 0 var(--carousel-controls-offset);\n  }\n}\n\n.control {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  min-width: var(--carousel-control-size);\n  min-height: var(--carousel-control-size);\n  border-radius: var(--carousel-control-size);\n  pointer-events: all;\n  background-color: var(--mantine-color-white);\n  color: var(--mantine-color-black);\n  box-shadow: var(--mantine-shadow-md);\n  border: 1px solid var(--mantine-color-gray-3);\n  transition: opacity 100ms ease;\n\n  @mixin where-light {\n    opacity: 0.85;\n  }\n\n  @mixin where-dark {\n    opacity: 0.65;\n  }\n\n  @mixin hover {\n    opacity: 1;\n  }\n}\n\n.indicators {\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  gap: 8px;\n  pointer-events: none;\n\n  &:where([data-orientation='vertical']) {\n    bottom: 0;\n    top: 0;\n    inset-inline-end: var(--mantine-spacing-md);\n    flex-direction: column;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    bottom: var(--mantine-spacing-md);\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    flex-direction: row;\n  }\n}\n\n.indicator {\n  pointer-events: all;\n  border-radius: var(--mantine-radius-xl);\n  box-shadow: var(--mantine-shadow-sm);\n  opacity: 0.6;\n  background-color: var(--mantine-color-white);\n\n  @mixin hover {\n    opacity: 1;\n  }\n\n  &:where([data-active]) {\n    opacity: 1;\n  }\n\n  &:where([data-orientation='vertical']) {\n    width: 5px;\n    height: 25px;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    width: 25px;\n    height: 5px;\n  }\n}\n\n.slide {\n  position: relative;\n  flex: 0 0 var(--carousel-slide-size, 100%);\n\n  .root:where([data-include-gap-in-size]) & {\n    &:where([data-orientation='vertical']) {\n      padding-bottom: var(--carousel-slide-gap);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      padding-inline-end: var(--carousel-slide-gap);\n    }\n  }\n\n  .root:where(:not([data-include-gap-in-size])) & {\n    &:where([data-orientation='vertical']) {\n      margin-bottom: var(--carousel-slide-gap);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      margin-inline-end: var(--carousel-slide-gap);\n    }\n  }\n}\n","import { defineComponent, h, type PropType } from 'vue'\nimport { Box, withBoxProps } from '@mantine-vue/core'\nimport { useCarouselContext } from './Carousel.context'\nimport classes from './Carousel.module.css'\n\nexport type CarouselSlideStylesNames = 'slide'\n\nexport interface CarouselSlideProps {\n  classNames?: any\n  styles?: any\n  mod?: any\n}\n\nconst CarouselSlideBaseComponent = defineComponent({\n  name: 'CarouselSlide',\n  inheritAttrs: false,\n  props: {\n    classNames: { type: [Object, Function], default: undefined },\n    styles: { type: [Object, Function], default: undefined },\n    mod: { type: [Object, Array] as PropType<any>, default: undefined },\n  },\n  setup(props, { attrs, slots }) {\n    const ctx = useCarouselContext()\n\n    return () =>\n      h(\n        Box,\n        {\n          mod: [{ orientation: ctx.orientation }, props.mod],\n          role: 'group',\n          'aria-roledescription': 'slide',\n          'aria-label': 'Carousel slide',\n          ...attrs,\n          ...ctx.getStyles('slide', {\n            className: attrs.class,\n            style: attrs.style,\n            classNames: props.classNames,\n            styles: props.styles,\n          }),\n        },\n        slots,\n      )\n  },\n})\n\nexport const CarouselSlide = Object.assign(withBoxProps(CarouselSlideBaseComponent), { classes })\n","import { defineComponent, h, type PropType } from 'vue'\nimport {\n  filterProps,\n  getBaseValue,\n  getSortedBreakpoints,\n  getSpacing,\n  InlineStyles,\n  keys,\n  px,\n  rem,\n  useMantineTheme,\n} from '@mantine-vue/core'\n\ntype StyleProp<T> = T | Partial<Record<string, T>>\n\nfunction isObject(value: unknown): value is Record<string, any> {\n  return typeof value === 'object' && value !== null && !Array.isArray(value)\n}\n\nconst sharedProps = {\n  selector: { type: String, required: true },\n  slideSize: {\n    type: [String, Number, Object] as PropType<StyleProp<string | number>>,\n    default: undefined,\n  },\n  slideGap: {\n    type: [String, Number, Object] as PropType<StyleProp<string | number>>,\n    default: undefined,\n  },\n}\n\nexport const CarouselVariables = defineComponent({\n  name: 'CarouselVariables',\n  props: sharedProps,\n  setup(props) {\n    const theme = useMantineTheme()\n\n    return () => {\n      const baseStyles = filterProps({\n        '--carousel-slide-gap': getSpacing(getBaseValue(props.slideGap)),\n        '--carousel-slide-size': rem(getBaseValue(props.slideSize)),\n      })\n\n      const queries = keys(theme.value.breakpoints).reduce<Record<string, Record<string, any>>>(\n        (acc, breakpoint) => {\n          acc[breakpoint] = acc[breakpoint] ?? {}\n\n          if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined) {\n            acc[breakpoint]['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n          }\n\n          if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined) {\n            acc[breakpoint]['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n          }\n\n          return acc\n        },\n        {},\n      )\n\n      const media = getSortedBreakpoints(theme.value.breakpoints).reduce<\n        Record<string, Record<string, any>>\n      >((acc, item) => {\n        if (keys(queries[item.breakpoint] ?? {}).length > 0) {\n          acc[`(min-width: ${theme.value.breakpoints[item.breakpoint]})`] = queries[item.breakpoint]\n        }\n\n        return acc\n      }, {})\n\n      return h(InlineStyles, { selector: props.selector!, styles: baseStyles, media })\n    }\n  },\n})\n\nfunction getBreakpoints(values: unknown) {\n  return isObject(values) ? keys(values).filter((breakpoint) => breakpoint !== 'base') : []\n}\n\nfunction sortBreakpoints(breakpoints: string[]) {\n  return breakpoints.sort((a, b) => px(a) - px(b))\n}\n\nexport const CarouselContainerVariables = defineComponent({\n  name: 'CarouselContainerVariables',\n  props: sharedProps,\n  setup(props) {\n    return () => {\n      const baseStyles = filterProps({\n        '--carousel-slide-gap': getSpacing(getBaseValue(props.slideGap)),\n        '--carousel-slide-size': rem(getBaseValue(props.slideSize)),\n      })\n\n      const breakpoints = sortBreakpoints(\n        Array.from(\n          new Set([...getBreakpoints(props.slideGap), ...getBreakpoints(props.slideSize)]),\n        ),\n      )\n\n      const container = breakpoints.reduce<Record<string, Record<string, any>>>(\n        (acc, breakpoint) => {\n          const key = `carousel (min-width: ${breakpoint})`\n          acc[key] = {}\n\n          if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined) {\n            acc[key]['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n          }\n\n          if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined) {\n            acc[key]['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n          }\n\n          return acc\n        },\n        {},\n      )\n\n      return h(InlineStyles, { selector: props.selector!, styles: baseStyles, container })\n    }\n  },\n})\n","// Ported verbatim from @mantine/carousel/src/get-chevron-rotation.ts – pure function, no\n// React/Vue specifics.\nexport interface GetChevronRotationOptions {\n  dir: 'rtl' | 'ltr'\n  orientation: 'horizontal' | 'vertical' | undefined\n  direction: 'next' | 'previous'\n}\n\nexport function getChevronRotation({ dir, orientation, direction }: GetChevronRotationOptions) {\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","// Extracted so the wrap-around index math can be unit tested without mounting a component.\nexport function getNextIndicatorIndex(index: number, total: number): number {\n  return index < total - 1 ? index + 1 : 0\n}\n\nexport function getPreviousIndicatorIndex(index: number, total: number): number {\n  return index > 0 ? index - 1 : total - 1\n}\n\n// Note: when `max < min` (e.g. an empty carousel), this clamps to `max`, not `min`.\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max)\n}\n","import {\n  Comment,\n  computed,\n  defineComponent,\n  h,\n  ref,\n  watch,\n  type DefineComponent,\n  type PropType,\n  type VNode,\n} from 'vue'\nimport emblaCarouselVue from 'embla-carousel-vue'\nimport type { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from 'embla-carousel'\nimport { useId } from '@mantine-vue/hooks'\nimport {\n  Box,\n  createVarsResolver,\n  getSpacing,\n  rem,\n  useDirection,\n  useProps,\n  useStyles,\n  UnstyledButton,\n  VisuallyHidden,\n  withBoxProps,\n  AccordionChevron,\n} from '@mantine-vue/core'\nimport { provideCarouselContext } from './Carousel.context'\nimport { CarouselSlide } from './CarouselSlide'\nimport { CarouselContainerVariables, CarouselVariables } from './CarouselVariables'\nimport { getChevronRotation } from './get-chevron-rotation'\nimport { clamp, getNextIndicatorIndex, getPreviousIndicatorIndex } from './get-indicator-navigation'\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 interface CarouselProps {\n  /** Options passed down to embla carousel */\n  emblaOptions?: EmblaOptionsType\n  /** Called when next slide is shown */\n  onNextSlide?: () => void\n  /** Called when previous slider is shown */\n  onPreviousSlide?: () => void\n  /** Called with slide index when slide changes */\n  onSlideChange?: (index: number) => void\n  /** Get embla API as ref */\n  getEmblaApi?: (embla: EmblaCarouselType) => void\n  /** Props passed down to next control */\n  nextControlProps?: Record<string, any>\n  /** Props passed down to previous control */\n  previousControlProps?: Record<string, any>\n  /** Controls size of the next and previous controls @default 26 */\n  controlSize?: string | number\n  /** Controls position of the next and previous controls, key of `theme.spacing` or any valid CSS value @default 'sm' */\n  controlsOffset?: string | number\n  /** Controls slide width based on viewport width @default '100%' */\n  slideSize?: string | number | Record<string, string | number>\n  /** Key of theme.spacing or number to set gap between slides */\n  slideGap?: string | number | Record<string, string | number>\n  /** Carousel orientation @default 'horizontal' */\n  orientation?: 'horizontal' | 'vertical'\n  /** Determines type of queries used for responsive styles @default 'media' */\n  type?: 'media' | 'container'\n  /** Slides container `height`, required for vertical orientation */\n  height?: string | number\n  /** Determines whether gap between slides should be treated as part of the slide size @default true */\n  includeGapInSize?: boolean\n  /** Index of initial slide */\n  initialSlide?: number\n  /** Determines whether next/previous controls should be displayed @default true */\n  withControls?: boolean\n  /** Determines whether indicators should be displayed @default false */\n  withIndicators?: boolean\n  /** A list of embla plugins */\n  plugins?: EmblaPluginType[]\n  /** Icon of the next control */\n  nextControlIcon?: any\n  /** Icon of the previous control */\n  previousControlIcon?: any\n  /** Determines whether arrow key should switch slides @default true */\n  withKeyboardEvents?: boolean\n  /** Function to get props for indicator button */\n  getIndicatorProps?: (index: number) => Record<string, any>\n  id?: string\n  classNames?: any\n  styles?: any\n  vars?: any\n  unstyled?: boolean\n  mod?: any\n}\n\nconst defaultProps = {\n  controlSize: 26,\n  controlsOffset: 'sm',\n  slideSize: '100%',\n  slideGap: 0,\n  orientation: 'horizontal',\n  includeGapInSize: true,\n  initialSlide: 0,\n  withControls: true,\n  withIndicators: false,\n  withKeyboardEvents: true,\n  type: 'media',\n} as const\n\nconst defaultEmblaOptions: EmblaOptionsType = {\n  align: 'center',\n  loop: false,\n  slidesToScroll: 1,\n  dragFree: false,\n  inViewThreshold: 0,\n  skipSnaps: false,\n  containScroll: 'trimSnaps',\n}\n\nconst varsResolver = createVarsResolver<any>((_, { 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\nfunction useRandomClassName() {\n  return `__mantine-vue-carousel-${Math.random().toString(36).slice(2, 9)}`\n}\n\nfunction countRealSlides(nodes: VNode[] | undefined): number {\n  if (!nodes) {\n    return 0\n  }\n\n  return nodes.filter((node) => node.type !== Comment).length\n}\n\nconst CarouselBaseComponent = defineComponent({\n  name: 'Carousel',\n  inheritAttrs: false,\n  props: {\n    emblaOptions: { type: Object as PropType<EmblaOptionsType>, default: undefined },\n    onNextSlide: { type: Function as PropType<() => void>, default: undefined },\n    onPreviousSlide: { type: Function as PropType<() => void>, default: undefined },\n    onSlideChange: { type: Function as PropType<(index: number) => void>, default: undefined },\n    getEmblaApi: {\n      type: Function as PropType<(embla: EmblaCarouselType) => void>,\n      default: undefined,\n    },\n    nextControlProps: { type: Object as PropType<Record<string, any>>, default: undefined },\n    previousControlProps: { type: Object as PropType<Record<string, any>>, default: undefined },\n    controlSize: { type: [String, Number], default: undefined },\n    controlsOffset: { type: [String, Number], default: undefined },\n    slideSize: { type: [String, Number, Object], default: undefined },\n    slideGap: { type: [String, Number, Object], default: undefined },\n    orientation: { type: String as PropType<'horizontal' | 'vertical'>, default: undefined },\n    type: { type: String as PropType<'media' | 'container'>, default: undefined },\n    height: { type: [String, Number], default: undefined },\n    includeGapInSize: { type: Boolean, default: undefined },\n    initialSlide: { type: Number, default: undefined },\n    withControls: { type: Boolean, default: undefined },\n    withIndicators: { type: Boolean, default: undefined },\n    plugins: { type: Array as PropType<EmblaPluginType[]>, default: undefined },\n    nextControlIcon: { type: null, default: undefined },\n    previousControlIcon: { type: null, default: undefined },\n    withKeyboardEvents: { type: Boolean, default: undefined },\n    getIndicatorProps: {\n      type: Function as PropType<(index: number) => Record<string, any>>,\n      default: undefined,\n    },\n    id: { type: String, default: undefined },\n    mod: { type: [Object, Array] as PropType<any>, default: undefined },\n    classNames: { type: [Object, Function], default: undefined },\n    styles: { type: [Object, Function], default: undefined },\n    vars: { type: [Object, Function], default: undefined },\n    unstyled: { type: Boolean, default: false },\n  },\n  setup(rawProps, { attrs, slots }) {\n    const props = useProps('Carousel', defaultProps, rawProps)\n\n    const getStyles = useStyles({\n      name: 'Carousel',\n      classes,\n      props,\n      get className() {\n        return attrs.class\n      },\n      get style() {\n        return attrs.style as any\n      },\n      get classNames() {\n        return props.classNames as any\n      },\n      get styles() {\n        return props.styles as any\n      },\n      get unstyled() {\n        return props.unstyled\n      },\n      get vars() {\n        return props.vars as any\n      },\n      varsResolver,\n    })\n\n    const _id = useId(props.id)\n    const responsiveClassName = useRandomClassName()\n    const { dir } = useDirection()\n\n    const emblaOptionsRef = computed<EmblaOptionsType>(() => ({\n      axis: props.orientation === 'horizontal' ? 'x' : 'y',\n      direction: props.orientation === 'horizontal' ? dir.value : undefined,\n      startIndex: props.initialSlide,\n      ...defaultEmblaOptions,\n      ...props.emblaOptions,\n    }))\n    const pluginsRef = computed(() => props.plugins ?? [])\n\n    const [emblaNode, embla] = emblaCarouselVue(emblaOptionsRef, pluginsRef)\n\n    const selected = ref(0)\n    const slidesCount = ref(0)\n    const slotSlideCount = ref(0)\n\n    const handleScroll = (index: number) => {\n      embla.value?.scrollTo(index)\n    }\n\n    const handleSelect = () => {\n      const instance = embla.value\n      if (!instance) {\n        return\n      }\n      const slide = instance.selectedScrollSnap()\n      const changed = slide !== selected.value\n      selected.value = slide\n      if (changed) {\n        props.onSlideChange?.(slide)\n      }\n    }\n\n    const handlePrevious = () => {\n      embla.value?.scrollPrev()\n      props.onPreviousSlide?.()\n    }\n\n    const handleNext = () => {\n      embla.value?.scrollNext()\n      props.onNextSlide?.()\n    }\n\n    const handleKeydown = (event: KeyboardEvent) => {\n      if (!props.withKeyboardEvents) {\n        return\n      }\n\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      if (event.key === 'Home') {\n        event.preventDefault()\n        embla.value?.scrollTo(0)\n      }\n\n      if (event.key === 'End') {\n        event.preventDefault()\n        embla.value?.scrollTo(embla.value.scrollSnapList().length - 1)\n      }\n    }\n\n    const handleIndicatorKeyDown = (event: KeyboardEvent, index: number) => {\n      const isHorizontal = props.orientation === 'horizontal'\n      const nextKey = isHorizontal ? 'ArrowRight' : 'ArrowDown'\n      const prevKey = isHorizontal ? 'ArrowLeft' : 'ArrowUp'\n      const parent = (event.currentTarget as HTMLElement | null)?.parentElement\n\n      if (event.key === nextKey) {\n        event.preventDefault()\n        const nextIndex = getNextIndicatorIndex(index, slidesCount.value)\n        handleScroll(nextIndex)\n        ;(parent?.children[nextIndex] as HTMLElement | undefined)?.focus()\n      }\n\n      if (event.key === prevKey) {\n        event.preventDefault()\n        const prevIndex = getPreviousIndicatorIndex(index, slidesCount.value)\n        handleScroll(prevIndex)\n        ;(parent?.children[prevIndex] as HTMLElement | undefined)?.focus()\n      }\n\n      if (event.key === 'Home') {\n        event.preventDefault()\n        handleScroll(0)\n        ;(parent?.children[0] as HTMLElement | undefined)?.focus()\n      }\n\n      if (event.key === 'End') {\n        event.preventDefault()\n        handleScroll(slidesCount.value - 1)\n        ;(parent?.children[slidesCount.value - 1] as HTMLElement | undefined)?.focus()\n      }\n    }\n\n    watch(\n      embla,\n      (instance, _prev, onCleanup) => {\n        if (!instance) {\n          return\n        }\n\n        props.getEmblaApi?.(instance)\n        handleSelect()\n        slidesCount.value = instance.scrollSnapList().length\n        instance.on('select', handleSelect)\n\n        onCleanup(() => {\n          instance.off('select', handleSelect)\n        })\n      },\n      { immediate: true },\n    )\n\n    watch([slotSlideCount, () => props.emblaOptions?.slidesToScroll], ([childrenCount]) => {\n      const instance = embla.value\n      if (!instance) {\n        return\n      }\n\n      instance.reInit()\n      slidesCount.value = instance.scrollSnapList().length\n      selected.value = clamp(selected.value, 0, childrenCount - 1)\n    })\n\n    provideCarouselContext({\n      getStyles,\n      get orientation() {\n        return props.orientation\n      },\n    } as any)\n\n    return () => {\n      const canScrollPrev = embla.value?.canScrollPrev() || false\n      const canScrollNext = embla.value?.canScrollNext() || false\n\n      const defaultSlot = slots.default?.()\n      slotSlideCount.value = countRealSlides(defaultSlot)\n\n      const indicators = Array(slidesCount.value)\n        .fill(0)\n        .map((_, index) =>\n          h(UnstyledButton, {\n            ...getStyles('indicator'),\n            key: index,\n            role: 'tab',\n            'aria-label': `Go to slide ${index + 1}`,\n            'aria-selected': index === selected.value,\n            tabindex: index === selected.value ? 0 : -1,\n            'data-active': index === selected.value || undefined,\n            onClick: () => handleScroll(index),\n            onKeydown: (event: KeyboardEvent) => handleIndicatorKeyDown(event, index),\n            'data-orientation': props.orientation,\n            onMousedown: (event: Event) => event.preventDefault(),\n            ...props.getIndicatorProps?.(index),\n          }),\n        )\n\n      const variablesProps = {\n        selector: `.${responsiveClassName}`,\n        slideSize: props.slideSize,\n        slideGap: props.slideGap,\n      }\n\n      return [\n        props.type === 'container'\n          ? h(CarouselContainerVariables, variablesProps)\n          : h(CarouselVariables, variablesProps),\n\n        h(\n          Box,\n          {\n            role: 'region',\n            'aria-roledescription': 'carousel',\n            ...attrs,\n            ...getStyles('root', { className: responsiveClassName }),\n            id: _id.value,\n            mod: [\n              { orientation: props.orientation, 'include-gap-in-size': props.includeGapInSize },\n              props.mod,\n            ],\n            onKeydownCapture: handleKeydown,\n          },\n          () => [\n            h(\n              VisuallyHidden,\n              { role: 'status', 'aria-live': 'polite', 'aria-atomic': 'true' },\n              () =>\n                slidesCount.value > 0 ? `Slide ${selected.value + 1} of ${slidesCount.value}` : '',\n            ),\n\n            props.withControls &&\n              h('div', { ...getStyles('controls'), 'data-orientation': props.orientation }, [\n                h(\n                  UnstyledButton,\n                  {\n                    'aria-controls': _id.value,\n                    'aria-label': 'Previous slide',\n                    'aria-disabled': !canScrollPrev,\n                    'data-inactive': !canScrollPrev || undefined,\n                    'data-type': 'previous',\n                    tabindex: canScrollPrev ? 0 : -1,\n                    ...props.previousControlProps,\n                    ...getStyles('control', {\n                      className: props.previousControlProps?.className,\n                      style: props.previousControlProps?.style,\n                    }),\n                    onClick: (event: Event) => {\n                      handlePrevious()\n                      props.previousControlProps?.onClick?.(event)\n                    },\n                  },\n                  () =>\n                    typeof props.previousControlIcon !== 'undefined'\n                      ? props.previousControlIcon\n                      : h(AccordionChevron, {\n                          style: {\n                            transform: `rotate(${getChevronRotation({\n                              dir: dir.value,\n                              orientation: props.orientation,\n                              direction: 'previous',\n                            })}deg)`,\n                          },\n                        }),\n                ),\n\n                h(\n                  UnstyledButton,\n                  {\n                    'aria-controls': _id.value,\n                    'aria-label': 'Next slide',\n                    'aria-disabled': !canScrollNext,\n                    'data-inactive': !canScrollNext || undefined,\n                    'data-type': 'next',\n                    tabindex: canScrollNext ? 0 : -1,\n                    ...getStyles('control', {\n                      className: props.nextControlProps?.className,\n                      style: props.nextControlProps?.style,\n                    }),\n                    ...props.nextControlProps,\n                    onClick: (event: Event) => {\n                      handleNext()\n                      props.nextControlProps?.onClick?.(event)\n                    },\n                  },\n                  () =>\n                    typeof props.nextControlIcon !== 'undefined'\n                      ? props.nextControlIcon\n                      : h(AccordionChevron, {\n                          style: {\n                            transform: `rotate(${getChevronRotation({\n                              dir: dir.value,\n                              orientation: props.orientation,\n                              direction: 'next',\n                            })}deg)`,\n                          },\n                        }),\n                ),\n              ]),\n\n            h('div', { ...getStyles('viewport'), ref: emblaNode, 'data-type': props.type }, [\n              h(\n                'div',\n                {\n                  ...getStyles('container', { className: responsiveClassName }),\n                  'data-orientation': props.orientation,\n                },\n                defaultSlot,\n              ),\n            ]),\n\n            props.withIndicators &&\n              h(\n                'div',\n                {\n                  ...getStyles('indicators'),\n                  role: 'tablist',\n                  'aria-label': 'Slides',\n                  'data-orientation': props.orientation,\n                },\n                indicators,\n              ),\n          ],\n        ),\n      ]\n    }\n  },\n})\n\nexport const Carousel: DefineComponent<CarouselProps> & {\n  classes: typeof classes\n  varsResolver: typeof varsResolver\n  Slide: typeof CarouselSlide\n} = Object.assign(withBoxProps(CarouselBaseComponent) as DefineComponent<CarouselProps>, {\n  classes,\n  varsResolver,\n  Slide: CarouselSlide,\n})\n"],"mappings":"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"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/Carousel.context.ts","../src/components/CarouselVariables/CarouselVariables.utils.ts","../src/components/CarouselVariables/CarouselContainerVariables.vue","../src/components/CarouselVariables/CarouselContainerVariables.vue","../src/components/CarouselVariables/CarouselVariables.vue","../src/components/CarouselVariables/CarouselVariables.vue","../src/get-chevron-rotation.ts","../src/get-indicator-navigation.ts","../src/Carousel.module.css","../src/components/Carousel/Carousel.vue","../src/components/Carousel/Carousel.vue","../src/components/CarouselSlide/CarouselSlide.vue","../src/components/CarouselSlide/CarouselSlide.vue","../src/components/CarouselSlide/index.ts","../src/components/Carousel/index.ts"],"sourcesContent":["import { createSafeContext } from '@mantine-vue/core'\n\nexport interface CarouselContextValue {\n  getStyles: (selector: string, options?: Record<string, any>) => Record<string, any>\n  orientation: 'horizontal' | 'vertical' | undefined\n}\n\nexport const [provideCarouselContext, useCarouselContext] = createSafeContext<CarouselContextValue>(\n  'Carousel component was not found in tree',\n)\n","import { filterProps, getBaseValue, getSpacing, rem } from '@mantine-vue/core'\nimport type { CarouselVariablesProps } from './CarouselVariables.types'\nexport const isObject = (value: unknown): value is Record<string, any> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value)\nexport const getBaseStyles = (props: CarouselVariablesProps) =>\n  filterProps({\n    '--carousel-slide-gap': getSpacing(getBaseValue(props.slideGap)),\n    '--carousel-slide-size': rem(getBaseValue(props.slideSize)),\n  })\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { InlineStyles, keys, getSpacing, px, rem } from '@mantine-vue/core'\nimport { getBaseStyles, isObject } from './CarouselVariables.utils'\nimport type { CarouselVariablesProps } from './CarouselVariables.types'\ndefineOptions({ name: 'CarouselContainerVariables' })\nconst props = defineProps<CarouselVariablesProps>()\nconst styles = computed(() => getBaseStyles(props))\nconst container = computed(() => {\n  const getBreakpoints = (value: unknown) =>\n    isObject(value) ? keys(value).filter((key) => key !== 'base') : []\n  const breakpoints = [\n    ...new Set([...getBreakpoints(props.slideGap), ...getBreakpoints(props.slideSize)]),\n  ].sort((a, b) => px(a) - px(b))\n  return breakpoints.reduce<Record<string, Record<string, any>>>((result, breakpoint) => {\n    const values: Record<string, any> = {}\n    if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined)\n      values['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n    if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined)\n      values['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n    result[`carousel (min-width: ${breakpoint})`] = values\n    return result\n  }, {})\n})\n</script>\n<template>\n  <InlineStyles :selector=\"props.selector\" :styles=\"styles\" :container=\"container\" />\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { InlineStyles, keys, getSpacing, px, rem } from '@mantine-vue/core'\nimport { getBaseStyles, isObject } from './CarouselVariables.utils'\nimport type { CarouselVariablesProps } from './CarouselVariables.types'\ndefineOptions({ name: 'CarouselContainerVariables' })\nconst props = defineProps<CarouselVariablesProps>()\nconst styles = computed(() => getBaseStyles(props))\nconst container = computed(() => {\n  const getBreakpoints = (value: unknown) =>\n    isObject(value) ? keys(value).filter((key) => key !== 'base') : []\n  const breakpoints = [\n    ...new Set([...getBreakpoints(props.slideGap), ...getBreakpoints(props.slideSize)]),\n  ].sort((a, b) => px(a) - px(b))\n  return breakpoints.reduce<Record<string, Record<string, any>>>((result, breakpoint) => {\n    const values: Record<string, any> = {}\n    if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined)\n      values['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n    if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined)\n      values['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n    result[`carousel (min-width: ${breakpoint})`] = values\n    return result\n  }, {})\n})\n</script>\n<template>\n  <InlineStyles :selector=\"props.selector\" :styles=\"styles\" :container=\"container\" />\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n  getSortedBreakpoints,\n  InlineStyles,\n  keys,\n  getSpacing,\n  rem,\n  useMantineTheme,\n} from '@mantine-vue/core'\nimport { getBaseStyles, isObject } from './CarouselVariables.utils'\nimport type { CarouselVariablesProps } from './CarouselVariables.types'\ndefineOptions({ name: 'CarouselVariables' })\nconst props = defineProps<CarouselVariablesProps>()\nconst theme = useMantineTheme()\nconst styles = computed(() => getBaseStyles(props))\nconst media = computed(() => {\n  const queries = keys(theme.value.breakpoints).reduce<Record<string, Record<string, any>>>(\n    (result, breakpoint) => {\n      const values: Record<string, any> = {}\n      if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined)\n        values['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n      if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined)\n        values['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n      result[breakpoint] = values\n      return result\n    },\n    {},\n  )\n  return getSortedBreakpoints(theme.value.breakpoints).reduce<Record<string, Record<string, any>>>(\n    (result, item) => {\n      if (keys(queries[item.breakpoint] ?? {}).length)\n        result[`(min-width: ${theme.value.breakpoints[item.breakpoint]})`] =\n          queries[item.breakpoint]\n      return result\n    },\n    {},\n  )\n})\n</script>\n<template><InlineStyles :selector=\"props.selector\" :styles=\"styles\" :media=\"media\" /></template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport {\n  getSortedBreakpoints,\n  InlineStyles,\n  keys,\n  getSpacing,\n  rem,\n  useMantineTheme,\n} from '@mantine-vue/core'\nimport { getBaseStyles, isObject } from './CarouselVariables.utils'\nimport type { CarouselVariablesProps } from './CarouselVariables.types'\ndefineOptions({ name: 'CarouselVariables' })\nconst props = defineProps<CarouselVariablesProps>()\nconst theme = useMantineTheme()\nconst styles = computed(() => getBaseStyles(props))\nconst media = computed(() => {\n  const queries = keys(theme.value.breakpoints).reduce<Record<string, Record<string, any>>>(\n    (result, breakpoint) => {\n      const values: Record<string, any> = {}\n      if (isObject(props.slideGap) && props.slideGap[breakpoint] !== undefined)\n        values['--carousel-slide-gap'] = getSpacing(props.slideGap[breakpoint])\n      if (isObject(props.slideSize) && props.slideSize[breakpoint] !== undefined)\n        values['--carousel-slide-size'] = rem(props.slideSize[breakpoint])\n      result[breakpoint] = values\n      return result\n    },\n    {},\n  )\n  return getSortedBreakpoints(theme.value.breakpoints).reduce<Record<string, Record<string, any>>>(\n    (result, item) => {\n      if (keys(queries[item.breakpoint] ?? {}).length)\n        result[`(min-width: ${theme.value.breakpoints[item.breakpoint]})`] =\n          queries[item.breakpoint]\n      return result\n    },\n    {},\n  )\n})\n</script>\n<template><InlineStyles :selector=\"props.selector\" :styles=\"styles\" :media=\"media\" /></template>\n","// Ported verbatim from @mantine/carousel/src/get-chevron-rotation.ts – pure function, no\n// React/Vue specifics.\nexport interface GetChevronRotationOptions {\n  dir: 'rtl' | 'ltr'\n  orientation: 'horizontal' | 'vertical' | undefined\n  direction: 'next' | 'previous'\n}\n\nexport function getChevronRotation({ dir, orientation, direction }: GetChevronRotationOptions) {\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","// Extracted so the wrap-around index math can be unit tested without mounting a component.\nexport function getNextIndicatorIndex(index: number, total: number): number {\n  return index < total - 1 ? index + 1 : 0\n}\n\nexport function getPreviousIndicatorIndex(index: number, total: number): number {\n  return index > 0 ? index - 1 : total - 1\n}\n\n// Note: when `max < min` (e.g. an empty carousel), this clamps to `max`, not `min`.\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.min(Math.max(value, min), max)\n}\n",".root {\n  --carousel-height: auto;\n  position: relative;\n}\n\n.viewport {\n  height: var(--carousel-height);\n  overflow: hidden;\n\n  &[data-type='container'] {\n    container: carousel / inline-size;\n  }\n}\n\n.container {\n  display: flex;\n  flex-direction: row;\n  height: var(--carousel-height);\n\n  :where([data-include-gap-in-size]) & {\n    &:where([data-orientation='vertical']) {\n      margin-bottom: calc(var(--carousel-slide-gap) * -1);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      margin-inline-end: calc(var(--carousel-slide-gap) * -1);\n    }\n  }\n\n  &:where([data-orientation='vertical']) {\n    flex-direction: column;\n  }\n}\n\n.controls {\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  z-index: 1;\n  pointer-events: none;\n\n  &:where([data-orientation='vertical']) {\n    inset-inline-start: calc(50% - var(--carousel-control-size) / 2);\n    top: 0;\n    bottom: 0;\n    flex-direction: column;\n    padding: var(--carousel-controls-offset) 0;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    top: calc(50% - var(--carousel-control-size) / 2);\n    flex-direction: row;\n    padding: 0 var(--carousel-controls-offset);\n  }\n}\n\n.control {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  min-width: var(--carousel-control-size);\n  min-height: var(--carousel-control-size);\n  border-radius: var(--carousel-control-size);\n  pointer-events: all;\n  background-color: var(--mantine-color-white);\n  color: var(--mantine-color-black);\n  box-shadow: var(--mantine-shadow-md);\n  border: 1px solid var(--mantine-color-gray-3);\n  transition: opacity 100ms ease;\n\n  @mixin where-light {\n    opacity: 0.85;\n  }\n\n  @mixin where-dark {\n    opacity: 0.65;\n  }\n\n  @mixin hover {\n    opacity: 1;\n  }\n}\n\n.indicators {\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  gap: 8px;\n  pointer-events: none;\n\n  &:where([data-orientation='vertical']) {\n    bottom: 0;\n    top: 0;\n    inset-inline-end: var(--mantine-spacing-md);\n    flex-direction: column;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    bottom: var(--mantine-spacing-md);\n    inset-inline-start: 0;\n    inset-inline-end: 0;\n    flex-direction: row;\n  }\n}\n\n.indicator {\n  pointer-events: all;\n  border-radius: var(--mantine-radius-xl);\n  box-shadow: var(--mantine-shadow-sm);\n  opacity: 0.6;\n  background-color: var(--mantine-color-white);\n\n  @mixin hover {\n    opacity: 1;\n  }\n\n  &:where([data-active]) {\n    opacity: 1;\n  }\n\n  &:where([data-orientation='vertical']) {\n    width: 5px;\n    height: 25px;\n  }\n\n  &:where([data-orientation='horizontal']) {\n    width: 25px;\n    height: 5px;\n  }\n}\n\n.slide {\n  position: relative;\n  flex: 0 0 var(--carousel-slide-size, 100%);\n\n  .root:where([data-include-gap-in-size]) & {\n    &:where([data-orientation='vertical']) {\n      padding-bottom: var(--carousel-slide-gap);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      padding-inline-end: var(--carousel-slide-gap);\n    }\n  }\n\n  .root:where(:not([data-include-gap-in-size])) & {\n    &:where([data-orientation='vertical']) {\n      margin-bottom: var(--carousel-slide-gap);\n    }\n\n    &:where([data-orientation='horizontal']) {\n      margin-inline-end: var(--carousel-slide-gap);\n    }\n  }\n}\n","<script lang=\"ts\">\nimport { createVarsResolver, getSpacing, rem } from '@mantine-vue/core'\nconst varsResolver = createVarsResolver<any>((_, { height, controlSize, controlsOffset }) => ({\n  root: {\n    '--carousel-height': rem(height),\n    '--carousel-control-size': rem(controlSize),\n    '--carousel-controls-offset': getSpacing(controlsOffset),\n  },\n}))\nexport { varsResolver }\n</script>\n\n<script setup lang=\"ts\">\nimport { Comment, computed, ref, useAttrs, useSlots, watch, type VNode } from 'vue'\nimport emblaCarouselVue from 'embla-carousel-vue'\nimport type { EmblaOptionsType } from 'embla-carousel'\nimport {\n  AccordionChevron,\n  Box,\n  UnstyledButton,\n  VisuallyHidden,\n  useDirection,\n  useProps,\n  useStyles,\n} from '@mantine-vue/core'\nimport { assignRef, useId } from '@mantine-vue/hooks'\nimport { provideCarouselContext } from '../../Carousel.context'\nimport CarouselContainerVariables from '../CarouselVariables/CarouselContainerVariables.vue'\nimport CarouselVariables from '../CarouselVariables/CarouselVariables.vue'\nimport { getChevronRotation } from '../../get-chevron-rotation'\nimport {\n  clamp,\n  getNextIndicatorIndex,\n  getPreviousIndicatorIndex,\n} from '../../get-indicator-navigation'\nimport type { CarouselEmits, CarouselProps } from './Carousel.types'\nimport classes from '../../Carousel.module.css'\n\ndefineOptions({ name: 'Carousel', inheritAttrs: false })\nconst rawProps = withDefaults(defineProps<CarouselProps>(), {\n  controlSize: 26,\n  controlsOffset: 'sm',\n  slideSize: '100%',\n  slideGap: 0,\n  orientation: 'horizontal',\n  includeGapInSize: true,\n  initialSlide: 0,\n  withControls: true,\n  withIndicators: false,\n  withKeyboardEvents: true,\n  type: 'media',\n})\nconst props = useProps('Carousel', null, rawProps)\nconst emit = defineEmits<CarouselEmits>()\nconst attrs = useAttrs()\nconst slots = useSlots()\nconst getStyles = useStyles({\n  name: 'Carousel',\n  classes,\n  props,\n  className: attrs.class,\n  style: attrs.style as any,\n  classNames: props.classNames,\n  styles: props.styles,\n  unstyled: props.unstyled,\n  vars: props.vars,\n  varsResolver,\n})\nconst id = useId(props.id)\nconst responsiveClassName = `__mantine-vue-carousel-${Math.random().toString(36).slice(2, 9)}`\nconst { dir } = useDirection()\nconst defaultEmblaOptions: EmblaOptionsType = {\n  align: 'center',\n  loop: false,\n  slidesToScroll: 1,\n  dragFree: false,\n  inViewThreshold: 0,\n  skipSnaps: false,\n  containScroll: 'trimSnaps',\n}\nconst emblaOptions = computed<EmblaOptionsType>(() => ({\n  axis: props.orientation === 'horizontal' ? 'x' : 'y',\n  direction: props.orientation === 'horizontal' ? dir.value : undefined,\n  startIndex: props.initialSlide,\n  ...defaultEmblaOptions,\n  ...props.emblaOptions,\n}))\nconst plugins = computed(() => props.plugins ?? [])\nconst [emblaNode, embla] = emblaCarouselVue(emblaOptions, plugins)\nconst selected = ref(0)\nconst slidesCount = ref(0)\nconst slotSlideCount = ref(0)\nconst canScrollPrev = computed(() => (selected.value >= 0 && embla.value?.canScrollPrev()) || false)\nconst canScrollNext = computed(() => (selected.value >= 0 && embla.value?.canScrollNext()) || false)\nconst variablesProps = computed(() => ({\n  selector: `.${responsiveClassName}`,\n  slideSize: props.slideSize,\n  slideGap: props.slideGap,\n}))\n\nfunction countRealSlides(nodes: VNode[]) {\n  return nodes.filter((node) => node.type !== Comment).length\n}\nfunction renderSlides() {\n  const nodes = slots.default?.() ?? []\n  slotSlideCount.value = countRealSlides(nodes)\n  return nodes\n}\nfunction scrollTo(index: number) {\n  embla.value?.scrollTo(index)\n}\nfunction select() {\n  const instance = embla.value\n  if (!instance) return\n  const slide = instance.selectedScrollSnap()\n  const changed = slide !== selected.value\n  selected.value = slide\n  if (changed) emit('slide-change', slide)\n}\nfunction previous() {\n  embla.value?.scrollPrev()\n  emit('previous-slide')\n}\nfunction next() {\n  embla.value?.scrollNext()\n  emit('next-slide')\n}\nfunction keydown(event: KeyboardEvent) {\n  if (!props.withKeyboardEvents) return\n  if (event.key === 'ArrowRight') {\n    event.preventDefault()\n    next()\n  }\n  if (event.key === 'ArrowLeft') {\n    event.preventDefault()\n    previous()\n  }\n  if (event.key === 'Home') {\n    event.preventDefault()\n    scrollTo(0)\n  }\n  if (event.key === 'End') {\n    event.preventDefault()\n    scrollTo((embla.value?.scrollSnapList().length ?? 1) - 1)\n  }\n}\nfunction indicatorKeydown(event: KeyboardEvent, index: number) {\n  const nextKey = props.orientation === 'horizontal' ? 'ArrowRight' : 'ArrowDown'\n  const previousKey = props.orientation === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'\n  const parent = (event.currentTarget as HTMLElement).parentElement\n  let target: number | null = null\n  if (event.key === nextKey) target = getNextIndicatorIndex(index, slidesCount.value)\n  if (event.key === previousKey) target = getPreviousIndicatorIndex(index, slidesCount.value)\n  if (event.key === 'Home') target = 0\n  if (event.key === 'End') target = slidesCount.value - 1\n  if (target !== null) {\n    event.preventDefault()\n    scrollTo(target)\n    ;(parent?.children[target] as HTMLElement | undefined)?.focus()\n  }\n}\nfunction indicatorAttrs(index: number) {\n  return {\n    ...getStyles('indicator'),\n    role: 'tab',\n    'aria-label': `Go to slide ${index + 1}`,\n    'aria-selected': index === selected.value,\n    tabindex: index === selected.value ? 0 : -1,\n    'data-active': index === selected.value || undefined,\n    'data-orientation': props.orientation,\n    onClick: () => scrollTo(index),\n    onKeydown: (event: KeyboardEvent) => indicatorKeydown(event, index),\n    onMousedown: (event: Event) => event.preventDefault(),\n    ...props.getIndicatorProps?.(index),\n  }\n}\nfunction previousAttrs() {\n  return {\n    'aria-controls': id.value,\n    'aria-label': 'Previous slide',\n    'aria-disabled': !canScrollPrev.value,\n    'data-inactive': !canScrollPrev.value || undefined,\n    'data-type': 'previous',\n    tabindex: canScrollPrev.value ? 0 : -1,\n    ...props.previousControlProps,\n    ...getStyles('control', {\n      className: props.previousControlProps?.className,\n      style: props.previousControlProps?.style,\n    }),\n    onClick: (event: Event) => {\n      previous()\n      props.previousControlProps?.onClick?.(event)\n    },\n  }\n}\nfunction nextAttrs() {\n  return {\n    'aria-controls': id.value,\n    'aria-label': 'Next slide',\n    'aria-disabled': !canScrollNext.value,\n    'data-inactive': !canScrollNext.value || undefined,\n    'data-type': 'next',\n    tabindex: canScrollNext.value ? 0 : -1,\n    ...getStyles('control', {\n      className: props.nextControlProps?.className,\n      style: props.nextControlProps?.style,\n    }),\n    ...props.nextControlProps,\n    onClick: (event: Event) => {\n      next()\n      props.nextControlProps?.onClick?.(event)\n    },\n  }\n}\nconst renderPreviousIcon = () => props.previousControlIcon\nconst renderNextIcon = () => props.nextControlIcon\n\nwatch(\n  embla,\n  (instance, _previous, onCleanup) => {\n    if (!instance) return\n    emit('embla-api-ready', instance)\n    select()\n    slidesCount.value = instance.scrollSnapList().length\n    instance.on('select', select)\n    onCleanup(() => instance.off('select', select))\n  },\n  { immediate: true },\n)\nwatch([slotSlideCount, () => props.emblaOptions?.slidesToScroll], ([childrenCount]) => {\n  const instance = embla.value\n  if (!instance) return\n  instance.reInit()\n  slidesCount.value = instance.scrollSnapList().length\n  selected.value = clamp(selected.value, 0, childrenCount - 1)\n})\nprovideCarouselContext({\n  getStyles,\n  get orientation() {\n    return props.orientation\n  },\n} as any)\n\nconst rootElement = ref<Element | null>(null)\n\nconst setRootRef = (node: Element | null) => {\n  rootElement.value = node\n  assignRef(props.rootRef, node)\n}\n\ndefineExpose({ embla, rootElement })\n</script>\n\n<template>\n  <CarouselContainerVariables v-if=\"props.type === 'container'\" v-bind=\"variablesProps\" />\n  <CarouselVariables v-else v-bind=\"variablesProps\" />\n  <Box\n    :rootRef=\"setRootRef\"\n    v-bind=\"{\n      role: 'region',\n      'aria-roledescription': 'carousel',\n      ...attrs,\n      ...getStyles('root', { className: responsiveClassName }),\n    }\"\n    :id=\"id\"\n    :mod=\"[\n      { orientation: props.orientation, 'include-gap-in-size': props.includeGapInSize },\n      props.mod,\n    ]\"\n    @keydown.capture=\"keydown\"\n  >\n    <VisuallyHidden role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n      {{ slidesCount > 0 ? `Slide ${selected + 1} of ${slidesCount}` : '' }}\n    </VisuallyHidden>\n    <div\n      v-if=\"props.withControls\"\n      v-bind=\"getStyles('controls')\"\n      :data-orientation=\"props.orientation\"\n    >\n      <UnstyledButton v-bind=\"previousAttrs()\">\n        <component v-if=\"props.previousControlIcon !== undefined\" :is=\"renderPreviousIcon\" />\n        <AccordionChevron\n          v-else\n          :style=\"{\n            transform: `rotate(${getChevronRotation({ dir, orientation: props.orientation, direction: 'previous' })}deg)`,\n          }\"\n        />\n      </UnstyledButton>\n      <UnstyledButton v-bind=\"nextAttrs()\">\n        <component v-if=\"props.nextControlIcon !== undefined\" :is=\"renderNextIcon\" />\n        <AccordionChevron\n          v-else\n          :style=\"{\n            transform: `rotate(${getChevronRotation({ dir, orientation: props.orientation, direction: 'next' })}deg)`,\n          }\"\n        />\n      </UnstyledButton>\n    </div>\n    <div ref=\"emblaNode\" v-bind=\"getStyles('viewport')\" :data-type=\"props.type\">\n      <div\n        v-bind=\"getStyles('container', { className: responsiveClassName })\"\n        :data-orientation=\"props.orientation\"\n      >\n        <component :is=\"renderSlides\" />\n      </div>\n    </div>\n    <div\n      v-if=\"props.withIndicators\"\n      v-bind=\"getStyles('indicators')\"\n      role=\"tablist\"\n      aria-label=\"Slides\"\n      :data-orientation=\"props.orientation\"\n    >\n      <UnstyledButton\n        v-for=\"index in slidesCount\"\n        :key=\"index - 1\"\n        v-bind=\"indicatorAttrs(index - 1)\"\n      />\n    </div>\n  </Box>\n</template>\n","<script lang=\"ts\">\nimport { createVarsResolver, getSpacing, rem } from '@mantine-vue/core'\nconst varsResolver = createVarsResolver<any>((_, { height, controlSize, controlsOffset }) => ({\n  root: {\n    '--carousel-height': rem(height),\n    '--carousel-control-size': rem(controlSize),\n    '--carousel-controls-offset': getSpacing(controlsOffset),\n  },\n}))\nexport { varsResolver }\n</script>\n\n<script setup lang=\"ts\">\nimport { Comment, computed, ref, useAttrs, useSlots, watch, type VNode } from 'vue'\nimport emblaCarouselVue from 'embla-carousel-vue'\nimport type { EmblaOptionsType } from 'embla-carousel'\nimport {\n  AccordionChevron,\n  Box,\n  UnstyledButton,\n  VisuallyHidden,\n  useDirection,\n  useProps,\n  useStyles,\n} from '@mantine-vue/core'\nimport { assignRef, useId } from '@mantine-vue/hooks'\nimport { provideCarouselContext } from '../../Carousel.context'\nimport CarouselContainerVariables from '../CarouselVariables/CarouselContainerVariables.vue'\nimport CarouselVariables from '../CarouselVariables/CarouselVariables.vue'\nimport { getChevronRotation } from '../../get-chevron-rotation'\nimport {\n  clamp,\n  getNextIndicatorIndex,\n  getPreviousIndicatorIndex,\n} from '../../get-indicator-navigation'\nimport type { CarouselEmits, CarouselProps } from './Carousel.types'\nimport classes from '../../Carousel.module.css'\n\ndefineOptions({ name: 'Carousel', inheritAttrs: false })\nconst rawProps = withDefaults(defineProps<CarouselProps>(), {\n  controlSize: 26,\n  controlsOffset: 'sm',\n  slideSize: '100%',\n  slideGap: 0,\n  orientation: 'horizontal',\n  includeGapInSize: true,\n  initialSlide: 0,\n  withControls: true,\n  withIndicators: false,\n  withKeyboardEvents: true,\n  type: 'media',\n})\nconst props = useProps('Carousel', null, rawProps)\nconst emit = defineEmits<CarouselEmits>()\nconst attrs = useAttrs()\nconst slots = useSlots()\nconst getStyles = useStyles({\n  name: 'Carousel',\n  classes,\n  props,\n  className: attrs.class,\n  style: attrs.style as any,\n  classNames: props.classNames,\n  styles: props.styles,\n  unstyled: props.unstyled,\n  vars: props.vars,\n  varsResolver,\n})\nconst id = useId(props.id)\nconst responsiveClassName = `__mantine-vue-carousel-${Math.random().toString(36).slice(2, 9)}`\nconst { dir } = useDirection()\nconst defaultEmblaOptions: EmblaOptionsType = {\n  align: 'center',\n  loop: false,\n  slidesToScroll: 1,\n  dragFree: false,\n  inViewThreshold: 0,\n  skipSnaps: false,\n  containScroll: 'trimSnaps',\n}\nconst emblaOptions = computed<EmblaOptionsType>(() => ({\n  axis: props.orientation === 'horizontal' ? 'x' : 'y',\n  direction: props.orientation === 'horizontal' ? dir.value : undefined,\n  startIndex: props.initialSlide,\n  ...defaultEmblaOptions,\n  ...props.emblaOptions,\n}))\nconst plugins = computed(() => props.plugins ?? [])\nconst [emblaNode, embla] = emblaCarouselVue(emblaOptions, plugins)\nconst selected = ref(0)\nconst slidesCount = ref(0)\nconst slotSlideCount = ref(0)\nconst canScrollPrev = computed(() => (selected.value >= 0 && embla.value?.canScrollPrev()) || false)\nconst canScrollNext = computed(() => (selected.value >= 0 && embla.value?.canScrollNext()) || false)\nconst variablesProps = computed(() => ({\n  selector: `.${responsiveClassName}`,\n  slideSize: props.slideSize,\n  slideGap: props.slideGap,\n}))\n\nfunction countRealSlides(nodes: VNode[]) {\n  return nodes.filter((node) => node.type !== Comment).length\n}\nfunction renderSlides() {\n  const nodes = slots.default?.() ?? []\n  slotSlideCount.value = countRealSlides(nodes)\n  return nodes\n}\nfunction scrollTo(index: number) {\n  embla.value?.scrollTo(index)\n}\nfunction select() {\n  const instance = embla.value\n  if (!instance) return\n  const slide = instance.selectedScrollSnap()\n  const changed = slide !== selected.value\n  selected.value = slide\n  if (changed) emit('slide-change', slide)\n}\nfunction previous() {\n  embla.value?.scrollPrev()\n  emit('previous-slide')\n}\nfunction next() {\n  embla.value?.scrollNext()\n  emit('next-slide')\n}\nfunction keydown(event: KeyboardEvent) {\n  if (!props.withKeyboardEvents) return\n  if (event.key === 'ArrowRight') {\n    event.preventDefault()\n    next()\n  }\n  if (event.key === 'ArrowLeft') {\n    event.preventDefault()\n    previous()\n  }\n  if (event.key === 'Home') {\n    event.preventDefault()\n    scrollTo(0)\n  }\n  if (event.key === 'End') {\n    event.preventDefault()\n    scrollTo((embla.value?.scrollSnapList().length ?? 1) - 1)\n  }\n}\nfunction indicatorKeydown(event: KeyboardEvent, index: number) {\n  const nextKey = props.orientation === 'horizontal' ? 'ArrowRight' : 'ArrowDown'\n  const previousKey = props.orientation === 'horizontal' ? 'ArrowLeft' : 'ArrowUp'\n  const parent = (event.currentTarget as HTMLElement).parentElement\n  let target: number | null = null\n  if (event.key === nextKey) target = getNextIndicatorIndex(index, slidesCount.value)\n  if (event.key === previousKey) target = getPreviousIndicatorIndex(index, slidesCount.value)\n  if (event.key === 'Home') target = 0\n  if (event.key === 'End') target = slidesCount.value - 1\n  if (target !== null) {\n    event.preventDefault()\n    scrollTo(target)\n    ;(parent?.children[target] as HTMLElement | undefined)?.focus()\n  }\n}\nfunction indicatorAttrs(index: number) {\n  return {\n    ...getStyles('indicator'),\n    role: 'tab',\n    'aria-label': `Go to slide ${index + 1}`,\n    'aria-selected': index === selected.value,\n    tabindex: index === selected.value ? 0 : -1,\n    'data-active': index === selected.value || undefined,\n    'data-orientation': props.orientation,\n    onClick: () => scrollTo(index),\n    onKeydown: (event: KeyboardEvent) => indicatorKeydown(event, index),\n    onMousedown: (event: Event) => event.preventDefault(),\n    ...props.getIndicatorProps?.(index),\n  }\n}\nfunction previousAttrs() {\n  return {\n    'aria-controls': id.value,\n    'aria-label': 'Previous slide',\n    'aria-disabled': !canScrollPrev.value,\n    'data-inactive': !canScrollPrev.value || undefined,\n    'data-type': 'previous',\n    tabindex: canScrollPrev.value ? 0 : -1,\n    ...props.previousControlProps,\n    ...getStyles('control', {\n      className: props.previousControlProps?.className,\n      style: props.previousControlProps?.style,\n    }),\n    onClick: (event: Event) => {\n      previous()\n      props.previousControlProps?.onClick?.(event)\n    },\n  }\n}\nfunction nextAttrs() {\n  return {\n    'aria-controls': id.value,\n    'aria-label': 'Next slide',\n    'aria-disabled': !canScrollNext.value,\n    'data-inactive': !canScrollNext.value || undefined,\n    'data-type': 'next',\n    tabindex: canScrollNext.value ? 0 : -1,\n    ...getStyles('control', {\n      className: props.nextControlProps?.className,\n      style: props.nextControlProps?.style,\n    }),\n    ...props.nextControlProps,\n    onClick: (event: Event) => {\n      next()\n      props.nextControlProps?.onClick?.(event)\n    },\n  }\n}\nconst renderPreviousIcon = () => props.previousControlIcon\nconst renderNextIcon = () => props.nextControlIcon\n\nwatch(\n  embla,\n  (instance, _previous, onCleanup) => {\n    if (!instance) return\n    emit('embla-api-ready', instance)\n    select()\n    slidesCount.value = instance.scrollSnapList().length\n    instance.on('select', select)\n    onCleanup(() => instance.off('select', select))\n  },\n  { immediate: true },\n)\nwatch([slotSlideCount, () => props.emblaOptions?.slidesToScroll], ([childrenCount]) => {\n  const instance = embla.value\n  if (!instance) return\n  instance.reInit()\n  slidesCount.value = instance.scrollSnapList().length\n  selected.value = clamp(selected.value, 0, childrenCount - 1)\n})\nprovideCarouselContext({\n  getStyles,\n  get orientation() {\n    return props.orientation\n  },\n} as any)\n\nconst rootElement = ref<Element | null>(null)\n\nconst setRootRef = (node: Element | null) => {\n  rootElement.value = node\n  assignRef(props.rootRef, node)\n}\n\ndefineExpose({ embla, rootElement })\n</script>\n\n<template>\n  <CarouselContainerVariables v-if=\"props.type === 'container'\" v-bind=\"variablesProps\" />\n  <CarouselVariables v-else v-bind=\"variablesProps\" />\n  <Box\n    :rootRef=\"setRootRef\"\n    v-bind=\"{\n      role: 'region',\n      'aria-roledescription': 'carousel',\n      ...attrs,\n      ...getStyles('root', { className: responsiveClassName }),\n    }\"\n    :id=\"id\"\n    :mod=\"[\n      { orientation: props.orientation, 'include-gap-in-size': props.includeGapInSize },\n      props.mod,\n    ]\"\n    @keydown.capture=\"keydown\"\n  >\n    <VisuallyHidden role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n      {{ slidesCount > 0 ? `Slide ${selected + 1} of ${slidesCount}` : '' }}\n    </VisuallyHidden>\n    <div\n      v-if=\"props.withControls\"\n      v-bind=\"getStyles('controls')\"\n      :data-orientation=\"props.orientation\"\n    >\n      <UnstyledButton v-bind=\"previousAttrs()\">\n        <component v-if=\"props.previousControlIcon !== undefined\" :is=\"renderPreviousIcon\" />\n        <AccordionChevron\n          v-else\n          :style=\"{\n            transform: `rotate(${getChevronRotation({ dir, orientation: props.orientation, direction: 'previous' })}deg)`,\n          }\"\n        />\n      </UnstyledButton>\n      <UnstyledButton v-bind=\"nextAttrs()\">\n        <component v-if=\"props.nextControlIcon !== undefined\" :is=\"renderNextIcon\" />\n        <AccordionChevron\n          v-else\n          :style=\"{\n            transform: `rotate(${getChevronRotation({ dir, orientation: props.orientation, direction: 'next' })}deg)`,\n          }\"\n        />\n      </UnstyledButton>\n    </div>\n    <div ref=\"emblaNode\" v-bind=\"getStyles('viewport')\" :data-type=\"props.type\">\n      <div\n        v-bind=\"getStyles('container', { className: responsiveClassName })\"\n        :data-orientation=\"props.orientation\"\n      >\n        <component :is=\"renderSlides\" />\n      </div>\n    </div>\n    <div\n      v-if=\"props.withIndicators\"\n      v-bind=\"getStyles('indicators')\"\n      role=\"tablist\"\n      aria-label=\"Slides\"\n      :data-orientation=\"props.orientation\"\n    >\n      <UnstyledButton\n        v-for=\"index in slidesCount\"\n        :key=\"index - 1\"\n        v-bind=\"indicatorAttrs(index - 1)\"\n      />\n    </div>\n  </Box>\n</template>\n","<script setup lang=\"ts\">\nimport { ref, useAttrs } from 'vue'\nimport { assignRef } from '@mantine-vue/hooks'\nimport { Box } from '@mantine-vue/core'\nimport { useCarouselContext } from '../../Carousel.context'\nimport type { CarouselSlideProps } from './CarouselSlide.types'\n\ndefineOptions({ name: 'CarouselSlide', inheritAttrs: false })\nconst props = defineProps<CarouselSlideProps>()\nconst attrs = useAttrs()\nconst context = useCarouselContext()\n\nconst rootElement = ref<Element | null>(null)\n\nconst setRootRef = (node: Element | null) => {\n  rootElement.value = node\n  assignRef(props.rootRef, node)\n}\n\ndefineExpose({ rootElement })\n</script>\n\n<template>\n  <Box\n    :rootRef=\"setRootRef\"\n    v-bind=\"{\n      ...attrs,\n      ...context.getStyles('slide', {\n        className: attrs.class,\n        style: attrs.style,\n        classNames: props.classNames,\n        styles: props.styles,\n      }),\n    }\"\n    :mod=\"[{ orientation: context.orientation }, props.mod]\"\n    role=\"group\"\n    aria-roledescription=\"slide\"\n    aria-label=\"Carousel slide\"\n  >\n    <slot />\n  </Box>\n</template>\n","<script setup lang=\"ts\">\nimport { ref, useAttrs } from 'vue'\nimport { assignRef } from '@mantine-vue/hooks'\nimport { Box } from '@mantine-vue/core'\nimport { useCarouselContext } from '../../Carousel.context'\nimport type { CarouselSlideProps } from './CarouselSlide.types'\n\ndefineOptions({ name: 'CarouselSlide', inheritAttrs: false })\nconst props = defineProps<CarouselSlideProps>()\nconst attrs = useAttrs()\nconst context = useCarouselContext()\n\nconst rootElement = ref<Element | null>(null)\n\nconst setRootRef = (node: Element | null) => {\n  rootElement.value = node\n  assignRef(props.rootRef, node)\n}\n\ndefineExpose({ rootElement })\n</script>\n\n<template>\n  <Box\n    :rootRef=\"setRootRef\"\n    v-bind=\"{\n      ...attrs,\n      ...context.getStyles('slide', {\n        className: attrs.class,\n        style: attrs.style,\n        classNames: props.classNames,\n        styles: props.styles,\n      }),\n    }\"\n    :mod=\"[{ orientation: context.orientation }, props.mod]\"\n    role=\"group\"\n    aria-roledescription=\"slide\"\n    aria-label=\"Carousel slide\"\n  >\n    <slot />\n  </Box>\n</template>\n","import { factory } from '@mantine-vue/core'\nimport CarouselSlideComponent from './CarouselSlide.vue'\nimport type { CarouselSlideFactory } from './CarouselSlide.types'\nimport classes from '../../Carousel.module.css'\nexport const CarouselSlide = factory<CarouselSlideFactory>(CarouselSlideComponent, { classes })\nexport type {\n  CarouselSlideFactory,\n  CarouselSlideProps,\n  CarouselSlideStylesNames,\n} from './CarouselSlide.types'\n","import { factory } from '@mantine-vue/core'\nimport CarouselComponent, { varsResolver } from './Carousel.vue'\nimport type { CarouselFactory } from './Carousel.types'\nimport { CarouselSlide } from '../CarouselSlide'\nimport classes from '../../Carousel.module.css'\nexport const Carousel = factory<CarouselFactory>(CarouselComponent, {\n  classes,\n  varsResolver,\n  Slide: CarouselSlide,\n})\nexport type {\n  CarouselCssVariables,\n  CarouselEmits,\n  CarouselFactory,\n  CarouselProps,\n  CarouselStylesNames,\n} from './Carousel.types'\n"],"mappings":"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"}

package/lib/components/Carousel/Carousel.types.d.ts

@@ -0,0 +1,86 @@
+import type { CarouselSlide } from '../CarouselSlide';
+import type { Ref } from 'vue';
+import type { Factory } from '@mantine-vue/core';
+import type { VueRefTarget } from '@mantine-vue/hooks';
+import type { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from 'embla-carousel';
+export type CarouselStylesNames = 'slide' | 'root' | 'viewport' | 'container' | 'controls' | 'control' | 'indicators' | 'indicator';
+/** Props accepted by `Carousel`. */
+export interface CarouselProps {
+    /** Receives the root DOM node. */
+    rootRef?: VueRefTarget<Element>;
+    /** Options passed to Embla Carousel. */
+    emblaOptions?: EmblaOptionsType;
+    /** Props passed down to next control. */
+    nextControlProps?: Record<string, any>;
+    /** Props passed down to previous control. */
+    previousControlProps?: Record<string, any>;
+    /** Previous and next control size @default 26 */
+    controlSize?: string | number;
+    /** Controls offset @default 'sm' */
+    controlsOffset?: string | number;
+    /** Slide width @default '100%' */
+    slideSize?: string | number | Record<string, string | number>;
+    /** Gap between slides @default 0 */
+    slideGap?: string | number | Record<string, string | number>;
+    /** Carousel orientation @default 'horizontal' */
+    orientation?: 'horizontal' | 'vertical';
+    /** Responsive query type @default 'media' */
+    type?: 'media' | 'container';
+    /** Carousel height, required for vertical orientation. */
+    height?: string | number;
+    /** Includes gap in slide size calculations @default true */
+    includeGapInSize?: boolean;
+    /** Initial slide index @default 0 */
+    initialSlide?: number;
+    /** Displays previous and next controls @default true */
+    withControls?: boolean;
+    /** Displays slide indicators @default false */
+    withIndicators?: boolean;
+    /** A list of Embla plugins. */
+    plugins?: EmblaPluginType[];
+    /** Icon of the next control */
+    nextControlIcon?: any;
+    /** Icon of the previous control */
+    previousControlIcon?: any;
+    /** Enables arrow-key navigation @default true */
+    withKeyboardEvents?: boolean;
+    /** Function to get props for indicator button */
+    getIndicatorProps?: (index: number) => Record<string, any>;
+    /** Id assigned to the carousel root element and referenced by previous and next controls. */
+    id?: string;
+    classNames?: any;
+    styles?: any;
+    vars?: any;
+    unstyled?: boolean;
+    mod?: any;
+}
+/** Events emitted by `Carousel`. */
+export interface CarouselEmits {
+    /** Emitted when the next slide control is activated. */
+    'next-slide': [];
+    /** Emitted when the previous slide control is activated. */
+    'previous-slide': [];
+    /** Emitted with the selected slide index. */
+    'slide-change': [index: number];
+    /** Emitted with the Embla API instance once it becomes available. */
+    'embla-api-ready': [embla: EmblaCarouselType];
+}
+export type CarouselCssVariables = {
+    root: '--carousel-height' | '--carousel-control-size' | '--carousel-controls-offset';
+};
+export type CarouselFactory = Factory<{
+    props: Omit<CarouselProps, 'rootRef'>;
+    emits: CarouselEmits;
+    ref: HTMLDivElement;
+    exposed: {
+        /** The underlying Embla instance, once the carousel has mounted. */
+        embla: Ref<EmblaCarouselType | undefined>;
+        rootElement: Element | null;
+    };
+    element: 'div';
+    stylesNames: CarouselStylesNames;
+    vars: CarouselCssVariables;
+    staticComponents: {
+        Slide: typeof CarouselSlide;
+    };
+}>;

package/lib/components/Carousel/Carousel.vue.d.ts

@@ -0,0 +1,19 @@
+import type { CarouselProps } from './Carousel.types';
+declare const varsResolver: (theme: import("@mantine-vue/core").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
+export { varsResolver };
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<CarouselProps, {
+    embla: import("vue").Ref<import("embla-carousel").EmblaCarouselType | undefined, import("embla-carousel").EmblaCarouselType | undefined>;
+    rootElement: import("vue").Ref<Element | null, Element | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "next-slide": () => any;
+    "previous-slide": () => any;
+    "slide-change": (index: number) => any;
+    "embla-api-ready": (embla: import("embla-carousel").EmblaCarouselType) => any;
+}, string, import("vue").PublicProps, Readonly<CarouselProps> & Readonly<{
+    "onNext-slide"?: (() => any) | undefined;
+    "onPrevious-slide"?: (() => any) | undefined;
+    "onSlide-change"?: ((index: number) => any) | undefined;
+    "onEmbla-api-ready"?: ((embla: import("embla-carousel").EmblaCarouselType) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/lib/components/Carousel/index.d.ts

@@ -0,0 +1,17 @@
+import { CarouselSlide } from '../CarouselSlide';
+export declare const Carousel: import("@mantine-vue/core").MantineComponent<{
+    props: Omit<import("./Carousel.types").CarouselProps, "rootRef">;
+    emits: import("./Carousel.types").CarouselEmits;
+    ref: HTMLDivElement;
+    exposed: {
+        embla: import("vue").Ref<import("embla-carousel").EmblaCarouselType | undefined>;
+        rootElement: Element | null;
+    };
+    element: "div";
+    stylesNames: import("./Carousel.types").CarouselStylesNames;
+    vars: import("./Carousel.types").CarouselCssVariables;
+    staticComponents: {
+        Slide: typeof CarouselSlide;
+    };
+}>;
+export type { CarouselCssVariables, CarouselEmits, CarouselFactory, CarouselProps, CarouselStylesNames, } from './Carousel.types';

package/lib/components/CarouselSlide/CarouselSlide.types.d.ts

@@ -0,0 +1,20 @@
+import type { Factory } from '@mantine-vue/core';
+import type { VueRefTarget } from '@mantine-vue/hooks';
+export type CarouselSlideStylesNames = 'slide';
+/** Props accepted by `CarouselSlide`. */
+export interface CarouselSlideProps {
+    /** Receives the root DOM node. */
+    rootRef?: VueRefTarget<Element>;
+    classNames?: any;
+    styles?: any;
+    mod?: any;
+}
+export type CarouselSlideFactory = Factory<{
+    props: Omit<CarouselSlideProps, 'rootRef'>;
+    ref: HTMLDivElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    element: 'div';
+    stylesNames: CarouselSlideStylesNames;
+}>;

package/lib/components/CarouselSlide/CarouselSlide.vue.d.ts

@@ -0,0 +1,16 @@
+import type { CarouselSlideProps } from './CarouselSlide.types';
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<CarouselSlideProps, {
+    rootElement: import("vue").Ref<Element | null, Element | null>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CarouselSlideProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/CarouselSlide/index.d.ts

@@ -0,0 +1,10 @@
+export declare const CarouselSlide: import("@mantine-vue/core").MantineComponent<{
+    props: Omit<import("./CarouselSlide.types").CarouselSlideProps, "rootRef">;
+    ref: HTMLDivElement;
+    exposed: {
+        rootElement: Element | null;
+    };
+    element: "div";
+    stylesNames: import("./CarouselSlide.types").CarouselSlideStylesNames;
+}>;
+export type { CarouselSlideFactory, CarouselSlideProps, CarouselSlideStylesNames, } from './CarouselSlide.types';

package/lib/components/CarouselVariables/CarouselContainerVariables.vue.d.ts

@@ -0,0 +1,4 @@
+import type { CarouselVariablesProps } from './CarouselVariables.types';
+declare const __VLS_export: import("vue").DefineComponent<CarouselVariablesProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CarouselVariablesProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/lib/components/CarouselVariables/CarouselVariables.types.d.ts

@@ -0,0 +1,9 @@
+export type CarouselStyleProp<T> = T | Partial<Record<string, T>>;
+export interface CarouselVariablesProps {
+    /** CSS selector used to scope generated responsive carousel variables. */
+    selector: string;
+    /** Controls slide width based on viewport or container width. @default '100%' */
+    slideSize?: CarouselStyleProp<string | number>;
+    /** Key of `theme.spacing` or any valid CSS value to set gap between slides. @default 0 */
+    slideGap?: CarouselStyleProp<string | number>;
+}

package/lib/components/CarouselVariables/CarouselVariables.utils.d.ts

@@ -0,0 +1,6 @@
+import type { CarouselVariablesProps } from './CarouselVariables.types';
+export declare const isObject: (value: unknown) => value is Record<string, any>;
+export declare const getBaseStyles: (props: CarouselVariablesProps) => Partial<{
+    '--carousel-slide-gap': string | undefined;
+    '--carousel-slide-size': string;
+}>;

package/lib/components/CarouselVariables/CarouselVariables.vue.d.ts

@@ -0,0 +1,4 @@
+import type { CarouselVariablesProps } from './CarouselVariables.types';
+declare const __VLS_export: import("vue").DefineComponent<CarouselVariablesProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CarouselVariablesProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/lib/components/CarouselVariables/index.d.ts

@@ -0,0 +1,3 @@
+export { default as CarouselVariables } from './CarouselVariables.vue';
+export { default as CarouselContainerVariables } from './CarouselContainerVariables.vue';
+export type { CarouselStyleProp, CarouselVariablesProps } from './CarouselVariables.types';

package/lib/index.d.mts

@@ -1,6 +1,6 @@
-export { Carousel } from './Carousel';
+export { Carousel } from './components/Carousel';
 export { useCarouselContext } from './Carousel.context';
-export { CarouselSlide } from './CarouselSlide';
-export type { CarouselProps, CarouselStylesNames } from './Carousel';
-export type { CarouselSlideProps, CarouselSlideStylesNames } from './CarouselSlide';
+export { CarouselSlide } from './components/CarouselSlide';
+export type { CarouselEmits, CarouselProps, CarouselStylesNames } from './components/Carousel';
+export type { CarouselSlideProps, CarouselSlideStylesNames } from './components/CarouselSlide';
 export type { CarouselContextValue } from './Carousel.context';

package/lib/index.d.ts

@@ -1,6 +1,6 @@
-export { Carousel } from './Carousel';
+export { Carousel } from './components/Carousel';
 export { useCarouselContext } from './Carousel.context';
-export { CarouselSlide } from './CarouselSlide';
-export type { CarouselProps, CarouselStylesNames } from './Carousel';
-export type { CarouselSlideProps, CarouselSlideStylesNames } from './CarouselSlide';
+export { CarouselSlide } from './components/CarouselSlide';
+export type { CarouselEmits, CarouselProps, CarouselStylesNames } from './components/Carousel';
+export type { CarouselSlideProps, CarouselSlideStylesNames } from './components/CarouselSlide';
 export type { CarouselContextValue } from './Carousel.context';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine-vue/carousel",
-  "version": "2.4.0",
+  "version": "3.1.0",
   "description": "Embla based carousel, Vue equivalent to @mantine/carousel",
   "license": "MIT",
   "files": [
@@ -39,8 +39,8 @@
     "vue": "^3.5.0"
   },
   "peerDependencies": {
-    "@mantine-vue/core": "2.4.0",
-    "@mantine-vue/hooks": "2.4.0",
+    "@mantine-vue/core": "3.1.0",
+    "@mantine-vue/hooks": "3.1.0",
     "embla-carousel": ">=8.0.0",
     "embla-carousel-vue": ">=8.0.0",
     "vue": "^3.5.0"

package/lib/Carousel.d.ts

@@ -1,66 +0,0 @@
-import { type DefineComponent } from 'vue';
-import type { EmblaCarouselType, EmblaOptionsType, EmblaPluginType } from 'embla-carousel';
-import { CarouselSlide } from './CarouselSlide';
-import classes from './Carousel.module.css';
-export type CarouselStylesNames = 'slide' | 'root' | 'viewport' | 'container' | 'controls' | 'control' | 'indicators' | 'indicator';
-export interface CarouselProps {
-    /** Options passed down to embla carousel */
-    emblaOptions?: EmblaOptionsType;
-    /** Called when next slide is shown */
-    onNextSlide?: () => void;
-    /** Called when previous slider is shown */
-    onPreviousSlide?: () => void;
-    /** Called with slide index when slide changes */
-    onSlideChange?: (index: number) => void;
-    /** Get embla API as ref */
-    getEmblaApi?: (embla: EmblaCarouselType) => void;
-    /** Props passed down to next control */
-    nextControlProps?: Record<string, any>;
-    /** Props passed down to previous control */
-    previousControlProps?: Record<string, any>;
-    /** Controls size of the next and previous controls @default 26 */
-    controlSize?: string | number;
-    /** Controls position of the next and previous controls, key of `theme.spacing` or any valid CSS value @default 'sm' */
-    controlsOffset?: string | number;
-    /** Controls slide width based on viewport width @default '100%' */
-    slideSize?: string | number | Record<string, string | number>;
-    /** Key of theme.spacing or number to set gap between slides */
-    slideGap?: string | number | Record<string, string | number>;
-    /** Carousel orientation @default 'horizontal' */
-    orientation?: 'horizontal' | 'vertical';
-    /** Determines type of queries used for responsive styles @default 'media' */
-    type?: 'media' | 'container';
-    /** Slides container `height`, required for vertical orientation */
-    height?: string | number;
-    /** Determines whether gap between slides should be treated as part of the slide size @default true */
-    includeGapInSize?: boolean;
-    /** Index of initial slide */
-    initialSlide?: number;
-    /** Determines whether next/previous controls should be displayed @default true */
-    withControls?: boolean;
-    /** Determines whether indicators should be displayed @default false */
-    withIndicators?: boolean;
-    /** A list of embla plugins */
-    plugins?: EmblaPluginType[];
-    /** Icon of the next control */
-    nextControlIcon?: any;
-    /** Icon of the previous control */
-    previousControlIcon?: any;
-    /** Determines whether arrow key should switch slides @default true */
-    withKeyboardEvents?: boolean;
-    /** Function to get props for indicator button */
-    getIndicatorProps?: (index: number) => Record<string, any>;
-    id?: string;
-    classNames?: any;
-    styles?: any;
-    vars?: any;
-    unstyled?: boolean;
-    mod?: any;
-}
-declare const varsResolver: (theme: import("@mantine-vue/core").MantineTheme, props: any, ctx: Record<string, any>) => Record<string, Record<string, string | undefined>>;
-export declare const Carousel: DefineComponent<CarouselProps> & {
-    classes: typeof classes;
-    varsResolver: typeof varsResolver;
-    Slide: typeof CarouselSlide;
-};
-export {};