vlist 0.1.3 → 1.5.5

package/dist/utils/stats.d.ts

@@ -0,0 +1,49 @@
+export interface StatsConfig {
+    /** Returns the current scroll position (scrollTop or scrollLeft) */
+    getScrollPosition: () => number;
+    /** Returns the total number of items */
+    getTotal: () => number;
+    /** Returns the item size along the scroll axis (height for vertical, width for horizontal) */
+    getItemSize: () => number;
+    /** Returns the viewport size in px (clientHeight for vertical, clientWidth for horizontal) */
+    getContainerSize: () => number;
+    /** Returns the column count for grid/masonry layouts (defaults to 1) */
+    getColumns?: () => number;
+}
+export interface StatsState {
+    /** Progress through the list as 0–100 */
+    progress: number;
+    /** Current instantaneous velocity in px/ms */
+    velocity: number;
+    /** Running average velocity in px/ms (filtered samples only) */
+    velocityAvg: number;
+    /** Number of items visible up to the current scroll position */
+    itemCount: number;
+    /** Total number of items */
+    total: number;
+}
+export interface Stats {
+    /** Return the current computed state. Pure read — no side effects. */
+    getState: () => StatsState;
+    /** Feed a velocity sample. Call from the `velocity:change` event. */
+    onVelocity: (velocity: number) => void;
+}
+/**
+ * Create a stats tracker.
+ *
+ * All inputs are provided via callbacks so the tracker always reflects
+ * the latest values without needing to be recreated when the list changes.
+ *
+ * ```ts
+ * const stats = createStats({
+ *   getScrollPosition: () => list.getScrollPosition(),
+ *   getTotal: () => items.length,
+ *   getItemSize: () => ITEM_HEIGHT,
+ *   getContainerSize: () => containerEl.clientHeight,
+ * })
+ *
+ * const { progress, itemCount, total } = stats.getState()
+ * ```
+ */
+export declare function createStats(config: StatsConfig): Stats;
+//# sourceMappingURL=stats.d.ts.map

package/dist/vlist-extras.css

@@ -0,0 +1 @@
+.vlist--compact .vlist-item{padding:0.5rem 0.75rem}.vlist--comfortable .vlist-item{padding:1rem 1.25rem}.vlist--borderless{border:none;border-radius:0}.vlist--borderless .vlist-item{border-bottom:none}.vlist-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:color-mix(in srgb,var(--vlist-bg) 80%,transparent);backdrop-filter:blur(4px);z-index:20}.vlist-loading-spinner{width:2rem;height:2rem;border:4px solid var(--vlist-border);border-top-color:var(--vlist-focus-ring);border-radius:50%;animation:vlist-spin 1s linear infinite}@keyframes vlist-spin{to{transform:rotate(360deg)}}.vlist-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--vlist-text-muted);padding:2rem;text-align:center}.vlist-empty-icon{width:3rem;height:3rem;margin-bottom:1rem;opacity:0.5}.vlist-empty-text{font-size:1.125rem;font-weight:500}.vlist-empty-subtext{font-size:0.875rem;margin-top:0.25rem;opacity:0.75}@keyframes vlist-item-enter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.vlist-item--enter{animation:vlist-item-enter 0.2s ease-out}

package/dist/vlist-grid.css

