Theme: Share a transparent primitive across interactive tokens

Several interactive background tokens (the weak/normal and disabled variants for the neutral, brand, and error tones) repeated the same inline fully-transparent value. Extract it into a shared `primitive.transparent` token and reference it, mirroring how the other disabled tokens already alias primitives. Internal-only: primitives are not emitted as custom properties, so there is no public API or resolved-value change.

Author: ciampo

packages/theme/src/prebuilt/ts/color-tokens.ts

@@ -4,6 +4,16 @@
  */
 
 export default {
+	transparent: [
+		'background-interactive-brand-weak',
+		'background-interactive-brand-weak-disabled',
+		'background-interactive-error',
+		'background-interactive-error-disabled',
+		'background-interactive-error-weak',
+		'background-interactive-error-weak-disabled',
+		'background-interactive-neutral-weak',
+		'background-interactive-neutral-weak-disabled',
+	],
 	'primary-bgFill1': [ 'background-interactive-brand-strong' ],
 	'primary-fgFill': [
 		'foreground-interactive-brand-strong',

packages/theme/tokens/color.json

@@ -2,6 +2,13 @@
 	"wpds-color": {
 		"$type": "color",
 		"primitive": {
+			"transparent": {
+				"$value": {
+					"colorSpace": "srgb",
+					"components": [ 0, 0, 0 ],
+					"alpha": 0
+				}
+			},
 			"primary": {
 				"bgFill1": {
 					"$value": {
@@ -1168,23 +1175,15 @@
 					"$description": "Background color for interactive elements with neutral tone and strong emphasis, in their disabled state."
 				},
 				"neutral-weak": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with neutral tone and weak emphasis."
 				},
 				"neutral-weak-active": {
 					"$value": "{wpds-color.primitive.bg.surface4}",
 					"$description": "Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active."
 				},
 				"neutral-weak-disabled": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with neutral tone and weak emphasis, in their disabled state."
 				},
 				"brand-strong": {
@@ -1200,43 +1199,27 @@
 					"$description": "Background color for interactive elements with brand tone and strong emphasis, in their disabled state."
 				},
 				"brand-weak": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with brand tone and weak emphasis."
 				},
 				"brand-weak-active": {
 					"$value": "{wpds-color.primitive.primary.surface4}",
 					"$description": "Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active."
 				},
 				"brand-weak-disabled": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with brand tone and weak emphasis, in their disabled state."
 				},
 				"error": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with error tone and normal emphasis."
 				},
 				"error-active": {
 					"$value": "{wpds-color.primitive.error.surface2}",
 					"$description": "Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active."
 				},
 				"error-disabled": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with error tone and normal emphasis, in their disabled state."
 				},
 				"error-strong": {
@@ -1252,23 +1235,15 @@
 					"$description": "Background color for interactive elements with error tone and strong emphasis, in their disabled state."
 				},
 				"error-weak": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with error tone and weak emphasis."
 				},
 				"error-weak-active": {
 					"$value": "{wpds-color.primitive.error.surface4}",
 					"$description": "Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active."
 				},
 				"error-weak-disabled": {
-					"$value": {
-						"colorSpace": "srgb",
-						"components": [ 0, 0, 0 ],
-						"alpha": 0
-					},
+					"$value": "{wpds-color.primitive.transparent}",
 					"$description": "Background color for interactive elements with error tone and weak emphasis, in their disabled state."
 				}
 			},