stellar-ui-plus 1.16.18

package/types/refComponents.d.ts

@@ -0,0 +1,118 @@
+import steAnimate from "../components/ste-animate/ste-animate.vue"
+import steBadge from "../components/ste-badge/ste-badge.vue"
+import steBarcode from "../components/ste-barcode/ste-barcode.vue"
+import steButton from "../components/ste-button/ste-button.vue"
+import steCalendar from "../components/ste-calendar/ste-calendar.vue"
+import steCheckbox from "../components/ste-checkbox/ste-checkbox.vue"
+import steCheckboxGroup from "../components/ste-checkbox-group/ste-checkbox-group.vue"
+import steCodeInput from "../components/ste-code-input/ste-code-input.vue"
+import steDatePicker from "../components/ste-date-picker/ste-date-picker.vue"
+import steDrag from "../components/ste-drag/ste-drag.vue"
+import steDropdownMenu from "../components/ste-dropdown-menu/ste-dropdown-menu.vue"
+import steDropdownMenuItem from "../components/ste-dropdown-menu-item/ste-dropdown-menu-item.vue"
+import steIcon from "../components/ste-icon/ste-icon.vue"
+import steImage from "../components/ste-image/ste-image.vue"
+import steIndexItem from "../components/ste-index-item/ste-index-item.vue"
+import steIndexList from "../components/ste-index-list/ste-index-list.vue"
+import steInput from "../components/ste-input/ste-input.vue"
+import steLoading from "../components/ste-loading/ste-loading.vue"
+import steMediaPreview from "../components/ste-media-preview/ste-media-preview.vue"
+import steMessageBox from "../components/ste-message-box/ste-message-box.vue"
+import steNoticeBar from "../components/ste-notice-bar/ste-notice-bar.vue"
+import steNumberKeyboard from "../components/ste-number-keyboard/ste-number-keyboard.vue"
+import stePicker from "../components/ste-picker/ste-picker.vue"
+import stePopup from "../components/ste-popup/ste-popup.vue"
+import stePrice from "../components/ste-price/ste-price.vue"
+import steProgress from "../components/ste-progress/ste-progress.vue"
+import steQrcode from "../components/ste-qrcode/ste-qrcode.vue"
+import steRadio from "../components/ste-radio/ste-radio.vue"
+import steRadioGroup from "../components/ste-radio-group/ste-radio-group.vue"
+import steRate from "../components/ste-rate/ste-rate.vue"
+import steReadMore from "../components/ste-read-more/ste-read-more.vue"
+import steRichText from "../components/ste-rich-text/ste-rich-text.vue"
+import steScrollTo from "../components/ste-scroll-to/ste-scroll-to.vue"
+import steScrollToItem from "../components/ste-scroll-to-item/ste-scroll-to-item.vue"
+import steSearch from "../components/ste-search/ste-search.vue"
+import steSelect from "../components/ste-select/ste-select.vue"
+import steSignature from "../components/ste-signature/ste-signature.vue"
+import steSlider from "../components/ste-slider/ste-slider.vue"
+import steStep from "../components/ste-step/ste-step.vue"
+import steStepper from "../components/ste-stepper/ste-stepper.vue"
+import steSteps from "../components/ste-steps/ste-steps.vue"
+import steSticky from "../components/ste-sticky/ste-sticky.vue"
+import steSwipeAction from "../components/ste-swipe-action/ste-swipe-action.vue"
+import steSwipeActionGroup from "../components/ste-swipe-action-group/ste-swipe-action-group.vue"
+import steSwiper from "../components/ste-swiper/ste-swiper.vue"
+import steSwiperItem from "../components/ste-swiper-item/ste-swiper-item.vue"
+import steSwitch from "../components/ste-switch/ste-switch.vue"
+import steTab from "../components/ste-tab/ste-tab.vue"
+import steTable from "../components/ste-table/ste-table.vue"
+import steTableColumn from "../components/ste-table-column/ste-table-column.vue"
+import steTabs from "../components/ste-tabs/ste-tabs.vue"
+import steText from "../components/ste-text/ste-text.vue"
+import steToast from "../components/ste-toast/ste-toast.vue"
+import steTouchSwipe from "../components/ste-touch-swipe/ste-touch-swipe.vue"
+import steTouchSwipeItem from "../components/ste-touch-swipe-item/ste-touch-swipe-item.vue"
+import steTour from "../components/ste-tour/ste-tour.vue"
+import steTree from "../components/ste-tree/ste-tree.vue"
+import steUpload from "../components/ste-upload/ste-upload.vue"
+import steVideo from "../components/ste-video/ste-video.vue"
+export type RefAnimate = InstanceType<typeof steAnimate>
+export type RefBadge = InstanceType<typeof steBadge>
+export type RefBarcode = InstanceType<typeof steBarcode>
+export type RefButton = InstanceType<typeof steButton>
+export type RefCalendar = InstanceType<typeof steCalendar>
+export type RefCheckbox = InstanceType<typeof steCheckbox>
+export type RefCheckboxGroup = InstanceType<typeof steCheckboxGroup>
+export type RefCodeInput = InstanceType<typeof steCodeInput>
+export type RefDatePicker = InstanceType<typeof steDatePicker>
+export type RefDrag = InstanceType<typeof steDrag>
+export type RefDropdownMenu = InstanceType<typeof steDropdownMenu>
+export type RefDropdownMenuItem = InstanceType<typeof steDropdownMenuItem>
+export type RefIcon = InstanceType<typeof steIcon>
+export type RefImage = InstanceType<typeof steImage>
+export type RefIndexItem = InstanceType<typeof steIndexItem>
+export type RefIndexList = InstanceType<typeof steIndexList>
+export type RefInput = InstanceType<typeof steInput>
+export type RefLoading = InstanceType<typeof steLoading>
+export type RefMediaPreview = InstanceType<typeof steMediaPreview>
+export type RefMessageBox = InstanceType<typeof steMessageBox>
+export type RefNoticeBar = InstanceType<typeof steNoticeBar>
+export type RefNumberKeyboard = InstanceType<typeof steNumberKeyboard>
+export type RefPicker = InstanceType<typeof stePicker>
+export type RefPopup = InstanceType<typeof stePopup>
+export type RefPrice = InstanceType<typeof stePrice>
+export type RefProgress = InstanceType<typeof steProgress>
+export type RefQrcode = InstanceType<typeof steQrcode>
+export type RefRadio = InstanceType<typeof steRadio>
+export type RefRadioGroup = InstanceType<typeof steRadioGroup>
+export type RefRate = InstanceType<typeof steRate>
+export type RefReadMore = InstanceType<typeof steReadMore>
+export type RefRichText = InstanceType<typeof steRichText>
+export type RefScrollTo = InstanceType<typeof steScrollTo>
+export type RefScrollToItem = InstanceType<typeof steScrollToItem>
+export type RefSearch = InstanceType<typeof steSearch>
+export type RefSelect = InstanceType<typeof steSelect>
+export type RefSignature = InstanceType<typeof steSignature>
+export type RefSlider = InstanceType<typeof steSlider>
+export type RefStep = InstanceType<typeof steStep>
+export type RefStepper = InstanceType<typeof steStepper>
+export type RefSteps = InstanceType<typeof steSteps>
+export type RefSticky = InstanceType<typeof steSticky>
+export type RefSwipeAction = InstanceType<typeof steSwipeAction>
+export type RefSwipeActionGroup = InstanceType<typeof steSwipeActionGroup>
+export type RefSwiper = InstanceType<typeof steSwiper>
+export type RefSwiperItem = InstanceType<typeof steSwiperItem>
+export type RefSwitch = InstanceType<typeof steSwitch>
+export type RefTab = InstanceType<typeof steTab>
+export type RefTable = InstanceType<typeof steTable>
+export type RefTableColumn = InstanceType<typeof steTableColumn>
+export type RefTabs = InstanceType<typeof steTabs>
+export type RefText = InstanceType<typeof steText>
+export type RefToast = InstanceType<typeof steToast>
+export type RefTouchSwipe = InstanceType<typeof steTouchSwipe>
+export type RefTouchSwipeItem = InstanceType<typeof steTouchSwipeItem>
+export type RefTour = InstanceType<typeof steTour>
+export type RefTree = InstanceType<typeof steTree>
+export type RefUpload = InstanceType<typeof steUpload>
+export type RefVideo = InstanceType<typeof steVideo>

