fix: expand supported types in baseline-data

src/data/baseline-data.js

@@ -562,52 +562,168 @@ export const types = new Map([
 	["sign", 0],
 	["anchor", 0],
 	["anchor-size", 0],
+	["inset", 10],
 	["time", 10],
+	["fallback", 0],
+	["type-or-unit", 0],
 	["attr", 10],
 	["blend-mode", 10],
 	["line-style", 10],
 	["calc", 10],
+	["gradient", 10],
+	["nested", 10],
+	["number", 10],
 	["calc-keyword", 5],
+	["NaN", 5],
+	["e", 5],
+	["infinity", 5],
+	["pi", 5],
 	["calc-size", 0],
-	["shape", 0],
-	["color", 10],
+	["cap", 0],
+	["revert-layer", 10],
+	["ch", 10],
+	["shape", 10],
+	["rect", 10],
+	["color", 5],
+	["color-mix", 5],
+	["conic-gradient", 5],
+	["repeating-conic-gradient", 5],
+	["container", 5],
 	["string", 10],
+	["unicode", 10],
 	["counter", 10],
 	["counters", 10],
+	["cross-fade", 0],
 	["easing-function", 10],
+	["cubic-bezier", 10],
+	["currentcolor", 10],
+	["element", 0],
+	["em", 10],
+	["ex", 0],
 	["exp", 5],
 	["hypot", 5],
 	["log", 5],
 	["pow", 5],
 	["sqrt", 5],
 	["filter-function", 10],
+	["blur", 10],
+	["brightness", 10],
+	["contrast", 10],
+	["drop-shadow", 10],
+	["grayscale", 10],
+	["hue-rotate", 10],
+	["invert", 10],
+	["opacity", 10],
+	["saturate", 10],
+	["sepia", 10],
 	["url", 10],
-	["gradient", 10],
+	["linear-gradient", 10],
+	["radial-gradient", 10],
+	["repeating-linear-gradient", 10],
+	["repeating-radial-gradient", 10],
 	["image", 10],
 	["flex", 10],
+	["hsl", 5],
+	["hwb", 5],
+	["ic", 5],
+	["image-set", 5],
+	["global", 10],
+	["inherit", 10],
+	["initial", 10],
+	["lab", 5],
+	["lch", 5],
+	["lh", 5],
+	["light-dark", 5],
+	["linear-function", 5],
 	["ratio", 10],
 	["clamp", 10],
 	["max", 10],
 	["min", 10],
 	["ray", 5],
-	["number", 10],
+	["position", 10],
+	["size", 5],
+	["named-color", 10],
+	["oklab", 5],
+	["oklch", 5],
+	["scientific", 10],
+	["overlay", 0],
 	["overflow", 5],
+	["clip", 5],
+	["paint", 0],
+	["path", 0],
+	["Q", 10],
+	["rcap", 0],
+	["rch", 0],
+	["rgb", 10],
+	["rem", 5],
 	["resolution", 5],
+	["dpcm", 5],
+	["dpi", 5],
+	["dppx", 5],
+	["x", 5],
+	["revert", 10],
+	["rex", 0],
+	["alpha", 10],
+	["ric", 0],
+	["rlh", 5],
 	["mod", 5],
-	["rem", 5],
 	["round", 5],
 	["basic-shape", 10],
+	["animation", 10],
+	["circle", 10],
+	["ellipse", 10],
+	["polygon", 10],
+	["xywh", 10],
+	["steps", 10],
+	["system-color", 10],
+	["text-edge", 0],
+	["alphabetic", 0],
+	["text", 0],
 	["angle", 10],
 	["angle-percentage", 10],
-	["position", 10],
+	["deg", 10],
+	["grad", 10],
+	["rad", 10],
+	["turn", 10],
+	["four", 10],
+	["keyword", 10],
 	["transform-function", 10],
+	["matrix", 10],
+	["rotate", 10],
+	["scale", 10],
+	["scaleX", 10],
+	["scaleY", 10],
+	["skew", 10],
+	["skewX", 10],
+	["skewY", 10],
+	["translate", 10],
+	["translateX", 10],
+	["translateY", 10],
+	["matrix3d", 10],
+	["perspective", 10],
+	["rotate3d", 10],
+	["rotateX", 10],
+	["rotateY", 10],
+	["rotateZ", 10],
+	["scale3d", 10],
+	["scaleZ", 10],
+	["translate3d", 10],
+	["translateZ", 10],
 	["acos", 5],
 	["asin", 5],
 	["atan", 5],
 	["atan2", 5],
 	["cos", 5],
 	["sin", 5],
 	["tan", 5],
+	["unset", 10],
+	["vb", 5],
+	["vi", 5],
+	["viewport", 5],
+	["vh", 10],
+	["vmax", 10],
+	["vmin", 10],
+	["vw", 10],
 	["dimension", 10],
 	["length", 10],
 	["length-percentage", 10],

tests/rules/require-baseline.test.js

@@ -267,6 +267,22 @@ ruleTester.run("require-baseline", rule, {
 				},
 			],
 		},
+		{
+			code: "a { color: color-mix(in hsl, hsl(200 50 80), coral 80%); }",
+			errors: [
+				{
+					messageId: "notBaselineType",
+					data: {
+						type: "color-mix",
+						availability: "widely",
+					},
+					line: 1,
+					column: 12,
+					endLine: 1,
+					endColumn: 56,
+				},
+			],
+		},
 		{
 			code: "@media (color-gamut: srgb) { a { color: red; } }",
 			errors: [

tools/generate-baseline.js

@@ -74,7 +74,8 @@ function extractCSSFeatures(features) {
 	const cssAtRulePattern = /^css\.at-rules\.(?<atRule>[a-zA-Z$\d-]+)$/u;
 	const cssMediaConditionPattern =
 		/^css\.at-rules\.media\.(?<condition>[a-zA-Z$\d-]+)$/u;
-	const cssTypePattern = /^css\.types\.(?<type>[a-zA-Z$\d-]+)$/u;
+	const cssTypePattern =
+		/^css\.types\.(?:.*?\.)?(?<type>[a-zA-Z\d-]+)(?:\.[^.]*$|[^.]*$)/u;
 	const cssSelectorPattern = /^css\.selectors\.(?<selector>[a-zA-Z$\d-]+)$/u;
 
 	const properties = {};