mtrl-addons 0.2.2 → 0.2.3

package/dist/core/layout/schema.d.ts

@@ -0,0 +1,112 @@
+/**
+ * @module core/layout/schema
+ * @description Unified layout schema processor with integrated optimizations
+ * Consolidates array, object, JSX, and template processing with built-in performance enhancements
+ */
+export interface LayoutConfig {
+    /** Base layout type */
+    type?: "stack" | "row" | "grid" | string;
+    /** Spacing between elements */
+    gap?: number | string;
+    /** Additional CSS classes */
+    class?: string;
+    /** Alignment of items along the cross axis */
+    align?: "start" | "center" | "end" | "stretch";
+    /** Alignment of items along the main axis */
+    justify?: "start" | "center" | "end" | "between" | "around" | "evenly";
+    /** Whether and how items should wrap */
+    wrap?: boolean | "reverse" | "nowrap";
+    /** Whether row items should stack vertically on mobile */
+    mobileStack?: boolean;
+    /** Whether row items should scroll horizontally on mobile */
+    mobileScroll?: boolean;
+    /** Number of columns or automatic sizing method */
+    columns?: number | "auto-fit" | "auto-fill";
+    /** Whether to use dense packing algorithm for grid */
+    dense?: boolean;
+    /** Whether grid items should adjust height automatically */
+    autoHeight?: boolean;
+}
+export interface LayoutItemConfig {
+    /** Column width in a 12-column grid */
+    width?: number;
+    /** Width on small screens */
+    sm?: number;
+    /** Width on medium screens */
+    md?: number;
+    /** Width on large screens */
+    lg?: number;
+    /** Width on extra-large screens */
+    xl?: number;
+    /** Number of grid columns to span */
+    span?: number;
+    /** Number of grid rows to span */
+    rowSpan?: number;
+    /** Display order */
+    order?: number | "first" | "last";
+    /** Self-alignment within container */
+    align?: "start" | "center" | "end" | "stretch";
+    /** Whether item should automatically size */
+    auto?: boolean;
+}
+export interface LayoutOptions {
+    /** Default creator function to use if not specified in schema */
+    creator?: Function;
+    /** Whether to apply CSS class prefix @default true */
+    prefix?: boolean;
+    /** Additional options */
+    [key: string]: any;
+}
+export interface LayoutResult {
+    /** The raw layout object with all components */
+    layout: Record<string, any>;
+    /** Reference to the root element for convenience */
+    element: HTMLElement | any;
+    /** Flattened component map */
+    component: Record<string, any>;
+    /** Gets a component by name */
+    get(name: string): any;
+    /** Gets all components in a flattened map */
+    getAll(): Record<string, any>;
+    /** Destroys the layout, cleaning up all components */
+    destroy(): void;
+}
+type ComponentLike = {
+    element: HTMLElement;
+    [key: string]: any;
+};
+/**
+ * Checks if a value is a component object (has an element property)
+ */
+declare function isComponent(value: any): value is ComponentLike;
+/**
+ * Optimized class processing with minimal string operations
+ * Handles arrays, strings, className aliases, and rawClass efficiently
+ */
+declare function processClassNames(options: Record<string, any>, skipPrefix?: boolean): Record<string, any>;
+/**
+ * Applies layout classes based on configuration
+ * Uses integrated caching for optimal performance
+ */
+declare function applyLayoutClasses(element: HTMLElement, layoutConfig: LayoutConfig): void;
+/**
+ * Applies layout item classes based on configuration
+ * Uses integrated caching for optimal performance
+ */
+declare function applyLayoutItemClasses(element: HTMLElement, itemConfig: LayoutItemConfig): void;
+/**
+ * Flattens a nested layout into a simple object with element and component references
+ */
+declare function flattenLayout(layout: Record<string, any>): Record<string, any>;
+/**
+ * Creates a layout result object with utility functions
+ */
+declare function createLayoutResult(layout: Record<string, any>): LayoutResult;
+/**
+ * Creates a layout from various schema formats
+ * Unified processor for arrays, objects, JSX, and HTML strings
+ */
+export declare function createLayout(schema: any, parentElement?: HTMLElement | null, options?: LayoutOptions): LayoutResult;
+export declare function clearClassCache(): void;
+export declare function clearFragmentPool(): void;
+export { processClassNames, isComponent, flattenLayout, applyLayoutClasses, applyLayoutItemClasses, createLayoutResult, };

