feat: migration of tokens to spectrum 2

Expanding the existing themes system to support the new S2 mappings. --- Co-authored-by: castastrophe <[email protected]> Co-authored-by: Patrick Fulton <[email protected]> Co-authored-by: Cory Dransfeldt <[email protected]> Co-authored-by: Aziz Ramos <[email protected]> Co-authored-by: Josh Winn <[email protected]> Co-authored-by: Rise Erpelding <[email protected]> Co-authored-by: Marissa Huysentruyt <[email protected]> Co-authored-by: Rajdeep Chandra <[email protected]> Co-authored-by: TarunAdobe <[email protected]>
adobe · Nov 22, 2024 · 2e4db3f · 2e4db3f
1 parent 7e50770
commit 2e4db3f
Show file tree

Hide file tree

Showing 6 changed files with 7 additions and 8 deletions.
diff --git a/components/calendar/index.css b/components/calendar/index.css
@@ -13,7 +13,6 @@
 
 @import "./themes/express.css";
 
-
 @media (forced-colors: active) {
 	.spectrum-Calendar-prevMonth,
 	.spectrum-Calendar-nextMonth {
@@ -144,7 +143,7 @@
 
 .spectrum-Calendar-prevMonth,
 .spectrum-Calendar-nextMonth {
-	transform: var(--spectrum-logical-rotation);
+	transform: var(--spectrum-logical-rotation,);
 
 	&:not([disabled]) {
 		color: var(--spectrum-calendar-button-icon-color);

diff --git a/components/calendar/stories/template.js b/components/calendar/stories/template.js
@@ -286,7 +286,7 @@ export const Template = ({
 					isQuiet: true,
 					isDisabled,
 					size: buttonSize,
-					iconName: "ChevronLeft100",
+					iconName: "ChevronLeft",
 					iconSet: "ui",
 					customClasses: [`${rootClass}-prevMonth`],
 					onclick: previousHandler.bind(null, {
@@ -300,7 +300,7 @@ export const Template = ({
 					isQuiet: true,
 					isDisabled,
 					size: buttonSize,
-					iconName: "ChevronRight100",
+					iconName: "ChevronRight",
 					iconSet: "ui",
 					customClasses: [`${rootClass}-nextMonth`],
 					onclick: nextHandler.bind(null, {

diff --git a/components/dialog/stories/template.js b/components/dialog/stories/template.js
@@ -26,7 +26,7 @@ export const Template = ({
 	footer = [],
 	customClasses = [],
 	id = getRandomId("dialog"),
-	size = "medium",
+	size = "m",
 	layout,
 	heroImageUrl,
 	customStyles = {},

diff --git a/components/meter/stories/template.js b/components/meter/stories/template.js
@@ -20,7 +20,7 @@ export const Template = ({
 		customClasses: [
 			...customClasses,
 			rootClass,
-			typeof size !== "undefined" ? `${rootClass}--size${size.toUpperCase()}` : null,
+			typeof size !== "undefined" ? `${rootClass}--size${size?.toUpperCase()}` : null,
 			typeof fill !== "undefined" ? `is-${fill}` : null,
 			/*
 			 * The `spectrum-Meter--staticWhite` class is not present in the Meter CSS, as it makes use of

diff --git a/components/popover/stories/popover.stories.js b/components/popover/stories/popover.stories.js
@@ -240,7 +240,7 @@ DialogStyle.args = {
 	content: [
 		(passthroughs, context) => Dialog({
 			showModal: false,
-			size: ["small"],
+			size: "s",
 			isDismissable: false,
 			heading: "Example heading",
 			hasFooter: false,

diff --git a/components/popover/stories/popover.test.js b/components/popover/stories/popover.test.js
@@ -137,7 +137,7 @@ export const PopoverGroup = Variants({
 			content: [
 				(passthroughs, context) => Dialog({
 					showModal: false,
-					size: ["small"],
+					size: "s",
 					isDismissable: false,
 					heading: "Example heading",
 					hasFooter: false,