microsoft / microsoft/TypeScript

Request: Way to target Compound Components (eg. React) in a theme specifically. (<MyComponent.*>)

Open
#62,040 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Awaiting More Feedback Suggestion
Dominant language
Go
Stars
111k
Forks
14.3k
Avg merge
2d 4h
Merged PRs (30d)
132

Description

Not sure if other libraries offer something similar, but react has this way of building compound components that result in a code like this:

Image

I think this pattern is quite widely adopted, specially in UI component libraries and is quite versatile and powerful.

What I don't like about it that it becomes extremely hard to read

Image

I would like the way to identify the compound components (slot components) - (or compound part of the name / or both) and set different color to them

so I can get something like

Image

or

Image

would this be possible?

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No source files, tests, or entry points are named. Start by determining whether TypeScript owns the requested theme-targeting behavior or whether it belongs to an editor or syntax-highlighting project; done means compound component names or parts can receive distinct theme colors.

Written by the indexing model from the issue text.

Assessment

Tech stack
react
Domain
tooling
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.