package/dist/core/layout/types.d.ts

@@ -0,0 +1,69 @@
+/**
+ * @module core/layout/types
+ * @description Essential type definitions for layout creation system
+ * Core types are defined in schema.ts for better tree-shaking
+ */
+import type { LayoutConfig, LayoutItemConfig, LayoutOptions, LayoutResult } from "./schema";
+export type { LayoutConfig, LayoutItemConfig, LayoutOptions, LayoutResult };
+/**
+ * Interface for component-like objects
+ */
+export interface ComponentLike {
+    /** DOM element reference */
+    element: any;
+    /** Optional method to clean up resources */
+    destroy?: () => void;
+    /** Allow additional properties */
+    [key: string]: any;
+}
+/**
+ * Extended options for element creation
+ * Used in object-based schemas
+ */
+export interface ElementOptions extends Record<string, any> {
+    /** Layout configuration for the element */
+    layout?: LayoutConfig;
+    /** Layout item configuration */
+    layoutItem?: LayoutItemConfig;
+    /** CSS classes to apply (with automatic mtrl- prefix) */
+    class?: string;
+    /** Additional CSS classes (alias for class) */
+    className?: string;
+    /** CSS classes to apply without prefix */
+    rawClass?: string | string[];
+    /** HTML tag name for createElement */
+    tag?: string;
+    /** Text content for the element */
+    textContent?: string;
+    /** Inline styles */
+    style?: Record<string, string | number>;
+    /** HTML attributes */
+    attributes?: Record<string, string>;
+    /** Event handlers */
+    events?: Record<string, Function>;
+    /** Legacy event handler support */
+    event?: Record<string, Function>;
+}
+/**
+ * Definition for a single element in object-based layout schemas
+ */
+export interface ElementDefinition {
+    /** Optional name to reference the element */
+    name?: string;
+    /** Creator function that produces a DOM element or ComponentLike */
+    creator?: (options?: Record<string, any>) => any;
+    /** Options to pass to the creator function */
+    options?: ElementOptions;
+    /** Child elements to create and attach */
+    children?: Record<string, ElementDefinition>;
+}
+/**
+ * Schema for object-based layout creation
+ * Array-based schemas are handled directly as arrays
+ */
+export interface Schema {
+    /** Root element definition */
+    element?: ElementDefinition;
+    /** Additional elements */
+    [key: string]: ElementDefinition | undefined;
+}

package/dist/core/viewport/constants.d.ts