package/utils/Color.ts

@@ -0,0 +1,66 @@
+const rgbReg = /^rgb\(\s?(\d{1,3})\s?\,\s?(\d{1,3})\s?\,\s?(\d{1,3})\s?\)/
+const rgbaReg = /^rgba\(\s?(\d{1,3}\s?\,\s?\d{1,3}\s?\,\s?\d{1,3})\s?\,\s?([\d\.]+)\s?\)/
+const hexReg = /^\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/
+const hexaReg = /^\#([0-9a-fA-F]{4}|[0-9a-fA-F]{8})$/
+
+class Color {
+  static hex2rgba(hex: string, a = 1) {
+    const str = hex.toLowerCase()
+    const result = []
+    let sColor = str.replace(hexReg, '$1')
+    if (sColor.length === 3)
+      sColor = sColor.split('').map(s => s + s).join('')
+
+    for (let i = 0; i < 6; i += 2)
+      result.push(Number.parseInt(sColor.slice(i, i + 2), 16))
+
+    return `rgba(${result.join(',')},${a})`
+  }
+
+  static hexa2rgba(hexa: string, a: number) {
+    const str = hexa.toLowerCase()
+    const result = []
+
+    let sColor = str.replace(hexaReg, '$1')
+    if (sColor.length === 4)
+      sColor = sColor.split('').map(s => s + s).join('')
+
+    for (let i = 0; i < 6; i += 2)
+      result.push(Number.parseInt(sColor.slice(i, i + 2), 16))
+
+    const _a = a || Number(Number.parseInt(sColor.slice(6, 8), 16) / 255).toFixed(2)
+    return `rgba(${result.join(',')},${_a})`
+  }
+
+  static rgb2rgba(rgb: string, a = 1) {
+    const result = []
+    for (let i = 1; i <= 3; i++)
+      result.push(rgb.replace(rgbReg, `$${i}`))
+
+    return `rgba(${result.join(',')},${a})`
+  }
+
+  static setRgbaDiaphaneity(rgba: string, a: number) {
+    const _rgb = rgba.replace(rgbaReg, '$1')
+    const _a = a || rgba.replace(rgbaReg, '$2')
+    return `rgba(${_rgb},${_a})`
+  }
+
+  static formatColor(color: string, a: number) {
+    if (hexReg.test(color))
+      return Color.hex2rgba(color, a)
+
+    if (hexaReg.test(color))
+      return Color.hexa2rgba(color, a)
+
+    if (rgbReg.test(color))
+      return Color.rgb2rgba(color, a)
+
+    if (rgbaReg.test(color) && a)
+      return Color.setRgbaDiaphaneity(color, a)
+
+    return color
+  }
+}
+
+export default Color

