Summary

• Design a markup structure for the light and shadow DOM
• Design component variants, props, parts, slots, and vars

Research and planning tasks

• Gather code samples from the landscape
  • Note: Use the Landscape analysis code samples template to collect relevant code samples from across the landscape
• Identify and document the component’s critical content
  • Document the component content that is critical for end-user understanding. Note: This critical content should always appear on the page, even in non-JS environments.
• Design and document the structure for the light DOM
• Design and document the structure for the shadow DOM
• Design and document the expected component customization methods
  • List and define the proposed component variants
  • List and define props
  • List and define slots
  • List and define CSS Parts
  • List and define CSS Variables
  • List any component content that will need to be translated into other languages