Skip to content

Outline styles aren't parsed in React Native #467

@pmleczek

Description

@pmleczek

Describe the issue

The documentation states that outline* style props should be supported (and have built-in React Native support) -

| outlineColor ||| |
| outlineOffset ||| |
| outlineStyle ||| |
| outlineWidth ||| |

In reality in React Native, they're properly parsed only if criteria for version.experimental are met:

if (version.experimental) {
allowedStyleKeySet.add('outlineColor');
allowedStyleKeySet.add('outlineOffset');
allowedStyleKeySet.add('outlineStyle');
allowedStyleKeySet.add('outlineWidth');
}

Expected behavior

outline* styles are correctly parsed as they're long-present functionality of RN (available since 0.77) or alternatively documentation provides correct information and specifies how to turn on the experimental support

Steps to reproduce

RSD version: 0.0.55
React Native version: 0.84.0
React version: 19.2.3
Browser: Google Chrome

  1. Define CSS styles using outline properties:
const styles = css.create({
  test: {
    outlineColor: "#000000",
    outlineWidth: 1,
    outlineStyle: "solid",
});
  1. Apply them to a component:
<html.div style={styles.test}>...</html.div>
  1. Render the component in a React Native app and observe how the styles are rendered

  2. (Optionally) console.log the resolved styles - the outline properties will be excluded

Test case

No response

Additional comments

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions