Skip to content

Commit 1b105ff

Browse files
authored
style(biome): update biome to lint css code (#2025)
2 parents b9b03fb + fcb36ec commit 1b105ff

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

68 files changed

+8588
-19098
lines changed

.github/workflows/pr.yml

-3
Original file line numberDiff line numberDiff line change
@@ -37,9 +37,6 @@ jobs:
3737
- name: Code lint
3838
run: pnpm lint
3939

40-
- name: Stylelint
41-
run: pnpm stylelint **/*.css
42-
4340
- name: Test
4441
run: pnpm test:ci
4542

biome.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,8 @@
4343
"a11y": {
4444
"noSvgWithoutTitle": "off",
4545
"useButtonType": "off",
46-
"useKeyWithClickEvents": "off"
46+
"useKeyWithClickEvents": "off",
47+
"noLabelWithoutControl": "off"
4748
},
4849
"suspicious": {
4950
"noExplicitAny": "off",

examples/next-14x/.eslintrc.json

-3
This file was deleted.

examples/next-14x/package.json

+1-4
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,7 @@
55
"scripts": {
66
"dev": "next dev",
77
"build": "next build",
8-
"start": "next start",
9-
"lint": "next lint"
8+
"start": "next start"
109
},
1110
"dependencies": {
1211
"@tanstack/react-table": "8.13.2",
@@ -21,8 +20,6 @@
2120
"@types/node": "^20",
2221
"@types/react": "^18",
2322
"@types/react-dom": "^18",
24-
"eslint": "^8",
25-
"eslint-config-next": "14.1.3",
2623
"typescript": "^5"
2724
}
2825
}

examples/shoreline-nextjs-integration/next-env.d.ts

-4
This file was deleted.

package.json

+2-9
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@
2727
"build:storybook": "pnpm build && pnpm storybook build",
2828
"test": "vitest",
2929
"version": "lerna run version",
30-
"lint:css": "stylelint \"**/*.css\"",
3130
"chromatic": "chromatic --exit-zero-on-changes --build-script-name=build:storybook",
3231
"gen:component": "plop component",
3332
"create:icon": "plop icon",
@@ -37,12 +36,11 @@
3736
"test:ci": "pnpm test",
3837
"test:storybook": "pnpm run build:storybook:ci && pnpm dlx playwright install chromium --with-deps && test-storybook --browsers chromium",
3938
"test:storybook:ci": "concurrently -k -s first -n storybook@shoreline,test:storybook@shoreline -c magenta,blue \"http-server storybook-static --port 6006 --silent\" \"wait-on tcp:127.0.0.1:6006 && pnpm run test:storybook\"",
40-
"lint:ci": "pnpm lint",
4139
"prepare": "husky install",
4240
"commitlint": "commitlint --edit"
4341
},
4442
"devDependencies": {
45-
"@biomejs/biome": "1.8.3",
43+
"@biomejs/biome": "1.9.4",
4644
"@chromatic-com/storybook": "^1",
4745
"@commitlint/cli": "^9.1.2",
4846
"@commitlint/config-conventional": "^9.1.2",
@@ -63,7 +61,6 @@
6361
"@types/react": "18.2.14",
6462
"@types/react-dom": "18.2.6",
6563
"@vitejs/plugin-react": "4.1.0",
66-
"@vtex/shoreline-stylelint": "workspace:*",
6764
"@vtex/shoreline-test-utils": "workspace:*",
6865
"chromatic": "^9.1.0",
6966
"commitizen": "^4.2.0",
@@ -81,9 +78,6 @@
8178
"react-dom": "18.2.0",
8279
"react-test-renderer": "18.2.0",
8380
"storybook": "^8.0.9",
84-
"stylelint": "^15.11.0",
85-
"stylelint-config-recommended": "^13.0.0",
86-
"stylelint-prettier": "^4.0.2",
8781
"tslib": "2.6.3",
8882
"tsup": "8.1.0",
8983
"turbo": "2.0.9",
@@ -93,8 +87,7 @@
9387
"wait-on": "7.2.0"
9488
},
9589
"lint-staged": {
96-
"*.{ts,tsx,js,jsx,json}": "biome check --write .",
97-
"*.css": "stylelint \"**/*.css\" --fix"
90+
"*.{ts,tsx,js,jsx,json,css}": "biome check --write ."
9891
},
9992
"config": {
10093
"commitizen": {

packages/docs/components/decorative-box/decorative-box.module.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%239C92AC' fill-opacity='0.2' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
1414
}
1515

16-
.decorativeBox[data-subtle='true'] {
16+
.decorativeBox[data-subtle="true"] {
1717
background-color: transparent;
1818
border: none;
1919
border-radius: 0;

packages/docs/components/img-card/img-card-grid.module.css

+3-3
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,9 @@
77
display: grid;
88
width: 100%;
99
grid-template-columns: repeat(
10-
auto-fill,
11-
minmax(max(250px, calc((100% - 1.25rem * 2) / var(--rows))), 1fr)
12-
);
10+
auto-fill,
11+
minmax(max(250px, calc((100% - 1.25rem * 2) / var(--rows))), 1fr)
12+
);
1313
gap: var(--sl-space-5);
1414
margin: var(--mt) var(--mr) var(--mb) var(--ml);
1515
}

packages/docs/components/preview/preview.module.css

+5-13
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,7 @@
77
}
88

99
.previewWrapper {
10-
--sl-local-bg: color-mix(
11-
in srgb,
12-
var(--sl-color-gray-1) 50%,
13-
transparent 50%
14-
);
10+
--sl-local-bg: color-mix(in srgb, var(--sl-color-gray-1) 50%, transparent 50%);
1511
padding: var(--space);
1612
min-height: var(--min-h);
1713
height: fit-content;
@@ -23,19 +19,15 @@
2319
transition: all 250ms cubic-bezier(0, 0.12, 0, 1.05);
2420
}
2521

26-
.previewWrapper[data-theme='muted'] {
27-
--sl-local-bg: color-mix(
28-
in srgb,
29-
var(--sl-color-gray-1) 50%,
30-
transparent 50%
31-
);
22+
.previewWrapper[data-theme="muted"] {
23+
--sl-local-bg: color-mix(in srgb, var(--sl-color-gray-1) 50%, transparent 50%);
3224
}
3325

34-
.previewWrapper[data-theme='base'] {
26+
.previewWrapper[data-theme="base"] {
3527
--sl-local-bg: var(--sl-bg-base);
3628
}
3729

38-
.previewWrapper[data-fixed-height='true'] {
30+
.previewWrapper[data-fixed-height="true"] {
3931
height: var(--min-h);
4032
}
4133

packages/docs/components/props-docs/props-docs.module.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -24,12 +24,12 @@
2424
display: inline-flex;
2525
}
2626

27-
.tag[data-color='purple'] {
27+
.tag[data-color="purple"] {
2828
--color: #6847ba;
2929
--background: #6847ba14;
3030
}
3131

32-
.tag[data-color='green'] {
32+
.tag[data-color="green"] {
3333
--color: #458443;
3434
--background: #45844314;
3535
}

packages/docs/components/tokens-grid/cell.module.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,6 @@
99
white-space: pre-line;
1010
}
1111

12-
.cell[data-type='preview'] {
12+
.cell[data-type="preview"] {
1313
padding-right: var(--sl-space-0);
1414
}

packages/docs/components/tokens-grid/grid.module.css

+4-4
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,18 @@
33
grid-template-columns: 2fr 2fr 5rem;
44
}
55

6-
.grid[data-foundation='breakpoint'] {
6+
.grid[data-foundation="breakpoint"] {
77
grid-template-columns: 2fr 2fr 2fr;
88
}
99

10-
.grid[data-foundation='elevation'] {
10+
.grid[data-foundation="elevation"] {
1111
grid-template-columns: 2fr 3fr 5rem;
1212
}
1313

14-
.grid[data-foundation='space'] {
14+
.grid[data-foundation="space"] {
1515
grid-template-columns: 2fr 1fr 1fr;
1616
}
1717

18-
.grid[data-foundation='radius'] {
18+
.grid[data-foundation="radius"] {
1919
grid-template-columns: 2fr 1fr 5rem;
2020
}

packages/docs/components/tokens-grid/preview-cell.module.css

+24-24
Original file line numberDiff line numberDiff line change
@@ -7,81 +7,81 @@
77
letter-spacing: var(--sl-text-body-letter-spacing);
88
}
99

10-
.previewCell[data-foundation='color'],
11-
.previewCell[data-foundation='bg'],
12-
.previewCell[data-foundation='fg'] {
10+
.previewCell[data-foundation="color"],
11+
.previewCell[data-foundation="bg"],
12+
.previewCell[data-foundation="fg"] {
1313
background: var(--value);
1414
height: var(--cell-size);
1515
width: var(--cell-size);
1616
border-radius: var(--sl-radius-2);
1717
}
1818

19-
.previewCell[data-foundation='border'] {
19+
.previewCell[data-foundation="border"] {
2020
border: var(--value);
2121
background: transparent;
2222
height: var(--cell-size);
2323
width: var(--cell-size);
2424
border-radius: var(--sl-radius-2);
2525
}
2626

27-
.previewCell[data-foundation='radius'] {
27+
.previewCell[data-foundation="radius"] {
2828
background: var(--sl-color-gray-5);
2929
height: var(--cell-size);
3030
width: var(--cell-size);
3131
border-radius: var(--value);
3232
}
3333

34-
.previewCell[data-foundation='space'] {
34+
.previewCell[data-foundation="space"] {
3535
background: var(--sl-color-gray-5);
3636
height: var(--cell-size);
3737
width: var(--value);
3838
border-radius: var(--sl-space-05);
3939
}
4040

41-
.previewCell[data-foundation='letter-spacing'],
42-
.previewCell[data-foundation='font-size'],
43-
.previewCell[data-foundation='font-weight'],
44-
.previewCell[data-foundation='text'],
45-
.previewCell[data-foundation='line-height'] {
41+
.previewCell[data-foundation="letter-spacing"],
42+
.previewCell[data-foundation="font-size"],
43+
.previewCell[data-foundation="font-weight"],
44+
.previewCell[data-foundation="text"],
45+
.previewCell[data-foundation="line-height"] {
4646
display: flex;
4747
align-items: center;
4848
height: var(--cell-size);
4949
}
5050

51-
.previewCell[data-foundation='letter-spacing']::after,
52-
.previewCell[data-foundation='font-size']::after,
53-
.previewCell[data-foundation='font-weight']::after,
54-
.previewCell[data-foundation='text']::after,
55-
.previewCell[data-foundation='line-height']::after {
56-
content: 'Aa';
51+
.previewCell[data-foundation="letter-spacing"]::after,
52+
.previewCell[data-foundation="font-size"]::after,
53+
.previewCell[data-foundation="font-weight"]::after,
54+
.previewCell[data-foundation="text"]::after,
55+
.previewCell[data-foundation="line-height"]::after {
56+
content: "Aa";
5757
}
5858

59-
.previewCell[data-foundation='letter-spacing'] {
59+
.previewCell[data-foundation="letter-spacing"] {
6060
font-size: 0.875rem;
6161
letter-spacing: var(--value);
6262
}
6363

64-
.previewCell[data-foundation='font-size'] {
64+
.previewCell[data-foundation="font-size"] {
6565
font-size: var(--value);
6666
}
6767

68-
.previewCell[data-foundation='line-height'] {
68+
.previewCell[data-foundation="line-height"] {
6969
font-size: 0.875rem;
7070
line-height: var(--value);
7171
}
7272

73-
.previewCell[data-foundation='font-weight'] {
73+
.previewCell[data-foundation="font-weight"] {
7474
font-size: 0.875rem;
7575
font-weight: var(--value);
7676
}
7777

78-
.previewCell[data-foundation='text'] {
78+
.previewCell[data-foundation="text"] {
7979
font: var(--preview-cell-text-font);
8080
letter-spacing: var(--preview-cell-text-letter-spacing);
8181
}
8282

83-
.previewCell[data-foundation='shadow'],
84-
.previewCell[data-foundation='focus-ring'] {
83+
.previewCell[data-foundation="shadow"],
84+
.previewCell[data-foundation="focus-ring"] {
8585
height: var(--cell-size);
8686
width: var(--cell-size);
8787
display: flex;

packages/docs/pages/global.css

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/**
2-
* Nextra Overrides
3-
*/
2+
* Nextra Overrides
3+
*/
44

55
h2.nx-border-b {
66
border: none;
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
11
.ch-examples {
2-
height: 100vh;
2+
height: 100vh;
33
}
44

55
.ch-center {
6-
display: flex;
7-
flex-direction: column;
8-
align-items: center;
9-
justify-content: center;
6+
display: flex;
7+
flex-direction: column;
8+
align-items: center;
9+
justify-content: center;
1010
}
1111

1212
.ch-decorative-box {
13-
padding: 3rem;
14-
background-clip: padding-box;
15-
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%239C92AC' fill-opacity='0.2' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
13+
padding: 3rem;
14+
background-clip: padding-box;
15+
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%239C92AC' fill-opacity='0.2' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
1616
}
1717

1818
.ch-bg-purple {
19-
background-color: var(--sl-color-purple-1);
19+
background-color: var(--sl-color-purple-1);
2020
}
2121

2222
.ch-bg-green {
23-
background-color: var(--sl-color-green-1);
24-
}
23+
background-color: var(--sl-color-green-1);
24+
}
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.screen-container {
22
width: 80%;
33
height: 80vh;
4-
border: var(--sl-border-base)
4+
border: var(--sl-border-base);
55
}

packages/shoreline/src/components/label/stories/show.stories.tsx

+5-3
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,11 @@ export function Show() {
1010
<Stack>
1111
<Label>Label</Label>
1212
<Label optional>Label</Label>
13-
<Stack role="group" space="$space-1">
14-
<Label htmlFor="example">Label for input</Label>
15-
<input id="example" />
13+
<Stack asChild space="$space-1">
14+
<fieldset>
15+
<Label htmlFor="example">Label for input</Label>
16+
<input id="example" />
17+
</fieldset>
1618
</Stack>
1719
</Stack>
1820
)

0 commit comments

Comments
 (0)