oxy-uni-ui 1.0.1 → 1.2.0

package/components/oxy-upload/index.scss

@@ -46,6 +46,10 @@
     }
   }
 
+  @include e(evoke-file) {
+    border-radius: 8px;
+  }
+
   @include e(evoke-num) {
     font-size: 14px;
     line-height: 14px;
@@ -172,4 +176,50 @@
     width: 100%;
     height: 100%;
   }
+
+  @include e(preview-file) {
+    margin-bottom: 32px;
+    .oxy-upload__status-content:not(.oxy-upload__mask) {
+      border: 1px solid $-color-border;
+      box-sizing: border-box;
+      border-radius: 8px;
+      .oxy-upload__picture {
+        border-radius: 8px;
+      }
+      .oxy-upload__picture-icon {
+        width: 32px;
+        height: 32px;
+      }
+    }
+    .oxy-upload__mask {
+      border-radius: 8px;
+    }
+    :deep(.oxy-tooltip) {
+      width: 100%;
+      .oxy-tooltip__inner {
+        width: fit-content;
+        white-space: pre-wrap;
+        word-break: break-all;
+      }
+    }
+    .oxy-upload____status-content-name {
+      display: block;
+      width: 100%;
+      font-size: $-upload-file-fs;
+      color: $-upload-file-color;
+      box-sizing: border-box;
+      padding: 0 4px;
+      text-align: center;
+      margin-top: 8px;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+
+  &.oxy-upload__position-right {
+    .oxy-upload__evoke {
+      margin-right: 12px;
+    }
+  }
 }

package/components/oxy-upload/oxy-upload.vue

@@ -1,9 +1,33 @@
 <template>
-  <view :class="['oxy-upload', customClass]" :style="customStyle">
+  <view :class="['oxy-upload', { 'oxy-upload__position-right': props.listPosition === 'right' }, customClass]" :style="customStyle">
+    <block v-if="showUpload && props.listPosition === 'right'">
+      <view :class="['oxy-upload__evoke-slot', customEvokeClass]" v-if="$slots.default" @click="onEvokeClick">
+        <slot></slot>
+      </view>
+      <!-- 唤起项 -->
+      <view v-else @click="onEvokeClick" :class="['oxy-upload__evoke', disabled ? 'is-disabled' : '', customEvokeClass]">
+        <!-- 唤起项图标 -->
+        <oxy-icon
+          class="oxy-upload__evoke-icon"
+          :name="props.evokeIcon ? props.evokeIcon : props.listType === 'card' ? 'add' : 'fill-camera'"
+        ></oxy-icon>
+        <!-- 有限制个数时确认是否展示限制个数 -->
+        <view v-if="limit && showLimitNum" class="oxy-upload__evoke-num">（{{ uploadFiles.length }}/{{ limit }}）</view>
+      </view>
+    </block>
+
     <!-- 预览列表 -->
-    <view :class="['oxy-upload__preview', customPreviewClass]" v-for="(file, index) in uploadFiles" :key="index">
+    <view
+      :class="['oxy-upload__preview', { 'oxy-upload__preview-file': props.listType === 'card' }, customPreviewClass]"
+      v-for="(file, index) in uploadFiles"
+      :key="index"
+    >
       <!-- 成功时展示图片 -->
-      <view class="oxy-upload__status-content">
+      <view v-if="props.listType === 'card'" class="oxy-upload__status-content">
+        <image v-if="isImage(file)" :src="file.url" :mode="imageMode" class="oxy-upload__picture" @click="onPreviewImage(file)" />
+        <image v-else :src="getUploadImage(file)" :mode="imageMode" class="oxy-upload__picture-icon" @click="onPreview(file)" />
+      </view>
+      <view v-else class="oxy-upload__status-content">
         <image v-if="isImage(file)" :src="file.url" :mode="imageMode" class="oxy-upload__picture" @click="onPreviewImage(file)" />
         <template v-else-if="isVideo(file)">
           <view class="oxy-upload__video" v-if="file.thumb" @click="onPreviewVideo(file)">
@@ -66,16 +90,26 @@
       ></oxy-icon>
       <!-- 自定义预览样式 -->
       <slot name="preview-cover" v-if="$slots['preview-cover']" :file="file" :index="index"></slot>
+      <oxy-tooltip v-if="props.listType === 'card'" placement="top" :content="file.name">
+        <text class="oxy-upload____status-content-name">{{ file.name }}</text>
+      </oxy-tooltip>
     </view>
 
-    <block v-if="showUpload">
+    <block v-if="showUpload && props.listPosition === 'left'">
       <view :class="['oxy-upload__evoke-slot', customEvokeClass]" v-if="$slots.default" @click="onEvokeClick">
         <slot></slot>
       </view>
       <!-- 唤起项 -->
-      <view v-else @click="onEvokeClick" :class="['oxy-upload__evoke', disabled ? 'is-disabled' : '', customEvokeClass]">
+      <view
+        v-else
+        @click="onEvokeClick"
+        :class="['oxy-upload__evoke', { 'oxy-upload__evoke-file': props.listType === 'card' }, disabled ? 'is-disabled' : '', customEvokeClass]"
+      >
         <!-- 唤起项图标 -->
-        <oxy-icon class="oxy-upload__evoke-icon" name="fill-camera"></oxy-icon>
+        <oxy-icon
+          class="oxy-upload__evoke-icon"
+          :name="props.evokeIcon ? props.evokeIcon : props.listType === 'card' ? 'add' : 'fill-camera'"
+        ></oxy-icon>
         <!-- 有限制个数时确认是否展示限制个数 -->
         <view v-if="limit && showLimitNum" class="oxy-upload__evoke-num">（{{ uploadFiles.length }}/{{ limit }}）</view>
       </view>
@@ -96,12 +130,19 @@ export default {
 </script>
 
 <script lang="ts" setup>
+import ImgPdf from './images/pdf.png'
+import ImgWord from './images/word.png'
+import ImgAudio from './images/audio.png'
+import ImgVideo from './images/video.png'
+import ImgPic from './images/pic.png'
+import ImgOther from './images/other.png'
 import OxyIcon from '../oxy-icon/oxy-icon.vue'
 import OxyVideoPreview from '../oxy-video-preview/oxy-video-preview.vue'
 import OxyLoading from '../oxy-loading/oxy-loading.vue'
+import OxyTooltip from '../oxy-tooltip/oxy-tooltip.vue'
 
 import { computed, ref, watch } from 'vue'
-import { context, isEqual, isImageUrl, isVideoUrl, isFunction, isDef, deepClone } from '../common/util'
+import { context, isEqual, isImageUrl, isVideoUrl, isAudioUrl, isPdfUrl, isDocUrl, isFunction, isDef, deepClone } from '../common/util'
 import { useTranslate } from '../composables/useTranslate'
 import { useUpload } from '../composables/useUpload'
 import {
@@ -119,6 +160,15 @@ import {
 } from './types'
 import type { VideoPreviewInstance } from '../oxy-video-preview/types'
 
+const imgs: AnyObject = {
+  pdf: ImgPdf,
+  word: ImgWord,
+  audio: ImgAudio,
+  video: ImgVideo,
+  pic: ImgPic,
+  other: ImgOther
+}
+
 const props = defineProps(uploadProps)
 
 const emit = defineEmits<{
@@ -660,6 +710,14 @@ function onPreviewFile(file: UploadFileItem) {
   }
 }
 
+function onPreview(file: UploadFileItem) {
+  if (isVideo(file)) {
+    onPreviewVideo(file)
+  } else {
+    onPreviewFile(file)
+  }
+}
+
 function isVideo(file: UploadFileItem) {
   return (file.name && isVideoUrl(file.name)) || isVideoUrl(file.url)
 }
@@ -667,6 +725,34 @@ function isVideo(file: UploadFileItem) {
 function isImage(file: UploadFileItem) {
   return (file.name && isImageUrl(file.name)) || isImageUrl(file.url)
 }
+
+function isAudio(file: UploadFileItem) {
+  return (file.name && isAudioUrl(file.name)) || isAudioUrl(file.url)
+}
+
+function isPdf(file: UploadFileItem) {
+  return (file.name && isPdfUrl(file.name)) || isPdfUrl(file.url)
+}
+
+function isDoc(file: UploadFileItem) {
+  return (file.name && isDocUrl(file.name)) || isDocUrl(file.url)
+}
+
+function getUploadImage(file: UploadFileItem) {
+  if (isPdf(file)) {
+    return imgs.pdf
+  } else if (isDoc(file)) {
+    return imgs.word
+  } else if (isAudio(file)) {
+    return imgs.audio
+  } else if (isVideo(file)) {
+    return imgs.video
+  } else if (isImage(file)) {
+    return imgs.pic
+  } else {
+    return imgs.other
+  }
+}
 </script>
 <style lang="scss" scoped>
 @import './index.scss';

package/components/oxy-upload/types.ts

@@ -68,6 +68,8 @@ export type UploadSizeType = 'original' | 'compressed'
 export type UploadFileType = 'image' | 'video' | 'media' | 'all' | 'file'
 export type UploadCameraType = 'front' | 'back'
 export type UploadStatusType = 'pending' | 'loading' | 'success' | 'fail'
+export type UploadListType = 'default' | 'card'
+export type UploadListPosition = 'left' | 'right'
 
 export type UploadBeforePreviewOption = {
   file: UploadFileItem
@@ -342,7 +344,26 @@ export const uploadProps = {
    * H5支持全部类型过滤。
    * 微信小程序支持all和file时过滤,其余平台不支持。
    */
-  extension: Array as PropType<string[]>
+  extension: Array as PropType<string[]>,
+  /**
+   * 唤起图标
+   * 类型：string
+   * 可选值：'fill-camera' / 'add'
+   * 默认值：fill-camera
+   */
+  evokeIcon: makeStringProp(''),
+  /**
+   * 文件列表的类型
+   * 类型：string
+   */
+  listType: makeStringProp<UploadListType>('default'),
+  /**
+   * 文件列表的位置
+   * 类型：string
+   * 可选值：'left' / 'right'
+   * 默认值：left
+   */
+  listPosition: makeStringProp<UploadListPosition>('left')
 }
 
 export type UploadProps = ExtractPropTypes<typeof uploadProps>

package/components/oxy-virtual-scroll/index.scss

@@ -0,0 +1,35 @@
+@import './../common/abstracts/_mixin.scss';
+@import './../common/abstracts/variable.scss';
+@include b(virtual-scroll) {
+  position: relative;
+  width: 100%;
+  height: 100%;
+
+  @include e(view) {
+    width: 100%;
+  }
+  @include e(container) {
+    position: relative;
+    .oxy-virtual-scroll__items {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+    }
+  }
+
+  @include e(back-top) {
+    position: absolute;
+    right: 20px;
+    bottom: 20px;
+    width: 40px;
+    height: 40px;
+    background: rgba(0, 0, 0, 0.6);
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    z-index: 100;
+  }
+}

package/components/oxy-virtual-scroll/oxy-virtual-scroll.vue

@@ -0,0 +1,143 @@
+<template>
+  <view :class="['oxy-virtual-scroll', customClass]" :style="customStyle">
+    <!-- 滚动内容区域 -->
+    <scroll-view
+      v-if="data.length"
+      :style="{ height: height }"
+      class="oxy-virtual-scroll__view"
+      :scroll-y="scrollY"
+      :scroll-x="scrollX"
+      :upper-threshold="upperThreshold"
+      :lower-threshold="lowerThreshold"
+      :scroll-top="scrollTop"
+      :scroll-left="scrollLeft"
+      :scroll-with-animation="scrollWithAnimation"
+      :enable-back-to-top="enableBackToTop"
+      :show-scrollbar="showScrollbar"
+      :refresher-enabled="refresherEnabled"
+      :refresher-threshold="refresherThreshold"
+      :refresher-default-style="refresherDefaultStyle"
+      :refresher-background="refresherBackground"
+      :refresher-triggered="triggered"
+      :enable-flex="enableFlex"
+      :scroll-anchoring="scrollAnchoring"
+      @scroll="onScroll"
+      @scrolltoupper="onScrollUpper"
+      @scrolltolower="onScrollLower"
+    >
+      <view class="oxy-virtual-scroll__container" :style="{ height: totalHeight + 'px' }">
+        <view class="oxy-virtual-scroll__items" :style="{ transform: `translateY(${virtualOffsetY}px)` }">
+          <view v-for="(item, index) in virtualData" :key="index">
+            <slot name="item" :item="item" :index="startIndex + index"></slot>
+          </view>
+          <slot name="bottom"></slot>
+        </view>
+      </view>
+    </scroll-view>
+
+    <view v-else>
+      <oxy-status-tip image="content" :tip="emptyText" />
+    </view>
+
+    <!-- 回到顶部按钮 -->
+    <view v-if="showBackToTop && showBackTopBtn" class="oxy-virtual-scroll__back-top" @click="scrollToTop">
+      <oxy-icon name="backtop" color="#fff" size="20px"></oxy-icon>
+    </view>
+  </view>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'oxy-virtual-scroll',
+  options: {
+    addGlobalClass: true,
+    virtualHost: true,
+    styleIsolation: 'shared'
+  }
+}
+</script>
+
+<script lang="ts" setup>
+import { toRefs } from 'vue'
+import type { ScrollViewOnScrollEvent, ScrollViewOnScrolltolowerEvent, ScrollViewOnScrolltoupperEvent } from '@uni-helper/uni-app-types'
+import { virtualScrollProps, type VirtualScrollExpose } from './types'
+import { useVirtualScroll } from '../composables/useVirtualScroll'
+
+const props = defineProps(virtualScrollProps)
+const emit = defineEmits(['scroll', 'scroll-to-upper', 'scroll-to-lower'])
+
+// 解构props用于组合式函数
+const { data, virtual, height, itemHeight, idKey, showBackToTop, backToTopThreshold } = toRefs(props)
+
+// 使用虚拟滚动组合式函数
+const {
+  scrollTop,
+  showBackTopBtn,
+  virtualData,
+  startIndex,
+  virtualOffsetY,
+  totalHeight,
+  displayData,
+  initScrollData,
+  initScrollEngine,
+  updateVisibleData,
+  scrollToTop: virtualScrollToTop,
+  scrollToBottom: virtualScrollToBottom,
+  scrollToPosition: virtualScrollToPosition,
+  scrollToElement: virtualScrollToElement,
+  scrollToElementById: virtualScrollToElementById,
+  onScroll: handleVirtualScroll
+} = useVirtualScroll({
+  data,
+  virtual,
+  height,
+  itemHeight,
+  idKey,
+  backToTopThreshold
+})
+
+// 滚动事件
+function onScroll(event: ScrollViewOnScrollEvent) {
+  handleVirtualScroll(event.detail.scrollTop)
+  emit('scroll', event)
+}
+
+// 滚动到顶部
+function onScrollUpper(event: ScrollViewOnScrolltoupperEvent) {
+  emit('scroll-to-upper', event)
+}
+
+// 滚动到底部
+function onScrollLower(event: ScrollViewOnScrolltolowerEvent) {
+  emit('scroll-to-lower', event)
+}
+
+// 滚动方法
+const scrollToTop = () => {
+  virtualScrollToTop()
+}
+const scrollToBottom = () => {
+  virtualScrollToBottom()
+}
+const scrollToPosition = (position: number | string) => {
+  virtualScrollToPosition(position)
+}
+const scrollToElement = (item: any) => {
+  virtualScrollToElement(item)
+}
+const scrollToElementById = (id: string | number) => {
+  virtualScrollToElementById(id)
+}
+
+defineExpose<VirtualScrollExpose>({
+  scrollToTop,
+  scrollToBottom,
+  scrollToPosition,
+  scrollToElement,
+  scrollToElementById
+})
+</script>
+
+<style lang="scss" scoped>
+@import './index.scss';
+</style>

package/components/oxy-virtual-scroll/types.ts

@@ -0,0 +1,155 @@
+import type { ComponentPublicInstance, ExtractPropTypes, PropType } from 'vue'
+import { baseProps, makeRequiredProp, makeBooleanProp, makeStringProp, makeNumericProp, makeNumberProp } from '../common/props'
+
+export const virtualScrollProps = {
+  ...baseProps,
+  /**
+   * 虚拟列表数据源
+   * 类型：array
+   * 默认值：[]
+   */
+  data: makeRequiredProp(Array as PropType<any[]>),
+  /**
+   * id的取值字段
+   * 类型：string
+   * 默认值：'id'
+   */
+  idKey: makeStringProp('id'),
+
+  /**
+   * 容器高度
+   * 类型：string
+   * 默认值：'100%'
+   */
+  height: makeStringProp('100%'),
+  /**
+   * 是否显示回到顶部按钮
+   * 类型：boolean
+   * 默认值：false
+   */
+  showBackToTop: makeBooleanProp(false),
+  /**
+   * 滚动多远显示backToTop
+   * 类型：number
+   * 默认值：'300px'
+   */
+  backToTopThreshold: makeStringProp('300px'),
+  /**
+   * 单个项目高度
+   * 类型：number
+   * 默认值：'44px'
+   */
+  itemHeight: makeStringProp('44px'),
+  /**
+   * 是否开启水平滚动
+   * 类型：boolean
+   * 默认值：false
+   */
+  scrollX: makeBooleanProp(false),
+  /**
+   * 是否开启纵向滚动
+   * 类型：boolean
+   * 默认值：true
+   */
+  scrollY: makeBooleanProp(true),
+  /**
+   * 距顶部/左边多远时（单位px），触发 scrolltoupper 事件
+   * 类型：number | string
+   * 默认值：50
+   */
+  upperThreshold: makeNumericProp(50),
+  /**
+   * 距底部/右边多远时（单位px），触发 scrolltolower 事件
+   * 类型：number | string
+   * 默认值：50
+   */
+  lowerThreshold: makeNumericProp(50),
+  /**
+   * 设置横向滚动条位置
+   * 类型：number | string
+   * 默认值：0
+   */
+  scrollLeft: makeNumericProp(0),
+  /**
+   * 是否在设置滚动条位置时使用滚动动画
+   * 类型：boolean
+   * 默认值：false
+   */
+  scrollWithAnimation: makeBooleanProp(false),
+  /**
+   * iOS/Android 返回顶部功能，竖向有效
+   * 类型：boolean
+   * 默认值：false
+   */
+  enableBackToTop: makeBooleanProp(false),
+  /**
+   * 控制是否出现滚动条（App-nvue 有效）
+   * 类型：boolean
+   * 默认值：true
+   */
+  showScrollbar: makeBooleanProp(true),
+  /**
+   * 开启自定义下拉刷新
+   * 类型：boolean
+   * 默认值：false
+   */
+  refresherEnabled: makeBooleanProp(false),
+  /**
+   * 设置自定义下拉刷新阈值
+   * 类型：number
+   * 默认值：45
+   */
+  refresherThreshold: makeNumberProp(45),
+  /**
+   * 设置自定义下拉刷新默认样式
+   * 类型：'black' | 'white' | 'none'
+   * 默认值：'black'
+   */
+  refresherDefaultStyle: makeStringProp<'black' | 'white' | 'none'>('black'),
+  /**
+   * 设置自定义下拉刷新区域背景颜色
+   * 类型：string
+   * 默认值：'#FFF'
+   */
+  refresherBackground: makeStringProp('#FFF'),
+  /**
+   * 设置当前下拉刷新状态
+   * 类型：boolean
+   * 默认值：false
+   */
+  triggered: makeBooleanProp(false),
+  /**
+   * 启用 flexbox 布局
+   * 类型：boolean
+   * 默认值：false
+   */
+  enableFlex: makeBooleanProp(false),
+  /**
+   * 开启 scroll anchoring 特性
+   * 类型：boolean
+   * 默认值：false
+   */
+  scrollAnchoring: makeBooleanProp(false),
+  /**
+   * 暂无数据时的提示问题
+   * 类型：string
+   * 默认值：'暂无数据'
+   */
+  emptyText: makeStringProp('暂无数据'),
+  /**
+   * 是否开启虚拟滚动
+   * 类型：boolean
+   * 默认值：true
+   */
+  virtual: makeBooleanProp(true)
+}
+
+export type VirtualScrollExpose = {
+  scrollToTop: () => void
+  scrollToBottom: () => void
+  scrollToPosition: (position: number | string) => void
+  scrollToElement: (item: any) => void
+  scrollToElementById: (id: string | number) => void
+}
+export type VirtualScrollProps = ExtractPropTypes<typeof virtualScrollProps>
+export type VirtualScrollInstance = ComponentPublicInstance<VirtualScrollProps, VirtualScrollExpose>

package/components/oxy-virtual-scroll/virtual-scroll.ts

@@ -0,0 +1,81 @@
+/**
+ * 虚拟滚动引擎 - 优化长列表性能
+ */
+
+export interface VirtualScrollItem {
+  key?: string
+  items?: VirtualScrollItem[]
+  [key: string]: any
+}
+
+export interface VirtualScrollOptions {
+  containerHeight?: number
+  itemHeight?: number
+  bufferSize?: number
+  data?: VirtualScrollItem[]
+}
+
+export interface VisibleDataResult {
+  visibleData: VirtualScrollItem[]
+  startIndex: number
+  endIndex: number
+  offsetY: number
+}
+
+export class VirtualScrollEngine {
+  containerHeight: number
+  itemHeight: number
+  bufferSize: number
+  data: VirtualScrollItem[]
+  visibleData: VirtualScrollItem[]
+  startIndex: number
+  endIndex: number
+  scrollTop: number
+  cache: Map<string, VisibleDataResult>
+
+  constructor(options: VirtualScrollOptions = {}) {
+    this.containerHeight = options.containerHeight || 400
+    this.itemHeight = options.itemHeight || 50
+    this.bufferSize = options.bufferSize || 5
+    this.data = options.data || []
+
+    this.visibleData = []
+    this.startIndex = 0
+    this.endIndex = 0
+    this.scrollTop = 0
+
+    this.cache = new Map()
+  }
+
+  // 更新可见区域数据
+  updateVisibleData(scrollTop: number): VisibleDataResult {
+    this.scrollTop = scrollTop
+
+    const cacheKey = `${scrollTop}_${this.data.length}`
+    if (this.cache.has(cacheKey)) {
+      return this.cache.get(cacheKey)!
+    }
+
+    const visibleCount = Math.ceil(this.containerHeight / this.itemHeight)
+    this.startIndex = Math.max(0, Math.floor(scrollTop / this.itemHeight) - this.bufferSize)
+    this.endIndex = Math.min(this.data.length - 1, this.startIndex + visibleCount + this.bufferSize * 2)
+
+    this.visibleData = this.data.slice(this.startIndex, this.endIndex + 1)
+
+    const result: VisibleDataResult = {
+      visibleData: this.visibleData,
+      startIndex: this.startIndex,
+      endIndex: this.endIndex,
+      offsetY: this.startIndex * this.itemHeight
+    }
+
+    // 缓存优化
+    if (this.cache.size > 50) {
+      const firstKey = this.cache.keys().next().value as string
+      this.cache.delete(firstKey)
+    }
+    this.cache.set(cacheKey, result)
+
+    return result
+  }
+}

package/global.d.ts

@@ -59,10 +59,12 @@ declare module 'vue' {
     OxyTab: typeof import('./components/oxy-tab/oxy-tab.vue')['default']
     OxyTabs: typeof import('./components/oxy-tabs/oxy-tabs.vue')['default']
     OxyTag: typeof import('./components/oxy-tag/oxy-tag.vue')['default']
+    OxyCorner: typeof import('./components/oxy-corner/oxy-corner.vue')['default']
     OxyToast: typeof import('./components/oxy-toast/oxy-toast.vue')['default']
     OxyTooltip: typeof import('./components/oxy-tooltip/oxy-tooltip.vue')['default']
     OxyTransition: typeof import('./components/oxy-transition/oxy-transition.vue')['default']
     OxyUpload: typeof import('./components/oxy-upload/oxy-upload.vue')['default']
+    OxyFileList: typeof import('./components/oxy-file-list/oxy-file-list.vue')['default']
     OxyNotify: typeof import('./components/oxy-notify/oxy-notify.vue')['default']
     OxyWatermark: typeof import('./components/oxy-watermark/oxy-watermark.vue')['default']
     OxyCircle: typeof import('./components/oxy-circle/oxy-circle.vue')['default']
@@ -75,6 +77,7 @@ declare module 'vue' {
     OxyNavbarCapsule: typeof import('./components/oxy-navbar-capsule/oxy-navbar-capsule.vue')['default']
     OxyTable: typeof import('./components/oxy-table/oxy-table.vue')['default']
     OxyTableCol: typeof import('./components/oxy-table-col/oxy-table-col.vue')['default']
+    OxyVirtualScroll: typeof import('./components/oxy-virtual-scroll/oxy-virtual-scroll.vue')['default']
     OxySidebar: typeof import('./components/oxy-sidebar/oxy-sidebar.vue')['default']
     OxySidebarItem: typeof import('./components/oxy-sidebar-item/oxy-sidebar-item.vue')['default']
     OxyFab: typeof import('./components/oxy-fab/oxy-fab.vue')['default']