Skip to content

Commit 22af222

Browse files
thecrypticacethecrypticace
authored
Bump embedded Tailwind CSS and plugin versions (#1469)
Planning on cutting a release once this is merged
1 parent 352b678 commit 22af222

File tree

24 files changed

+296
-227
lines changed

24 files changed

+296
-227
lines changed

‎packages/tailwindcss-language-server/ThirdPartyNotices.txt‎

Lines changed: 56 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -478,7 +478,7 @@ This is necessary, as the default `aspectRatio` values are overwritten by this p
478478

479479
================================================================================
480480

481-
@tailwindcss/[email protected].0
481+
@tailwindcss/[email protected].1
482482

483483
# @tailwindcss/container-queries
484484

@@ -509,47 +509,68 @@ module.exports = {
509509

510510
## Usage
511511

512+
Start by marking an element as a container using the `@container` class, and then applying styles based on the size of that container using the container variants like `@md:`, `@lg:`, and `@xl:`:
513+
512514
```html
513-
<!-- Container queries without a specific container name -->
514515
<div class="@container">
515-
<!-- Container query with a size of `lg` defined in your tailwind.config.js file -->
516-
<div class="@lg:underline"></div>
517-
<div class="@[1024px]:underline"></div>
516+
<div class="@lg:underline">
517+
<!-- This text will be underlined when the container is larger than `32rem` -->
518+
</div>
518519
</div>
520+
```
521+
522+
By default we provide [container sizes](#configuration) from `@xs` (`20rem`) to `@7xl` (`80rem`).
523+
524+
### Named containers
525+
526+
You can optionally name containers using a `@container/{name}` class, and then include that name in the container variants using classes like `@lg/{name}:underline`:
519527

520-
<!-- Container queries that apply for a defined container name -->
521-
<div class="@container/sidebar">
522-
<div class="@lg/sidebar:underline"></div>
523-
<div class="@[1024px]/sidebar:underline"></div>
528+
```html
529+
<div class="@container/main">
530+
<!-- ... -->
531+
<div class="@lg/main:underline">
532+
<!-- This text will be underlined when the "main" container is larger than `32rem` -->
533+
</div>
524534
</div>
525535
```
526536

527-
### Container types
537+
### Arbitrary container sizes
528538

529-
| Class | css |
530-
| --------------------------- | ------------------------------------------------------- |
531-
| `@container` | `container-type: inline-size;` |
532-
| `@container/sidebar` | `container-type: inline-size; container-name: sidebar;` |
533-
| `@container-normal` | `container-type: normal;` |
534-
| `@container-normal/sidebar` | `container-type: inline-size; container-name: sidebar;` |
539+
In addition to using one of the [container sizes](#configuration) provided by default, you can also create one-off sizes using any arbitrary value:
540+
541+
```html
542+
<div class="@container">
543+
<div class="@[17.5rem]:underline"></div>
544+
<!-- This text will be underlined when the container is larger than `17.5rem` -->
545+
</div>
546+
</div>
547+
```
548+
549+
### Removing a container
550+
551+
To stop an element from acting as a container, use the `@container-normal` class.
552+
553+
<div class="@container xl:@container-normal">
554+
<!-- ... -->
555+
</div>
535556

536557
## Configuration
537558

538559
By default we ship with the following configured values:
539560

540-
| Name | Value |
541-
| ----- | ------- |
542-
| `xs` | `20rem` |
543-
| `sm` | `24rem` |
544-
| `md` | `28rem` |
545-
| `lg` | `32rem` |
546-
| `xl` | `36rem` |
547-
| `2xl` | `42rem` |
548-
| `3xl` | `48rem` |
549-
| `4xl` | `56rem` |
550-
| `5xl` | `64rem` |
551-
| `6xl` | `72rem` |
552-
| `7xl` | `80rem` |
561+
| Name | CSS |
562+
| ------ | ------------------------------- |
563+
| `@xs` | `@container (min-width: 20rem)` |
564+
| `@sm` | `@container (min-width: 24rem)` |
565+
| `@md` | `@container (min-width: 28rem)` |
566+
| `@lg` | `@container (min-width: 32rem)` |
567+
| `@xl` | `@container (min-width: 36rem)` |
568+
| `@2xl` | `@container (min-width: 42rem)` |
569+
| `@3xl` | `@container (min-width: 48rem)` |
570+
| `@4xl` | `@container (min-width: 56rem)` |
571+
| `@5xl` | `@container (min-width: 64rem)` |
572+
| `@6xl` | `@container (min-width: 72rem)` |
573+
| `@7xl` | `@container (min-width: 80rem)` |
553574

554575
You can configure which values are available for this plugin under the `containers` key in your `tailwind.config.js` file:
555576

@@ -559,12 +580,7 @@ module.exports = {
559580
theme: {
560581
extend: {
561582
containers: {
562-
xs: '20rem',
563-
sm: '24rem',
564-
md: '28rem',
565-
lg: '32rem',
566-
xl: '36rem',
567-
// etc...
583+
'2xs': '16rem',
568584
},
569585
},
570586
},
@@ -573,7 +589,7 @@ module.exports = {
573589

574590
================================================================================
575591

576-
@tailwindcss/[email protected].3
592+
@tailwindcss/[email protected].10
577593

578594
MIT License
579595

@@ -599,7 +615,7 @@ SOFTWARE.
599615

600616
================================================================================
601617

602-
@tailwindcss/[email protected].2
618+
@tailwindcss/[email protected].4
603619

604620
MIT License
605621

@@ -625,7 +641,7 @@ SOFTWARE.
625641

626642
================================================================================
627643

628-
@tailwindcss/[email protected].7
644+
@tailwindcss/[email protected].19
629645

630646
MIT License
631647

@@ -1342,7 +1358,7 @@ SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
13421358

13431359
================================================================================
13441360

1345-
[email protected].17
1361+
[email protected].18
13461362

13471363
MIT License
13481364

@@ -1394,7 +1410,7 @@ THE SOFTWARE.
13941410

13951411
================================================================================
13961412

1397-
[email protected].6
1413+
[email protected].7
13981414

13991415
The MIT License (MIT)
14001416

‎packages/tailwindcss-language-server/package.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -43,12 +43,12 @@
4343
"@parcel/watcher-linux-arm64-glibc": "2.5.1",
4444
"@parcel/watcher-linux-arm64-musl": "2.5.1",
4545
"@tailwindcss/aspect-ratio": "0.4.2",
46-
"@tailwindcss/container-queries": "0.1.0",
47-
"@tailwindcss/forms": "0.5.3",
46+
"@tailwindcss/container-queries": "0.1.1",
47+
"@tailwindcss/forms": "0.5.10",
4848
"@tailwindcss/language-service": "workspace:*",
49-
"@tailwindcss/line-clamp": "0.4.2",
50-
"@tailwindcss/oxide": "^4.1.0",
51-
"@tailwindcss/typography": "0.5.7",
49+
"@tailwindcss/line-clamp": "0.4.4",
50+
"@tailwindcss/oxide": "^4.1.14",
51+
"@tailwindcss/typography": "0.5.19",
5252
"@types/braces": "3.0.1",
5353
"@types/color-name": "^1.1.3",
5454
"@types/culori": "^2.1.0",
@@ -87,8 +87,8 @@
8787
"resolve": "1.20.0",
8888
"rimraf": "3.0.2",
8989
"stack-trace": "0.0.10",
90-
"tailwindcss": "3.4.17",
91-
"tailwindcss-v4": "npm:[email protected].1",
90+
"tailwindcss": "3.4.18",
91+
"tailwindcss-v4": "npm:[email protected].14",
9292
"tinyglobby": "^0.2.12",
9393
"tsconfck": "^3.1.4",
9494
"tsconfig-paths": "^4.2.0",

‎packages/tailwindcss-language-server/src/project-locator.test.ts‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,7 @@ testLocator({
364364
'package.json': json`
365365
{
366366
"dependencies": {
367-
"tailwindcss": "^3.4.17"
367+
"tailwindcss": "3.4.18"
368368
}
369369
}
370370
`,
@@ -379,7 +379,7 @@ testLocator({
379379
},
380380
expected: [
381381
{
382-
version: '3.4.17',
382+
version: '3.4.18',
383383
config: '/tailwind.admin.config.js',
384384
content: ['/src/**/*.{html,js}'],
385385
},
@@ -455,7 +455,7 @@ testLocator({
455455
},
456456
expected: [
457457
{
458-
version: '4.1.1 (bundled)',
458+
version: '4.1.14 (bundled)',
459459
config: '/src/a/b/c/index.css',
460460
content: [],
461461
},
@@ -487,12 +487,12 @@ testLocator({
487487
},
488488
expected: [
489489
{
490-
version: '4.1.1 (bundled)',
490+
version: '4.1.14 (bundled)',
491491
config: '/index.css',
492492
content: [],
493493
},
494494
{
495-
version: '4.1.1 (bundled)',
495+
version: '4.1.14 (bundled)',
496496
config: '/src/vendor/c.css',
497497
content: [],
498498
},
@@ -519,12 +519,12 @@ testLocator({
519519
},
520520
expected: [
521521
{
522-
version: '4.1.1 (bundled)',
522+
version: '4.1.14 (bundled)',
523523
config: '/src/app.css',
524524
content: [],
525525
},
526526
{
527-
version: '4.1.1 (bundled)',
527+
version: '4.1.14 (bundled)',
528528
config: '/a/foo.css',
529529
content: [],
530530
},
@@ -554,12 +554,12 @@ testLocator({
554554
},
555555
expected: [
556556
{
557-
version: '4.1.1 (bundled)',
557+
version: '4.1.14 (bundled)',
558558
config: '/src/app.css',
559559
content: [],
560560
},
561561
{
562-
version: '4.1.1 (bundled)',
562+
version: '4.1.14 (bundled)',
563563
config: '/a/foo.css',
564564
content: [],
565565
},
@@ -581,7 +581,7 @@ testLocator({
581581
},
582582
expected: [
583583
{
584-
version: '4.1.1 (bundled)',
584+
version: '4.1.14 (bundled)',
585585
config: '/src/app.css',
586586
content: [],
587587
},

‎packages/tailwindcss-language-server/tests/colors/colors.test.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -349,7 +349,7 @@ defineTest({
349349

350350
expect(c.project).toMatchObject({
351351
tailwind: {
352-
version: '4.1.1',
352+
version: '4.1.14',
353353
isDefaultVersion: true,
354354
},
355355
})
@@ -388,7 +388,7 @@ defineTest({
388388

389389
expect(c.project).toMatchObject({
390390
tailwind: {
391-
version: '4.1.1',
391+
version: '4.1.14',
392392
isDefaultVersion: true,
393393
},
394394
})

‎packages/tailwindcss-language-server/tests/env/v4.test.js‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ defineTest({
2121

2222
expect(await client.project()).toMatchObject({
2323
tailwind: {
24-
version: '4.1.1',
24+
version: '4.1.14',
2525
isDefaultVersion: true,
2626
},
2727
})
@@ -137,7 +137,7 @@ defineTest({
137137

138138
expect(await client.project()).toMatchObject({
139139
tailwind: {
140-
version: '4.1.1',
140+
version: '4.1.14',
141141
isDefaultVersion: true,
142142
},
143143
})
@@ -188,7 +188,7 @@ defineTest({
188188
'package.json': json`
189189
{
190190
"dependencies": {
191-
"tailwindcss": "4.1.1"
191+
"tailwindcss": "4.1.14"
192192
}
193193
}
194194
`,
@@ -205,7 +205,7 @@ defineTest({
205205

206206
expect(await client.project()).toMatchObject({
207207
tailwind: {
208-
version: '4.1.1',
208+
version: '4.1.14',
209209
isDefaultVersion: false,
210210
},
211211
})
@@ -243,7 +243,7 @@ defineTest({
243243
'package.json': json`
244244
{
245245
"dependencies": {
246-
"tailwindcss": "4.1.1"
246+
"tailwindcss": "4.1.14"
247247
}
248248
}
249249
`,
@@ -270,7 +270,7 @@ defineTest({
270270

271271
expect(await client.project()).toMatchObject({
272272
tailwind: {
273-
version: '4.1.1',
273+
version: '4.1.14',
274274
isDefaultVersion: false,
275275
},
276276
})
@@ -322,7 +322,7 @@ defineTest({
322322

323323
expect(await client.project()).toMatchObject({
324324
tailwind: {
325-
version: '4.1.1',
325+
version: '4.1.14',
326326
isDefaultVersion: true,
327327
},
328328
})
@@ -354,7 +354,7 @@ defineTest({
354354
'package.json': json`
355355
{
356356
"dependencies": {
357-
"tailwindcss": "4.1.1"
357+
"tailwindcss": "4.1.14"
358358
}
359359
}
360360
`,
@@ -667,7 +667,7 @@ defineTest({
667667
'package.json': json`
668668
{
669669
"dependencies": {
670-
"tailwindcss": "3.4.17"
670+
"tailwindcss": "3.4.18"
671671
}
672672
}
673673
`,
@@ -745,7 +745,7 @@ defineTest({
745745
'package.json': json`
746746
{
747747
"dependencies": {
748-
"tailwindcss": "3.4.17",
748+
"tailwindcss": "3.4.18",
749749
"some-pkg": "file:./packages/some-pkg"
750750
}
751751
}
@@ -831,7 +831,7 @@ defineTest({
831831

832832
expect(await client.project()).toMatchObject({
833833
tailwind: {
834-
version: '4.1.1',
834+
version: '4.1.14',
835835
isDefaultVersion: true,
836836
},
837837
})

0 commit comments

Comments
 (0)