Feature request: Add RTL-sensitive value properties list

[lifeiscontent]

Summary

It would be helpful to have a list of CSS properties whose values need to be flipped/mirrored in RTL (right-to-left) writing modes.

Use Case

CSS-in-JS libraries generating RTL stylesheets need to know which properties have values that should be mirrored. For example:

/* LTR */
text-align: left;
float: left;
transform: translateX(10px);

/* RTL - values need flipping */
text-align: right;
float: right;
transform: translateX(-10px);

Current State

There's no indication of which properties have direction-sensitive values that need transformation in RTL contexts.

Proposed Enhancement

Add an rtlValueFlip or directionSensitive field:

{
  "name": "text-align",
  "directionSensitiveValues": true,
  "rtlValueMap": {
    "left": "right",
    "right": "left"
  },
  ...
}

{
  "name": "float",
  "directionSensitiveValues": true,
  "rtlValueMap": {
    "left": "right",
    "right": "left"
  },
  ...
}

{
  "name": "clear",
  "directionSensitiveValues": true,
  ...
}

Or a simpler list of properties:

{
  "rtlSensitiveProperties": [
    "text-align",
    "float",
    "clear",
    "background-position",
    "background-position-x",
    "transform-origin",
    "perspective-origin",
    "object-position"
  ]
}

Affected Properties

Properties with direction-sensitive values:

• text-align (left ↔ right)
• float (left ↔ right)
• clear (left ↔ right)
• background-position, background-position-x
• transform-origin, perspective-origin
• object-position
• Various transform functions (translateX values need sign flip)