2022-03-17 22:20:25 +08:00
|
|
|
import type { InjectionKey, Ref } from 'vue'
|
2022-03-17 12:21:06 +08:00
|
|
|
|
|
|
|
import type { CarouselItemProps } from '@element-plus/components/carousel'
|
|
|
|
|
2022-03-17 22:20:25 +08:00
|
|
|
export type CarouselItemStates = {
|
|
|
|
hover: boolean
|
|
|
|
translate: number
|
|
|
|
scale: number
|
|
|
|
active: boolean
|
|
|
|
ready: boolean
|
|
|
|
inStage: boolean
|
|
|
|
animating: boolean
|
|
|
|
}
|
|
|
|
|
|
|
|
export type CarouselItemContext = {
|
|
|
|
props: CarouselItemProps
|
|
|
|
states: CarouselItemStates
|
2022-10-02 08:44:40 +08:00
|
|
|
uid: number
|
2022-03-17 22:20:25 +08:00
|
|
|
translateItem: (index: number, activeIndex: number, oldIndex?: number) => void
|
|
|
|
}
|
2022-03-17 12:21:06 +08:00
|
|
|
|
|
|
|
export type CarouselContext = {
|
|
|
|
root: Ref<HTMLElement | undefined>
|
2022-03-17 22:20:25 +08:00
|
|
|
items: Ref<CarouselItemContext[]>
|
|
|
|
isCardType: Ref<boolean>
|
|
|
|
isVertical: Ref<boolean>
|
2022-03-17 12:21:06 +08:00
|
|
|
loop: boolean
|
|
|
|
addItem: (item: CarouselItemContext) => void
|
2022-10-02 08:44:40 +08:00
|
|
|
removeItem: (uid: number) => void
|
2022-03-17 12:21:06 +08:00
|
|
|
setActiveItem: (index: number) => void
|
|
|
|
}
|
|
|
|
|
|
|
|
export const carouselContextKey: InjectionKey<CarouselContext> =
|
|
|
|
Symbol('carouselContextKey')
|