@tplc/wot/types/components/wd-swiper/types.d.ts

import type { ExtractPropTypes, PropType, CSSProperties } from 'vue'
import type { SwiperNavProps } from '../wd-swiper-nav/types'
import type { ImageMode } from '../wd-img/types'
/**
 * 轮播滑动方向
 */
export type DirectionType = 'horizontal' | 'vertical'
/**
 * 切换动画
 */
export type EasingType = 'default' | 'linear' | 'easeInCubic' | 'easeOutCubic' | 'easeInOutCubic'
/**
 * 指示器位置
 */
export type IndicatorPositionType =
  | 'left'
  | 'top-left'
  | 'top'
  | 'top-right'
  | 'bottom-left'
  | 'bottom'
  | 'bottom-right'
  | 'right'
export interface SwiperList {
  [key: string]: any
  value?: string
}
export declare const swiperProps: {
  /**
   * 是否自动播放轮播图
   * 类型：boolean
   * 默认值：true
   */
  autoplay: {
    type: BooleanConstructor
    default: boolean
  }
  /**
   * 当前轮播在哪一项（下标）
   * 类型：number
   * 默认值：0
   */
  current: {
    type: NumberConstructor
    default: number
  }
  /**
   * 轮播滑动方向，可选值：'horizontal'（水平）或'vertical'（垂直）
   * 类型：string
   * 默认值：'horizontal'
   */
  direction: {
    type: PropType<DirectionType>
    default: DirectionType
  }
  /**
   * 同时显示的滑块数量
   * 类型：number
   * 默认值：1
   */
  displayMultipleItems: {
    type: NumberConstructor
    default: number
  }
  /**
   * 滑动动画时长，单位为毫秒
   * 类型：number
   * 默认值：300
   */
  duration: {
    type: NumberConstructor
    default: number
  }
  /**
   * 指定 swiper 切换缓动动画类型
   * 类型：string
   * 默认值：'default'
   */
  easingFunction: {
    type: PropType<EasingType>
    default: EasingType
  }
  /**
   * 轮播的高度
   * 类型：number 或 string（数字或可转换为数字的字符串）
   * 默认值：'192'
   */
  height: {
    type: (NumberConstructor | StringConstructor)[]
    default: string
  }
  /** 图片宽度 */
  imgWidth: {
    type: (NumberConstructor | StringConstructor)[]
    default: undefined
  }
  /**
   * 轮播间隔时间，单位为毫秒
   * 类型：number
   * 默认值：5000
   */
  interval: {
    type: NumberConstructor
    default: number
  }
  /**
   * 图片列表，可以是一个图片对象数组或字符串数组
   * 类型：array
   * 默认值：空数组
   */
  list: {
    type: PropType<SwiperList[] | string[]>
    default: () => never[]
  }
  /**
   * 是否循环播放轮播图
   * 类型：boolean
   * 默认值：true
   */
  loop: {
    type: BooleanConstructor
    default: boolean
  }
  /**
   * 后边距
   * 类型：number 或 string（数字或可转换为数字的字符串）
   * 默认值：'0'
   */
  nextMargin: {
    type: (NumberConstructor | StringConstructor)[]
    default: string
  }
  /**
   * 页码信息展示位置，可选值：'bottom'（底部）等
   * 类型：string
   * 默认值：'bottom'
   */
  indicatorPosition: {
    type: PropType<IndicatorPositionType>
    default: IndicatorPositionType
  }
  /**
   * 前边距
   * 类型：number 或 string（数字或可转换为数字的字符串）
   * 默认值：'0'
   */
  previousMargin: {
    type: (NumberConstructor | StringConstructor)[]
    default: string
  }
  /**
   * 是否应用边距到第一个、最后一个元素
   * 类型：boolean
   * 默认值：false
   */
  snapToEdge: {
    type: BooleanConstructor
    default: boolean
  }
  /**
   * 指示器全部配置，可以是布尔值或指示器配置对象
   * 类型：boolean 或 object
   * 默认值：true
   */
  indicator: {
    type: PropType<boolean | Partial<SwiperNavProps>>
    default: boolean
  }
  /**
   * 图片裁剪、缩放的模式
   * 类型：string
   * 默认值：'aspectFill'
   */
  imageMode: {
    type: PropType<ImageMode>
    default: ImageMode
  }
  /**
   * 选项对象中，value 对应的 key
   */
  valueKey: {
    type: PropType<string>
    default: string
  }
  /**
   * 自定义指示器类名
   * 类型：string
   */
  customIndicatorClass: {
    type: PropType<string>
    default: string
  }
  /**
   * 自定义图片类名
   * 类型：string
   */
  customImageClass: {
    type: PropType<string>
    default: string
  }
  /**
   * 自定义上一个图片类名
   * 类型：string
   */
  customPrevImageClass: {
    type: PropType<string>
    default: string
  }
  customPrevImageHeight: {
    type: PropType<number | string>
    default: undefined
  }
  customNextImageHeight: {
    type: PropType<number | string>
    default: undefined
  }
  customPrevImageStyle: {
    type: PropType<CSSProperties>
  }
  customNextImageStyle: {
    type: PropType<CSSProperties>
  }
  customImageStyle: {
    type: PropType<CSSProperties>
    default: () => {}
  }
  /**
   * 自定义下一个图片类名
   * 类型：string
   */
  customNextImageClass: {
    type: PropType<string>
    default: string
  }
  /** padding */
  itemPadding: {
    type: PropType<string>
    default: string
  }
  /** 图片圆角 */
  imageRadius: {
    type: PropType<string>
    default: string
  }
  radius: {
    type: PropType<string>
    default: string
  }
  action: {
    type: BooleanConstructor
    default: boolean
  }
  indicatorCustomStyle: {
    type: PropType<string>
    default: string
  }
  customStyle: {
    type: PropType<string>
    default: string
  }
  customClass: {
    type: PropType<string>
    default: string
  }
}
export type SwiperProps = ExtractPropTypes<typeof swiperProps>