@@ -0,0 +1,105 @@
+/**
+ * Viewport Constants
+ * Centralized constants for all viewport functionality
+ * Consolidated from viewport, viewport/features, and list-manager constants
+ */
+export declare const VIEWPORT_CONSTANTS: {
+    VIRTUAL_SCROLL: {
+        DEFAULT_ITEM_SIZE: number;
+        OVERSCAN_BUFFER: number;
+        SCROLL_SENSITIVITY: number;
+        MAX_VIRTUAL_SIZE: number;
+        AUTO_DETECT_ITEM_SIZE: boolean;
+    };
+    SCROLLING: {
+        OVERSCAN: number;
+    };
+    RENDERING: {
+        DEFAULT_MAX_POOL_SIZE: number;
+        CLASSES: {
+            ITEM: string;
+        };
+    };
+    LOADING: {
+        CANCEL_THRESHOLD: number;
+        MAX_CONCURRENT_REQUESTS: number;
+        DEFAULT_RANGE_SIZE: number;
+        DEBOUNCE_LOADING: number;
+        MIN_RANGE_SIZE: number;
+        MAX_RANGE_SIZE: number;
+        REQUEST_TIMEOUT: number;
+        RETRY_ATTEMPTS: number;
+        RETRY_DELAY: number;
+    };
+    REQUEST_QUEUE: {
+        ENABLED: boolean;
+        MAX_QUEUE_SIZE: number;
+        MAX_ACTIVE_REQUESTS: number;
+    };
+    PLACEHOLDER: {
+        MASK_CHARACTER: string;
+        CLASS: string;
+        MAX_SAMPLE_SIZE: number;
+        PLACEHOLDER_FLAG: string;
+        RANDOM_LENGTH_VARIANCE: boolean;
+    };
+    SPEED_TRACKING: {
+        DECELERATION_FACTOR: number;
+    };
+    MOMENTUM: {
+        ENABLED: boolean;
+        DECELERATION_FACTOR: number;
+        MIN_VELOCITY: number;
+        MIN_DURATION: number;
+        MIN_VELOCITY_THRESHOLD: number;
+        FRAME_TIME: number;
+    };
+    INITIAL_LOAD: {
+        STRATEGY: string;
+        VIEWPORT_MULTIPLIER: number;
+        MIN_ITEMS: number;
+        MAX_ITEMS: number;
+        PLACEHOLDER_COUNT: number;
+        SHOW_LOADING_STATE: boolean;
+        LOADING_DELAY: number;
+    };
+    SELECTION: {
+        SELECTED_CLASS: string;
+    };
+    SCROLLBAR: {
+        CLASSES: {
+            SCROLLBAR: string;
+            SCROLLBAR_TRACK: string;
+            SCROLLBAR_THUMB: string;
+            SCROLLBAR_VISIBLE: string;
+            SCROLLBAR_DRAGGING: string;
+            SCROLLBAR_THUMB_DRAGGING: string;
+        };
+    };
+    ORIENTATION: {
+        DEFAULT_ORIENTATION: string;
+        DEFAULT_CROSS_AXIS_ALIGNMENT: string;
+        REVERSE_DIRECTION: boolean;
+    };
+    PAGINATION: {
+        DEFAULT_STRATEGY: "offset" | "page" | "cursor";
+        DEFAULT_LIMIT: number;
+        STRATEGIES: {
+            PAGE: "page";
+            OFFSET: "offset";
+            CURSOR: "cursor";
+        };
+        CURSOR_CLEANUP_INTERVAL: number;
+        MAX_CURSOR_MAP_SIZE: number;
+        CURSOR_SCROLL_MARGIN_MULTIPLIER: number;
+        CURSOR_MIN_VIRTUAL_SIZE_MULTIPLIER: number;
+    };
+};
+/**
+ * Type for overriding constants at runtime
+ */
+export type ViewportConstants = typeof VIEWPORT_CONSTANTS;
+/**
+ * Helper function to merge user constants with defaults
+ */
+export declare function mergeConstants(userConstants?: Partial<ViewportConstants>): ViewportConstants;

