Skip to content

React-tokens to include fallback value for charts #7373

@dlabrecq

Description

@dlabrecq

In order for charts to support the dark theme, the chart theme must use CSS variables. In order for the variables to work, devs must also include PatternFly's chart CSS in their pages. This would be a breaking change, unless the variables include a fallback value, like so:

Before

export const chart_color_blue_100: {
  "name": "--pf-chart-color-blue-100",
  "value": "#8bc1f7",
  "var": "var(--pf-chart-color-blue-100)"
};

After

export const chart_color_blue_100: {
  "name": "--pf-chart-color-blue-100",
  "value": "#8bc1f7",
  "var": "var(--pf-chart-color-blue-100, #8bc1f7)"
};

That said, we would like to change React-tokens to include the fallback value for charts.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions