@react-stately/tree - npm Package Compare versions

Comparing version 3.0.0-alpha.1 to 3.0.0-nightly.672

dist/main.js

@@ -1,50 +0,142 @@
-var _babelRuntimeHelpersSlicedToArray = $parcel$interopDefault(require("@babel/runtime/helpers/slicedToArray"));
+var {
+  useControlledState
+} = require("@react-stately/utils");
 
-var _temp = require("@react-stately/collections");
+var {
+  useCollection
+} = require("@react-stately/collections");
 
-var CollectionBuilder = _temp.CollectionBuilder;
-var TreeCollection = _temp.TreeCollection;
+var {
+  SelectionManager,
+  useMultipleSelectionState
+} = require("@react-stately/selection");
 
-var useMemo = require("react").useMemo;
+var {
+  useEffect,
+  useMemo
+} = require("react");
 
-var _temp2 = require("@react-stately/selection");
+let $f4c7caecb598119f63e2918a55ec91a9$var$_Symbol$iterator;
+$f4c7caecb598119f63e2918a55ec91a9$var$_Symbol$iterator = Symbol.iterator;
 
-var SelectionManager = _temp2.SelectionManager;
-var useMultipleSelectionState = _temp2.useMultipleSelectionState;
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+class $f4c7caecb598119f63e2918a55ec91a9$export$TreeCollection {
+  constructor(nodes, _temp) {
+    var _last;
 
-var useControlledState = require("@react-stately/utils").useControlledState;
+    let {
+      expandedKeys
+    } = _temp === void 0 ? {} : _temp;
+    this.keyMap = new Map();
+    this.iterable = void 0;
+    this.firstKey = void 0;
+    this.lastKey = void 0;
+    this.iterable = nodes;
+    expandedKeys = expandedKeys || new Set();
 
-function $parcel$interopDefault(a) {
-  return a && a.__esModule ? a.default : a;
+    let visit = node => {
+      this.keyMap.set(node.key, node);
+
+      if (node.childNodes && (node.type === 'section' || expandedKeys.has(node.key))) {
+        for (let child of node.childNodes) {
+          visit(child);
+        }
+      }
+    };
+
+    for (let node of nodes) {
+      visit(node);
+    }
+
+    let last;
+    let index = 0;
+
+    for (let [key, node] of this.keyMap) {
+      if (last) {
+        last.nextKey = key;
+        node.prevKey = last.key;
+      } else {
+        this.firstKey = key;
+        node.prevKey = undefined;
+      }
+
+      if (node.type === 'item') {
+        node.index = index++;
+      }
+
+      last = node; // Set nextKey as undefined since this might be the last node
+      // If it isn't the last node, last.nextKey will properly set at start of new loop
+
+      last.nextKey = undefined;
+    }
+
+    this.lastKey = (_last = last) == null ? void 0 : _last.key;
+  }
+
+  *[$f4c7caecb598119f63e2918a55ec91a9$var$_Symbol$iterator]() {
+    yield* this.iterable;
+  }
+
+  get size() {
+    return this.keyMap.size;
+  }
+
+  getKeys() {
+    return this.keyMap.keys();
+  }
+
+  getKeyBefore(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.prevKey : null;
+  }
+
+  getKeyAfter(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.nextKey : null;
+  }
+
+  getFirstKey() {
+    return this.firstKey;
+  }
+
+  getLastKey() {
+    return this.lastKey;
+  }
+
+  getItem(key) {
+    return this.keyMap.get(key);
+  }
+
 }
 
+/**
+ * Provides state management for tree-like components. Handles building a collection
+ * of items from props, item expanded state, and manages multiple selection state.
+ */
 function useTreeState(props) {
-  var _useControlledState = useControlledState(props.expandedKeys ? new Set(props.expandedKeys) : undefined, props.defaultExpandedKeys ? new Set(props.defaultExpandedKeys) : new Set(), props.onExpandedChange),
-      _useControlledState2 = _babelRuntimeHelpersSlicedToArray(_useControlledState, 2),
-      expandedKeys = _useControlledState2[0],
-      setExpandedKeys = _useControlledState2[1];
+  let [expandedKeys, setExpandedKeys] = useControlledState(props.expandedKeys ? new Set(props.expandedKeys) : undefined, props.defaultExpandedKeys ? new Set(props.defaultExpandedKeys) : new Set(), props.onExpandedChange);
+  let selectionState = useMultipleSelectionState(props);
+  let disabledKeys = useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : new Set(), [props.disabledKeys]);
+  let tree = useCollection(props, nodes => new $f4c7caecb598119f63e2918a55ec91a9$export$TreeCollection(nodes, {
+    expandedKeys
+  })); // Reset focused key if that item is deleted from the collection.
 
-  var selectionState = useMultipleSelectionState(props);
-  var disabledKeys = useMemo(function () {
-    return props.disabledKeys ? new Set(props.disabledKeys) : new Set();
-  }, [props.disabledKeys]);
-  var builder = useMemo(function () {
-    return new CollectionBuilder(props.itemKey);
-  }, [props.itemKey]);
-  var tree = useMemo(function () {
-    var nodes = builder.build(props, function (key) {
-      return {
-        isExpanded: expandedKeys.has(key),
-        isSelected: selectionState.selectedKeys.has(key),
-        isDisabled: disabledKeys.has(key),
-        isFocused: key === selectionState.focusedKey
-      };
-    });
-    return new TreeCollection(nodes);
-  }, [builder, props, expandedKeys, selectionState.selectedKeys, selectionState.focusedKey, disabledKeys]);
+  useEffect(() => {
+    if (selectionState.focusedKey != null && !tree.getItem(selectionState.focusedKey)) {
+      selectionState.setFocusedKey(null);
+    }
+  }, [tree, selectionState.focusedKey]);
 
-  var onToggle = function onToggle(key) {
-    setExpandedKeys(function (expandedKeys) {
-      return $dd94371a435f0424310d5df3b91ea8ae$var$toggleKey(expandedKeys, key);
-    });
+  let onToggle = key => {
+    setExpandedKeys(expandedKeys => $f01b8043d944d5f04fffbeb1df9fd6cb$var$toggleKey(expandedKeys, key));
   };
@@ -54,4 +146,4 @@
     collection: tree,
-    expandedKeys: expandedKeys,
-    disabledKeys: disabledKeys,
+    expandedKeys,
+    disabledKeys,
     toggleKey: onToggle,
@@ -64,4 +156,4 @@ selectionManager: new SelectionManager(tree, selectionState)
 
-function $dd94371a435f0424310d5df3b91ea8ae$var$toggleKey(set, key) {
-  var res = new Set(set);
+function $f01b8043d944d5f04fffbeb1df9fd6cb$var$toggleKey(set, key) {
+  let res = new Set(set);
 
@@ -75,2 +167,3 @@ if (res.has(key)) {
   return res;
-}
+}
+//# sourceMappingURL=main.js.map

dist/module.js

@@ -1,5 +0,112 @@
-import { CollectionBuilder, TreeCollection } from "@react-stately/collections";
-import { useMemo } from "react";
+import { useControlledState } from "@react-stately/utils";
+import { useCollection } from "@react-stately/collections";
 import { SelectionManager, useMultipleSelectionState } from "@react-stately/selection";
-import { useControlledState } from "@react-stately/utils";
+import { useEffect, useMemo } from "react";
+let $afa6f708e32ecf7f97d9a58dfd59c$var$_Symbol$iterator;
+$afa6f708e32ecf7f97d9a58dfd59c$var$_Symbol$iterator = Symbol.iterator;
+
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+class $afa6f708e32ecf7f97d9a58dfd59c$export$TreeCollection {
+  constructor(nodes, _temp) {
+    var _last;
+
+    let {
+      expandedKeys
+    } = _temp === void 0 ? {} : _temp;
+    this.keyMap = new Map();
+    this.iterable = void 0;
+    this.firstKey = void 0;
+    this.lastKey = void 0;
+    this.iterable = nodes;
+    expandedKeys = expandedKeys || new Set();
+
+    let visit = node => {
+      this.keyMap.set(node.key, node);
+
+      if (node.childNodes && (node.type === 'section' || expandedKeys.has(node.key))) {
+        for (let child of node.childNodes) {
+          visit(child);
+        }
+      }
+    };
+
+    for (let node of nodes) {
+      visit(node);
+    }
+
+    let last;
+    let index = 0;
+
+    for (let [key, node] of this.keyMap) {
+      if (last) {
+        last.nextKey = key;
+        node.prevKey = last.key;
+      } else {
+        this.firstKey = key;
+        node.prevKey = undefined;
+      }
+
+      if (node.type === 'item') {
+        node.index = index++;
+      }
+
+      last = node; // Set nextKey as undefined since this might be the last node
+      // If it isn't the last node, last.nextKey will properly set at start of new loop
+
+      last.nextKey = undefined;
+    }
+
+    this.lastKey = (_last = last) == null ? void 0 : _last.key;
+  }
+
+  *[$afa6f708e32ecf7f97d9a58dfd59c$var$_Symbol$iterator]() {
+    yield* this.iterable;
+  }
+
+  get size() {
+    return this.keyMap.size;
+  }
+
+  getKeys() {
+    return this.keyMap.keys();
+  }
+
+  getKeyBefore(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.prevKey : null;
+  }
+
+  getKeyAfter(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.nextKey : null;
+  }
+
+  getFirstKey() {
+    return this.firstKey;
+  }
+
+  getLastKey() {
+    return this.lastKey;
+  }
+
+  getItem(key) {
+    return this.keyMap.get(key);
+  }
+
+}
+
+/**
+ * Provides state management for tree-like components. Handles building a collection
+ * of items from props, item expanded state, and manages multiple selection state.
+ */
 export function useTreeState(props) {
@@ -9,15 +116,14 @@ let [expandedKeys, setExpandedKeys] = useControlledState(props.expandedKeys ? new Set(props.expandedKeys) : undefined, props.defaultExpandedKeys ? new Set(props.defaultExpandedKeys) : new Set(), props.onExpandedChange);
   let disabledKeys = useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : new Set(), [props.disabledKeys]);
-  let builder = useMemo(() => new CollectionBuilder(props.itemKey), [props.itemKey]);
-  let tree = useMemo(() => {
-    let nodes = builder.build(props, key => ({
-      isExpanded: expandedKeys.has(key),
-      isSelected: selectionState.selectedKeys.has(key),
-      isDisabled: disabledKeys.has(key),
-      isFocused: key === selectionState.focusedKey
-    }));
-    return new TreeCollection(nodes);
-  }, [builder, props, expandedKeys, selectionState.selectedKeys, selectionState.focusedKey, disabledKeys]);
+  let tree = useCollection(props, nodes => new $afa6f708e32ecf7f97d9a58dfd59c$export$TreeCollection(nodes, {
+    expandedKeys
+  })); // Reset focused key if that item is deleted from the collection.
 
+  useEffect(() => {
+    if (selectionState.focusedKey != null && !tree.getItem(selectionState.focusedKey)) {
+      selectionState.setFocusedKey(null);
+    }
+  }, [tree, selectionState.focusedKey]);
+
   let onToggle = key => {
-    setExpandedKeys(expandedKeys => $e56539661b1cae5db2e995db1aab0fcf$var$toggleKey(expandedKeys, key));
+    setExpandedKeys(expandedKeys => $f51dc3c5c900bd3cdb4a06df11d84697$var$toggleKey(expandedKeys, key));
   };
@@ -34,3 +140,3 @@
 
-function $e56539661b1cae5db2e995db1aab0fcf$var$toggleKey(set, key) {
+function $f51dc3c5c900bd3cdb4a06df11d84697$var$toggleKey(set, key) {
   let res = new Set(set);
@@ -45,2 +151,3 @@
   return res;
-}
+}
+//# sourceMappingURL=module.js.map

dist/types.d.ts

@@ -1,14 +0,24 @@
-import { Collection, Node } from "@react-stately/collections";
-import { CollectionBase, Expandable, MultipleSelection } from "@react-types/shared";
+import { Collection, CollectionBase, Expandable, MultipleSelection, Node } from "@react-types/shared";
 import { Key } from "react";
 import { SelectionManager } from "@react-stately/selection";
+interface TreeProps<T> extends CollectionBase<T>, Expandable, MultipleSelection {
+}
 export interface TreeState<T> {
-    collection: Collection<Node<T>>;
-    expandedKeys: Set<Key>;
-    disabledKeys: Set<Key>;
-    toggleKey: (key: Key) => void;
-    selectionManager: SelectionManager;
+    /** A collection of items in the tree. */
+    readonly collection: Collection<Node<T>>;
+    /** A set of keys for items that are disabled. */
+    readonly disabledKeys: Set<Key>;
+    /** A set of keys for items that are expanded. */
+    readonly expandedKeys: Set<Key>;
+    /** Toggles the expanded state for an item by its key. */
+    toggleKey(key: Key): void;
+    /** A selection manager to read and update multiple selection state. */
+    readonly selectionManager: SelectionManager;
 }
-export function useTreeState<T>(props: CollectionBase<T> & Expandable & MultipleSelection): TreeState<T>;
+/**
+ * Provides state management for tree-like components. Handles building a collection
+ * of items from props, item expanded state, and manages multiple selection state.
+ */
+export function useTreeState<T extends object>(props: TreeProps<T>): TreeState<T>;
 
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@react-stately/tree",
-  "version": "3.0.0-alpha.1",
+  "version": "3.0.0-nightly.672+9853bacb",
   "description": "Spectrum UI components in React",
@@ -11,3 +11,4 @@ "license": "Apache-2.0",
   "files": [
-    "dist"
+    "dist",
+    "src"
   ],
@@ -17,10 +18,10 @@ "sideEffects": false,
     "type": "git",
-    "url": "https://github.com/adobe-private/react-spectrum-v3"
+    "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
     "@babel/runtime": "^7.6.2",
-    "@react-stately/collections": "^3.0.0-alpha.1",
-    "@react-stately/selection": "^3.0.0-alpha.1",
-    "@react-stately/utils": "^3.0.0-rc.2",
-    "@react-types/shared": "^3.0.0-rc.2"
+    "@react-stately/collections": "3.0.0-nightly.672+9853bacb",
+    "@react-stately/selection": "3.0.0-nightly.672+9853bacb",
+    "@react-stately/utils": "3.0.0-nightly.672+9853bacb",
+    "@react-types/shared": "3.0.0-nightly.672+9853bacb"
   },
@@ -33,3 +34,3 @@ "peerDependencies": {
   },
-  "gitHead": "207e6ee9076905c96638a7f81a367758872e1410"
+  "gitHead": "9853bacb98dd37c64faf573e5cb1a6493e2e6f08"
 }

README.md

 # @react-stately/tree
 
-This package is part of [react-spectrum](https://github.com/adobe-private/react-spectrum-v3). See the repo for more details.
+This package is part of [react-spectrum](https://github.com/adobe/react-spectrum). See the repo for more details.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

49496

increased by182.24%

Number of package files

12

increased by71.43%

Lines of code

442

increased by313.08%

Worsened metrics

Number of medium supply chain risk alerts

2

increased byInfinity%

Dependency changes

• - Removed@react-stately/collections@3.11.0(transitive)

• - Removed@react-stately/selection@3.17.0(transitive)

• - Removed@react-stately/utils@3.10.4(transitive)

• - Removed@react-types/shared@3.25.0(transitive)

• - Removed@swc/helpers@0.5.13(transitive)

• - Removedtslib@2.8.0(transitive)

• Updated@react-stately/collections@3.0.0-nightly.672+9853bacb

• Updated@react-stately/selection@3.0.0-nightly.672+9853bacb

• Updated@react-stately/utils@3.0.0-nightly.672+9853bacb

• Updated@react-types/shared@3.0.0-nightly.672+9853bacb