react-virtualized-sticky-tree - npm Package Compare versions

Comparing version 3.0.0-beta1 to 3.0.0-beta10

lib/src/AutoSizedStickyList.d.ts

@@ -5,5 +5,5 @@ import React from 'react';
 import { StickyListProps } from './StickyList';
-export interface AutoSizedStickyListProps<TNodeType extends TreeNode = TreeNode> extends Omit<StickyListProps<TNodeType>, 'width' | 'height'> {
+export interface AutoSizedStickyListProps<TNodeType extends TreeNode = TreeNode, TMeta = any> extends Omit<StickyListProps<TNodeType, TMeta>, 'width' | 'height'> {
     onResize?: (rect: ContentRect) => void;
-    treeRef?: React.Ref<StickyTree<TNodeType>>;
+    treeRef?: React.Ref<StickyTree<TNodeType, TMeta>>;
     className?: string;
@@ -15,5 +15,5 @@ }
 }
-export default class AutoSizedStickyList<TNodeType extends TreeNode = TreeNode> extends React.PureComponent<AutoSizedStickyListProps<TNodeType>, AutoSizedStickyTreeState> {
-    constructor(props: AutoSizedStickyListProps<TNodeType>);
+export default class AutoSizedStickyList<TNodeType extends TreeNode = TreeNode, TMeta = any> extends React.PureComponent<AutoSizedStickyListProps<TNodeType, TMeta>, AutoSizedStickyTreeState> {
+    constructor(props: AutoSizedStickyListProps<TNodeType, TMeta>);
     render(): JSX.Element;
 }

lib/src/AutoSizedStickyTree.d.ts

 import React from 'react';
 import { ContentRect } from 'react-measure';
 import StickyTree, { StickyTreeProps, TreeNode } from './StickyTree';
-export interface AutoSizedStickyTreeProps<TNodeType extends TreeNode = TreeNode> extends Omit<StickyTreeProps<TNodeType>, 'width' | 'height'> {
+export interface AutoSizedStickyTreeProps<TNodeType extends TreeNode = TreeNode, TMeta = any> extends Omit<StickyTreeProps<TNodeType, TMeta>, 'width' | 'height'> {
     onResize?: (rect: ContentRect) => void;
-    treeRef?: React.Ref<StickyTree<TNodeType>>;
+    treeRef?: React.Ref<StickyTree<TNodeType, TMeta>>;
     className?: string;
@@ -13,5 +13,5 @@ }
 }
-export default class AutoSizedStickyTree<TNodeType extends TreeNode = TreeNode> extends React.PureComponent<AutoSizedStickyTreeProps<TNodeType>, AutoSizedStickyTreeState> {
-    constructor(props: AutoSizedStickyTreeProps<TNodeType>);
+export default class AutoSizedStickyTree<TNodeType extends TreeNode = TreeNode, TMeta = any> extends React.PureComponent<AutoSizedStickyTreeProps<TNodeType, TMeta>, AutoSizedStickyTreeState> {
+    constructor(props: AutoSizedStickyTreeProps<TNodeType, TMeta>);
     render(): JSX.Element;
 }

lib/src/index.d.ts

 export { default as StickyTree } from './StickyTree';
+export * from './StickyTree';
 export { default as AutoSizedStickyTree } from './AutoSizedStickyTree';
+export * from './AutoSizedStickyTree';

lib/src/index.js

 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
@@ -9,3 +19,5 @@ return (mod && mod.__esModule) ? mod : { "default": mod };
 Object.defineProperty(exports, "StickyTree", { enumerable: true, get: function () { return __importDefault(StickyTree_1).default; } });
+__exportStar(require("./StickyTree"), exports);
 var AutoSizedStickyTree_1 = require("./AutoSizedStickyTree");
 Object.defineProperty(exports, "AutoSizedStickyTree", { enumerable: true, get: function () { return __importDefault(AutoSizedStickyTree_1).default; } });
+__exportStar(require("./AutoSizedStickyTree"), exports);

lib/src/StickyList.d.ts

 import React from 'react';
 import StickyTree, { StickyTreeProps, TreeNode } from './StickyTree';
 declare type OmitProps = 'getChildren' | 'root' | 'renderRoot';
-export interface StickyListProps<TNodeType extends TreeNode = TreeNode> extends Omit<StickyTreeProps<TNodeType>, OmitProps> {
+export interface StickyListProps<TNodeType extends TreeNode = TreeNode, TMeta = any> extends Omit<StickyTreeProps<TNodeType, TMeta>, OmitProps> {
     items: TNodeType[];
     getHeight?: (item: TNodeType) => number;
-    treeRef?: React.Ref<StickyTree<TNodeType>>;
+    treeRef?: React.Ref<StickyTree<TNodeType, TMeta>>;
 }
-export default class StickyList<TNodeType extends TreeNode = TreeNode> extends React.PureComponent<StickyListProps<TNodeType>> {
-    getChildren: StickyTreeProps<TNodeType>['getChildren'];
+export default class StickyList<TNodeType extends TreeNode = TreeNode, TMeta = any> extends React.PureComponent<StickyListProps<TNodeType, TMeta>> {
+    private root;
+    getChildren: StickyTreeProps<TNodeType, TMeta>['getChildren'];
     render(): JSX.Element;
 }
 export {};

lib/src/StickyList.js

@@ -22,2 +22,3 @@ "use strict";
         super(...arguments);
+        this.root = { node: { id: 'root' } };
         this.getChildren = (node) => {
@@ -34,5 +35,5 @@ const { items, getHeight } = this.props;
         const _a = this.props, { items, rowRenderer, width, height, treeRef, getHeight } = _a, rest = __rest(_a, ["items", "rowRenderer", "width", "height", "treeRef", "getHeight"]);
-        return (react_1.default.createElement(StickyTree_1.default, Object.assign({ ref: treeRef, getChildren: this.getChildren, renderRoot: false, root: { node: { id: 'root' } }, rowRenderer: rowRenderer, width: width, height: height }, rest)));
+        return (react_1.default.createElement(StickyTree_1.default, Object.assign({ ref: treeRef, getChildren: this.getChildren, renderRoot: false, root: this.root, rowRenderer: rowRenderer, width: width, height: height }, rest)));
     }
 }
 exports.default = StickyList;

lib/src/StickyTree.d.ts

@@ -20,11 +20,13 @@ import React from 'react';
     node: TNodeType;
+    meta?: any;
 }
 export interface EnhancedStickyTreeLeafNode<TNodeType extends TreeNode = TreeNode> extends Required<StickyTreeNode<TNodeType>> {
     id: NodeId;
-    top: number;
     depth: number;
     index: number;
+    top: number;
+    totalHeight: number;
     isFirstChild: boolean;
     isLastChild: boolean;
-    totalHeight: number;
+    isLeafNode: boolean;
 }
@@ -37,3 +39,25 @@ export interface EnhancedStickyTreeParentNode<TNodeType extends TreeNode = TreeNode> extends EnhancedStickyTreeLeafNode<TNodeType> {
 export declare type EnhancedStickyTreeNode<TNodeType extends TreeNode = TreeNode> = EnhancedStickyTreeLeafNode<TNodeType> | EnhancedStickyTreeParentNode<TNodeType>;
-export interface StickyTreeProps<TNodeType extends TreeNode = TreeNode> {
+export declare type StickyTreeGetChildren<TNodeType extends TreeNode = TreeNode> = (node: TNodeType, nodeInfo: EnhancedStickyTreeNode<TNodeType>) => StickyTreeNode<TNodeType>[] | undefined;
+export interface StickyTreeRowRendererProps<TNodeType extends TreeNode = TreeNode, TMeta = any> {
+    node: TNodeType;
+    nodeInfo: EnhancedStickyTreeNode<TNodeType>;
+    style: React.CSSProperties;
+    meta?: TMeta;
+}
+export declare type StickyTreeRowRenderer<TNodeType extends TreeNode = TreeNode, TMeta = any> = (props: StickyTreeRowRendererProps<TNodeType, TMeta>) => React.ReactElement;
+export declare type StickyTreeOnScroll = (scrollInfo: {
+    scrollTop: number;
+    scrollLeft: number;
+    scrollReason: ScrollReason;
+}) => void;
+export declare type StickyTreeOnRowsRendered<TNodeType extends TreeNode = TreeNode> = (renderInfo: {
+    overscanStartIndex: number;
+    overscanStopIndex: number;
+    startIndex: number;
+    stopIndex: number;
+    startNode?: EnhancedStickyTreeNode<TNodeType>;
+    endNode?: EnhancedStickyTreeNode<TNodeType>;
+    nodes: EnhancedStickyTreeNode<TNodeType>[];
+}) => void;
+export interface StickyTreeProps<TNodeType extends TreeNode = TreeNode, TMeta = any> {
     /**
@@ -58,3 +82,3 @@ * Returns an array of child objects that represent the children of a particular node.
      */
-    getChildren: (node: TNodeType, nodeInfo: EnhancedStickyTreeNode<TNodeType>) => StickyTreeNode<TNodeType>[] | undefined;
+    getChildren: StickyTreeGetChildren<TNodeType>;
     /**
@@ -70,8 +94,9 @@ * Called to retrieve a row to render. The function should return a single React node.
      */
-    rowRenderer: (renderInfo: {
-        node: TNodeType;
-        nodeInfo: EnhancedStickyTreeNode<TNodeType>;
-        style: React.CSSProperties;
-    }) => React.ReactElement;
+    rowRenderer: StickyTreeRowRenderer<TNodeType, TMeta>;
     /**
+     * Allows for extra props to be passed to the rowRenderer, whilst simultaneously allowing for updates to rows for values that are apart of the model.
+     * For example, selectedRowId, activeRowId etc. Updates to meta will no rebuild the tree, only re-render visible nodes.
+     */
+    meta?: TMeta;
+    /**
      * An object which represents the root node in the form:
@@ -116,19 +141,7 @@ *
      */
-    onScroll?: (scrollInfo: {
-        scrollTop: number;
-        scrollLeft: number;
-        scrollReason: ScrollReason;
-    }) => void;
+    onScroll?: StickyTreeOnScroll;
     /**
      * Called to indicate that a new render range for rows has been rendered.
      */
-    onRowsRendered?: (renderInfo: {
-        overscanStartIndex: number;
-        overscanStopIndex: number;
-        startIndex: number;
-        stopIndex: number;
-        startNode?: EnhancedStickyTreeNode<TNodeType>;
-        endNode?: EnhancedStickyTreeNode<TNodeType>;
-        nodes: EnhancedStickyTreeNode<TNodeType>[];
-    }) => void;
+    onRowsRendered?: StickyTreeOnRowsRendered<TNodeType>;
     /**
@@ -165,3 +178,3 @@ * Specifies the default row height which will be used if the child or root object do not have a height specified.
 }
-export default class StickyTree<TNodeType extends TreeNode = TreeNode> extends React.PureComponent<StickyTreeProps<TNodeType>, StickyTreeState> {
+export default class StickyTree<TNodeType extends TreeNode = TreeNode, TMeta = any> extends React.PureComponent<StickyTreeProps<TNodeType, TMeta>, StickyTreeState> {
     static defaultProps: {
@@ -181,3 +194,3 @@ overscanRowCount: number;
     private treeToRender;
-    constructor(props: StickyTreeProps<TNodeType>);
+    constructor(props: StickyTreeProps<TNodeType, TMeta>);
     /**
@@ -200,2 +213,3 @@ *  Converts the consumer's tree structure into a flat array with root at index: 0,
     UNSAFE_componentWillUpdate(newProps: StickyTreeProps<TNodeType>, newState: StickyTreeState): void;
+    getNode(nodeId: NodeId): TNodeType;
     /**
@@ -202,0 +216,0 @@ * Returns the index of the node in a flat list tree (post-order traversal).

lib/src/StickyTree.js

@@ -83,2 +83,4 @@ "use strict";
             top: context.totalHeight,
+            isLeafNode: false,
+            meta: stickyNode.meta,
             parentIndex,
@@ -127,2 +129,5 @@ parentInfo: enhancedParentStickyNode,
         }
+        else {
+            enhancedStickyNode.isLeafNode = true;
+        }
         enhancedStickyNode.totalHeight = context.totalHeight - enhancedStickyNode.top;
@@ -164,2 +169,6 @@ return nodes;
     }
+    getNode(nodeId) {
+        var _a;
+        return (_a = this.nodes[this.getNodeIndex(nodeId)]) === null || _a === void 0 ? void 0 : _a.node;
+    }
     /**
@@ -492,3 +501,4 @@ * Returns the index of the node in a flat list tree (post-order traversal).
         }
-        const renderedRow = props.rowRenderer({ node: nodeInfo.node, nodeInfo, style });
+        const RowRenderer = props.rowRenderer;
+        const renderedRow = react_1.default.createElement(RowRenderer, { key: nodeInfo.node.id, node: nodeInfo.node, nodeInfo: nodeInfo, style: style, meta: props.meta });
         if (props.isModelImmutable) {
@@ -592,3 +602,3 @@ this.rowRenderCache[nodeInfo.id] = renderedRow;
     onScroll(e) {
-        const { scrollTop, scrollLeft } = e.currentTarget;
+        const { scrollTop, scrollLeft } = e.target;
         const scrollReason = this.state.scrollReason || ScrollReason.OBSERVED;
@@ -595,0 +605,0 @@ this.setScrollTopAndClosestNode(scrollTop, this.state.currNodePos, scrollReason);

package.json

 {
   "name": "react-virtualized-sticky-tree",
   "description": "A React component for efficiently rendering tree like structures with support for position: sticky",
-  "version": "3.0.0-beta1",
+  "version": "3.0.0-beta10",
   "author": "Marc McIntyre <[e-mail]>",
   "license": "MIT",
-  "main": "lib/index.js",
-  "types": "lib/index.d.ts",
+  "main": "lib/src/index.js",
+  "types": "lib/src/index.d.ts",
   "homepage": "https://github.com/marchaos/react-virtualized-sticky-tree#readme",
@@ -49,3 +49,2 @@ "repository": {
     "@types/react-dom": "^17.0.0",
-    "@types/react-measure": "^2.0.6",
     "babel-loader": "^8.2.1",
@@ -75,4 +74,5 @@ "chai": "^3.5.0",
   "dependencies": {
-    "react-measure": "^2.5.2"
+    "react-measure": "^2.5.2",
+    "@types/react-measure": "^2.0.6"
   }
 }

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

58179

4.16%

Dev dependency count

31

-3.12%

Lines of code

1141

3.63%

Number of medium supply chain risk alerts

0

-100%

Worsened metrics

Dependency count

3

50%

Dependency changes

• + Added

  @types/react-measure@^2.0.6

• + Added

  @types/react@19.1.4
  (transitive)

• + Added

  @types/react-measure@2.0.12
  (transitive)

• + Added

  csstype@3.1.3
  (transitive)