@@ -0,0 +1 @@
+.vlist--grid .vlist-items{contain:layout style}.vlist-grid-item{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;padding:var(--vlist-item-padding-y) var(--vlist-item-padding-x);background-color:var(--vlist-bg);cursor:default;user-select:none;transition:background-color var(--vlist-transition-duration) var(--vlist-transition-timing);contain:content;box-sizing:border-box;overflow:hidden}.vlist--grid .vlist-item{right:auto;border-bottom:none}.vlist--scrolling .vlist-grid-item{transition:none}.vlist--selectable .vlist-grid-item{cursor:pointer}.vlist--selectable .vlist-grid-item:hover{background-color:var(--vlist-bg-hover)}.vlist-grid-item.vlist-item--odd{background:var(--vlist-bg-striped)}.vlist-grid-item.vlist-item--selected{background-color:var(--vlist-bg-selected)}.vlist-grid-item.vlist-item--odd.vlist-item--selected{background:var(--vlist-bg-selected)}.vlist--selectable .vlist-grid-item.vlist-item--selected:hover{background-color:var(--vlist-bg-selected-hover)}.vlist--selectable .vlist-grid-item.vlist-item--odd.vlist-item--selected:hover{background:var(--vlist-bg-selected-hover)}.vlist-grid-item.vlist-item--focused{outline:2px solid var(--vlist-focus-ring,#3b82f6);outline-offset:-2px;z-index:1}

package/dist/vlist-masonry.css

@@ -0,0 +1 @@
+.vlist--masonry .vlist-items{contain:layout style}.vlist-masonry-item{position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;padding:var(--vlist-item-padding-y) var(--vlist-item-padding-x);background-color:var(--vlist-bg);cursor:default;user-select:none;transition:background-color var(--vlist-transition-duration) var(--vlist-transition-timing);contain:content;box-sizing:border-box;overflow:hidden}.vlist--masonry .vlist-item{right:auto;border-bottom:none}.vlist--scrolling .vlist-masonry-item{transition:none}.vlist--selectable .vlist-masonry-item{cursor:pointer}.vlist--selectable .vlist-masonry-item:hover{background-color:var(--vlist-bg-hover)}.vlist-masonry-item.vlist-item--odd{background:var(--vlist-bg-striped)}.vlist-masonry-item.vlist-item--selected{background-color:var(--vlist-bg-selected)}.vlist-masonry-item.vlist-item--odd.vlist-item--selected{background:var(--vlist-bg-selected)}.vlist--selectable .vlist-masonry-item.vlist-item--selected:hover{background-color:var(--vlist-bg-selected-hover)}.vlist--selectable .vlist-masonry-item.vlist-item--odd.vlist-item--selected:hover{background:var(--vlist-bg-selected-hover)}.vlist-masonry-item.vlist-item--focused{outline:2px solid var(--vlist-focus-ring,#3b82f6);outline-offset:-2px;z-index:1}

package/dist/vlist-table.css

@@ -0,0 +1 @@
+.vlist--table{overflow:hidden;min-height:inherit}.vlist--table .vlist-viewport{overflow:auto}.vlist--table .vlist-items{contain:layout style}.vlist-table-header{position:absolute;top:0;left:0;right:0;z-index:5;overflow:hidden;display:flex;align-items:stretch;box-sizing:border-box;will-change:scroll-position;contain:layout style;background-color:var(--vlist-bg,#ffffff);border-bottom:1px solid var(--vlist-border,#e5e7eb);font-weight:600;font-size:0.8125rem;letter-spacing:0.01em;color:var(--vlist-text-muted,#6b7280)}.vlist-table-header-scroll{position:relative;display:flex;align-items:stretch;height:100%;min-width:100%;flex-shrink:0}.vlist-table-header-cell{position:relative;display:flex;align-items:center;height:100%;box-sizing:border-box;flex-shrink:0;user-select:none;padding-left:var(--vlist-item-padding-x,0.75rem);padding-right:var(--vlist-item-padding-x,0.75rem);border-right:1px solid transparent;transition:background-color 0.15s ease}.vlist-table-header-cell:hover{background-color:var(--vlist-bg-hover,rgba(0,0,0,0.04))}.vlist-table-header-cell--sortable{cursor:pointer}.vlist-table-header-cell--sortable:active{background-color:var(--vlist-bg-selected,rgba(59,130,246,0.12))}.vlist-table-header-cell--center{justify-content:center}.vlist-table-header-cell--right{justify-content:flex-end}.vlist-table-header-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;pointer-events:none}.vlist-table-header-sort{margin-left:4px;flex-shrink:0;opacity:0;font-size:0.7em;transition:opacity 0.15s ease;pointer-events:none;color:var(--vlist-text-muted,#6b7280)}.vlist-table-header-resize{position:absolute;top:0;right:-3px;bottom:0;width:5px;cursor:col-resize;z-index:2;touch-action:none;opacity:0;transition:opacity 0.15s ease}.vlist-table-header-resize::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;transform:translateX(-50%);background-color:var(--vlist-border,#e5e7eb);transition:background-color 0.15s ease}.vlist-table-header-cell:hover .vlist-table-header-resize{opacity:1}.vlist-table-header-resize:hover::after{background-color:var(--vlist-focus-ring,#3b82f6)}.vlist-table-header-resize--active{opacity:1}.vlist-table-header-resize--active::after{background-color:var(--vlist-border-selected,#3b82f6)}.vlist--col-resizing,.vlist--col-resizing *{cursor:col-resize !important;user-select:none !important}.vlist-table-row{position:absolute;top:0;left:0;display:flex;box-sizing:border-box;contain:content;border-bottom:none;background-color:var(--vlist-bg,#ffffff);cursor:default;user-select:none;transition:background-color var(--vlist-transition-duration,150ms) var(--vlist-transition-timing,ease-in-out);will-change:transform}.vlist--scrolling .vlist-table-row{transition:none}.vlist-table-row.vlist-item--odd{background:var( --vlist-bg-striped,var(--vlist-bg-hover,rgba(0,0,0,0.02)) )}.vlist--selectable .vlist-table-row{cursor:pointer}.vlist--selectable .vlist-table-row:hover{background-color:var(--vlist-bg-hover,rgba(0,0,0,0.04))}.vlist-table-row.vlist-item--selected{background-color:var(--vlist-bg-selected,rgba(59,130,246,0.12))}.vlist-table-row.vlist-item--odd.vlist-item--selected{background:var(--vlist-bg-selected,rgba(59,130,246,0.12))}.vlist--selectable .vlist-table-row.vlist-item--selected:hover{background-color:var(--vlist-bg-selected-hover,rgba(59,130,246,0.18))}.vlist--selectable .vlist-table-row.vlist-item--odd.vlist-item--selected:hover{background:var(--vlist-bg-selected-hover,rgba(59,130,246,0.18))}.vlist-table-row.vlist-item--focused{outline:2px solid var(--vlist-focus-ring,#3b82f6);outline-offset:-2px;z-index:1}.vlist-table-cell{position:absolute;top:0;bottom:0;display:flex;align-items:center;box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:var(--vlist-item-padding-x,0.75rem);padding-right:var(--vlist-item-padding-x,0.75rem);font-size:0.875rem;color:var(--vlist-text,#111827)}.vlist-table-cell--center{text-align:center;justify-content:center}.vlist-table-cell--right{text-align:right;justify-content:flex-end}.vlist--table-row-borders .vlist-table-row{border-bottom:1px solid var(--vlist-border,#e5e7eb)}.vlist--table-col-borders .vlist-table-cell{border-right:1px solid var(--vlist-border,#e5e7eb)}.vlist--table-col-borders .vlist-table-header-cell{border-right-color:var(--vlist-border,#e5e7eb)}.vlist-table-group-header{display:flex;align-items:center;background-color:var(--vlist-bg,#ffffff);cursor:default;user-select:none;pointer-events:none}.vlist-table-group-header-content{flex:1;min-width:0;padding-left:var(--vlist-item-padding-x,0.75rem);padding-right:var(--vlist-item-padding-x,0.75rem)}.vlist--table-row-borders .vlist-table-group-header{border-bottom:none;border-top:1px solid var(--vlist-border,#e5e7eb)}.vlist--table.vlist--grouped .vlist-sticky-header{z-index:4}[data-theme-mode="dark"] .vlist-table-header,.dark .vlist-table-header{background-color:var(--vlist-bg,#111827);color:var(--vlist-text-muted,#9ca3af);border-bottom-color:var(--vlist-border,#374151)}[data-theme-mode="dark"] .vlist-table-header-cell:hover,.dark .vlist-table-header-cell:hover{background-color:var(--vlist-bg-hover,rgba(255,255,255,0.06))}[data-theme-mode="dark"] .vlist-table-header-resize::after,.dark .vlist-table-header-resize::after{background-color:var(--vlist-border,#374151)}[data-theme-mode="dark"] .vlist-table-header-resize:hover::after,.dark .vlist-table-header-resize:hover::after{background-color:var(--vlist-focus-ring,#3b82f6)}[data-theme-mode="dark"] .vlist-table-group-header,.dark .vlist-table-group-header{background-color:var(--vlist-bg,#111827)}@media (prefers-color-scheme:dark){:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist-table-header{background-color:var(--vlist-bg,#111827);color:var(--vlist-text-muted,#9ca3af);border-bottom-color:var(--vlist-border,#374151)}:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist-table-header-cell:hover{background-color:var(--vlist-bg-hover,rgba(255,255,255,0.06))}:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist-table-header-resize::after{background-color:var(--vlist-border,#374151)}:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist-table-header-resize:hover::after{background-color:var(--vlist-focus-ring,#3b82f6)}:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist-table-group-header{background-color:var(--vlist-bg,#111827)}}.vlist-table-row.vlist-item--placeholder .vlist-table-cell{color:transparent}.vlist-table-row.vlist-item--placeholder .vlist-table-cell>*{color:transparent;background-color:var(--vlist-border,#e5e7eb);border-radius:4px;animation:vlist-placeholder-pulse 2s ease-in-out infinite;line-height:1;min-width:1em}.vlist-table-row.vlist-item--placeholder .vlist-table-cell>*>*{visibility:hidden}.vlist-table-row.vlist-item--placeholder .vlist-table-cell>*[style]{background:var(--vlist-border,#e5e7eb) !important;color:transparent !important}[data-theme-mode="dark"] .vlist--table-row-borders .vlist-table-group-header,.dark .vlist--table-row-borders .vlist-table-group-header{border-top-color:var(--vlist-border,#374151)}@media (prefers-color-scheme:dark){:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]) .vlist--table-row-borders .vlist-table-group-header{border-top-color:var(--vlist-border,#374151)}}

package/dist/vlist.css

@@ -0,0 +1 @@
+@keyframes vlist-fade-in{from{opacity:0.6}to{opacity:1}}@keyframes vlist-placeholder-pulse{0%,100%{opacity:0.6}50%{opacity:0.4}}:root{--vlist-scrollbar-width:8px;--vlist-scrollbar-track-bg:transparent;--vlist-scrollbar-custom-thumb-radius:4px;--vlist-item-padding-x:1rem;--vlist-item-padding-y:0.75rem;--vlist-border-radius:0.5rem;--vlist-transition-duration:150ms;--vlist-transition-timing:ease-in-out;--vlist-bg:#ffffff;--vlist-bg-hover:rgba(0,0,0,0.04);--vlist-bg-striped:rgba(0,0,0,0.02);--vlist-bg-selected:rgba(59,130,246,0.12);--vlist-bg-selected-hover:rgba(59,130,246,0.18);--vlist-border:#e5e7eb;--vlist-border-selected:#3b82f6;--vlist-text:#111827;--vlist-text-muted:#6b7280;--vlist-focus-ring:#3b82f6;--vlist-group-header-bg:#f3f4f6;--vlist-scrollbar-thumb:#d1d5db;--vlist-scrollbar-thumb-hover:#9ca3af;--vlist-scrollbar-custom-thumb-bg:rgba(0,0,0,0.3);--vlist-scrollbar-custom-thumb-hover-bg:rgba(0,0,0,0.5);--vlist-placeholder-bg:rgba(0,0,0,0.2)}[data-theme-mode="dark"]{--vlist-bg:#111827;--vlist-bg-hover:rgba(255,255,255,0.06);--vlist-bg-striped:rgba(255,255,255,0.02);--vlist-bg-selected:rgba(59,130,246,0.2);--vlist-bg-selected-hover:rgba(59,130,246,0.28);--vlist-border:#374151;--vlist-border-selected:#3b82f6;--vlist-text:#f9fafb;--vlist-text-muted:#9ca3af;--vlist-focus-ring:#3b82f6;--vlist-group-header-bg:#1e2433;--vlist-scrollbar-thumb:#4b5563;--vlist-scrollbar-thumb-hover:#6b7280;--vlist-scrollbar-custom-thumb-bg:rgba(255,255,255,0.3);--vlist-scrollbar-custom-thumb-hover-bg:rgba(255,255,255,0.5);--vlist-placeholder-bg:rgba(255,255,255,0.3)}@media (prefers-color-scheme:dark){:root:not([data-theme-mode="light"]):not([data-theme-mode="dark"]){--vlist-bg:#111827;--vlist-bg-hover:rgba(255,255,255,0.06);--vlist-bg-striped:rgba(255,255,255,0.02);--vlist-bg-selected:rgba(59,130,246,0.2);--vlist-bg-selected-hover:rgba(59,130,246,0.28);--vlist-border:#374151;--vlist-border-selected:#3b82f6;--vlist-text:#f9fafb;--vlist-text-muted:#9ca3af;--vlist-focus-ring:#3b82f6;--vlist-group-header-bg:#1e2433;--vlist-scrollbar-thumb:#4b5563;--vlist-scrollbar-thumb-hover:#6b7280;--vlist-scrollbar-custom-thumb-bg:rgba(255,255,255,0.3);--vlist-scrollbar-custom-thumb-hover-bg:rgba(255,255,255,0.5);--vlist-placeholder-bg:rgba(255,255,255,0.3)}}.dark{--vlist-bg:#111827;--vlist-bg-hover:rgba(255,255,255,0.06);--vlist-bg-striped:rgba(255,255,255,0.02);--vlist-bg-selected:rgba(59,130,246,0.2);--vlist-bg-selected-hover:rgba(59,130,246,0.28);--vlist-border:#374151;--vlist-border-selected:#3b82f6;--vlist-text:#f9fafb;--vlist-text-muted:#9ca3af;--vlist-focus-ring:#3b82f6;--vlist-group-header-bg:#1e2433;--vlist-scrollbar-thumb:#4b5563;--vlist-scrollbar-thumb-hover:#6b7280;--vlist-scrollbar-custom-thumb-bg:rgba(255,255,255,0.3);--vlist-scrollbar-custom-thumb-hover-bg:rgba(255,255,255,0.5);--vlist-placeholder-bg:rgba(255,255,255,0.3)}.vlist{position:relative;width:100%;height:100%;overflow:hidden;background-color:var(--vlist-bg);color:var(--vlist-text);color-scheme:light;border:1px solid var(--vlist-border);border-radius:var(--vlist-border-radius);outline:none}[data-theme-mode="dark"] .vlist,.dark .vlist{color-scheme:dark}@media (prefers-color-scheme:dark){:root:not([data-theme-mode="light"]) .vlist{color-scheme:dark}}.vlist:focus,.vlist:focus-visible{outline:none}.vlist-viewport{width:100%;height:100%;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--vlist-scrollbar-thumb) transparent}.vlist-viewport::-webkit-scrollbar{width:6px;height:6px}.vlist-viewport::-webkit-scrollbar-track{background:transparent}.vlist-viewport::-webkit-scrollbar-thumb{background-color:var(--vlist-scrollbar-thumb);border-radius:3px}.vlist-viewport::-webkit-scrollbar-thumb:hover{background-color:var(--vlist-scrollbar-thumb-hover)}.vlist-content{position:relative;width:100%}.vlist-items{position:relative;width:100%;contain:layout style}.vlist-item{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;background-color:var(--vlist-bg);cursor:default;user-select:none;opacity:1;transition:background-color var(--vlist-transition-duration) var(--vlist-transition-timing),opacity var(--vlist-transition-duration) var(--vlist-transition-timing);contain:content;box-sizing:border-box;will-change:transform}.vlist--scrolling .vlist-item{transition:none}.vlist--selectable .vlist-item{cursor:pointer}.vlist--selectable .vlist-item:hover{background-color:var(--vlist-bg-hover)}.vlist-item.vlist-item--odd{background:var(--vlist-bg-striped)}.vlist-item.vlist-item--selected{background-color:var(--vlist-bg-selected)}.vlist-item.vlist-item--odd.vlist-item--selected{background:var(--vlist-bg-selected)}.vlist-item.vlist-item--selected:hover{background-color:var(--vlist-bg-selected-hover)}.vlist-item.vlist-item--odd.vlist-item--selected:hover{background:var(--vlist-bg-selected-hover)}.vlist-item.vlist-item--focused{outline:2px solid var(--vlist-focus-ring,#3b82f6);outline-offset:-2px;z-index:1}.vlist-item--replaced{animation:vlist-fade-in 0.3s ease-out}.vlist-item--placeholder{opacity:0.6;animation:vlist-placeholder-pulse 2s ease-in-out infinite}.vlist-item.vlist-item--selected.vlist-item--focused{outline-color:var(--vlist-border-selected)}.vlist-scrollbar{position:absolute;top:0;right:0;width:var(--vlist-scrollbar-width);height:100%;background-color:var(--vlist-scrollbar-track-bg);opacity:0;transition:opacity 0.2s ease-out;z-index:10;pointer-events:none}.vlist-scrollbar-hover{position:absolute;top:0;right:0;height:100%;z-index:9;pointer-events:auto}.vlist-scrollbar-hover--horizontal{top:auto;right:auto;bottom:0;left:0;width:100%;height:auto}.vlist-scrollbar--visible{opacity:1;pointer-events:auto}.vlist-scrollbar-thumb{position:absolute;top:0;left:0;right:0;width:100%;background-color:var(--vlist-scrollbar-custom-thumb-bg);border-radius:var(--vlist-scrollbar-custom-thumb-radius);cursor:pointer;transition:background-color 0.15s ease-out}.vlist-scrollbar-thumb:hover{background-color:var(--vlist-scrollbar-custom-thumb-hover-bg)}.vlist-scrollbar--dragging{opacity:1;pointer-events:auto}.vlist-scrollbar--dragging .vlist-scrollbar-thumb{background-color:var(--vlist-scrollbar-custom-thumb-hover-bg)}.vlist--grouped .vlist-item[data-id^="__group_header_"]{cursor:default;background-color:var(--vlist-group-header-bg,#f3f4f6);border-bottom:1px solid var(--vlist-border);z-index:1;overflow:hidden}.vlist--grouped .vlist-item[data-id^="__group_header_"]:hover{background-color:var(--vlist-group-header-bg,#f3f4f6)}.vlist-sticky-header{left:0;right:0;background-color:var(--vlist-group-header-bg,#f3f4f6);border-bottom:1px solid var(--vlist-border)}.vlist--horizontal{overflow:hidden}.vlist--horizontal .vlist-viewport{overflow-x:auto;overflow-y:hidden}.vlist--horizontal .vlist-content{height:100%;width:auto}.vlist--horizontal .vlist-items{height:100%;width:auto}.vlist--horizontal .vlist-item{position:absolute;top:0;bottom:0;left:0;right:auto;display:flex;align-items:center;justify-content:center;border-bottom:none;border-right:1px solid var(--vlist-border)}.vlist-scrollbar--horizontal{top:auto;right:auto;bottom:0;left:0;width:100%;height:var(--vlist-scrollbar-width)}.vlist-scrollbar--horizontal .vlist-scrollbar-thumb{top:0;left:0;width:auto;height:100%}.vlist-viewport--custom-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.vlist-viewport--custom-scrollbar::-webkit-scrollbar{display:none}.vlist-viewport--no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.vlist-viewport--no-scrollbar::-webkit-scrollbar{display:none}.vlist-viewport--gutter-stable{scrollbar-gutter:stable}

package/package.json

@@ -1,26 +1,78 @@
 {
   "name": "vlist",
-  "version": "0.1.3",
+  "version": "1.5.5",
+  "description": "Lightweight, high-performance virtual list with zero dependencies",
+  "author": {
+    "name": "Floor IO",
+    "url": "https://floor.io"
+  },
   "repository": {
     "type": "git",
-    "url": "https://github.com/givve/angular-virtual-scroll.git"
-  },
-  "author": {
-    "name": "Alexander Klaiber",
-    "email": "aklaiber@givve.com"
+    "url": "git+https://github.com/floor/vlist.git"
   },
   "keywords": [
-    "angular"
+    "virtual-list",
+    "virtual-scroll",
+    "virtualized-list",
+    "infinite-scroll",
+    "windowing",
+    "list-virtualization",
+    "dom-recycling",
+    "large-list",
+    "performance",
+    "typescript",
+    "zero-dependencies"
   ],
   "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./internals": {
+      "types": "./dist/internals.d.ts",
+      "import": "./dist/internals.js",
+      "default": "./dist/internals.js"
+    },
+    "./styles": "./dist/vlist.css",
+    "./styles/grid": "./dist/vlist-grid.css",
+    "./styles/masonry": "./dist/vlist-masonry.css",
+    "./styles/table": "./dist/vlist-table.css",
+    "./styles/extras": "./dist/vlist-extras.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/index.js",
+    "dist/internals.js",
+    "dist/**/*.d.ts",
+    "dist/**/*.css",
+    "dist/size.json",
+    "!dist/**/*.d.ts.map"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "scripts": {
+    "build": "bun run build.ts",
+    "dev": "bun run build.ts --watch",
+    "test": "bun test",
+    "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.test.json",
+    "size": "bun run scripts/measure-size.ts",
+    "prepublishOnly": "bun run build --types"
+  },
   "bugs": {
-    "url": "https://github.com/givve/angular-virtual-scroll.git/issues"
+    "url": "https://github.com/floor/vlist/issues"
   },
-  "module": "vlist.js",
-  "typings": "vlist.d.ts",
-  "peerDependencies": {
-    "@angular/core": "^4.0.0",
-    "rxjs": "^5.1.0",
-    "zone.js": "^0.8.4"
+  "homepage": "https://vlist.io",
+  "devDependencies": {
+    "@types/bun": "^1.0.0",
+    "@types/jsdom": "^27.0.0",
+    "jsdom": "^28.0.0",
+    "typescript": "^5.0.0"
   }
 }

package/README.MD

@@ -1,80 +0,0 @@
-# angular-virtual-scroll
-
-Easy to use virtual scroll list for angular. VirtualScroll separate large lists into smaller chunks for a fast rendering. 
-
-
-[Demo](https://givve.github.io/angular-virtual-scroll/)
-
-## Usage
-
-```xml
-<virtual-scroll [items]="items" (update)="viewPortItems = $event">
-  <div *ngFor="let item of viewPortItems" class="item">
-    {{ item }}
-  </div>
-</virtual-scroll>
-```
-
-## Get Started
-
-**Step 1:** Install `vlist`
-
-```bash
-$ npm install vlist --save
-```
-
-**Step2:** Import `VListModule`
-
-```typescript
-....
-import { VListModule } from 'vlist';
-
-@NgModule({
-  ....
-  imports: [
-    ....
-    VListModule
-  ],
-  ....
-})
-export class AppModule { }
-```
-
-**Step 3:** Wrap `<virtual-scroll>...</virtual-scroll>` around the list items
-
-```xml
-<virtual-scroll [items]="items" (update)="viewPortItems = $event">
-  <div *ngFor="let item of viewPortItems" class="item">
-    {{ item }}
-  </div>
-</virtual-scroll>
-```
-
-## API
-
-| Attribute      | Type   | Description
-|----------------|--------|------------
-| items          | any[]  | 
-
-
-## Contributing
-
-Pull requests are welcome!
-
-## Development
-
-To generate all `*.js`, `*.d.ts` and `*.metadata.json` files:
-
-```bash
-$ npm run build
-```
-
-To lint all `*.ts` files:
-
-```bash
-$ npm run lint
-```
-
-## License
-
-MIT © [Alexander Klaiber](mailto:dev@givve.com)

package/index.d.ts

@@ -1,3 +0,0 @@
-export * from './virtual-scroll.component';
-export declare class VListModule {
-}

package/index.js

@@ -1,196 +0,0 @@
-import { Component, ElementRef, EventEmitter, HostListener, Input, NgModule, Output, ViewChild } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { Observable } from 'rxjs/Observable';
-import 'rxjs/add/observable/of';
-import 'rxjs/add/observable/fromEvent';
-import 'rxjs/add/operator/debounceTime';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/retryWhen';
-import 'rxjs/add/operator/delay';
-
-var VirtualScrollComponent = (function () {
-    /**
-     * @param {?} element
-     */
-    function VirtualScrollComponent(element) {
-        this.element = element;
-        this.items = [];
-        this.update = new EventEmitter();
-        this.itemHeight = 0;
-        this.viewportPosition = 0;
-        this.latestStartChunk = 0;
-        this.latestEndChunk = 0;
-        this.latestScrollTop = 0;
-        this.ticking = false;
-    }
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        Observable.fromEvent(window, 'resize').debounceTime(50).subscribe(function () { return _this.updateChunk(); });
-        Observable.of(this.viewportElementRef.nativeElement.getElementsByClassName('item')).map(function (items) {
-            if (items.length == 0) {
-                throw 'ex';
-            }
-            return items[0];
-        }).retryWhen(function (errors) { return errors.delay(100); }).subscribe(function (item) {
-            _this.itemHeight = item.getBoundingClientRect().height;
-            _this.updateChunk();
-        });
-    };
-    /**
-     * @param {?} changes
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.ngOnChanges = function (changes) {
-        if (changes.items.currentValue.length > 0) {
-            if (this.itemHeight == 0) {
-                /** Render one item to get the item height. **/
-                this.update.emit(this.items.slice(0, 1));
-            }
-        }
-        /** Clear and update chunk. **/
-        if (this.itemHeight > 0) {
-            this.latestStartChunk = 0;
-            this.latestEndChunk = 0;
-            this.updateChunk();
-        }
-    };
-    /**
-     * @param {?} e
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.onScroll = function (e) {
-        var _this = this;
-        this.latestScrollTop = this.getCurrentScrollTop();
-        if (!this.ticking) {
-            requestAnimationFrame(function () {
-                _this.ticking = false;
-                _this.updateChunk();
-                _this.updateViewPort();
-            });
-        }
-        this.ticking = true;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.updateChunk = function () {
-        if (this.latestStartChunk != this.startChunk() || this.latestEndChunk != this.endChunk()) {
-            this.latestStartChunk = this.startChunk();
-            this.latestEndChunk = this.endChunk();
-            this.update.emit(this.items.slice(this.latestStartChunk, this.latestEndChunk));
-        }
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.updateViewPort = function () {
-        if (this.isBottom()) {
-            this.viewportPosition = this.latestScrollTop - this.itemHeight;
-        }
-        else {
-            this.viewportPosition = this.latestScrollTop;
-        }
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.isBottom = function () {
-        return this.getCurrentScrollHeight() - this.getCurrentScrollTop() === this.getCurrentHeight();
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.startChunk = function () {
-        return Math.floor(this.getCurrentScrollTop() / this.itemHeight);
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.endChunk = function () {
-        return this.startChunk() + this.totalPossibleItems();
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.getHeight = function () {
-        return this.items.length * this.itemHeight;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.getCurrentHeight = function () {
-        return this.element.nativeElement.clientHeight;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.getCurrentWidth = function () {
-        return this.element.nativeElement.clientWidth;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.getCurrentScrollHeight = function () {
-        return this.element.nativeElement.scrollHeight;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.getCurrentScrollTop = function () {
-        return this.element.nativeElement.scrollTop;
-    };
-    /**
-     * @return {?}
-     */
-    VirtualScrollComponent.prototype.totalPossibleItems = function () {
-        return Math.round(this.getCurrentHeight() / this.itemHeight) + 1;
-    };
-    return VirtualScrollComponent;
-}());
-VirtualScrollComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'virtual-scroll',
-                template: "<div id=\"scrollport\" [style.height.px]=\"getHeight()\"></div> <div id=\"viewport\" #viewport [style.margin-top.px]=\"-getHeight()\" [style.transform]=\"'translateY(' + viewportPosition + 'px)'\"> <ng-content></ng-content> </div> ",
-                styles: [":host { overflow: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%; display: block; position: relative; } #scrollport { width: 1px; opacity: 0; } #viewport { position: absolute; width: 100%; } "]
-            },] },
-];
-/**
- * @nocollapse
- */
-VirtualScrollComponent.ctorParameters = function () { return [
-    { type: ElementRef, },
-]; };
-VirtualScrollComponent.propDecorators = {
-    'items': [{ type: Input },],
-    'update': [{ type: Output },],
-    'viewportElementRef': [{ type: ViewChild, args: ['viewport', { read: ElementRef },] },],
-    'onScroll': [{ type: HostListener, args: ['scroll',] },],
-};
-
-var VListModule = (function () {
-    function VListModule() {
-    }
-    return VListModule;
-}());
-VListModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule
-                ],
-                declarations: [
-                    VirtualScrollComponent
-                ],
-                exports: [
-                    VirtualScrollComponent
-                ]
-            },] },
-];
-/**
- * @nocollapse
- */
-VListModule.ctorParameters = function () { return []; };
-
-export { VListModule, VirtualScrollComponent };

package/virtual-scroll.component.d.ts

@@ -1,34 +0,0 @@
-import { ElementRef, EventEmitter, OnChanges, OnInit, SimpleChanges } from '@angular/core';
-import 'rxjs/add/observable/of';
-import 'rxjs/add/observable/fromEvent';
-import 'rxjs/add/operator/debounceTime';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/retryWhen';
-import 'rxjs/add/operator/delay';
-export declare class VirtualScrollComponent implements OnInit, OnChanges {
-    private element;
-    items: any[];
-    update: EventEmitter<any[]>;
-    viewportElementRef: ElementRef;
-    itemHeight: number;
-    viewportPosition: number;
-    latestStartChunk: number;
-    latestEndChunk: number;
-    latestScrollTop: number;
-    ticking: boolean;
-    constructor(element: ElementRef);
-    ngOnInit(): void;
-    ngOnChanges(changes: SimpleChanges): void;
-    onScroll(e: Event): void;
-    private updateChunk();
-    private updateViewPort();
-    private isBottom();
-    private startChunk();
-    private endChunk();
-    getHeight(): number;
-    private getCurrentHeight();
-    private getCurrentWidth();
-    private getCurrentScrollHeight();
-    private getCurrentScrollTop();
-    private totalPossibleItems();
-}

package/vlist.d.ts

