feat: add example gradients for static black and white (#2637)

* feat: add example gradients for static black and white

Add new gradient backgrounds, displayed for static black and static
white variants. These are used for examples only. This adds CSS custom
properties available globally within Storybook and sets them on the
existing decorator.

* docs(fieldlabel): support static colors decorator in storybook

Change Field label stories that show static black and static white,
so they work with the recently added decorator that changes the main
Storybook background.

* docs(button): adjust static colors template

Adjust static colors template to better handle the static color
decorator and gradients.

* chore(fieldlabel): apply eslint indentation changes to stories

Author: jawinn

.storybook/decorators/context.js

@@ -31,11 +31,11 @@ export const withContextWrapper = makeDecorator({
 
 		const staticColorSettings = {
 			"black": {
-				background: "var(--spectrum-docs-static-black-background-color)",
+				background: "var(--spectrum-examples-gradient-static-black)",
 				color: "light"
 			},
 			"white": {
-				background: "var(--spectrum-docs-static-white-background-color)",
+				background: "var(--spectrum-examples-gradient-static-white)",
 				color: "dark"
 			},
 		};

components/accordion/package.json

@@ -38,7 +38,7 @@
 	},
 	"devDependencies": {
 		"@spectrum-css/icon": "9.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/actionbar/package.json

@@ -53,7 +53,7 @@
 		"@spectrum-css/closebutton": "5.0.0-next.1",
 		"@spectrum-css/fieldlabel": "8.0.0-next.1",
 		"@spectrum-css/popover": "8.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/actionbutton/package.json

@@ -39,7 +39,7 @@
 	"devDependencies": {
 		"@spectrum-css/commons": "9.1.4-next.0",
 		"@spectrum-css/icon": "9.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/actiongroup/package.json

@@ -38,7 +38,7 @@
 	},
 	"devDependencies": {
 		"@spectrum-css/actionbutton": "7.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/actionmenu/package.json

@@ -36,7 +36,7 @@
 		"@spectrum-css/icon": "9.0.1",
 		"@spectrum-css/menu": "9.0.1",
 		"@spectrum-css/popover": "8.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/alertbanner/package.json

@@ -53,7 +53,7 @@
 		"@spectrum-css/closebutton": "5.0.0-next.1",
 		"@spectrum-css/divider": "5.0.1",
 		"@spectrum-css/icon": "9.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/alertdialog/package.json

@@ -57,7 +57,7 @@
 		"@spectrum-css/divider": "5.0.1",
 		"@spectrum-css/icon": "9.0.1",
 		"@spectrum-css/modal": "7.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3",
+		"@spectrum-css/tokens": "14.0.0-next.4",
 		"@spectrum-css/underlay": "6.0.1"
 	},
 	"keywords": [

components/asset/package.json

@@ -33,7 +33,7 @@
 		}
 	},
 	"devDependencies": {
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",

components/assetcard/package.json

@@ -38,7 +38,7 @@
 	},
 	"devDependencies": {
 		"@spectrum-css/checkbox": "10.0.1",
-		"@spectrum-css/tokens": "14.0.0-next.3"
+		"@spectrum-css/tokens": "14.0.0-next.4"
 	},
 	"keywords": [
 		"design-system",