@spec apply_prefix_css(String.t(), String.t()) :: String.t()

Applies the configured prefix_css function to a property-value pair.

Returns the CSS string. If no prefix_css is configured, returns the standard "property:value" format.

@spec class_name_prefix() :: String.t()

Returns the configured class name prefix.

Default is "x" (matching StyleX). This prefix is used for all generated class names, variable names, keyframe names, etc.

Returns the configuration for the given profile.

Raises if the profile does not exist.

Example

LiveStyle.Config.config_for!(:default)
#=> [output: "priv/static/assets/css/live.css", cd: "/path/to/project"]

@spec debug_class_names?() :: boolean()

Returns whether debug class names are enabled.

When enabled, class names include the property name for easier debugging:

• Disabled: x1a2b3c4
• Enabled: backgroundColor-x1a2b3c4

Default is false. Enable in development for easier debugging:

config :live_style, debug_class_names: true

Returns the deprecated? function for checking deprecated CSS properties.

Used during validation to check if properties are deprecated. Should be a function that takes a property name and returns a boolean (or nil if unknown).

Default is nil (no deprecation checking).

Configuration

config :live_style, deprecated?: &MyAppWeb.CSS.deprecated?/1

Function Signature

@spec deprecated?(String.t()) :: boolean() | nil

Returns the level of deprecated property handling.

When a deprecated CSS property is used (e.g., clip), this setting controls the behavior. Requires the deprecated? config to be set.

• :warn (default) - Log a warning about the deprecated property
• :ignore - Silently allow deprecated properties

Example:

config :live_style, deprecated_property_level: :ignore

@spec font_size_px_to_rem?() :: boolean()

Returns whether font-size px to rem conversion is enabled.

When enabled, numeric font-size values in px are converted to rem for better accessibility (respects user's browser font size settings).

Default is false. Enable for accessibility:

config :live_style,
  font_size_px_to_rem: true,
  font_size_root_px: 16  # optional, default is 16

@spec font_size_root_px() :: number()

Returns the root font size in pixels for px to rem conversion.

Default is 16 (browser default). Used when font_size_px_to_rem is enabled.

Returns the configured output path for CSS.

This is a convenience function that returns the default profile's output path. For profile-specific paths, use config_for!/1.

Returns the prefix_css function for adding vendor prefixes.

Called during CSS generation to add vendor prefixes. Should be a function that takes (property, value) and returns a CSS string with any needed prefixes.

Default is nil (no prefixing).

Configuration

config :live_style, prefix_css: &MyAppWeb.CSS.prefix/2

Function Signature

@spec prefix_css(String.t(), String.t()) :: String.t()

Example Implementation

def prefix_css("user-select", value) do
  "-webkit-user-select:#{value};user-select:#{value}"
end
def prefix_css(property, value), do: "#{property}:#{value}"

Returns the configured shorthand expansion behavior and options.

Returns a tuple of {module, opts} where opts is a keyword list.

Examples

# Default
shorthand_behavior() #=> {LiveStyle.ShorthandBehavior.AcceptShorthands, []}

# Using atom shortcut
shorthand_behavior() #=> {LiveStyle.ShorthandBehavior.FlattenShorthands, []}

# Custom behavior with options
shorthand_behavior() #=> {MyCustomBehavior, [strict: true]}

Returns the level of unknown property handling.

• :warn (default) - Log a warning with suggestions
• :error - Raise a CompileError
• :ignore - Silently allow unknown properties

Example:

config :live_style, unknown_property_level: :error

Returns whether CSS layers should be used for specificity control.

When enabled, CSS rules are grouped by priority level into separate @layer priorityN blocks. This matches StyleX's useLayers: true behavior.

Priority levels are calculated as div(priority, 1000):

• Priority 0-999 → @layer priority1 (non-style rules like @property, @keyframes)
• Priority 1000-1999 → @layer priority2 (shorthand of shorthands)
• Priority 2000-2999 → @layer priority3 (shorthand of longhands)
• Priority 3000-3999 → @layer priority4 (regular properties)
• Priority 4000-4999 → @layer priority5 (physical longhands)
• Priority 5000+ → @layer priority6+ (pseudo-elements)

When disabled (default), uses the :not(#\#) selector hack instead, matching StyleX's default behavior.

Enable for StyleX useLayers: true compatibility:

config :live_style, use_css_layers: true

Returns whether property validation is enabled.

When enabled, LiveStyle validates CSS property names at compile time and warns or errors on unknown properties with "did you mean?" suggestions.

Custom properties (starting with --) are always allowed.

Default is true. Disable if you need to use non-standard properties:

config :live_style, validate_properties: false

Returns the level of vendor prefix property handling.

When a vendor-prefixed property is used (e.g., -webkit-mask-image) and the configured prefix_css would add that prefix automatically for the standard property (e.g., mask-image), this setting controls the behavior.

• :warn (default) - Log a warning suggesting to use the standard property
• :ignore - Silently allow vendor-prefixed properties

Example:

config :live_style, vendor_prefix_level: :ignore