Skip to content

Commit

Permalink
refactor(tokens): rename rule
Browse files Browse the repository at this point in the history
  • Loading branch information
adamviktora committed Sep 16, 2024
1 parent 6188763 commit a2ec857
Show file tree
Hide file tree
Showing 6 changed files with 31 additions and 24 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
### tokens-update

We have updated our CSS tokens. About half of our tokens have been replaced with newer ones.

- this rule provides an autofix for global non color tokens
- global color tokens will be replaced with a temporary hot pink color token (`temp_dev_tbd` react token or `--pf-t--temp--dev--tbd` class)
- don't forget to replace these tokens later
- other non-global (component or chart) tokens need to be replaced manually

To find a suitable replacement token, check our [v6 token documentation](https://staging-v6.patternfly.org/tokens/all-patternfly-tokens).

#### Examples

In:

```jsx
%inputExample%
```

Out:

```jsx
%outputExample%
```
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
const ruleTester = require("../../ruletester");
import * as rule from "./tokens-warn";
import * as rule from "./tokens-update";

const getWarnMessage = (tokenName: string) =>
`${tokenName} is an old CSS token. About half of our tokens have been replaced with newer ones. To find a suitable replacement token, check our new documentation https://staging-v6.patternfly.org/tokens/all-patternfly-tokens.`;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,15 @@ document.documentElement.style.setProperty("--pf-v5-global--ZIndex--lg", "3");
></div>;

// warnings (not fixable)
import global_warning_color_100 from "@patternfly/react-tokens/dist/esm/global_warning_color_100";
import c_badge_PaddingLeft from "@patternfly/react-tokens/dist/esm/c_badge_PaddingLeft";
import { c_alert__FontSize } from "@patternfly/react-tokens";

global_warning_color_100;
c_badge_PaddingLeft;
c_alert__FontSize;

<div
style={{
color: "var(--pf-v5-global--success-color--200)",
fontSize: "var(--pf-v5-c-alert__FontSize)",
width: "var(--pf-v5-global--arrow--width)",
}}
></div>;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,15 @@ document.documentElement.style.setProperty("--pf-t--global--z-index--lg", "3");
></div>;

// warnings (not fixable)
import global_warning_color_100 from "@patternfly/react-tokens/dist/esm/global_warning_color_100";
import c_badge_PaddingLeft from "@patternfly/react-tokens/dist/esm/c_badge_PaddingLeft";
import { c_alert__FontSize } from "@patternfly/react-tokens";

global_warning_color_100;
c_badge_PaddingLeft;
c_alert__FontSize;

<div
style={{
color: "var(--pf-v5-global--success-color--200)",
fontSize: "var(--pf-v5-c-alert__FontSize)",
width: "var(--pf-v5-global--arrow--width)",
}}
></div>;
Expand Down

This file was deleted.

0 comments on commit a2ec857

Please sign in to comment.