zgg-ui/components/z-tabs/z-tabs.ts

2.0.1 正式版本 基于 Vue 3、UniApp 和 TypeScript 开发的多端适配移动端 UI 组件库，旨在提供丰富的组件集合，帮助开发者快速构建多端响应式的移动应用界面

import type { InjectionKey } from 'vue'
import { propsHook, PropsTypeHook } from '../../libs/zHooks'

export interface zTabsItemRect {
  width: number
  height: number
  left: number
}

type TabsSwitchBeforeFunc = (index: number) => Promise<boolean> | boolean

interface zTabsProps extends PropsTypeHook {
  color?: string
  activeColor?: string
  fontSize?: string
  activeFontSize?: string
  modelValue?: string | number
  height?: string
  barWidth?: string
  bgColor?: string
  barColor?: string
  bottomShadow?: boolean
  scroll?: boolean
  bar?: boolean
  activeBold?: boolean
  offsetTop?: number
  beforeSwitch?: TabsSwitchBeforeFunc
}

export type zTabsItemContext = {
  uid: number
  elementRect: zTabsItemRect
  name?: string | number
}

export type TabsContext = zTabsProps & {
  items: zTabsItemContext[]
  activeUid: number
  showBar: boolean
  addItem: (item: zTabsItemContext) => void
  removeItem: (uid: number) => void
  setActiveItem: (uid: number) => void
}

export const ztabsContextKey: InjectionKey<TabsContext> =
  Symbol('ztabsContextKey')