You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
feat(material/tree): revamp tree data model, accessibility and documentation
Iterate on Tree component to improve its data model, accessibility and documentation.
Introduce levelAcessor and childrenAccessor as an alternative to TreeController. Given a data node, childrenAccessor determines the children of that node. Given a data node, levelAccessor determines level of the node. One of levelAccessor or childrenAccessor must be specified, not both.
Implement keyboard navigation in Tree component to align with [WAI ARIA Tree View Pattern](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/).
Make changes directly to Cdk tree API, which also apply to Mat tree APIs. See “Breaking Change” and “Deprecated” sections below for specifics on adopting changes.
Accessibility improvements
* Implement keyboard navigation for CdkTree and MatTree
* Implement keyboard usability for CdkTreeNodeToggle.
* Improve ARIA semantics for CdkTree, CdkTreeNode, Tree and TreeNode components
* Make accessibility fixes to tree and cdk-tree examples
* Add accessibility instructions to documentation
Documentation updates
* Add API and usage examples for TreeKeyManager
* Update @angular/cdk/tree and @angular/material/tree to be more consistent
* Update examples to use levelAccessor and childrenAccessor
* Add example for (activation) on MatTreeNode and CdkTreeNode
BREAKING CHANGE: Tree component uses a levelAcessor or childrenAccessor as alternative to a controller.
- CdkTree requires either a levelAccessor or childrenAccessor as Input. Cannot specify both.
- CdkTree optionally takes a expansionKey as Input. expansionKey is a function that returns key of a given node. CdkTree uses key to determine expanded state.
- Add isExpanded, toggle, expand and collapse methods to CdkTree
- Add toggleDescendants, expandDescendants, and collapseDescendants methods to CdkTree
- Add expandAll and collapseAll methods to CdkTree
BREAKING CHANGE: By default, tree nodes cannot be expanded and collapsed. Use isExpanded function to specify nodes that can be expanded and collapsed.
- Add isExpandable and isExpanded Inputs to CdkTreeNode to specify if argument tree node can be expanded or collapsed.
- Add isExpandable function to NestedTreeControlOptions to determine if argument tree node can be expanded or collapsed.
BREAKING CHANGE: Add methods and Outputs to CdkTreeNode to manage the activated, expanded and collapsed state.
- Add activate, expand and collapse methods to CdkTreeNode
- Add activation Output to CdkTreeNode
- Add expandedChange Output to CdkTreeNode
BREAKING CHANGE: Use isDisabled to set the disabled state of tree nodes.
- Add isDisabled Input to CdkTreeNode. By default, nodes are not disabled.
BREAKING CHANGE: MatTree and CdkTree components responds to keyboard navigation.
- CdkTree and MatTree respond to arrow keys, page up, page down, etc.; Keyboard commands align with [WAI ARIA Tree View Pattern](https://www.w3.org/WAI/ARIA/apg/patterns/treeview/).
- Add TreeKeyManager class
- CdkTree consumes TreeKeyManager
- Can no longer set the tabindex on MatTreeNode. MatTreeNode ignores the passed value of tabindex. MatTreeNode always has a tabindex attribute of “-1”.
BREAKING CHANGE: CdkTreeNodeToggle directive and component respond to keyboard navigation.
- CdkTreeNodeToggle toggles expanded state on Enter or Space keypress
DEPRECATED: Tree controllers deprecated. Use one of levelAccessor or childrenAccessor instead. To be removed in a future version.
* BaseTreeControl deprecated
* TreeControl deprecated
* FlatTreeControl deprecated
* NestedTreeControl deprecated
* treeControl Input on CdkTree deprecated in favor of using one of levelAccessor childrenAccessor Inputs.
DEPRECATED: Setting tabindex of tree nodes deprecated.
* `@Input tabIndex` on `MatTreeNode` deprecated. MatTreeNode ignores Input tabIndex and manages its own focus behavior.
* `@Input defaultTabIndex` on `MatTreeNode` deprecated. MatTreeNode ignores Input defaultTabIndex and manages its own focus behavior.
* `@Input tabIndex` on `MatNestedTreeNode` deprecated. MatTreeNode ignores Input defaultTabIndex and manages its own focus behavior.
DEPRECATED: disabled Input renamed to isDiabled. disabled to be deleted in a future version.
* disabled Input deprecated and alias to isDisabled
* disabled Input deprecated and alias to isDiabled
0 commit comments