@extclp/vexip-ui/es/components/virtual-list/virtual-list.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"virtual-list.mjs","sources":["../../../components/virtual-list/virtual-list.tsx"],"sourcesContent":["import { NativeScroll } from '@/components/native-scroll'\r\nimport { ResizeObserver } from '@/components/resize-observer'\r\n\r\nimport { computed, defineComponent, nextTick, ref, renderSlot, toRefs, watch } from 'vue'\r\n\r\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\r\nimport { createSlotRender, useVirtual } from '@vexip-ui/hooks'\r\nimport { virtualListProps } from './props'\r\n\r\nimport type { NativeScrollExposed } from '@/components/native-scroll'\r\nimport type { ScrollPayload } from './symbol'\r\n\r\nexport default defineComponent({\r\n  name: 'VirtualList',\r\n  components: {\r\n    NativeScroll,\r\n    ResizeObserver,\r\n  },\r\n  inheritAttrs: false,\r\n  props: virtualListProps,\r\n  emits: [],\r\n  setup(_props, { slots, attrs, expose }) {\r\n    const props = useProps('virtualList', _props, {\r\n      items: {\r\n        default: () => [],\r\n        static: true,\r\n      },\r\n      itemSize: 36,\r\n      itemFixed: false,\r\n      idKey: 'id',\r\n      defaultKeyAt: null,\r\n      bufferSize: 5,\r\n      listTag: 'div',\r\n      itemsTag: 'ul',\r\n      itemsAttrs: null,\r\n      hideBar: false,\r\n      lockItems: false,\r\n      autoplay: false,\r\n      ignoreResize: false,\r\n      disabled: false,\r\n    })\r\n\r\n    const nh = useNameHelper('virtual-list')\r\n\r\n    const { items, itemSize, itemFixed, idKey, bufferSize } = toRefs(props)\r\n\r\n    const scroll = ref<NativeScrollExposed>()\r\n    const list = ref<HTMLElement>()\r\n    const wrapper = computed(() => scroll.value?.content)\r\n\r\n    const {\r\n      indexMap,\r\n      heightTree,\r\n      scrollOffset,\r\n      visibleItems,\r\n      listStyle,\r\n      itemsStyle,\r\n      handleScroll,\r\n      handleResize,\r\n      handleItemResize,\r\n      scrollTo,\r\n      scrollBy,\r\n      scrollToKey,\r\n      scrollToIndex,\r\n      ensureIndexInView,\r\n      ensureKeyInView,\r\n    } = useVirtual({\r\n      items,\r\n      itemSize,\r\n      itemFixed,\r\n      idKey,\r\n      bufferSize,\r\n      wrapper,\r\n      defaultKeyAt: props.defaultKeyAt,\r\n      autoResize: false,\r\n    })\r\n\r\n    expose({\r\n      scroll,\r\n      wrapper,\r\n      list,\r\n      indexMap,\r\n      heightTree,\r\n      scrollOffset,\r\n      scrollTo,\r\n      scrollBy,\r\n      scrollToKey,\r\n      scrollToIndex,\r\n      ensureIndexInView,\r\n      ensureKeyInView,\r\n      refresh,\r\n    })\r\n\r\n    watch(\r\n      () => props.items.length,\r\n      () => {\r\n        nextTick(refresh)\r\n      },\r\n    )\r\n\r\n    const className = computed(() => {\r\n      return [\r\n        nh.b(),\r\n        props.inherit && nh.bm('inherit'),\r\n        props.disabled && nh.bm('disabled'),\r\n        attrs.class,\r\n      ]\r\n    })\r\n\r\n    function onScroll(payload: ScrollPayload) {\r\n      handleScroll()\r\n      emitEvent(props.onScroll, payload)\r\n    }\r\n\r\n    function onResize(entry: ResizeObserverEntry) {\r\n      if (props.ignoreResize) return\r\n\r\n      handleResize(entry)\r\n      emitEvent(props.onResize, entry)\r\n    }\r\n\r\n    function onItemResize(key: number | string | symbol, entry: ResizeObserverEntry) {\r\n      if (!props.lockItems && !props.ignoreResize) {\r\n        handleItemResize(key, entry)\r\n      }\r\n    }\r\n\r\n    async function refresh() {\r\n      await scroll.value?.refresh()\r\n      handleScroll()\r\n    }\r\n\r\n    function renderList(items: Record<string, any>[]) {\r\n      const keyField = props.idKey\r\n      const itemFixed = props.itemFixed\r\n      const keyIndexMap = indexMap.value\r\n      const { class: itemsClass, style: itemsOtherStyle, ...itemsAttrs } = props.itemsAttrs || {}\r\n\r\n      const ListTag = (props.listTag || 'div') as any\r\n      const ItemsTag = (props.itemsTag || 'ul') as any\r\n\r\n      return (\r\n        <ResizeObserver onResize={refresh}>\r\n          <ListTag ref={list} class={nh.be('list')} style={listStyle.value}>\r\n            <ItemsTag\r\n              {...itemsAttrs}\r\n              class={[nh.be('items'), itemsClass]}\r\n              style={[itemsStyle.value, itemsOtherStyle]}\r\n            >\r\n              {slots.default && props.items.length\r\n                ? items.map(item => {\r\n                  const key = item[keyField]\r\n                  const index = keyIndexMap.get(key)\r\n                  const vnode = renderSlot(slots, 'default', { item, index })\r\n\r\n                  if (itemFixed) {\r\n                    vnode.key = key\r\n\r\n                    return vnode\r\n                  }\r\n\r\n                  const onResize = onItemResize.bind(null, key)\r\n\r\n                  return (\r\n                    <ResizeObserver key={key} onResize={onResize}>\r\n                      {() => vnode}\r\n                    </ResizeObserver>\r\n                  )\r\n                })\r\n                : renderSlot(slots, 'empty')}\r\n            </ItemsTag>\r\n          </ListTag>\r\n        </ResizeObserver>\r\n      )\r\n    }\r\n\r\n    return () => {\r\n      let renderingItems = visibleItems.value\r\n\r\n      if (import.meta.env.MODE === 'test') {\r\n        // It is difficult to test ResizeObserver in vitest, so directly rendering all items\r\n        renderingItems = props.items\r\n      }\r\n\r\n      return (\r\n        <NativeScroll\r\n          {...attrs}\r\n          ref={scroll}\r\n          class={className.value}\r\n          inherit={props.inherit}\r\n          use-y-bar={!props.hideBar}\r\n          scroll-y={scrollOffset.value}\r\n          autoplay={props.autoplay}\r\n          onScroll={onScroll}\r\n          onResize={onResize}\r\n        >\r\n          {{\r\n            default: () => {\r\n              if (props.disabled) {\r\n                return slots.default && props.items.length\r\n                  ? props.items.map((item, index) => {\r\n                    const key = item[props.idKey]\r\n                    const vnode = renderSlot(slots, 'default', { item, index })\r\n\r\n                    vnode.key = key\r\n\r\n                    return vnode\r\n                  })\r\n                  : renderSlot(slots, 'empty')\r\n              }\r\n\r\n              return renderList(renderingItems)\r\n            },\r\n            prefixTrap: createSlotRender(slots, ['prefix-trap', 'prefixTrap']),\r\n            suffixTrap: createSlotRender(slots, ['suffix-trap', 'suffixTrap']),\r\n          }}\r\n        </NativeScroll>\r\n      )\r\n    }\r\n  },\r\n})\r\n"],"names":["defineComponent","name","components","NativeScroll","ResizeObserver","inheritAttrs","props","virtualListProps","emits","setup","_props","slots","attrs","expose","useProps","items","default","static","itemSize","itemFixed","idKey","defaultKeyAt","bufferSize","listTag","itemsTag","itemsAttrs","hideBar","lockItems","autoplay","ignoreResize","disabled","nh","useNameHelper","toRefs","scroll","ref","list","wrapper","computed","value","content","indexMap","heightTree","scrollOffset","visibleItems","listStyle","itemsStyle","handleScroll","handleResize","handleItemResize","scrollTo","scrollBy","scrollToKey","scrollToIndex","ensureIndexInView","ensureKeyInView","useVirtual","autoResize","refresh","watch","length","nextTick","className","b","inherit","bm","class","onScroll","payload","onResize","entry","onItemResize","key","renderList","keyField","keyIndexMap","itemsClass","style","itemsOtherStyle","ListTag","ItemsTag","_createVNode","be","_mergeProps","map","item","index","get","vnode","renderSlot","bind","renderingItems","prefixTrap","createSlotRender","suffixTrap"],"mappings":"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"}