@@ -1,4 +0,0 @@
-/**
- * Generated bundle index. Do not edit.
- */
-export * from './index';

package/vlist.metadata.json

@@ -1 +0,0 @@
-{"__symbolic":"module","version":3,"metadata":{"VListModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"declarations":[{"__symbolic":"reference","name":"VirtualScrollComponent"}],"exports":[{"__symbolic":"reference","name":"VirtualScrollComponent"}]}]}],"members":{}},"VirtualScrollComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"virtual-scroll","template":"<div id=\"scrollport\" [style.height.px]=\"getHeight()\"></div> <div id=\"viewport\" #viewport [style.margin-top.px]=\"-getHeight()\" [style.transform]=\"'translateY(' + viewportPosition + 'px)'\"> <ng-content></ng-content> </div> ","styles":[":host { overflow: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%; display: block; position: relative; } #scrollport { width: 1px; opacity: 0; } #viewport { position: absolute; width: 100%; } "]}]}],"members":{"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"update":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"viewportElementRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["viewport",{"read":{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"onScroll":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["scroll"]}]}],"updateChunk":[{"__symbolic":"method"}],"updateViewPort":[{"__symbolic":"method"}],"isBottom":[{"__symbolic":"method"}],"startChunk":[{"__symbolic":"method"}],"endChunk":[{"__symbolic":"method"}],"getHeight":[{"__symbolic":"method"}],"getCurrentHeight":[{"__symbolic":"method"}],"getCurrentWidth":[{"__symbolic":"method"}],"getCurrentScrollHeight":[{"__symbolic":"method"}],"getCurrentScrollTop":[{"__symbolic":"method"}],"totalPossibleItems":[{"__symbolic":"method"}]}}},"origins":{"VListModule":"./index","VirtualScrollComponent":"./virtual-scroll.component"},"importAs":"vlist"}