package/utils/System.ts

@@ -0,0 +1,114 @@
+export default class System {
+  /**
+   * 获取设备设置
+   */
+  static getSystemSetting() {
+    // #ifdef MP-WEIXIN
+    return wx.getSystemSetting()
+    // #endif
+
+    // #ifndef MP-WEIXIN
+    return uni.getSystemInfoSync()
+    // #endif
+  }
+
+  /**
+   * 获取微信APP授权设置
+   */
+  static getAppAuthorizeSetting() {
+    // #ifdef MP-WEIXIN
+    return wx.getAppAuthorizeSetting()
+    // #endif
+
+    // #ifndef MP-WEIXIN
+    return uni.getSystemInfoSync()
+    // #endif
+  }
+
+  /**
+   * 获取设备基础信息
+   */
+  static getDeviceInfo() {
+    // #ifdef MP-WEIXIN
+    return wx.getDeviceInfo()
+    // #endif
+
+    // #ifndef MP-WEIXIN
+    return uni.getSystemInfoSync()
+    // #endif
+  }
+
+  /**
+   * 获取窗口信息
+   */
+  static getWindowInfo() {
+    // #ifdef MP-WEIXIN
+    const res: any = wx.getWindowInfo()
+    res.safeAreaInsets = {
+      bottom: res.screenHeight - res.safeArea.bottom,
+    }
+    return wx.getWindowInfo()
+    // #endif
+
+    // #ifndef MP-WEIXIN
+    return uni.getSystemInfoSync()
+    // #endif
+  }
+
+  /**
+   * 获取微信APP基础信息
+   */
+  static getAppBaseInfo() {
+    // #ifdef MP-WEIXIN
+    return wx.getAppBaseInfo()
+    // #endif
+
+    // #ifndef MP-WEIXIN
+    return uni.getSystemInfoSync()
+    // #endif
+  }
+
+  /**
+   * 获取屏幕宽度
+   */
+  static getWindowWidth() {
+    return System.getWindowInfo().windowWidth
+  }
+
+  /**
+   * 获取屏幕高度
+   */
+  static getWindowHeight() {
+    return System.getWindowInfo().windowHeight
+  }
+
+  /**
+   * 获取手机顶部安全区域距离顶部的距离（状态栏高度）
+   */
+  static getStatusBarHeight() {
+    return System.getWindowInfo().statusBarHeight
+  }
+
+  /**
+   * 获取导航栏底部安全区域距离底部的距离（底部安全区距离状态栏的距离）
+   */
+  static getNavbarBottom() {
+    // #ifdef H5 || APP
+    return 44
+    // #endif
+    const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
+    return menuButtonInfo.bottom + 8
+  }
+
+  static getElementBoundary(el: UniApp.NodeInfo) {
+    const vw = System.getWindowWidth() // 计算vw单位
+    const vh = System.getWindowHeight() // 计算vh单位
+    const { top = 0, left = 0, bottom = 0, right = 0 } = el
+    return {
+      top,
+      left,
+      bottom: vh - bottom,
+      right: vw - right,
+    }
+  }
+}

