Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@af-utils/virtual-react

Package Overview
Dependencies
Maintainers
1
Versions
29
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@af-utils/virtual-react - npm Package Compare versions

Comparing version 0.0.28 to 1.0.0

37

lib/index.d.ts

@@ -16,2 +16,39 @@ /**

* @public
* Creates callback ref for grid item at specified index.
* @param model - {@link @af-utils/virtual-core#VirtualScroller} instance
* @param rowItemIndex - row item index
* @param colItemIndex - column item index
*
* @remarks
* Calls {@link @af-utils/virtual-core#VirtualScroller.attachItem} when item is mounted and
* {@link @af-utils/virtual-core#VirtualScroller.detachItem} when item is about to unmount.
*
* {@link createListItemRef} differences:
*
* - works with two models at the same time;
*
* - column widths are taken only from first mounted row;
*
* - row heights are taken only from first mounted column.
*
* @returns callback ref
*/
export declare const createGridItemRef: (rowsModel: VirtualScroller, rowItemIndex: number, colsModel: VirtualScroller, colItemIndex: number) => (el: HTMLElement | null) => void;
/**
* @public
* Creates callback ref for list item at specified index.
* @param model - {@link @af-utils/virtual-core#VirtualScroller} instance
* @param itemIndex - item index
*
* @remarks
* Calls {@link @af-utils/virtual-core#VirtualScroller.attachItem} when item is mounted and
* {@link @af-utils/virtual-core#VirtualScroller.detachItem} when item is about to unmount.
*
* @returns callback ref
*/
export declare const createListItemRef: (model: VirtualScroller, itemIndex: number) => (el: HTMLElement | null) => void;
/**
* @public
* React component.

@@ -18,0 +55,0 @@ * Small abstraction, which in 90% cases allows to avoid hook boilerplate.

@@ -220,5 +220,48 @@ // src/utils/rangeMappers/index.ts

var useVirtual_default = useVirtual;
// src/utils/refCreators/index.ts
var createListItemRef = (model, itemIndex) => {
let cachedEl = null;
return (el) => {
if (el) {
cachedEl = el;
model.attachItem(el, itemIndex);
} else if (cachedEl) {
model.detachItem(cachedEl);
cachedEl = null;
}
};
};
var createGridItemRef = (rowsModel, rowItemIndex, colsModel, colItemIndex) => {
let mask = 0;
let cachedEl = null;
return (el) => {
if (el) {
if (rowsModel.from === rowItemIndex) {
colsModel.attachItem(el, colItemIndex);
cachedEl = el;
mask |= 1;
}
if (colsModel.from === colItemIndex) {
rowsModel.attachItem(el, rowItemIndex);
cachedEl = el;
mask |= 2;
}
} else {
if (mask & 1) {
colsModel.detachItem(cachedEl);
}
if (mask & 2) {
rowsModel.detachItem(cachedEl);
}
cachedEl = null;
mask = 0;
}
};
};
export {
List_default as List,
Subscription_default as Subscription,
createGridItemRef,
createListItemRef,
mapVisibleRange,

@@ -225,0 +268,0 @@ mapVisibleRangeWithOffset,

4

package.json
{
"name": "@af-utils/virtual-react",
"private": false,
"version": "0.0.28",
"version": "1.0.0",
"description": "React components and hooks for rendering large scrollable data",

@@ -52,3 +52,3 @@ "repository": {

"dependencies": {
"@af-utils/virtual-core": "0.0.25"
"@af-utils/virtual-core": "1.0.0"
},

@@ -55,0 +55,0 @@ "peerDependencies": {

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc