Skip to content

Commit bccb922

Browse files
adamwathanadamwathan
committed
Use static utilities + a big loop
1 parent c9d759d commit bccb922

File tree

3 files changed

+80
-138
lines changed

3 files changed

+80
-138
lines changed

‎packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap

+30
Original file line numberDiff line numberDiff line change
@@ -1244,6 +1244,36 @@ exports[`getClassList 1`] = `
12441244
"rotate-45",
12451245
"rotate-6",
12461246
"rotate-90",
1247+
"rounded-b-full",
1248+
"rounded-b-none",
1249+
"rounded-bl-full",
1250+
"rounded-bl-none",
1251+
"rounded-br-full",
1252+
"rounded-br-none",
1253+
"rounded-e-full",
1254+
"rounded-e-none",
1255+
"rounded-ee-full",
1256+
"rounded-ee-none",
1257+
"rounded-es-full",
1258+
"rounded-es-none",
1259+
"rounded-full",
1260+
"rounded-l-full",
1261+
"rounded-l-none",
1262+
"rounded-none",
1263+
"rounded-r-full",
1264+
"rounded-r-none",
1265+
"rounded-s-full",
1266+
"rounded-s-none",
1267+
"rounded-se-full",
1268+
"rounded-se-none",
1269+
"rounded-ss-full",
1270+
"rounded-ss-none",
1271+
"rounded-t-full",
1272+
"rounded-t-none",
1273+
"rounded-tl-full",
1274+
"rounded-tl-none",
1275+
"rounded-tr-full",
1276+
"rounded-tr-none",
12471277
"row-auto",
12481278
"row-end-1",
12491279
"row-end-10",

‎packages/tailwindcss/src/utilities.test.ts

+20-20
Original file line numberDiff line numberDiff line change
@@ -5858,8 +5858,8 @@ test('rounded-s', () => {
58585858
}
58595859
58605860
.rounded-s-full {
5861-
border-start-start-radius: 9999px;
5862-
border-end-start-radius: 9999px;
5861+
border-start-start-radius: 3.40282e38px;
5862+
border-end-start-radius: 3.40282e38px;
58635863
}
58645864
58655865
.rounded-s-none {
@@ -5910,8 +5910,8 @@ test('rounded-e', () => {
59105910
}
59115911
59125912
.rounded-e-full {
5913-
border-start-end-radius: 9999px;
5914-
border-end-end-radius: 9999px;
5913+
border-start-end-radius: 3.40282e38px;
5914+
border-end-end-radius: 3.40282e38px;
59155915
}
59165916
59175917
.rounded-e-none {
@@ -5962,8 +5962,8 @@ test('rounded-t', () => {
59625962
}
59635963
59645964
.rounded-t-full {
5965-
border-top-left-radius: 9999px;
5966-
border-top-right-radius: 9999px;
5965+
border-top-left-radius: 3.40282e38px;
5966+
border-top-right-radius: 3.40282e38px;
59675967
}
59685968
59695969
.rounded-t-none {
@@ -6014,8 +6014,8 @@ test('rounded-r', () => {
60146014
}
60156015
60166016
.rounded-r-full {
6017-
border-top-right-radius: 9999px;
6018-
border-bottom-right-radius: 9999px;
6017+
border-top-right-radius: 3.40282e38px;
6018+
border-bottom-right-radius: 3.40282e38px;
60196019
}
60206020
60216021
.rounded-r-none {
@@ -6066,8 +6066,8 @@ test('rounded-b', () => {
60666066
}
60676067
60686068
.rounded-b-full {
6069-
border-bottom-right-radius: 9999px;
6070-
border-bottom-left-radius: 9999px;
6069+
border-bottom-right-radius: 3.40282e38px;
6070+
border-bottom-left-radius: 3.40282e38px;
60716071
}
60726072
60736073
.rounded-b-none {
@@ -6118,8 +6118,8 @@ test('rounded-l', () => {
61186118
}
61196119
61206120
.rounded-l-full {
6121-
border-top-left-radius: 9999px;
6122-
border-bottom-left-radius: 9999px;
6121+
border-top-left-radius: 3.40282e38px;
6122+
border-bottom-left-radius: 3.40282e38px;
61236123
}
61246124
61256125
.rounded-l-none {
@@ -6168,7 +6168,7 @@ test('rounded-ss', () => {
61686168
}
61696169
61706170
.rounded-ss-full {
6171-
border-start-start-radius: 9999px;
6171+
border-start-start-radius: 3.40282e38px;
61726172
}
61736173
61746174
.rounded-ss-none {
@@ -6221,7 +6221,7 @@ test('rounded-se', () => {
62216221
}
62226222
62236223
.rounded-se-full {
6224-
border-start-end-radius: 9999px;
6224+
border-start-end-radius: 3.40282e38px;
62256225
}
62266226
62276227
.rounded-se-none {
@@ -6274,7 +6274,7 @@ test('rounded-ee', () => {
62746274
}
62756275
62766276
.rounded-ee-full {
6277-
border-end-end-radius: 9999px;
6277+
border-end-end-radius: 3.40282e38px;
62786278
}
62796279
62806280
.rounded-ee-none {
@@ -6327,7 +6327,7 @@ test('rounded-es', () => {
63276327
}
63286328
63296329
.rounded-es-full {
6330-
border-end-start-radius: 9999px;
6330+
border-end-start-radius: 3.40282e38px;
63316331
}
63326332
63336333
.rounded-es-none {
@@ -6380,7 +6380,7 @@ test('rounded-tl', () => {
63806380
}
63816381
63826382
.rounded-tl-full {
6383-
border-top-left-radius: 9999px;
6383+
border-top-left-radius: 3.40282e38px;
63846384
}
63856385
63866386
.rounded-tl-none {
@@ -6433,7 +6433,7 @@ test('rounded-tr', () => {
64336433
}
64346434
64356435
.rounded-tr-full {
6436-
border-top-right-radius: 9999px;
6436+
border-top-right-radius: 3.40282e38px;
64376437
}
64386438
64396439
.rounded-tr-none {
@@ -6486,7 +6486,7 @@ test('rounded-br', () => {
64866486
}
64876487
64886488
.rounded-br-full {
6489-
border-bottom-right-radius: 9999px;
6489+
border-bottom-right-radius: 3.40282e38px;
64906490
}
64916491
64926492
.rounded-br-none {
@@ -6539,7 +6539,7 @@ test('rounded-bl', () => {
65396539
}
65406540
65416541
.rounded-bl-full {
6542-
border-bottom-left-radius: 9999px;
6542+
border-bottom-left-radius: 3.40282e38px;
65436543
}
65446544
65456545
.rounded-bl-none {

‎packages/tailwindcss/src/utilities.ts

+30-118
Original file line numberDiff line numberDiff line change
@@ -1952,125 +1952,37 @@ export function createUtilities(theme: Theme) {
19521952
staticUtility('break-keep', [['word-break', 'break-keep']])
19531953

19541954
{
1955-
function handleBareBorderRadiusValue({ value }: NamedUtilityValue) {
1956-
switch (value) {
1957-
case 'none':
1958-
return '0px'
1959-
case 'full':
1960-
return 'calc(infinity * 1px)'
1961-
default:
1962-
return null
1963-
}
1955+
// border-radius
1956+
for (let [root, properties] of [
1957+
['rounded', ['border-radius']],
1958+
['rounded-s', ['border-start-start-radius', 'border-end-start-radius']],
1959+
['rounded-e', ['border-start-end-radius', 'border-end-end-radius']],
1960+
['rounded-t', ['border-top-left-radius', 'border-top-right-radius']],
1961+
['rounded-r', ['border-top-right-radius', 'border-bottom-right-radius']],
1962+
['rounded-b', ['border-bottom-right-radius', 'border-bottom-left-radius']],
1963+
['rounded-l', ['border-top-left-radius', 'border-bottom-left-radius']],
1964+
['rounded-ss', ['border-start-start-radius']],
1965+
['rounded-se', ['border-start-end-radius']],
1966+
['rounded-ee', ['border-end-end-radius']],
1967+
['rounded-es', ['border-end-start-radius']],
1968+
['rounded-tl', ['border-top-left-radius']],
1969+
['rounded-tr', ['border-top-right-radius']],
1970+
['rounded-br', ['border-bottom-right-radius']],
1971+
['rounded-bl', ['border-bottom-left-radius']],
1972+
] as const) {
1973+
staticUtility(
1974+
`${root}-none`,
1975+
properties.map((property) => [property, '0']),
1976+
)
1977+
staticUtility(
1978+
`${root}-full`,
1979+
properties.map((property) => [property, 'calc(infinity * 1px)']),
1980+
)
1981+
functionalUtility(root, {
1982+
themeKeys: ['--radius'],
1983+
handle: (value) => properties.map((property) => decl(property, value)),
1984+
})
19641985
}
1965-
1966-
// rounded-*
1967-
functionalUtility('rounded', {
1968-
themeKeys: ['--radius'],
1969-
handleBareValue: handleBareBorderRadiusValue,
1970-
handle: (value) => [decl('border-radius', value)],
1971-
})
1972-
1973-
functionalUtility('rounded-s', {
1974-
themeKeys: ['--radius'],
1975-
handleBareValue: handleBareBorderRadiusValue,
1976-
handle: (value) => [
1977-
decl('border-start-start-radius', value),
1978-
decl('border-end-start-radius', value),
1979-
],
1980-
})
1981-
1982-
functionalUtility('rounded-e', {
1983-
themeKeys: ['--radius'],
1984-
handleBareValue: handleBareBorderRadiusValue,
1985-
handle: (value) => [
1986-
decl('border-start-end-radius', value),
1987-
decl('border-end-end-radius', value),
1988-
],
1989-
})
1990-
1991-
functionalUtility('rounded-t', {
1992-
themeKeys: ['--radius'],
1993-
handleBareValue: handleBareBorderRadiusValue,
1994-
handle: (value) => [
1995-
decl('border-top-left-radius', value),
1996-
decl('border-top-right-radius', value),
1997-
],
1998-
})
1999-
2000-
functionalUtility('rounded-r', {
2001-
themeKeys: ['--radius'],
2002-
handleBareValue: handleBareBorderRadiusValue,
2003-
handle: (value) => [
2004-
decl('border-top-right-radius', value),
2005-
decl('border-bottom-right-radius', value),
2006-
],
2007-
})
2008-
2009-
functionalUtility('rounded-b', {
2010-
themeKeys: ['--radius'],
2011-
handleBareValue: handleBareBorderRadiusValue,
2012-
handle: (value) => [
2013-
decl('border-bottom-right-radius', value),
2014-
decl('border-bottom-left-radius', value),
2015-
],
2016-
})
2017-
2018-
functionalUtility('rounded-l', {
2019-
themeKeys: ['--radius'],
2020-
handleBareValue: handleBareBorderRadiusValue,
2021-
handle: (value) => [
2022-
decl('border-top-left-radius', value),
2023-
decl('border-bottom-left-radius', value),
2024-
],
2025-
})
2026-
2027-
functionalUtility('rounded-ss', {
2028-
themeKeys: ['--radius'],
2029-
handleBareValue: handleBareBorderRadiusValue,
2030-
handle: (value) => [decl('border-start-start-radius', value)],
2031-
})
2032-
2033-
functionalUtility('rounded-se', {
2034-
themeKeys: ['--radius'],
2035-
handleBareValue: handleBareBorderRadiusValue,
2036-
handle: (value) => [decl('border-start-end-radius', value)],
2037-
})
2038-
2039-
functionalUtility('rounded-ee', {
2040-
themeKeys: ['--radius'],
2041-
handleBareValue: handleBareBorderRadiusValue,
2042-
handle: (value) => [decl('border-end-end-radius', value)],
2043-
})
2044-
2045-
functionalUtility('rounded-es', {
2046-
themeKeys: ['--radius'],
2047-
handleBareValue: handleBareBorderRadiusValue,
2048-
handle: (value) => [decl('border-end-start-radius', value)],
2049-
})
2050-
2051-
functionalUtility('rounded-tl', {
2052-
themeKeys: ['--radius'],
2053-
handleBareValue: handleBareBorderRadiusValue,
2054-
handle: (value) => [decl('border-top-left-radius', value)],
2055-
})
2056-
2057-
functionalUtility('rounded-tr', {
2058-
themeKeys: ['--radius'],
2059-
handleBareValue: handleBareBorderRadiusValue,
2060-
handle: (value) => [decl('border-top-right-radius', value)],
2061-
})
2062-
2063-
functionalUtility('rounded-br', {
2064-
themeKeys: ['--radius'],
2065-
handleBareValue: handleBareBorderRadiusValue,
2066-
handle: (value) => [decl('border-bottom-right-radius', value)],
2067-
})
2068-
2069-
functionalUtility('rounded-bl', {
2070-
themeKeys: ['--radius'],
2071-
handleBareValue: handleBareBorderRadiusValue,
2072-
handle: (value) => [decl('border-bottom-left-radius', value)],
2073-
})
20741986
}
20751987

20761988
staticUtility('border-solid', [

0 commit comments

Comments
 (0)