feat(checkbox): adding checkbox s2 tokens

Author: aramos-adobe

components/checkbox/dist/metadata.json

@@ -44,9 +44,6 @@
     ".spectrum-Checkbox-input:focus-visible + .spectrum-Checkbox-label",
     ".spectrum-Checkbox-input:focus-visible:checked + .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox-label",
-    ".spectrum-Checkbox-label:lang(ja)",
-    ".spectrum-Checkbox-label:lang(ko)",
-    ".spectrum-Checkbox-label:lang(zh)",
     ".spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-checkmark",
     ".spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-partialCheckmark",
     ".spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box:before",
@@ -67,6 +64,7 @@
     ".spectrum-Checkbox.is-invalid.is-indeterminate:hover .spectrum-Checkbox-label",
     ".spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box",
+    ".spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox.is-readOnly .spectrum-Checkbox-input",
     ".spectrum-Checkbox.is-readOnly .spectrum-Checkbox-input:checked:disabled + .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox.is-readOnly .spectrum-Checkbox-input:checked:disabled ~ .spectrum-Checkbox-label",
@@ -76,8 +74,10 @@
     ".spectrum-Checkbox:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox:active .spectrum-Checkbox-label",
     ".spectrum-Checkbox:hover .spectrum-Checkbox-box:before",
-    ".spectrum-Checkbox:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box:before",
     ".spectrum-Checkbox:hover .spectrum-Checkbox-label",
+    ".spectrum-Checkbox:lang(ja)",
+    ".spectrum-Checkbox:lang(ko)",
+    ".spectrum-Checkbox:lang(zh)",
     ".spectrum-Checkbox:not(.is-readOnly):active .spectrum-Checkbox-input:not(:disabled) + .spectrum-Checkbox-box"
   ],
   "modifiers": [
@@ -109,7 +109,7 @@
     "--mod-checkbox-emphasized-color-hover",
     "--mod-checkbox-focus-indicator-color",
     "--mod-checkbox-focus-indicator-gap",
-    "--mod-checkbox-focus-indicator-thinkness",
+    "--mod-checkbox-focus-indicator-thickness",
     "--mod-checkbox-font-size",
     "--mod-checkbox-height",
     "--mod-checkbox-invalid-color-default",
@@ -166,6 +166,8 @@
     "--spectrum-checkbox-line-height-cjk",
     "--spectrum-checkbox-selected-border-width",
     "--spectrum-checkbox-spacing",
+    "--spectrum-checkbox-text-font-style",
+    "--spectrum-checkbox-text-font-weight",
     "--spectrum-checkbox-text-to-control",
     "--spectrum-checkbox-top-to-control",
     "--spectrum-checkbox-top-to-control-extra-large",
@@ -201,6 +203,7 @@
     "--spectrum-corner-radius-small-size-large",
     "--spectrum-corner-radius-small-size-medium",
     "--spectrum-corner-radius-small-size-small",
+    "--spectrum-default-font-style",
     "--spectrum-disabled-content-color",
     "--spectrum-focus-indicator-color",
     "--spectrum-focus-indicator-gap",
@@ -217,6 +220,7 @@
     "--spectrum-neutral-content-color-down",
     "--spectrum-neutral-content-color-hover",
     "--spectrum-neutral-content-color-key-focus",
+    "--spectrum-regular-font-weight",
     "--spectrum-text-to-control-100",
     "--spectrum-text-to-control-200",
     "--spectrum-text-to-control-300",

components/checkbox/index.css

@@ -20,6 +20,7 @@
 	--spectrum-checkbox-checkmark-color: var(--highcontrast-checkbox-background-color-default, var(--mod-checkbox-checkmark-color, var(--spectrum-gray-50)));
 
 	/* Color */
+	--spectrum-checkbox-background-color: var(--spectrum-gray-25);
 	--spectrum-checkbox-content-color-default: var(--spectrum-neutral-content-color-default);
 	--spectrum-checkbox-content-color-hover: var(--spectrum-neutral-content-color-hover);
 	--spectrum-checkbox-content-color-down: var(--spectrum-neutral-content-color-down);
@@ -54,10 +55,6 @@
 	--spectrum-checkbox-line-height: var(--spectrum-line-height-100);
 	--spectrum-checkbox-line-height-cjk: var(--spectrum-cjk-line-height-100);
 
-	/* Size */
-	--spectrum-checkbox-height: var(--spectrum-component-height-100);
-	--spectrum-checkbox-control-size: var(--spectrum-checkbox-control-size-medium);
-	--spectrum-checkbox-control-corner-radius: var(--spectrum-corner-radius-small-size-medium);
 
 	--spectrum-checkbox-focus-indicator-gap: var(--spectrum-focus-indicator-gap);
 	--spectrum-checkbox-focus-indicator-thickness: var(--spectrum-focus-indicator-thickness);