LiveStyle.Compiler.CSS.DynamicProperties (LiveStyle v0.13.1)

View Source

Generates @property rules for dynamic CSS variables.

Dynamic classes use CSS variables that are set at runtime via inline styles. To prevent these variables from being inherited by pseudo-elements (which can cause unexpected behavior), we generate @property rules with inherits: false.

This matches StyleX's behavior where dynamic styles generate:

@property --x-opacity { syntax: "*"; inherits: false; }

Why inherits: false?

Without this, a pseudo-element like ::before would inherit the CSS variable value from its parent, which may not be the intended behavior for dynamic styles. Setting inherits: false ensures each element must explicitly set the variable.

Summary

Functions

Generates @property rules for all dynamic CSS variables in the manifest.

Functions

generate(manifest)

@spec generate(LiveStyle.Manifest.t()) :: String.t()

Generates @property rules for all dynamic CSS variables in the manifest.

Returns a string containing all @property rules, or empty string if none.