diff --git a/change/@fluentui-react-native-button-60667924-f4c4-48c7-b922-5f306006fe27.json b/change/@fluentui-react-native-button-60667924-f4c4-48c7-b922-5f306006fe27.json new file mode 100644 index 0000000000..52917ac1d1 --- /dev/null +++ b/change/@fluentui-react-native-button-60667924-f4c4-48c7-b922-5f306006fe27.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "remove deprecated alias tokens from v1 components", + "packageName": "@fluentui-react-native/button", + "email": "email not defined", + "dependentChangeType": "patch" +} diff --git a/change/@fluentui-react-native-menu-112f97c0-db5a-4404-ab29-754ec92deaec.json b/change/@fluentui-react-native-menu-112f97c0-db5a-4404-ab29-754ec92deaec.json new file mode 100644 index 0000000000..467437f0da --- /dev/null +++ b/change/@fluentui-react-native-menu-112f97c0-db5a-4404-ab29-754ec92deaec.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "remove deprecated alias tokens from v1 components", + "packageName": "@fluentui-react-native/menu", + "email": "email not defined", + "dependentChangeType": "patch" +} diff --git a/change/@fluentui-react-native-theme-types-514e76f6-3a89-444f-971f-ec22f3891112.json b/change/@fluentui-react-native-theme-types-514e76f6-3a89-444f-971f-ec22f3891112.json new file mode 100644 index 0000000000..ae1a94e13b --- /dev/null +++ b/change/@fluentui-react-native-theme-types-514e76f6-3a89-444f-971f-ec22f3891112.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "remove deprecated alias tokens from v1 components", + "packageName": "@fluentui-react-native/theme-types", + "email": "email not defined", + "dependentChangeType": "patch" +} diff --git a/packages/components/Button/src/ButtonColorTokens.macos.ts b/packages/components/Button/src/ButtonColorTokens.macos.ts index d324820617..acb09755b9 100644 --- a/packages/components/Button/src/ButtonColorTokens.macos.ts +++ b/packages/components/Button/src/ButtonColorTokens.macos.ts @@ -34,33 +34,33 @@ export const defaultButtonColorTokens: TokenSettings = (t: icon: t.colors.defaultFocusedIcon, }, primary: { - backgroundColor: t.colors.brandedBackground, - color: t.colors.primaryButtonText, - borderColor: t.colors.brandedBorder, - iconColor: t.colors.brandedIcon, + backgroundColor: t.colors.brandBackground, + color: t.colors.neutralForegroundOnBrand, + borderColor: t.colors.brandStroke1, + iconColor: t.colors.neutralForegroundOnBrand, disabled: { - backgroundColor: t.colors.primaryButtonBackgroundDisabled, - color: t.colors.brandedDisabledContent, - borderColor: t.colors.defaultDisabledBorder, - iconColor: t.colors.brandedDisabledIcon, + backgroundColor: t.colors.neutralBackgroundDisabled, + color: t.colors.neutralForegroundDisabled, + borderColor: t.colors.neutralStrokeDisabled, + iconColor: t.colors.neutralForegroundDisabled, }, hovered: { - backgroundColor: t.colors.brandedBackground, - color: t.colors.brandedHoveredContent, - borderColor: t.colors.brandedHoveredBorder, - iconColor: t.colors.brandedHoveredIcon, + backgroundColor: t.colors.brandBackgroundHover, + color: t.colors.neutralForegroundOnBrandHover, + borderColor: t.colors.brandBackgroundHover, + iconColor: t.colors.neutralForegroundOnBrandHover, }, pressed: { - backgroundColor: t.colors.primaryButtonBackgroundPressed, - color: t.colors.brandedPressedContent, - borderColor: t.colors.brandedPressedBorder, - iconColor: t.colors.brandedPressedIcon, + backgroundColor: t.colors.brandBackgroundPressed, + color: t.colors.neutralForegroundOnBrandPressed, + borderColor: t.colors.brandBackgroundPressed, + iconColor: t.colors.neutralForegroundOnBrandPressed, }, focused: { - backgroundColor: t.colors.brandedFocusedBackground, - color: t.colors.brandedFocusedContent, - borderColor: t.colors.brandedFocusedBorder, - iconColor: t.colors.brandedFocusedIcon, + backgroundColor: t.colors.brandBackgroundHover, + color: t.colors.neutralForegroundOnBrandHover, + borderColor: t.colors.strokeFocus2, + iconColor: t.colors.neutralForegroundOnBrandHover, }, }, subtle: { diff --git a/packages/components/Button/src/ButtonColorTokens.ts b/packages/components/Button/src/ButtonColorTokens.ts index 63d9c780c1..b2a6f4461a 100644 --- a/packages/components/Button/src/ButtonColorTokens.ts +++ b/packages/components/Button/src/ButtonColorTokens.ts @@ -34,33 +34,25 @@ export const defaultButtonColorTokens: TokenSettings = (t: icon: t.colors.defaultFocusedIcon, }, primary: { - backgroundColor: t.colors.brandedBackground, - color: t.colors.brandedContent, - borderColor: t.colors.brandedBorder, - iconColor: t.colors.brandedIcon, + backgroundColor: t.colors.brandBackground, + color: t.colors.neutralForegroundOnColor, + borderColor: t.colors.brandStroke1, + iconColor: t.colors.neutralForegroundOnColor, disabled: { - backgroundColor: t.colors.brandedDisabledBackground, - color: t.colors.brandedDisabledContent, - borderColor: t.colors.brandedDisabledBorder, - iconColor: t.colors.brandedDisabledIcon, - }, - hovered: { - backgroundColor: t.colors.brandedHoveredBackground, - color: t.colors.brandedHoveredContent, - borderColor: t.colors.brandedHoveredBorder, - iconColor: t.colors.brandedHoveredIcon, + backgroundColor: t.colors.brandBackgroundDisabled, + color: t.colors.neutralForegroundDisabled1, + iconColor: t.colors.neutralForegroundDisabled1, }, pressed: { - backgroundColor: t.colors.brandedPressedBackground, - color: t.colors.brandedPressedContent, - borderColor: t.colors.brandedPressedBorder, - iconColor: t.colors.brandedPressedIcon, + backgroundColor: t.colors.brandBackgroundPressed, + color: t.colors.neutralForegroundOnColor, + iconColor: t.colors.neutralForegroundOnColor, }, focused: { - backgroundColor: t.colors.brandedFocusedBackground, - color: t.colors.brandedFocusedContent, - borderColor: t.colors.brandedFocusedBorder, - iconColor: t.colors.brandedFocusedIcon, + backgroundColor: t.colors.brandBackground, + color: t.colors.neutralForegroundOnColor, + borderColor: t.colors.strokeFocus2, + iconColor: t.colors.neutralForegroundOnColor, }, }, subtle: { diff --git a/packages/components/Button/src/ToggleButton/__snapshots__/ToggleButton.test.tsx.snap b/packages/components/Button/src/ToggleButton/__snapshots__/ToggleButton.test.tsx.snap index 67ece684f0..bff788bf31 100644 --- a/packages/components/Button/src/ToggleButton/__snapshots__/ToggleButton.test.tsx.snap +++ b/packages/components/Button/src/ToggleButton/__snapshots__/ToggleButton.test.tsx.snap @@ -48,7 +48,7 @@ exports[`ToggleButton default 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", diff --git a/packages/components/Button/src/__snapshots__/Button.test.tsx.snap b/packages/components/Button/src/__snapshots__/Button.test.tsx.snap index 3df5c13bd0..c7eeff61ec 100644 --- a/packages/components/Button/src/__snapshots__/Button.test.tsx.snap +++ b/packages/components/Button/src/__snapshots__/Button.test.tsx.snap @@ -41,7 +41,7 @@ exports[`Button component tests Button circular 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 9999, "borderWidth": 1, "display": "flex", @@ -117,7 +117,7 @@ exports[`Button component tests Button composed 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", @@ -196,7 +196,7 @@ exports[`Button component tests Button customized 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", @@ -272,7 +272,7 @@ exports[`Button component tests Button default 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", @@ -347,7 +347,7 @@ exports[`Button component tests Button disabled 1`] = ` { "alignItems": "center", "alignSelf": "flex-start", - "backgroundColor": "#f3f2f1", + "backgroundColor": "#b4d6fa", "borderColor": "#f3f2f1", "borderRadius": 8, "borderWidth": 1, @@ -367,7 +367,7 @@ exports[`Button component tests Button disabled 1`] = ` numberOfLines={0} style={ { - "color": "#d2d0ce", + "color": "#bdbdbd", "fontFamily": "System", "fontSize": 12, "fontWeight": "600", @@ -425,7 +425,7 @@ exports[`Button component tests Button large 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 12, "borderWidth": 1, "display": "flex", @@ -502,7 +502,7 @@ exports[`Button component tests Button primary 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", @@ -579,7 +579,7 @@ exports[`Button component tests Button small 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 8, "borderWidth": 1, "display": "flex", @@ -656,7 +656,7 @@ exports[`Button component tests Button square 1`] = ` "alignItems": "center", "alignSelf": "flex-start", "backgroundColor": "#0f6cbd", - "borderColor": "#0f548c", + "borderColor": "#0f6cbd", "borderRadius": 0, "borderWidth": 1, "display": "flex", diff --git a/packages/components/Menu/src/MenuItemCheckbox/MenuItemCheckboxTokens.macos.ts b/packages/components/Menu/src/MenuItemCheckbox/MenuItemCheckboxTokens.macos.ts index 9d65f39902..426ab88d35 100644 --- a/packages/components/Menu/src/MenuItemCheckbox/MenuItemCheckboxTokens.macos.ts +++ b/packages/components/Menu/src/MenuItemCheckbox/MenuItemCheckboxTokens.macos.ts @@ -21,8 +21,8 @@ export const defaultMenuItemCheckboxTokens: TokenSettings