As a designer, I want to see which alias tokens are being used by the component-level tokens of each design system component in Storybook, so that it helps me to define the tokens for new components.
ACs
- All component pages in Storybook contain a section where component-level tokens are listed (tbd. After the first story writing, we might need to change the location)
- The list or table contains both the component-level tokens and their alias values (the concrete values are not needed)
ACs of the current proposal
- The content of the tokens list is dictated by the selected knob configuration (see mock in Figma in Figma)
tbd: engineers will discuss whether this is feasible
Notes/concerns regarding the current visualization approach:
- The content of the tab is influenced by the Knobs configuration made the user. So, for example, I would only see medium destructive button tokens if that's the typology I select to demo. Is that possible? will be discussed, see above
- In the list, tokens are grouped under headings: how much of the current viz code could be reused here? Answer: cannot be reused. Have to rethink the grouping to avoid manual efforts where possible.
Will look into an alternative approach (e.g. use of Docs tab, or create a new tokens doc page) after getting feedback from engineers regarding feasibility
