Feature request: Add pseudo-class/pseudo-element specificity data

[lifeiscontent]

Summary

It would be helpful to have specificity information for CSS pseudo-classes and pseudo-elements, indicating their relative priority when multiple pseudo-selectors are used.

Use Case

CSS-in-JS libraries need to output pseudo-class styles in the correct order to ensure proper cascade behavior. For example:

a:link { }     /* should come before :visited */
a:visited { }  /* should come before :hover */
a:hover { }    /* should come before :active */
a:active { }   /* highest priority among LVHA */

The LVHA order (Link, Visited, Hover, Active) is well-known, but there are many other pseudo-classes with implicit ordering requirements.

Current State

The selectors data includes pseudo-classes and pseudo-elements but no specificity or priority information:

{
  "name": ":hover",
  ...
}

Proposed Enhancement

Add priority/specificity data to pseudo-selectors:

{
  "name": ":link",
  "type": "pseudo-class",
  "specificityGroup": "lvha",
  "priorityInGroup": 1,
  ...
}
{
  "name": ":visited",
  "type": "pseudo-class", 
  "specificityGroup": "lvha",
  "priorityInGroup": 2,
  ...
}
{
  "name": ":hover",
  "type": "pseudo-class",
  "specificityGroup": "lvha", 
  "priorityInGroup": 3,
  ...
}
{
  "name": ":active",
  "type": "pseudo-class",
  "specificityGroup": "lvha",
  "priorityInGroup": 4,
  ...
}

Or a simpler numeric priority:

{
  "name": ":hover",
  "pseudoPriority": 10,
  ...
}
{
  "name": ":active",
  "pseudoPriority": 20,
  ...
}
{
  "name": ":focus",
  "pseudoPriority": 15,
  ...
}

Affected Selectors

Key pseudo-classes that need ordering:

• :link, :visited, :hover, :active (LVHA order)
• :focus, :focus-visible, :focus-within
• :disabled, :enabled
• :checked, :indeterminate
• Structural pseudos (:first-child, :last-child, etc.)