diff --git a/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-amount.test.ts b/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-amount.test.ts
index 9d3424ca278..61b18b82c5e 100644
--- a/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-amount.test.ts
+++ b/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-amount.test.ts
@@ -7,7 +7,7 @@ it('should update token values contextually', async () => {
`
const App = () => (
<>
-
+
diff --git a/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-contrast-intent-variant.test.ts b/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-contrast-intent-variant.test.ts
index 2f8c121b1da..508710b9901 100644
--- a/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-contrast-intent-variant.test.ts
+++ b/packages/blade/codemods/brand-refresh/transformers/__tests__/migrate-contrast-intent-variant.test.ts
@@ -7,17 +7,22 @@ it('should migrate contrast prop to emphasis', async () => {
`
const App = () => (
<>
- Hello
- Hello
+ Hello
+ Hello
- Lorem Ipsum Hello
+ Lorem Ipsum Hello
- Hello
- Hello
+ Hello
+ Hello
- console.log('Clicked')} />
- console.log('Clicked')} />
-
+ console.log('Clicked')} />
+ console.log('Clicked')} />
+
+
+
+
+
+
>
);
`,
@@ -27,17 +32,22 @@ it('should migrate contrast prop to emphasis', async () => {
expect(result).toMatchInlineSnapshot(`
"const App = () => (
<>
- Hello
- Hello
+ Hello
+ Hello
+
+ Lorem Ipsum Hello
- Lorem Ipsum Hello
+ Hello
+ Hello
- Hello
- Hello
+ console.log('Clicked')} />
+ console.log('Clicked')} />
+
+
+
- console.log('Clicked')} />
- console.log('Clicked')} />
-
+
+
>
);"
`);
diff --git a/packages/blade/codemods/brand-refresh/transformers/migrate-contrast-intent-color-props.ts b/packages/blade/codemods/brand-refresh/transformers/migrate-contrast-intent-color-props.ts
index 7d9882f34f2..88051824816 100644
--- a/packages/blade/codemods/brand-refresh/transformers/migrate-contrast-intent-color-props.ts
+++ b/packages/blade/codemods/brand-refresh/transformers/migrate-contrast-intent-color-props.ts
@@ -33,12 +33,12 @@ function migrateContrastIntentAndColorProps({ root, j, file }): void {
);
}
- // Bade/Counter/IconButton Components: Change `contrast` prop to `emphasis`
+ // Bade/Counter/IconButton/Alert Components: Change `contrast` prop to `emphasis`
try {
root
.find(j.JSXElement)
.filter((path) =>
- ['Badge', 'Counter', 'IconButton'].includes(path.value.openingElement.name.name),
+ ['Badge', 'Counter', 'IconButton', 'Alert'].includes(path.value.openingElement.name.name),
)
.find(j.JSXAttribute)
.filter((path) => path.node.name.name === 'contrast')
@@ -46,6 +46,10 @@ function migrateContrastIntentAndColorProps({ root, j, file }): void {
path.node.name.name = 'emphasis';
const contrastToEmphasisMap = {
+ alert: {
+ low: 'subtle',
+ high: 'intense',
+ },
badge: {
low: 'subtle',
high: 'intense',
@@ -74,6 +78,23 @@ function migrateContrastIntentAndColorProps({ root, j, file }): void {
);
}
+ // Remove 'contrast' prop from the Skeleton Component
+ try {
+ root
+ .find(j.JSXElement)
+ .filter((path) => path.value.openingElement.name.name === 'Skeleton')
+ .find(j.JSXAttribute)
+ .filter((path) => path.node.name.name === 'contrast')
+ .remove();
+ } catch (error) {
+ console.error(
+ red(
+ `⛔️ ${file.path}: Oops! Ran into an issue while removing the "contrast" prop from Skeleton.`,
+ ),
+ `\n${red(error.stack)}\n`,
+ );
+ }
+
// Remove deprecated 'intent'/'variant' props in favor of color
try {
root