package/dist/core/viewport/features/base.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Base Viewport Feature - Sets up core viewport structure
+ * Provides the foundation for other viewport features
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface BaseConfig {
+    className?: string;
+    orientation?: "vertical" | "horizontal";
+}
+/**
+ * Base feature for viewport
+ * Sets up the DOM structure and core styles
+ */
+export declare const withBase: (config?: BaseConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;

package/dist/core/viewport/features/collection.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Collection Feature - Data management and range loading
+ * Handles collection integration, pagination, and data fetching
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface CollectionConfig {
+    collection?: any;
+    rangeSize?: number;
+    strategy?: "offset" | "page" | "cursor";
+    transform?: (item: any) => any;
+    cancelLoadThreshold?: number;
+    maxConcurrentRequests?: number;
+    enableRequestQueue?: boolean;
+    maxQueueSize?: number;
+    loadOnDragEnd?: boolean;
+    initialScrollIndex?: number;
+    selectId?: string | number;
+    autoLoad?: boolean;
+    autoSelectFirst?: boolean;
+}
+export interface CollectionComponent {
+    collection: {
+        loadRange: (offset: number, limit: number) => Promise<any[]>;
+        loadMissingRanges: (range: {
+            start: number;
+            end: number;
+        }, caller?: string) => Promise<void>;
+        getLoadedRanges: () => Set<number>;
+        getPendingRanges: () => Set<number>;
+        clearFailedRanges: () => void;
+        retryFailedRange: (rangeId: number) => Promise<any[]>;
+        setTotalItems: (total: number) => void;
+        getTotalItems: () => number;
+        getCurrentCursor: () => string | null;
+        getCursorForPage: (page: number) => string | null;
+    };
+}
+/**
+ * Adds collection functionality to viewport component
+ */
+export declare function withCollection(config?: CollectionConfig): <T extends ViewportContext & ViewportComponent>(component: T) => T & CollectionComponent;

package/dist/core/viewport/features/events.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Events Feature - Centralized event system for viewport
+ * Provides event emission and subscription for inter-feature communication
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface EventsConfig {
+    debug?: boolean;
+}
+/**
+ * Events feature for viewport
+ * Centralizes all event handling for viewport features
+ */
+export declare const withEvents: (config?: EventsConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;

package/{src/core/viewport/features/index.ts → dist/core/viewport/features/index.d.ts}

@@ -1,5 +1,3 @@
-// src/core/list-manager/features/viewport/index.ts
-
 export { withBase } from "./base";
 export { withCollection } from "./collection";
 export { withEvents } from "./events";
@@ -10,11 +8,6 @@ export { withScrolling } from "./scrolling";
 export { withVirtual } from "./virtual";
 export { withPerformance } from "./performance";
 export { withMomentum } from "./momentum";
-
-// Utility exports
 export { createItemSizeManager } from "./item-size";
 export { createLoadingManager } from "./loading";
-// No createElementFromTemplate util here; remove incorrect export
-
-// Types
 export type { PlaceholderComponent, PlaceholderConfig } from "./placeholders";

package/dist/core/viewport/features/item-size.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Item Size Management
+ * Handles item measurement, caching, and size estimation for virtual scrolling
+ * Works with both vertical (height) and horizontal (width) orientations
+ */
+export interface ItemSizeManager {
+    measureItem(element: HTMLElement, index: number, orientation?: "vertical" | "horizontal"): number;
+    hasMeasuredSize(index: number): boolean;
+    getMeasuredSize(index: number): number;
+    getMeasuredSizes(): Map<number, number>;
+    cacheItemSize(index: number, size: number): void;
+    clearCache(): void;
+    getItemSize(): number;
+    updateItemSize(): void;
+    calculateTotalSize(totalItems?: number): number;
+    getStats(): any;
+    onSizeUpdated?: (totalSize: number) => void;
+    onItemSizeChanged?: (newEstimate: number) => void;
+}
+export interface ItemSizeConfig {
+    initialEstimate?: number;
+    orientation?: "vertical" | "horizontal";
+    cacheSize?: number;
+    onSizeUpdated?: (totalSize: number) => void;
+    onItemSizeChanged?: (newEstimate: number) => void;
+}
+/**
+ * Creates an item size manager for measuring and caching item dimensions
+ */
+export declare const createItemSizeManager: (config?: ItemSizeConfig) => ItemSizeManager;

package/dist/core/viewport/features/loading.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Loading - Velocity-based intelligent data loading for viewport
+ *
+ * This viewport module manages data loading based on scroll velocity.
+ * When scrolling fast, it cancels loads to prevent server overload.
+ */
+import type { ItemRange } from "../types";
+type ListManagerComponent = any;
+export interface LoadingConfig {
+    cancelLoadThreshold?: number;
+    maxConcurrentRequests?: number;
+    enableRequestQueue?: boolean;
+}
+export interface LoadingManager {
+    requestLoad(range: ItemRange, priority: "high" | "normal" | "low"): void;
+    updateVelocity(velocity: number, direction: "forward" | "backward"): void;
+    cancelPendingLoads(): void;
+    getStats(): LoadingStats;
+    isRangeLoading(range: ItemRange): boolean;
+}
+interface LoadingStats {
+    pendingRequests: number;
+    completedRequests: number;
+    failedRequests: number;
+    cancelledRequests: number;
+    currentVelocity: number;
+    canLoad: boolean;
+    queuedRequests: number;
+}
+/**
+ * Creates a loading manager that handles data loading based on scroll velocity
+ */
+export declare const createLoadingManager: (component: ListManagerComponent, config?: LoadingConfig) => LoadingManager;
+export {};

package/dist/core/viewport/features/momentum.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Momentum Feature - Adds inertial scrolling to viewport
+ * Provides smooth deceleration after touch/mouse drag gestures
+ */
+import type { ViewportComponent, ViewportContext } from "../types";
+interface MomentumConfig {
+    enabled?: boolean;
+    deceleration?: number;
+    minVelocity?: number;
+    minDuration?: number;
+    minVelocityThreshold?: number;
+}
+/**
+ * Adds momentum scrolling to viewport
+ */
+export declare const withMomentum: (config?: MomentumConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;
+export {};

package/dist/core/viewport/features/performance.d.ts

@@ -0,0 +1,53 @@
+/**
+ * @module core/compose/features
+ * @description Performance tracking feature for components
+ */
+/**
+ * Performance metrics interface
+ */
+export interface PerformanceMetrics {
+    renderCount: number;
+    scrollCount: number;
+    averageRenderTime: number;
+    averageScrollTime: number;
+    memoryUsage: number;
+    virtualizedItems: number;
+    recycledElements: number;
+}
+/**
+ * Performance configuration
+ */
+export interface PerformanceConfig {
+    recycleElements?: boolean;
+    bufferSize?: number;
+    trackMemory?: boolean;
+    maxSamples?: number;
+}
+/**
+ * Component with performance tracking capabilities
+ */
+export interface PerformanceComponent {
+    getMetrics: () => PerformanceMetrics;
+    resetMetrics: () => any;
+    _trackScroll?: (startTime: number) => void;
+}
+/**
+ * Adds performance tracking to a component
+ *
+ * @param config - Performance configuration
+ * @returns Component enhancer that adds performance tracking
+ *
+ * @example
+ * ```typescript
+ * const component = pipe(
+ *   createBase,
+ *   withElement(),
+ *   withPerformance({
+ *     recycleElements: true,
+ *     bufferSize: 50,
+ *     trackMemory: true
+ *   })
+ * )(config);
+ * ```
+ */
+export declare function withPerformance(config?: PerformanceConfig): (component: any) => any & PerformanceComponent;

package/dist/core/viewport/features/placeholders.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Placeholder Feature - Smart placeholder generation
+ * Analyzes first loaded data to generate realistic masked placeholders
+ * Shows placeholders while data is loading
+ */
+import type { ViewportContext } from "../types";
+import type { CollectionComponent } from "./collection";
+/**
+ * Configuration for placeholder feature
+ */
+export interface PlaceholderConfig {
+    enabled?: boolean;
+    analyzeFirstLoad?: boolean;
+    maskCharacter?: string;
+    randomLengthVariance?: boolean;
+}
+export interface PlaceholderComponent {
+    placeholders: {
+        analyzeDataStructure: (items: any[]) => void;
+        hasAnalyzedStructure: () => boolean;
+        generatePlaceholderItem: (index: number) => any;
+        generatePlaceholderItems: (range: {
+            start: number;
+            end: number;
+        }) => any[];
+        showPlaceholders: (range: {
+            start: number;
+            end: number;
+        }) => void;
+        isPlaceholder: (item: any) => boolean;
+        replacePlaceholders: (items: any[], offset: number) => void;
+        clear: () => void;
+    };
+}
+/**
+ * Adds placeholder functionality to viewport component
+ */
+export declare function withPlaceholders(config?: PlaceholderConfig): <T extends ViewportContext & CollectionComponent>(component: T) => T & PlaceholderComponent;

package/dist/core/viewport/features/rendering.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Rendering Feature - Item rendering and positioning for viewport
+ * Handles DOM element creation, positioning, recycling, and updates
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface RenderingConfig {
+    template?: (item: any, index: number) => string | HTMLElement | any[] | Record<string, any>;
+    overscan?: number;
+    measureItems?: boolean;
+    enableRecycling?: boolean;
+    maxPoolSize?: number;
+}
+/**
+ * Rendering feature for viewport
+ */
+export declare const withRendering: (config?: RenderingConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;

package/dist/core/viewport/features/scrollbar.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Scrollbar Feature - Custom scrollbar implementation
+ * Provides visual scroll indication and drag-to-scroll functionality
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface ScrollbarConfig {
+    enabled?: boolean;
+    autoHide?: boolean;
+    thumbMinHeight?: number;
+    thumbColor?: string;
+    trackColor?: string;
+    borderRadius?: number;
+    fadeTimeout?: number;
+}
+export interface ScrollbarComponent {
+    scrollbar: {
+        show: () => void;
+        hide: () => void;
+        updateBounds: (totalVirtualSize: number, containerSize: number) => void;
+        updatePosition: (scrollPosition: number) => void;
+    };
+}
+/**
+ * Adds scrollbar functionality to viewport component
+ */
+export declare function withScrollbar(config?: ScrollbarConfig): <T extends ViewportContext & ViewportComponent>(component: T) => T & ScrollbarComponent;

package/dist/core/viewport/features/scrolling.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Scrolling Feature - Virtual scrolling with integrated velocity tracking
+ * Handles wheel events, touch/mouse events, scroll position management, velocity measurement, and momentum scrolling
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface ScrollingConfig {
+    orientation?: "vertical" | "horizontal";
+    sensitivity?: number;
+    smoothing?: boolean;
+    idleTimeout?: number;
+}
+/**
+ * Scrolling feature for viewport
+ * Handles wheel events, velocity tracking, and idle detection
+ */
+export declare const withScrolling: (config?: ScrollingConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;

package/dist/core/viewport/features/utils.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Shared utilities for viewport features
+ * Eliminates code duplication across features
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+/**
+ * Wraps viewport initialization with feature-specific logic
+ * Eliminates the repeated initialization hook pattern
+ */
+export declare function wrapInitialize<T extends ViewportContext & ViewportComponent>(component: T, featureInit: () => void): void;
+/**
+ * Wraps component destroy with cleanup logic
+ * Eliminates the repeated destroy hook pattern
+ */
+export declare function wrapDestroy<T extends Record<string, any>>(component: T, cleanup: () => void): void;
+/**
+ * Gets viewport state with proper typing
+ * Eliminates repeated (component.viewport as any).state
+ */
+export declare function getViewportState(component: ViewportComponent): any;
+/**
+ * Checks if an item is a placeholder
+ * Eliminates duplicated placeholder detection logic
+ */
+export declare function isPlaceholder(item: any): boolean;
+/**
+ * Creates a range key for deduplication
+ * Used by multiple features for tracking ranges
+ */
+export declare function getRangeKey(range: {
+    start: number;
+    end: number;
+}): string;
+/**
+ * Clamps a value between min and max
+ * Used by multiple features for boundary checking
+ */
+export declare function clamp(value: number, min: number, max: number): number;
+/**
+ * Stores a function reference on the component for later access
+ * Eliminates pattern like (component as any)._featureFunction = fn
+ */
+export declare function storeFeatureFunction<T extends Record<string, any>>(component: T, name: string, fn: Function): void;

package/dist/core/viewport/features/virtual.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Virtual Feature - Core virtual scrolling calculations
+ * Handles visible range calculation and total virtual size management
+ */
+import type { ViewportContext, ViewportComponent } from "../types";
+export interface VirtualConfig {
+    itemSize?: number;
+    overscan?: number;
+    orientation?: "vertical" | "horizontal";
+    autoDetectItemSize?: boolean;
+    debug?: boolean;
+    initialScrollIndex?: number;
+}
+/**
+ * Virtual scrolling feature for viewport
+ * Handles visible range calculations with compression for large datasets
+ */
+export declare const withVirtual: (config?: VirtualConfig) => <T extends ViewportContext & ViewportComponent>(component: T) => T;