diff --git a/change/@fluentui-react-native-theme-types-311e15ce-08b4-49e7-86b0-898fecbbe328.json b/change/@fluentui-react-native-theme-types-311e15ce-08b4-49e7-86b0-898fecbbe328.json new file mode 100644 index 0000000000..178c7d1308 --- /dev/null +++ b/change/@fluentui-react-native-theme-types-311e15ce-08b4-49e7-86b0-898fecbbe328.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add BkgAccentTint and TextAccentTint palette types", + "packageName": "@fluentui-react-native/theme-types", + "email": "patboyd@exchange.microsoft.com", + "dependentChangeType": "patch" +} diff --git a/change/@fluentui-react-native-win32-theme-a1f288da-7e8d-4e49-b069-c0167ab69dbc.json b/change/@fluentui-react-native-win32-theme-a1f288da-7e8d-4e49-b069-c0167ab69dbc.json new file mode 100644 index 0000000000..4f8914d44a --- /dev/null +++ b/change/@fluentui-react-native-win32-theme-a1f288da-7e8d-4e49-b069-c0167ab69dbc.json @@ -0,0 +1,7 @@ +{ + "type": "minor", + "comment": "Add BkgAccentTint and TextAccentTint palette types", + "packageName": "@fluentui-react-native/win32-theme", + "email": "patboyd@exchange.microsoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/theming/theme-types/src/palette.types.ts b/packages/theming/theme-types/src/palette.types.ts index 07fb3fd3d5..0de584e24b 100644 --- a/packages/theming/theme-types/src/palette.types.ts +++ b/packages/theming/theme-types/src/palette.types.ts @@ -166,12 +166,28 @@ export interface OfficePalette { /** * Accents + * + * Used to emphasize or create boundaries around/within UI. */ + + // Used for general borders AccentDark: ColorValue; + + // Used for separator lines AccentLight: ColorValue; + + // Used for accent rectangles and bolder borders AccentEmphasis: ColorValue; + + // Used for borders that outline the entire UI region AccentOutline: ColorValue; + // A subtle tint used to accent a region on top of Bkg + BkgAccentTint: ColorValue; + + // A foreground color used for contrasting text on top of BkgAccentTint + TextAccentTint: ColorValue; + /** * Headers * diff --git a/packages/theming/win32-theme/src/NativeModule/fallbackOfficeModule.ts b/packages/theming/win32-theme/src/NativeModule/fallbackOfficeModule.ts index 0f06c06c9d..4ab56d33f3 100644 --- a/packages/theming/win32-theme/src/NativeModule/fallbackOfficeModule.ts +++ b/packages/theming/win32-theme/src/NativeModule/fallbackOfficeModule.ts @@ -131,6 +131,8 @@ const whiteColorsPalette: OfficePalette = { AccentLight: '#E6E6E6', AccentEmphasis: '#D83B01', AccentOutline: '#000000', + BkgAccentTint: '#D2E0F4', + TextAccentTint: '#242424', TextEmphasis2: '#D83B01', BkgCtlSubtleSelected: '#F3F3F3', TextCtlSubtleSelected: '#262626', diff --git a/packages/theming/win32-theme/src/__tests__/__snapshots__/win32-theme.test.ts.snap b/packages/theming/win32-theme/src/__tests__/__snapshots__/win32-theme.test.ts.snap index be86785d83..75ebcdfda7 100644 --- a/packages/theming/win32-theme/src/__tests__/__snapshots__/win32-theme.test.ts.snap +++ b/packages/theming/win32-theme/src/__tests__/__snapshots__/win32-theme.test.ts.snap @@ -2739,6 +2739,7 @@ exports[`createOfficeTheme test 1`] = ` "AccentLight": "#E6E6E6", "AccentOutline": "#000000", "Bkg": "antiquewhite", + "BkgAccentTint": "#D2E0F4", "BkgCtl": "#E6E6E6", "BkgCtlDisabled": "#E6E6E6", "BkgCtlEmphasis": "#D83B01", @@ -2818,6 +2819,7 @@ exports[`createOfficeTheme test 1`] = ` "StrokeToggleSwitchOnHover": "#EA6115", "StrokeToggleSwitchOnPressed": "#A22C01", "Text": "#262626", + "TextAccentTint": "#242424", "TextActive": "#262626", "TextActiveHover": "#EA6115", "TextActivePressed": "#A22C01", @@ -3222,6 +3224,7 @@ exports[`fallbackGetPalette test Random palette 1`] = ` "AccentLight": "#E6E6E6", "AccentOutline": "#000000", "Bkg": "#FFFFFF", + "BkgAccentTint": "#D2E0F4", "BkgCtl": "#E6E6E6", "BkgCtlDisabled": "#E6E6E6", "BkgCtlEmphasis": "#D83B01", @@ -3301,6 +3304,7 @@ exports[`fallbackGetPalette test Random palette 1`] = ` "StrokeToggleSwitchOnHover": "#EA6115", "StrokeToggleSwitchOnPressed": "#A22C01", "Text": "#262626", + "TextAccentTint": "#242424", "TextActive": "#262626", "TextActiveHover": "#EA6115", "TextActivePressed": "#A22C01", @@ -3364,6 +3368,7 @@ exports[`fallbackGetPalette test TaskPane palette 1`] = ` "AccentLight": "#E6E6E6", "AccentOutline": "#000000", "Bkg": "antiquewhite", + "BkgAccentTint": "#D2E0F4", "BkgCtl": "#E6E6E6", "BkgCtlDisabled": "#E6E6E6", "BkgCtlEmphasis": "#D83B01", @@ -3443,6 +3448,7 @@ exports[`fallbackGetPalette test TaskPane palette 1`] = ` "StrokeToggleSwitchOnHover": "#EA6115", "StrokeToggleSwitchOnPressed": "#A22C01", "Text": "#262626", + "TextAccentTint": "#242424", "TextActive": "#262626", "TextActiveHover": "#EA6115", "TextActivePressed": "#A22C01",