$ show x-extends/vxe-table
VxeTable is a Vue 3 component library for building complex, enterprise-grade data tables and grids. It provides a comprehensive set of features including virtual scrolling for millions of rows, inline editing, Excel-style copy-paste, column resizing/dragging, filtering, sorting, pivot tables, tree/gannt views, and export/import/print. The library is architected as a set of Vue components (VxeTable, VxeGrid, VxeColumn, VxeToolbar, VxeColgroup) with an extensible plugin system based on hooks and renderers. It relies on a companion UI library (vxe-pc-ui) for modals, buttons, selects, and other controls, and uses xe-utils for utility functions. The codebase is large and well-organized, with separate modules for editing, filtering, keyboard navigation, validation, column customization, and export. Performance is a key focus, with virtual scrolling implemented for both X and Y axes. The library supports i18n with over 20 languages and includes a comprehensive theming system with light/dark modes. While primarily a UI component library, it also includes proxy-based server-side data operations in the VxeGrid component. The repository includes a demo application (examples/) for testing features, though the main artifact is the published npm package.
The LLM identified 3 files worth highlighting for reuse:
Implements virtual scroll calculations for both X and Y axes, handling scroll position, preload offsets, and load thresholds. The logic is self-contained and could be extracted for use in other virtualized list/grid components. It calculates visible range based on scroll position, container size, and row/column sizes, supporting dynamic sizing and buffer zones. This is a non-trivial algorithm that is reusable beyond VxeTable.
Provides a set of DOM utility functions for class manipulation (addClass, removeClass, hasClass), offset/position calculation (getOffset, getPosition), scroll parent finding, and element placement. These functions are framework-agnostic and could be used as a lightweight DOM utility library in any JavaScript/TypeScript project. The implementation handles edge cases like computed styles and document scoping.
Contains animation utility functions, primarily used for row/column drag-and-drop transitions. Provides a requestAnimationFrame-based animation loop with easing functions and transform updates. The pattern is self-contained and could be reused for smooth animations in drag-and-drop or other UI interactions without additional framework dependencies.