search

carbon-design-system / carbon-for-ibm-dotcom

Carbon for IBM.com is based on the Carbon Design System for IBM
https://www.ibm.com/standards/carbon/
Apache License 2.0
261 stars 156 forks source link

[Tree view] New component #7196

Open shixiedesign opened 2 years ago

shixiedesign commented 2 years ago

Background

Carbon's tree view component currently exist in Carbon react experimental: Tree view and is a very accessibility friendly navigational component. We have many use cases that could benefit from this component include IBM Docs and SDMA. We would like to build this component in Carbon for IBM.com web components, and later contribute any enhancement to Carbon react.

Task

This is a new component for us. Bulk of the design work should be done and specs exist. It needs a little bit of review / evaluation with adopters (IBM Docs, SDMA) to make sure the design is complete and will serve their needs. Then functional spec, and development, website and QA.

The website ticket we may work with Carbon core team. Here are the existing documentations: Draft PR: https://carbon-website-git-fork-designertyler-treeview03092020-c-54d75e.vercel.app/components/tree-view/usage Notion (latest from Lauren): https://carbondesignsystem.notion.site/Usage-941b49cbba5c4f0abc7b072294f61bbf

Enhancements needed on

  1. Text label wrap to multiple lines
  2. Micro animation
  3. Number of tiers of indent

Regarding accessibility

Regarding keyboard accessibility: https://w3c.github.io/aria-practices/#TreeView

from Michael Gower (IBM)

Trees are also very keyboard friendly :) There are no tabs in a tree view. It's one tab stop all arrow interaction

Teams interested to adopt this component

RobertaJHahn commented 2 years ago

Convert an epic, design refinement issue, func spec, WC & React Wrapper issues, QA & website

Notes no longer valid. Changed course as the design resources will not have time to work on this component. See comments below for updated list.

RobertaJHahn commented 2 years ago

Create the Carbon WC dev issue & assign to Andrew, No React, visual QA

Design issues may be done after dev

jeffchew commented 2 years ago

Currently blocked by epic https://github.com/carbon-design-system/carbon/issues/11722.