Askr documentation
Generated API snapshot

@askrjs/ui/virtual-list

Exports from the declarations published in @askrjs/ui. Signatures reflect the published artifact.

Exports

This entrypoint publishes 9 exports. Use the anchored symbol rows for direct links. Type-only exports are labeled separately from runtime values.

VirtualListtype

VirtualList: { <Item>(props: VirtualListProps<Item>): JSX.Element; <Item>(props: VirtualListAsChildProps<Item>): JSX.Element; }

Renders a part of `virtual-list`. Supports polymorphic rendering via `asChild`.

VirtualListApitype

VirtualListApi: {
  scrollToIndex: (index: number, alignment?: VirtualScrollAlignment) => void;
  scrollToTop: () => void;
  scrollToBottom: () => void;
  getState: () => VirtualListState;
  getVisibleRange: () => VirtualRange;
  getItemCount: () => number;
  getScrollTop: () => number;
  isAtTop: () => boolean;
  isAtBottom: () => boolean;
  isFollowingBottom: () => boolean;
  getPendingUnseenCount: () => number;
  setFollowBottom: (followBottom: boolean) => void;
}

Virtual List Api.

VirtualListAsChildPropstype

VirtualListAsChildProps: Omit<VirtualListRootProps, 'children'> & {
  items: readonly Item[];
  rowHeight: number;
  overscan?: VirtualOverscan;
  getKey: (item: Item, index: number) => string | number;
  rowComponent: VirtualListRowComponent<Item>;
  followBottom?: boolean | {
    threshold?: number;
  };
  onScroll?: (event: Event) => void;
  viewport?: VirtualListViewport;
  apiRef?: Ref<VirtualListApi<Item> | null>;
  ref?: Ref<HTMLElement>;
  asChild: true;
  children: JSXElement;
}

Props for the `asChild` (polymorphic) rendering of Virtual List.

apiRef
apiRef?: Ref<VirtualListApi<Item> | null>;
asChild
asChild: true;
children
children: JSXElement;
followBottom
followBottom?: boolean | { threshold?: number; } | undefined;
getKey
getKey: (item: Item, index: number) => string | number;
items
items: readonly Item[];
onScroll
onScroll?: ((event: Event) => void) | undefined;
overscan
overscan?: VirtualOverscan | undefined;
ref
ref?: Ref<HTMLElement>;
rowComponent
rowComponent: VirtualListRowComponent<Item>;
rowHeight
rowHeight: number;
viewport
viewport?: "lg" | undefined;

VirtualListPropstype

VirtualListProps: VirtualListRootProps & {
  items: readonly Item[];
  rowHeight: number;
  overscan?: VirtualOverscan;
  getKey: (item: Item, index: number) => string | number;
  rowComponent: VirtualListRowComponent<Item>;
  followBottom?: boolean | {
    threshold?: number;
  };
  onScroll?: (event: Event) => void;
  viewport?: VirtualListViewport;
  apiRef?: Ref<VirtualListApi<Item> | null>;
  ref?: Ref<HTMLElement>;
  asChild?: false;
}

Props for Virtual List.

apiRef
apiRef?: Ref<VirtualListApi<Item> | null>;
asChild
asChild?: false | undefined;
followBottom
followBottom?: boolean | { threshold?: number; } | undefined;
getKey
getKey: (item: Item, index: number) => string | number;
items
items: readonly Item[];
onScroll
onScroll?: ((event: Event) => void) | undefined;
overscan
overscan?: VirtualOverscan | undefined;
ref
ref?: Ref<HTMLElement>;
rowComponent
rowComponent: VirtualListRowComponent<Item>;
rowHeight
rowHeight: number;
viewport
viewport?: "lg" | undefined;

VirtualListRowComponenttype

VirtualListRowComponent: (props: VirtualListRowComponentProps<Item>) => VirtualListRowElement | null

Virtual List Row Component.

VirtualListRowComponentPropstype

VirtualListRowComponentProps: {
  item: Item;
  index: number;
  rowKey: string;
  isVisible: boolean;
}

Props for Virtual List Row Component.

index
index: number;
isVisible
isVisible: boolean;
item
item: Item;
rowKey
rowKey: string;

VirtualListStatetype

VirtualListState: {
  count: number;
  scrollTop: number;
  viewportHeight: number;
  totalHeight: number;
  visibleRange: VirtualRange;
  isAtTop: boolean;
  isAtBottom: boolean;
  followBottom: boolean;
  pendingUnseenCount: number;
}

Virtual List State.