Skip to content

Commit 593f58a

Browse files
adamwathanadamwathan
authored
Merge branch 'next' into fix/negative-bare-values
2 parents ac6d81c + a51b63a commit 593f58a

File tree

7 files changed

+351
-65
lines changed

7 files changed

+351
-65
lines changed

‎CHANGELOG.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
1717
- Ensure individual variants from groups are always sorted earlier than stacked variants from the same groups ([#14431](https://github.com/tailwindlabs/tailwindcss/pull/14431))
1818
- Allow `anchor-size(…)` in arbitrary values ([#14394](https://github.com/tailwindlabs/tailwindcss/pull/14394))
1919
- Skip candidates with invalid `theme()` calls ([#14437](https://github.com/tailwindlabs/tailwindcss/pull/14437))
20+
- Don't generate `inset-*` utilities for `--inset-shadow-*` and `--inset-ring-*` theme values ([#14447](https://github.com/tailwindlabs/tailwindcss/pull/14447))
2021
- Disallow negative bare values in core utilities and variants ([#14453](https://github.com/tailwindlabs/tailwindcss/pull/14453))
2122

23+
### Changed
24+
25+
- Don't override explicit `leading-*`, `tracking-*`, or `font-{weight}` utilities with font-size utility defaults ([#14403](https://github.com/tailwindlabs/tailwindcss/pull/14403))
26+
2227
## [4.0.0-alpha.24] - 2024-09-11
2328

2429
### Added

‎packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap‎

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -586,7 +586,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
586586
@layer utilities {
587587
.text-2xl {
588588
font-size: var(--font-size-2xl, 1.5rem);
589-
line-height: var(--font-size-2xl--line-height, 2rem);
589+
line-height: var(--tw-leading, var(--font-size-2xl--line-height, 2rem));
590590
}
591591
592592
.text-black\\/50 {
@@ -599,11 +599,20 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
599599
600600
@media (width >= 96rem) {
601601
.\\32 xl\\:font-bold {
602+
--tw-font-weight: 700;
602603
font-weight: 700;
603604
}
604605
}
605606
}
606607
608+
@supports (-moz-orient: inline) {
609+
@layer base {
610+
*, :before, :after, ::backdrop {
611+
--tw-font-weight: initial;
612+
}
613+
}
614+
}
615+
607616
@keyframes spin {
608617
to {
609618
transform: rotate(360deg);
@@ -633,5 +642,10 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
633642
animation-timing-function: cubic-bezier(0, 0, .2, 1);
634643
transform: none;
635644
}
645+
}
646+
647+
@property --tw-font-weight {
648+
syntax: "*";
649+
inherits: false
636650
}"
637651
`;

‎packages/tailwindcss/src/ast.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export function rule(selector: string, nodes: AstNode[]): Rule {
2626
}
2727
}
2828

29-
export function decl(property: string, value: string): Declaration {
29+
export function decl(property: string, value: string | undefined): Declaration {
3030
return {
3131
kind: 'declaration',
3232
property,

‎packages/tailwindcss/src/compat/config.test.ts‎

Lines changed: 37 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -301,35 +301,49 @@ describe('theme callbacks', () => {
301301

302302
expect(compiler.build(['leading-base', 'leading-md', 'leading-xl', 'prose']))
303303
.toMatchInlineSnapshot(`
304-
":root {
305-
--font-size-base: 100rem;
306-
--font-size-md--line-height: 101rem;
307-
}
308-
.prose {
309-
[class~=lead-base] {
310-
font-size: 100rem;
304+
":root {
305+
--font-size-base: 100rem;
306+
--font-size-md--line-height: 101rem;
307+
}
308+
.prose {
309+
[class~=lead-base] {
310+
font-size: 100rem;
311+
line-height: 201rem;
312+
}
313+
[class~=lead-md] {
314+
font-size: 200rem;
315+
line-height: 101rem;
316+
}
317+
[class~=lead-xl] {
318+
font-size: 200rem;
319+
line-height: 201rem;
320+
}
321+
}
322+
.leading-base {
323+
--tw-leading: 201rem;
311324
line-height: 201rem;
312325
}
313-
[class~=lead-md] {
314-
font-size: 200rem;
326+
.leading-md {
327+
--tw-leading: 101rem;
315328
line-height: 101rem;
316329
}
317-
[class~=lead-xl] {
318-
font-size: 200rem;
330+
.leading-xl {
331+
--tw-leading: 201rem;
319332
line-height: 201rem;
320333
}
321-
}
322-
.leading-base {
323-
line-height: 201rem;
324-
}
325-
.leading-md {
326-
line-height: 101rem;
327-
}
328-
.leading-xl {
329-
line-height: 201rem;
330-
}
331-
"
332-
`)
334+
@supports (-moz-orient: inline) {
335+
@layer base {
336+
*, ::before, ::after, ::backdrop {
337+
--tw-leading: initial;
338+
}
339+
}
340+
}
341+
@property --tw-leading {
342+
syntax: "*";
343+
inherits: false;
344+
}
345+
"
346+
`)
333347
})
334348
})
335349

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

Lines changed: 85 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -911,26 +911,26 @@ test('col-start', async () => {
911911
expect(
912912
await run(['col-start-auto', 'col-start-4', 'col-start-99', 'col-start-[123]', '-col-start-4']),
913913
).toMatchInlineSnapshot(`
914-
".-col-start-4 {
915-
grid-column-start: calc(4 * -1);
916-
}
914+
".-col-start-4 {
915+
grid-column-start: calc(4 * -1);
916+
}
917917
918-
.col-start-4 {
919-
grid-column-start: 4;
920-
}
918+
.col-start-4 {
919+
grid-column-start: 4;
920+
}
921921
922-
.col-start-99 {
923-
grid-column-start: 99;
924-
}
922+
.col-start-99 {
923+
grid-column-start: 99;
924+
}
925925
926-
.col-start-\\[123\\] {
927-
grid-column-start: 123;
928-
}
926+
.col-start-\\[123\\] {
927+
grid-column-start: 123;
928+
}
929929
930-
.col-start-auto {
931-
grid-column-start: auto;
932-
}"
933-
`)
930+
.col-start-auto {
931+
grid-column-start: auto;
932+
}"
933+
`)
934934
expect(
935935
await run([
936936
'col-start',
@@ -11585,19 +11585,36 @@ test('font', async () => {
1158511585
}
1158611586
1158711587
.font-\\[--my-family\\] {
11588+
--tw-font-weight: var(--my-family);
1158811589
font-weight: var(--my-family);
1158911590
}
1159011591
1159111592
.font-\\[100\\] {
11593+
--tw-font-weight: 100;
1159211594
font-weight: 100;
1159311595
}
1159411596
1159511597
.font-\\[number\\:--my-weight\\] {
11598+
--tw-font-weight: var(--my-weight);
1159611599
font-weight: var(--my-weight);
1159711600
}
1159811601
1159911602
.font-bold {
11603+
--tw-font-weight: 700;
1160011604
font-weight: 700;
11605+
}
11606+
11607+
@supports (-moz-orient: inline) {
11608+
@layer base {
11609+
*, :before, :after, ::backdrop {
11610+
--tw-font-weight: initial;
11611+
}
11612+
}
11613+
}
11614+
11615+
@property --tw-font-weight {
11616+
syntax: "*";
11617+
inherits: false
1160111618
}"
1160211619
`)
1160311620
expect(
@@ -13224,15 +13241,31 @@ test('leading', async () => {
1322413241
}
1322513242
1322613243
.leading-6 {
13244+
--tw-leading: var(--line-height-6, 1.5rem);
1322713245
line-height: var(--line-height-6, 1.5rem);
1322813246
}
1322913247
1323013248
.leading-\\[--value\\] {
13249+
--tw-leading: var(--value);
1323113250
line-height: var(--value);
1323213251
}
1323313252
1323413253
.leading-none {
13254+
--tw-leading: var(--line-height-none, 1);
1323513255
line-height: var(--line-height-none, 1);
13256+
}
13257+
13258+
@supports (-moz-orient: inline) {
13259+
@layer base {
13260+
*, :before, :after, ::backdrop {
13261+
--tw-leading: initial;
13262+
}
13263+
}
13264+
}
13265+
13266+
@property --tw-leading {
13267+
syntax: "*";
13268+
inherits: false
1323613269
}"
1323713270
`)
1323813271
expect(
@@ -13267,19 +13300,36 @@ test('tracking', async () => {
1326713300
}
1326813301
1326913302
.-tracking-\\[--value\\] {
13303+
--tw-tracking: calc(var(--value) * -1);
1327013304
letter-spacing: calc(var(--value) * -1);
1327113305
}
1327213306
1327313307
.tracking-\\[--value\\] {
13308+
--tw-tracking: var(--value);
1327413309
letter-spacing: var(--value);
1327513310
}
1327613311
1327713312
.tracking-normal {
13313+
--tw-tracking: var(--letter-spacing-normal, 0em);
1327813314
letter-spacing: var(--letter-spacing-normal, 0em);
1327913315
}
1328013316
1328113317
.tracking-wide {
13318+
--tw-tracking: var(--letter-spacing-wide, .025em);
1328213319
letter-spacing: var(--letter-spacing-wide, .025em);
13320+
}
13321+
13322+
@supports (-moz-orient: inline) {
13323+
@layer base {
13324+
*, :before, :after, ::backdrop {
13325+
--tw-tracking: initial;
13326+
}
13327+
}
13328+
}
13329+
13330+
@property --tw-tracking {
13331+
syntax: "*";
13332+
inherits: false
1328313333
}"
1328413334
`)
1328513335
expect(
@@ -13858,7 +13908,7 @@ test('text', async () => {
1385813908
1385913909
.text-sm {
1386013910
font-size: var(--font-size-sm, .875rem);
13861-
line-height: var(--font-size-sm--line-height, 1.25rem);
13911+
line-height: var(--tw-leading, var(--font-size-sm--line-height, 1.25rem));
1386213912
}
1386313913
1386413914
.text-\\[12px\\]\\/6 {
@@ -14304,14 +14354,6 @@ test('inset-shadow', async () => {
1430414354
--inset-shadow-sm: inset 0 1px 1px #0000000d;
1430514355
}
1430614356
14307-
.inset-shadow {
14308-
inset: var(--inset-shadow, inset 0 2px 4px #0000000d);
14309-
}
14310-
14311-
.inset-shadow-sm {
14312-
inset: var(--inset-shadow-sm, inset 0 1px 1px #0000000d);
14313-
}
14314-
1431514357
.inset-shadow {
1431614358
--tw-inset-shadow: inset 0 2px 4px #0000000d;
1431714359
--tw-inset-shadow-colored: inset 0 2px 4px var(--tw-inset-shadow-color);
@@ -14784,6 +14826,7 @@ test('inset-ring', async () => {
1478414826
css`
1478514827
@theme {
1478614828
--color-red-500: #ef4444;
14829+
--inset-ring-thick: 100px;
1478714830
}
1478814831
@tailwind utilities;
1478914832
`,
@@ -14818,13 +14861,15 @@ test('inset-ring', async () => {
1481814861
'inset-ring-1',
1481914862
'inset-ring-2',
1482014863
'inset-ring-4',
14864+
'inset-ring-thick',
1482114865
'inset-ring-[12px]',
1482214866
'inset-ring-[length:--my-width]',
1482314867
],
1482414868
),
1482514869
).toMatchInlineSnapshot(`
1482614870
":root {
1482714871
--color-red-500: #ef4444;
14872+
--inset-ring-thick: 100px;
1482814873
}
1482914874
1483014875
.inset-ring {
@@ -15357,7 +15402,7 @@ describe('custom utilities', () => {
1535715402
"@layer utilities {
1535815403
.text-sm {
1535915404
font-size: var(--font-size-sm, .875rem);
15360-
line-height: var(--font-size-sm--line-height, 1.25rem);
15405+
line-height: var(--tw-leading, var(--font-size-sm--line-height, 1.25rem));
1536115406
font-size: var(--font-size-sm, .8755rem);
1536215407
line-height: var(--font-size-sm--line-height, 1.255rem);
1536315408
text-rendering: optimizeLegibility;
@@ -15519,6 +15564,7 @@ describe('custom utilities', () => {
1551915564
),
1552015565
).toMatchInlineSnapshot(`
1552115566
".bar {
15567+
--tw-font-weight: 700;
1552215568
font-weight: 700;
1552315569
}
1552415570
@@ -15528,6 +15574,19 @@ describe('custom utilities', () => {
1552815574
text-decoration-line: underline;
1552915575
display: flex;
1553015576
}
15577+
}
15578+
15579+
@supports (-moz-orient: inline) {
15580+
@layer base {
15581+
*, :before, :after, ::backdrop {
15582+
--tw-font-weight: initial;
15583+
}
15584+
}
15585+
}
15586+
15587+
@property --tw-font-weight {
15588+
syntax: "*";
15589+
inherits: false
1553115590
}"
1553215591
`)
1553315592
})

0 commit comments

Comments
 (0)