package/utils/mixin.ts

@@ -0,0 +1,122 @@
+import { computed, getCurrentInstance, inject, markRaw, onUnmounted, provide, ref, shallowReactive } from 'vue'
+import type { ComponentInternalInstance, ConcreteComponent, InjectionKey, VNode, VNodeNormalizedChildren } from 'vue'
+import type { Obj } from '../types'
+
+export interface SelfComponentInternalInstance extends ComponentInternalInstance {
+  selfValue?: Obj
+}
+
+type ParentProvide<T> = T & {
+  add(child: SelfComponentInternalInstance): void
+  remove(child: SelfComponentInternalInstance): void
+  internalChildren: SelfComponentInternalInstance[]
+}
+
+export function useInject<T>(key: InjectionKey<ParentProvide<T>>, selfValue: Obj = {}) {
+  const parent = inject(key, null)
+  if (parent) {
+    const instance: SelfComponentInternalInstance = getCurrentInstance()!
+    const { add, remove, internalChildren } = parent
+
+    if (instance)
+      instance.selfValue = selfValue
+
+    add(instance)
+    onUnmounted(() => remove(instance))
+
+    const index = computed(() => internalChildren.indexOf(instance))
+
+    return {
+      parent,
+      index,
+      instance,
+    }
+  }
+
+  return {
+    parent: null,
+    index: ref(-1),
+    instance: null,
+  }
+}
+
+// TODO: uniapp 不支持 vue 直接导出的 isVNode
+export function isVNode(value: any): value is VNode {
+  return value ? value.__v_isVNode === true : false
+}
+
+export function flattenVNodes(shouldTraverseChildren: VNodeNormalizedChildren, childName?: string) {
+  const result: VNode[] = []
+
+  const traverse = (children: VNodeNormalizedChildren) => {
+    if (!Array.isArray(children))
+      return
+    children.forEach((child) => {
+      if (!isVNode(child))
+        return
+
+      if (childName) {
+        if (child.type && (child.type as ConcreteComponent).name === childName) {
+          result.push(child)
+          return
+        }
+      }
+      else {
+        result.push(child)
+      }
+
+      if (child.component?.subTree)
+        traverse(child.component.subTree.children)
+
+      if (child.children)
+        traverse(child.children)
+    })
+  }
+
+  traverse(shouldTraverseChildren)
+
+  return result
+}
+
+export function sortChildren(parent: SelfComponentInternalInstance, internalChildren: SelfComponentInternalInstance[], childName?: string) {
+  const vnodes = flattenVNodes(parent && parent.subTree && parent.subTree.children, childName)
+  internalChildren.sort((a, b) => {
+    return vnodes.indexOf(a.vnode) - vnodes.indexOf(b.vnode)
+  })
+}
+
+// 如果指定组件名称，则只查找此组件并且查到后结束。也就是不关心此组件下的内容，在大部分场景下节省查找消耗。
+export function useProvide<ProvideValue>(key: InjectionKey<ProvideValue>, childName?: string) {
+  const internalChildren: SelfComponentInternalInstance[] = shallowReactive([])
+  const publicChildren = shallowReactive<any[]>([])
+  const parent = getCurrentInstance()!
+
+  const add = (child: SelfComponentInternalInstance) => {
+    if (!child.proxy)
+      return
+    internalChildren.push(markRaw(child))
+    publicChildren.push(markRaw(child.proxy))
+    sortChildren(parent, internalChildren, childName)
+  }
+
+  const remove = (child: SelfComponentInternalInstance) => {
+    if (child.proxy) {
+      internalChildren.splice(internalChildren.indexOf(markRaw(child)), 1)
+      publicChildren.splice(publicChildren.indexOf(markRaw(child.proxy)), 1)
+    }
+  }
+
+  return (value?: ProvideValue) => {
+    provide(key, {
+      add,
+      remove,
+      internalChildren,
+      ...value,
+    } as any)
+
+    return {
+      internalChildren,
+      children: publicChildren,
+    }
+  }
+}