chore: bump csstype from 3.1.3 to 3.2.3

.changeset/oghljm37os-poiwwi4ip4l.md

@@ -0,0 +1,25 @@
+---
+"@compiled/babel-plugin": minor
+"@compiled/react": minor
+"@compiled/jest": minor
+---
+
+Bump csstype from 3.1.3 to 3.2.3 and add missing `@container` support to cssMap validation
+
+Updates csstype to the latest version which reflects the evolution of CSS standards. This change also fixes a bug where `@container` (CSS Container Queries) was partially supported in CSS processing but was missing from the cssMap type validation lookup table.
+
+**Removed at-rules:**
+- `@scroll-timeline` - Abandoned CSS proposal; Scroll-driven Animations now use `animation-timeline` property instead
+- `@viewport` - Obsolete at-rule with no modern browser support; viewport configuration is now handled via meta tags and media queries
+
+**Added at-rules (with full support):**
+- `@container` - CSS Container Queries (now fully validated in cssMap)
+- `@position-try` - CSS Anchor Positioning 
+- `@view-transition` - View Transitions API
+
+**What changed:**
+- Updated csstype dependency to 3.2.3 across all packages
+- Updated `AtRules` type mapping in `packages/babel-plugin/src/utils/css-map.ts` to include the new at-rules and remove deprecated ones
+- Bumped to `minor` for `@compiled/babel-plugin` due to adding `@container` support to cssMap validation
+
+**Note:** The `@scroll-timeline` and `@viewport` at-rules are not used anywhere in the Compiled codebase, so this is not a breaking change.

package.json

@@ -65,7 +65,7 @@
     "@types/react": "^18.3.1",
     "@types/react-dom": "^18.3.1",
     "css-what": ">=6.1.0",
-    "csstype": "3.1.3",
+    "csstype": "3.2.3",
     "nth-check": ">=2.1.1",
     "postcss": "8.4.31",
     "semver": "^7.6.3",
@@ -96,7 +96,7 @@
     "@typescript-eslint/parser": "^6.21.0",
     "@typescript-eslint/utils": "^6.21.0",
     "babel-loader": "^9.1.2",
-    "csstype": "^3.1.3",
+    "csstype": "^3.2.3",
     "eslint": "^8.57.1",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-json-files": "^2.2.0",

packages/babel-plugin/src/utils/css-map.ts

@@ -8,6 +8,7 @@ export const EXTENDED_SELECTORS_KEY = 'selectors';
 
 const atRules: Record<AtRules, boolean> = {
   '@charset': true,
+  '@container': true,
   '@counter-style': true,
   '@document': true,
   '@font-face': true,
@@ -19,12 +20,12 @@ const atRules: Record<AtRules, boolean> = {
   '@media': true,
   '@namespace': true,
   '@page': true,
+  '@position-try': true,
   '@property': true,
   '@scope': true,
-  '@scroll-timeline': true,
   '@starting-style': true,
   '@supports': true,
-  '@viewport': true,
+  '@view-transition': true,
 };
 
 type ObjectKeyWithLiteralValue = t.Identifier | t.StringLiteral;

packages/jest/package.json

@@ -24,6 +24,6 @@
   },
   "devDependencies": {
     "@types/css": "^0.0.35",
-    "csstype": "^3.1.3"
+    "csstype": "^3.2.3"
   }
 }

packages/react/package.json

@@ -72,7 +72,7 @@
     "jsx-dev-runtime"
   ],
   "dependencies": {
-    "csstype": "^3.1.3"
+    "csstype": "^3.2.3"
   },
   "devDependencies": {
     "@compiled/benchmark": "^1.1.0",

yarn.lock

@@ -7757,10 +7757,10 @@ cssstyle@^2.3.0:
   dependencies:
     cssom "~0.3.6"
 
-csstype@3.1.3, csstype@^3.1.3, csstype@^3.2.2:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81"
-  integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
+csstype@3.2.3, csstype@^3.2.2, csstype@^3.2.3:
+  version "3.2.3"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.2.3.tgz#ec48c0f3e993e50648c86da559e2610995cf989a"
+  integrity sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==
 
 currently-unhandled@^0.4.1:
   version "0.4.1"