@instructure/ui-tree-browser 8.10.1 → 8.10.3-snapshot.12

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.10.2](https://github.com/instructure/instructure-ui/compare/v8.10.1...v8.10.2) (2021-10-01)
+
+**Note:** Version bump only for package @instructure/ui-tree-browser
+
 ## [8.10.1](https://github.com/instructure/instructure-ui/compare/v8.10.0...v8.10.1) (2021-10-01)
 
 **Note:** Version bump only for package @instructure/ui-tree-browser

package/LICENSE.md

@@ -0,0 +1,27 @@
+---
+title: The MIT License (MIT)
+category: Getting Started
+order: 9
+---
+
+# The MIT License (MIT)
+
+Copyright (c) 2015 Instructure, Inc.
+
+**Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions.**
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/es/TreeBrowser/TreeButton/index.js

@@ -44,9 +44,11 @@ id: TreeBrowser.Button
 let TreeButton = (_dec = withStyle(generateStyles, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeButton extends Component {
   constructor(...args) {
     super(...args);
+    this.ref = null;
 
     this.handleRef = el => {
       el && this.props.containerRef(el.parentElement);
+      this.ref = el;
     };
   }
 

package/es/TreeBrowser/TreeCollection/index.js

@@ -46,6 +46,7 @@ id: TreeBrowser.Collection
 let TreeCollection = (_dec = withStyle(generateStyles, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeCollection extends Component {
   constructor(props) {
     super(props);
+    this.ref = null;
 
     this.handleFocus = (e, item) => {
       e.stopPropagation();
@@ -298,6 +299,9 @@ let TreeCollection = (_dec = withStyle(generateStyles, generateComponentTheme),
     const ariaSelected = {};
     if (this.props.selection) ariaSelected['aria-selected'] = this.props.selection === `collection_${id}`;
     return isCollectionFlattened ? this.renderChildren() : jsx("li", Object.assign({
+      ref: el => {
+        this.ref = el;
+      },
       css: styles === null || styles === void 0 ? void 0 : styles.treeCollection,
       tabIndex: "-1",
       role: "treeitem",

package/es/TreeBrowser/TreeNode/index.js

@@ -47,9 +47,11 @@ in the TreeBrowser.
 let TreeNode = (_dec = withStyle(generateStyles, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeNode extends Component {
   constructor(...args) {
     super(...args);
+    this.ref = null;
 
     this.handleRef = el => {
       el && this.props.containerRef(el.parentElement);
+      this.ref = el;
     };
   }
 

package/es/TreeBrowser/index.js

@@ -46,6 +46,7 @@ category: components
 let TreeBrowser = (_dec = withStyle(generateStyles, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeBrowser extends Component {
   constructor(props) {
     super(props);
+    this.ref = null;
 
     this.handleCollectionClick = (e, collection, expand = true) => {
       e.stopPropagation();
@@ -311,7 +312,9 @@ let TreeBrowser = (_dec = withStyle(generateStyles, generateComponentTheme), _de
       role: "tree",
       onKeyDown: this.handleKeyDown,
       ref: el => {
-        this._root = el;
+        this._root = el; // TODO remove this and keep only 'ref' in V9
+
+        this.ref = el;
       },
       "aria-label": this.props.treeLabel
     }, this.renderRoot());

package/lib/TreeBrowser/TreeButton/index.js

@@ -35,9 +35,11 @@ id: TreeBrowser.Button
 let TreeButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeButton extends _react.Component {
   constructor(...args) {
     super(...args);
+    this.ref = null;
 
     this.handleRef = el => {
       el && this.props.containerRef(el.parentElement);
+      this.ref = el;
     };
   }
 

package/lib/TreeBrowser/TreeCollection/index.js

@@ -36,6 +36,7 @@ id: TreeBrowser.Collection
 let TreeCollection = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeCollection extends _react.Component {
   constructor(props) {
     super(props);
+    this.ref = null;
 
     this.handleFocus = (e, item) => {
       e.stopPropagation();
@@ -288,6 +289,9 @@ let TreeCollection = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.def
     const ariaSelected = {};
     if (this.props.selection) ariaSelected['aria-selected'] = this.props.selection === `collection_${id}`;
     return isCollectionFlattened ? this.renderChildren() : (0, _emotion.jsx)("li", Object.assign({
+      ref: el => {
+        this.ref = el;
+      },
       css: styles === null || styles === void 0 ? void 0 : styles.treeCollection,
       tabIndex: "-1",
       role: "treeitem",

package/lib/TreeBrowser/TreeNode/index.js

@@ -37,9 +37,11 @@ in the TreeBrowser.
 let TreeNode = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeNode extends _react.Component {
   constructor(...args) {
     super(...args);
+    this.ref = null;
 
     this.handleRef = el => {
       el && this.props.containerRef(el.parentElement);
+      this.ref = el;
     };
   }
 

package/lib/TreeBrowser/index.js

@@ -45,6 +45,7 @@ category: components
 let TreeBrowser = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_temp = _class2 = class TreeBrowser extends _react.Component {
   constructor(props) {
     super(props);
+    this.ref = null;
 
     this.handleCollectionClick = (e, collection, expand = true) => {
       e.stopPropagation();
@@ -310,7 +311,9 @@ let TreeBrowser = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defaul
       role: "tree",
       onKeyDown: this.handleKeyDown,
       ref: el => {
-        this._root = el;
+        this._root = el; // TODO remove this and keep only 'ref' in V9
+
+        this.ref = el;
       },
       "aria-label": this.props.treeLabel
     }, this.renderRoot());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-tree-browser",
-  "version": "8.10.1",
+  "version": "8.10.3-snapshot.12+af470a237",
   "description": "A component for displaying a hierarchical view of information",
   "author": "Instructure, Inc. Engineering and Product Design",
   "type": "commonjs",
@@ -24,22 +24,22 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.10.1",
-    "@instructure/ui-color-utils": "8.10.1",
-    "@instructure/ui-test-locator": "8.10.1",
-    "@instructure/ui-test-utils": "8.10.1",
-    "@instructure/ui-themes": "8.10.1"
+    "@instructure/ui-babel-preset": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-color-utils": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-test-locator": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-test-utils": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-themes": "8.10.3-snapshot.12+af470a237"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/emotion": "8.10.1",
-    "@instructure/shared-types": "8.10.1",
-    "@instructure/ui-icons": "8.10.1",
-    "@instructure/ui-img": "8.10.1",
-    "@instructure/ui-prop-types": "8.10.1",
-    "@instructure/ui-react-utils": "8.10.1",
-    "@instructure/ui-testable": "8.10.1",
-    "@instructure/ui-utils": "8.10.1",
+    "@instructure/emotion": "8.10.3-snapshot.12+af470a237",
+    "@instructure/shared-types": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-icons": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-img": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-prop-types": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-react-utils": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-testable": "8.10.3-snapshot.12+af470a237",
+    "@instructure/ui-utils": "8.10.3-snapshot.12+af470a237",
     "keycode": "^2",
     "prop-types": "^15"
   },
@@ -49,5 +49,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "gitHead": "af470a2374463c265ed1304870b7890fc8bb09a4"
 }

package/src/TreeBrowser/TreeButton/index.tsx

@@ -70,6 +70,7 @@ class TreeButton extends Component<TreeBrowserButtonProps> {
     containerRef: function () {},
     renderContent: undefined
   }
+  ref: Element | null = null
 
   componentDidMount() {
     this.props.makeStyles?.()
@@ -148,6 +149,7 @@ class TreeButton extends Component<TreeBrowserButtonProps> {
   handleRef = (el) => {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     el && this.props.containerRef(el.parentElement)
+    this.ref = el
   }
 
   render() {

package/src/TreeBrowser/TreeCollection/index.tsx

@@ -82,6 +82,7 @@ class TreeCollection extends Component<TreeBrowserCollectionProps> {
     isCollectionFlattened: false,
     renderContent: undefined
   }
+  ref: Element | null = null
 
   // @ts-expect-error ts-migrate(7006) FIXME: Parameter 'props' implicitly has an 'any' type.
   constructor(props) {
@@ -392,6 +393,9 @@ class TreeCollection extends Component<TreeBrowserCollectionProps> {
       this.renderChildren()
     ) : (
       <li
+        ref={(el) => {
+          this.ref = el
+        }}
         css={styles?.treeCollection}
         // @ts-expect-error ts-migrate(2322) FIXME: Type 'string' is not assignable to type 'number | ... Remove this comment to see the full error message
         tabIndex="-1"

package/src/TreeBrowser/TreeNode/index.tsx

@@ -71,6 +71,8 @@ class TreeNode extends Component<TreeBrowserNodeProps> {
     onClick: undefined
   }
 
+  ref: Element | null = null
+
   componentDidMount() {
     this.props.makeStyles?.()
   }
@@ -82,6 +84,7 @@ class TreeNode extends Component<TreeBrowserNodeProps> {
   handleRef = (el) => {
     // @ts-expect-error ts-migrate(2722) FIXME: Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
     el && this.props.containerRef(el.parentElement)
+    this.ref = el
   }
 
   // @ts-expect-error ts-migrate(7030) FIXME: Not all code paths return a value.

package/src/TreeBrowser/index.tsx

@@ -79,6 +79,7 @@ class TreeBrowser extends Component<TreeBrowserProps> {
   static Node = TreeNode
   static Collection = TreeCollection
   static Button = TreeButton
+  ref: Element | null = null
 
   // @ts-expect-error ts-migrate(7006) FIXME: Parameter 'props' implicitly has an 'any' type.
   constructor(props) {
@@ -385,7 +386,8 @@ class TreeBrowser extends Component<TreeBrowserProps> {
         onKeyDown={this.handleKeyDown}
         ref={(el) => {
           // @ts-expect-error ts-migrate(2339) FIXME: Property '_root' does not exist on type 'TreeBrows... Remove this comment to see the full error message
-          this._root = el
+          this._root = el // TODO remove this and keep only 'ref' in V9
+          this.ref = el
         }}
         aria-label={this.props.treeLabel}
       >