From 6dae1cd0099cd47208267793b2704be993de740c Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 13:07:13 -0700 Subject: [PATCH 1/8] move theming types into a subdirectory --- packages/agentic-design/src/theming/context.ts | 2 +- packages/agentic-design/src/theming/index.ts | 10 +++++----- .../src/theming/{ => types}/Color.types.ts | 0 .../src/theming/{ => types}/Shadow.types.ts | 0 .../src/theming/{ => types}/Theme.types.ts | 0 .../src/theming/{ => types}/Typography.types.ts | 0 .../src/theming/{ => types}/palette.types.ts | 0 packages/agentic-design/src/tokens/flex.types.ts | 2 +- 8 files changed, 7 insertions(+), 7 deletions(-) rename packages/agentic-design/src/theming/{ => types}/Color.types.ts (100%) rename packages/agentic-design/src/theming/{ => types}/Shadow.types.ts (100%) rename packages/agentic-design/src/theming/{ => types}/Theme.types.ts (100%) rename packages/agentic-design/src/theming/{ => types}/Typography.types.ts (100%) rename packages/agentic-design/src/theming/{ => types}/palette.types.ts (100%) diff --git a/packages/agentic-design/src/theming/context.ts b/packages/agentic-design/src/theming/context.ts index bdc4d019522..ab6cedd605f 100644 --- a/packages/agentic-design/src/theming/context.ts +++ b/packages/agentic-design/src/theming/context.ts @@ -1,6 +1,6 @@ import * as React from 'react'; -import type { Theme } from './Theme.types'; +import type { Theme } from './types/Theme.types'; export const ThemeContext = React.createContext(undefined); export const useTheme = () => React.useContext(ThemeContext); diff --git a/packages/agentic-design/src/theming/index.ts b/packages/agentic-design/src/theming/index.ts index a6fb0c33df9..f084c82ea31 100644 --- a/packages/agentic-design/src/theming/index.ts +++ b/packages/agentic-design/src/theming/index.ts @@ -7,9 +7,9 @@ export type { PaletteTextColors, PartialPalette, ThemeColorDefinition, -} from './Color.types'; -export type { ShadowValue, ShadowToken, BaseShadowAliasTokens, ThemeShadowDefinition, PartialShadowDefinition } from './Shadow.types'; -export type { AppearanceOptions, PartialTheme, Spacing, Theme, ThemeOptions } from './Theme.types'; +} from './types/Color.types'; +export type { ShadowValue, ShadowToken, BaseShadowAliasTokens, ThemeShadowDefinition, PartialShadowDefinition } from './types/Shadow.types'; +export type { AppearanceOptions, PartialTheme, Spacing, Theme, ThemeOptions } from './types/Theme.types'; export type { FontDynamicTypeRamp, FontFamilies, @@ -27,9 +27,9 @@ export type { Variant, VariantValue, Variants, -} from './Typography.types'; +} from './types/Typography.types'; export { ThemeContext, useTheme } from './context'; -export type { OfficePalette } from './palette.types'; +export type { OfficePalette } from './types/palette.types'; export { ThemeProvider } from './ThemeProvider'; export type { ThemeProviderProps } from './ThemeProvider'; export { ThemeReference } from './themeReference'; diff --git a/packages/agentic-design/src/theming/Color.types.ts b/packages/agentic-design/src/theming/types/Color.types.ts similarity index 100% rename from packages/agentic-design/src/theming/Color.types.ts rename to packages/agentic-design/src/theming/types/Color.types.ts diff --git a/packages/agentic-design/src/theming/Shadow.types.ts b/packages/agentic-design/src/theming/types/Shadow.types.ts similarity index 100% rename from packages/agentic-design/src/theming/Shadow.types.ts rename to packages/agentic-design/src/theming/types/Shadow.types.ts diff --git a/packages/agentic-design/src/theming/Theme.types.ts b/packages/agentic-design/src/theming/types/Theme.types.ts similarity index 100% rename from packages/agentic-design/src/theming/Theme.types.ts rename to packages/agentic-design/src/theming/types/Theme.types.ts diff --git a/packages/agentic-design/src/theming/Typography.types.ts b/packages/agentic-design/src/theming/types/Typography.types.ts similarity index 100% rename from packages/agentic-design/src/theming/Typography.types.ts rename to packages/agentic-design/src/theming/types/Typography.types.ts diff --git a/packages/agentic-design/src/theming/palette.types.ts b/packages/agentic-design/src/theming/types/palette.types.ts similarity index 100% rename from packages/agentic-design/src/theming/palette.types.ts rename to packages/agentic-design/src/theming/types/palette.types.ts diff --git a/packages/agentic-design/src/tokens/flex.types.ts b/packages/agentic-design/src/tokens/flex.types.ts index fb4eb8ede4f..cab0616a271 100644 --- a/packages/agentic-design/src/tokens/flex.types.ts +++ b/packages/agentic-design/src/tokens/flex.types.ts @@ -1,5 +1,5 @@ import type { ColorValue, TextStyle, ViewStyle, DimensionValue } from 'react-native'; -import type { ShadowToken } from '../theming/Shadow.types'; +import type { ShadowToken } from '../theming/types/Shadow.types'; type FontWeight = TextStyle['fontWeight']; type FontSize = TextStyle['fontSize']; From e585c06208b770e98ca90de89b301c081e5c2698 Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 13:34:38 -0700 Subject: [PATCH 2/8] remove caching from prebuild step --- lage.config.mjs | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/lage.config.mjs b/lage.config.mjs index 261091b3abc..827c8caae67 100644 --- a/lage.config.mjs +++ b/lage.config.mjs @@ -49,8 +49,7 @@ const config = { * Prebuild is a pre-build step that can either modify the source code or generate additional files in the project. */ dependsOn: ['^prebuild'], - inputs: ['**/*', '!node_modules/**/*', '!dist/**/*', '!lib/**/*', '!lib-commonjs/**/*'], - outputs: ['lib/**/*', 'src/**/*'], + cache: false, }, 'root-prebuild': { cache: false, From 5dd3ecc88cb4d6b2a932aa1d70787a4261629ba0 Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 13:50:04 -0700 Subject: [PATCH 3/8] add theming platform utilities to the design package --- packages/agentic-design/package.json | 10 ++++++- packages/agentic-design/src/theming/index.ts | 1 + .../src/theming/platformUtils.defaults.ts} | 10 ++++++- .../src/theming/platformUtils.macos.ts | 13 +++++++++ .../src/theming/platformUtils.ts | 1 + .../src/theming/platformUtils.win32.ts | 7 +++++ .../src/theming/platformUtils.windows.ts | 26 +++++++++++++++++ packages/deprecated/theming-ramp/package.json | 6 +++- packages/framework/theme/package.json | 6 +++- packages/theming/theme-tokens/package.json | 6 +++- packages/theming/theme-types/package.json | 6 +++- .../src/getCurrentAppearance.windows.ts | 26 ----------------- packages/theming/theming-utils/src/index.ts | 3 +- .../theming-utils/src/isHighContrast.macos.ts | 26 ----------------- .../theming-utils/src/isHighContrast.ts | 25 ----------------- .../theming-utils/src/isHighContrast.win32.ts | 28 ------------------- .../src/isHighContrast.windows.ts | 25 ----------------- packages/utils/test-tools/package.json | 6 +++- yarn.lock | 5 ++++ 19 files changed, 97 insertions(+), 139 deletions(-) rename packages/{theming/theming-utils/src/getCurrentAppearance.ts => agentic-design/src/theming/platformUtils.defaults.ts} (54%) create mode 100644 packages/agentic-design/src/theming/platformUtils.macos.ts create mode 100644 packages/agentic-design/src/theming/platformUtils.ts create mode 100644 packages/agentic-design/src/theming/platformUtils.win32.ts create mode 100644 packages/agentic-design/src/theming/platformUtils.windows.ts delete mode 100644 packages/theming/theming-utils/src/getCurrentAppearance.windows.ts delete mode 100644 packages/theming/theming-utils/src/isHighContrast.macos.ts delete mode 100644 packages/theming/theming-utils/src/isHighContrast.ts delete mode 100644 packages/theming/theming-utils/src/isHighContrast.win32.ts delete mode 100644 packages/theming/theming-utils/src/isHighContrast.windows.ts diff --git a/packages/agentic-design/package.json b/packages/agentic-design/package.json index b1d6ba83e3e..a01d557daef 100644 --- a/packages/agentic-design/package.json +++ b/packages/agentic-design/package.json @@ -60,6 +60,7 @@ "@fluentui-react-native/design-tokens-win32": "catalog:", "@fluentui-react-native/design-tokens-windows": "catalog:", "@fluentui-react-native/scripts": "workspace:*", + "@office-iss/react-native-win32": "^0.81.0", "@react-native-community/cli": "^20.0.0", "@react-native-community/cli-platform-android": "^20.0.0", "@react-native-community/cli-platform-ios": "^20.0.0", @@ -70,13 +71,15 @@ "react": "19.1.4", "react-native": "^0.81.6", "react-native-macos": "^0.81.0", + "react-native-windows": "^0.81.0", "react-test-renderer": "19.1.4" }, "peerDependencies": { "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -84,6 +87,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "furn": { @@ -95,6 +101,8 @@ "capabilities": [ "core-dev-only", "core-macos-dev-only", + "core-windows-dev-only", + "core-win32-dev-only", "react-test-renderer" ] }, diff --git a/packages/agentic-design/src/theming/index.ts b/packages/agentic-design/src/theming/index.ts index f084c82ea31..2cebc8dc4a3 100644 --- a/packages/agentic-design/src/theming/index.ts +++ b/packages/agentic-design/src/theming/index.ts @@ -34,3 +34,4 @@ export { ThemeProvider } from './ThemeProvider'; export type { ThemeProviderProps } from './ThemeProvider'; export { ThemeReference } from './themeReference'; export type { OnThemeChange, ThemeRecipe, ThemeTransform } from './themeReference'; +export { getCurrentAppearance, isHighContrast, setIsHighContrast } from './platformUtils'; diff --git a/packages/theming/theming-utils/src/getCurrentAppearance.ts b/packages/agentic-design/src/theming/platformUtils.defaults.ts similarity index 54% rename from packages/theming/theming-utils/src/getCurrentAppearance.ts rename to packages/agentic-design/src/theming/platformUtils.defaults.ts index 7a42aa24add..18c41bd0f81 100644 --- a/packages/theming/theming-utils/src/getCurrentAppearance.ts +++ b/packages/agentic-design/src/theming/platformUtils.defaults.ts @@ -1,6 +1,6 @@ import { Appearance } from 'react-native'; -import type { AppearanceOptions, ThemeOptions } from '@fluentui-react-native/design/theming'; +import type { AppearanceOptions, Theme, ThemeOptions } from './types/Theme.types'; export function getCurrentAppearance(appearance: ThemeOptions['appearance'], fallback: AppearanceOptions): AppearanceOptions { if (appearance === undefined || appearance === null) { @@ -9,3 +9,11 @@ export function getCurrentAppearance(appearance: ThemeOptions['appearance'], fal return appearance === 'dynamic' ? (Appearance && Appearance.getColorScheme()) || fallback : appearance; } + +export function setIsHighContrast(_isHighContrast: boolean) { + // High contrast state is managed externally on platforms other than macOS. +} + +export function isHighContrast(_theme?: Theme): boolean { + return false; +} diff --git a/packages/agentic-design/src/theming/platformUtils.macos.ts b/packages/agentic-design/src/theming/platformUtils.macos.ts new file mode 100644 index 00000000000..df4ef8ad14f --- /dev/null +++ b/packages/agentic-design/src/theming/platformUtils.macos.ts @@ -0,0 +1,13 @@ +import type { Theme } from './types/Theme.types'; + +export { getCurrentAppearance } from './platformUtils.defaults'; + +let isHighContrastEnabled = false; + +export function setIsHighContrast(isHighContrast: boolean) { + isHighContrastEnabled = isHighContrast; +} + +export function isHighContrast(_theme?: Theme): boolean { + return isHighContrastEnabled; +} diff --git a/packages/agentic-design/src/theming/platformUtils.ts b/packages/agentic-design/src/theming/platformUtils.ts new file mode 100644 index 00000000000..501ff27ea9d --- /dev/null +++ b/packages/agentic-design/src/theming/platformUtils.ts @@ -0,0 +1 @@ +export { getCurrentAppearance, isHighContrast, setIsHighContrast } from './platformUtils.defaults'; diff --git a/packages/agentic-design/src/theming/platformUtils.win32.ts b/packages/agentic-design/src/theming/platformUtils.win32.ts new file mode 100644 index 00000000000..8483e8ff426 --- /dev/null +++ b/packages/agentic-design/src/theming/platformUtils.win32.ts @@ -0,0 +1,7 @@ +import type { Theme } from './types/Theme.types'; + +export { getCurrentAppearance, setIsHighContrast } from './platformUtils.defaults'; + +export function isHighContrast(theme?: Theme): boolean { + return theme?.name === 'HighContrast'; +} diff --git a/packages/agentic-design/src/theming/platformUtils.windows.ts b/packages/agentic-design/src/theming/platformUtils.windows.ts new file mode 100644 index 00000000000..b03d4743dc1 --- /dev/null +++ b/packages/agentic-design/src/theming/platformUtils.windows.ts @@ -0,0 +1,26 @@ +import { Appearance } from 'react-native'; +import { AppTheme } from 'react-native-windows'; + +import type { AppearanceOptions, Theme, ThemeOptions } from './types/Theme.types'; + +export { setIsHighContrast } from './platformUtils.defaults'; + +export function getCurrentAppearance(appearance: ThemeOptions['appearance'], fallback: AppearanceOptions): AppearanceOptions { + if (appearance === undefined) { + return fallback; + } + + if (appearance === 'dynamic') { + if (!AppTheme || !Appearance) { + return fallback; + } + + return AppTheme.isHighContrast ? 'highContrast' : Appearance.getColorScheme(); + } + + return appearance; +} + +export function isHighContrast(_theme?: Theme): boolean { + return AppTheme.isHighContrast; +} diff --git a/packages/deprecated/theming-ramp/package.json b/packages/deprecated/theming-ramp/package.json index fd2cb86a8ba..ee14823d7a2 100644 --- a/packages/deprecated/theming-ramp/package.json +++ b/packages/deprecated/theming-ramp/package.json @@ -50,7 +50,8 @@ "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -58,6 +59,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "furn": { diff --git a/packages/framework/theme/package.json b/packages/framework/theme/package.json index c544592ba5e..dbe5b1f98e6 100644 --- a/packages/framework/theme/package.json +++ b/packages/framework/theme/package.json @@ -51,7 +51,8 @@ "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -59,6 +60,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "furn": { diff --git a/packages/theming/theme-tokens/package.json b/packages/theming/theme-tokens/package.json index 0b63d02c42a..6400c5554bc 100644 --- a/packages/theming/theme-tokens/package.json +++ b/packages/theming/theme-tokens/package.json @@ -55,7 +55,8 @@ "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -63,6 +64,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "rnx-kit": { diff --git a/packages/theming/theme-types/package.json b/packages/theming/theme-types/package.json index 1fbed69f074..602f9961c83 100644 --- a/packages/theming/theme-types/package.json +++ b/packages/theming/theme-types/package.json @@ -50,7 +50,8 @@ "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -58,6 +59,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "rnx-kit": { diff --git a/packages/theming/theming-utils/src/getCurrentAppearance.windows.ts b/packages/theming/theming-utils/src/getCurrentAppearance.windows.ts deleted file mode 100644 index 091d43a44e1..00000000000 --- a/packages/theming/theming-utils/src/getCurrentAppearance.windows.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { Appearance } from 'react-native'; - -import type { AppearanceOptions, ThemeOptions } from '@fluentui-react-native/design/theming'; -import { AppTheme } from 'react-native-windows'; - -export function getCurrentAppearance(appearance: ThemeOptions['appearance'], fallback: AppearanceOptions): AppearanceOptions { - if (appearance === undefined) { - return fallback; - } - - const isDynamic = appearance === 'dynamic'; - - if (isDynamic) { - if (!AppTheme || !Appearance) { - return fallback; - } - - if (AppTheme.isHighContrast) { - return 'highContrast' as AppearanceOptions; - } else { - return Appearance.getColorScheme(); // light or dark - } - } else { - return appearance as AppearanceOptions; - } -} diff --git a/packages/theming/theming-utils/src/index.ts b/packages/theming/theming-utils/src/index.ts index 6b4efbfae2d..95419129d86 100644 --- a/packages/theming/theming-utils/src/index.ts +++ b/packages/theming/theming-utils/src/index.ts @@ -1,4 +1,3 @@ -export { getCurrentAppearance } from './getCurrentAppearance'; -export { isHighContrast, setIsHighContrast } from './isHighContrast'; +export { getCurrentAppearance, isHighContrast, setIsHighContrast } from '@fluentui-react-native/design/theming'; export { mapPipelineToTheme, mapFontPipelineToTheme } from './mapPipelineToTheme'; export { mapPipelineToShadow } from './mapPipelineToShadow'; diff --git a/packages/theming/theming-utils/src/isHighContrast.macos.ts b/packages/theming/theming-utils/src/isHighContrast.macos.ts deleted file mode 100644 index 78c9b5a23bc..00000000000 --- a/packages/theming/theming-utils/src/isHighContrast.macos.ts +++ /dev/null @@ -1,26 +0,0 @@ -import type { Theme } from '@fluentui-react-native/design/theming'; - -let isHighContrastEnabled = false; - -/** - * Used to set isHighContrast state for FURN - * Specifically for macOS, where you cannot ask for HC state, - * so you have to store the value to keep track of it. - * - * @platform macOS - * @param isHighContrast New value of high contrast state - */ -export function setIsHighContrast(isHighContrast: boolean) { - isHighContrastEnabled = isHighContrast; -} - -/** - * Gives the state of high contrast in FURN. - * On win32, the t parameter is required, but on other platforms - * it's not needed. - * - * @param t The Theme object. Required on win32. - */ -export function isHighContrast(_t?: Theme): boolean { - return isHighContrastEnabled; -} diff --git a/packages/theming/theming-utils/src/isHighContrast.ts b/packages/theming/theming-utils/src/isHighContrast.ts deleted file mode 100644 index 74cbe47568c..00000000000 --- a/packages/theming/theming-utils/src/isHighContrast.ts +++ /dev/null @@ -1,25 +0,0 @@ -import type { Theme } from '@fluentui-react-native/design/theming'; - -/** - * Used to set isHighContrast state for FURN - * Specifically for macOS, where you cannot ask for HC state, - * so you have to store the value to keep track of it. - * - * @platform macOS - * @param isHighContrast New value of high contrast state - */ -export function setIsHighContrast(_isHighContrast: boolean) { - // noop, stub for mobile; -} - -/** - * Gives the state of high contrast in FURN. - * On win32, the t parameter is required, but on other platforms - * it's not needed. - * - * @param t The Theme object. Required on win32. - */ -export function isHighContrast(_t?: Theme): boolean { - // noop, stub for mobile; - return false; -} diff --git a/packages/theming/theming-utils/src/isHighContrast.win32.ts b/packages/theming/theming-utils/src/isHighContrast.win32.ts deleted file mode 100644 index 66535ee22d4..00000000000 --- a/packages/theming/theming-utils/src/isHighContrast.win32.ts +++ /dev/null @@ -1,28 +0,0 @@ -import type { Theme } from '@fluentui-react-native/design/theming'; - -/** - * Used to set isHighContrast state for FURN - * Specifically for macOS, where you cannot ask for HC state, - * so you have to store the value to keep track of it. - * - * @platform macOS - * @param isHighContrast New value of high contrast state - */ -export function setIsHighContrast(_isHighContrast: boolean) { - // noop, stub for win32; -} - -/** - * Gives the state of high contrast in FURN. - * On win32, the t parameter is required, but on other platforms - * it's not needed. - * - * @param t The Theme object. Required on win32. - */ -export function isHighContrast(t?: Theme): boolean { - if (!t) { - return false; - } - - return t.name === 'HighContrast'; -} diff --git a/packages/theming/theming-utils/src/isHighContrast.windows.ts b/packages/theming/theming-utils/src/isHighContrast.windows.ts deleted file mode 100644 index c133e84fff8..00000000000 --- a/packages/theming/theming-utils/src/isHighContrast.windows.ts +++ /dev/null @@ -1,25 +0,0 @@ -import type { Theme } from '@fluentui-react-native/design/theming'; -import { AppTheme } from 'react-native-windows'; - -/** - * Used to set isHighContrast state for FURN - * Specifically for macOS, where you cannot ask for HC state, - * so you have to store the value to keep track of it. - * - * @platform macOS - * @param isHighContrast New value of high contrast state - */ -export function setIsHighContrast(_isHighContrast: boolean) { - // noop, stub for windows; -} - -/** - * Gives the state of high contrast in FURN. - * On win32, the t parameter is required, but on other platforms - * it's not needed. - * - * @param t The Theme object. Required on win32. - */ -export function isHighContrast(_t?: Theme): boolean { - return AppTheme.isHighContrast; -} diff --git a/packages/utils/test-tools/package.json b/packages/utils/test-tools/package.json index 12871c3e96e..d127dcd0731 100644 --- a/packages/utils/test-tools/package.json +++ b/packages/utils/test-tools/package.json @@ -47,7 +47,8 @@ "@types/react": "~18.2.0 || ~19.0.0 || ~19.1.4", "react": "18.2.0 || 19.0.0 || 19.1.4", "react-native": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6", - "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" + "react-native-macos": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0", + "react-native-windows": "^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0" }, "peerDependenciesMeta": { "@types/react": { @@ -55,6 +56,9 @@ }, "react-native-macos": { "optional": true + }, + "react-native-windows": { + "optional": true } }, "furn": { diff --git a/yarn.lock b/yarn.lock index c6deaabc4d3..cc1a9bb8443 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3423,6 +3423,7 @@ __metadata: "@fluentui-react-native/design-tokens-windows": "catalog:" "@fluentui-react-native/framework-base": "workspace:*" "@fluentui-react-native/scripts": "workspace:*" + "@office-iss/react-native-win32": "npm:^0.81.0" "@react-native-community/cli": "npm:^20.0.0" "@react-native-community/cli-platform-android": "npm:^20.0.0" "@react-native-community/cli-platform-ios": "npm:^20.0.0" @@ -3433,17 +3434,21 @@ __metadata: react: "npm:19.1.4" react-native: "npm:^0.81.6" react-native-macos: "npm:^0.81.0" + react-native-windows: "npm:^0.81.0" react-test-renderer: "npm:19.1.4" peerDependencies: "@types/react": ~18.2.0 || ~19.0.0 || ~19.1.4 react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft From c1a3e9a52ca7bb923220de25d525a4118728aab2 Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 13:57:08 -0700 Subject: [PATCH 4/8] switch usage of theming utilities to the design package --- apps/tester-core/package.json | 1 - .../ColorTokens/ColorTokenTest.tsx | 2 +- .../CornerRadius/CornerRadiusTest.tsx | 2 +- .../StrokeWidth/StrokeWidthTest.tsx | 2 +- apps/tester-core/tsconfig.json | 3 --- packages/components/Avatar/package.json | 1 - .../components/Avatar/src/AvatarTokens.ts | 2 +- .../Avatar/src/AvatarTokens.win32.ts | 2 +- packages/components/Avatar/tsconfig.json | 3 --- packages/components/Badge/package.json | 1 - .../PresenceBadge/PresenceBadge.helpers.ts | 2 +- .../src/PresenceBadge/PresenceBadgeTokens.ts | 2 +- .../PresenceBadgeTokens.win32.ts | 2 +- packages/components/Badge/tsconfig.json | 3 --- packages/components/Button/package.json | 1 - .../Button/src/ButtonColorTokens.macos.ts | 2 +- .../Button/src/ButtonColorTokens.win32.ts | 2 +- .../Button/src/ButtonColorTokens.windows.ts | 2 +- .../Button/src/ButtonTokens.win32.ts | 2 +- .../CompoundButtonColorTokens.win32.ts | 2 +- .../CompoundButtonColorTokens.windows.ts | 2 +- .../CompoundButtonTokens.win32.ts | 2 +- .../ToggleButtonColorTokens.win32.ts | 2 +- .../ToggleButtonColorTokens.windows.ts | 2 +- packages/components/Button/src/useButton.ts | 2 +- packages/components/Button/tsconfig.json | 3 --- packages/components/Checkbox/package.json | 1 - .../src/shouldUseThickCheckmark.win32.ts | 2 +- packages/components/Checkbox/tsconfig.json | 3 --- packages/components/Menu/package.json | 1 - .../MenuPopover/MenuPopoverTokens.macos.ts | 2 +- packages/components/Menu/tsconfig.json | 3 --- packages/components/Switch/package.json | 2 +- .../Switch/src/SwitchTokens.win32.ts | 2 +- packages/components/Switch/tsconfig.json | 6 ++--- packages/components/TabList/package.json | 2 +- .../TabList/src/Tab/TabColorTokens.win32.ts | 2 +- packages/components/TabList/tsconfig.json | 6 ++--- packages/experimental/Shimmer/package.json | 2 +- .../experimental/Shimmer/src/ShimmerTokens.ts | 2 +- packages/experimental/Shimmer/tsconfig.json | 6 ++--- .../android-theme/src/androidShadows.ts | 2 +- .../src/__tests__/apple-theme.test.ts | 6 ++--- .../apple-theme/src/appleColors.ios.ts | 2 +- .../src/appleHighContrast.macos.ts | 2 +- .../apple-theme/src/appleShadows.ios.ts | 2 +- .../apple-theme/src/createAppleTheme.macos.ts | 4 +-- .../default-theme/src/createDefaultTheme.ts | 2 +- yarn.lock | 27 ++++++++++++------- 49 files changed, 62 insertions(+), 79 deletions(-) diff --git a/apps/tester-core/package.json b/apps/tester-core/package.json index ba2a8e14ca8..7d680428e91 100644 --- a/apps/tester-core/package.json +++ b/apps/tester-core/package.json @@ -73,7 +73,6 @@ "@fluentui-react-native/theme": "workspace:*", "@fluentui-react-native/theme-tokens": "workspace:*", "@fluentui-react-native/themed-stylesheet": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tooltip": "workspace:*", "@fluentui-react-native/vibrancy-view": "workspace:*", "@fluentui-react-native/win32-theme": "workspace:*", diff --git a/apps/tester-core/src/TestComponents/ColorTokens/ColorTokenTest.tsx b/apps/tester-core/src/TestComponents/ColorTokens/ColorTokenTest.tsx index bbf99c2abe9..77a8cfcf303 100644 --- a/apps/tester-core/src/TestComponents/ColorTokens/ColorTokenTest.tsx +++ b/apps/tester-core/src/TestComponents/ColorTokens/ColorTokenTest.tsx @@ -10,7 +10,7 @@ import { globalTokens } from '@fluentui-react-native/theme-tokens'; import type { Theme } from '@fluentui-react-native/design/theming'; import { useTheme } from '@fluentui-react-native/design/theming'; import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import { createOfficeAliasTokens } from '@fluentui-react-native/win32-theme'; import type { SvgProps } from 'react-native-svg'; import Svg, { G, Path } from 'react-native-svg'; diff --git a/apps/tester-core/src/TestComponents/CornerRadius/CornerRadiusTest.tsx b/apps/tester-core/src/TestComponents/CornerRadius/CornerRadiusTest.tsx index b08561e87c7..1eabac904a3 100644 --- a/apps/tester-core/src/TestComponents/CornerRadius/CornerRadiusTest.tsx +++ b/apps/tester-core/src/TestComponents/CornerRadius/CornerRadiusTest.tsx @@ -16,7 +16,7 @@ import { Text } from '@fluentui/react-native'; import { HOMEPAGE_CORNERRADIUS_TESTPAGE } from '@fluentui-react-native/e2e-testing'; import { useFluentTheme } from '@fluentui-react-native/framework'; import { Stack } from '@fluentui-react-native/stack'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import { stackStyle } from '../Common/styles'; import type { TestSection, PlatformStatus } from '../Test'; diff --git a/apps/tester-core/src/TestComponents/StrokeWidth/StrokeWidthTest.tsx b/apps/tester-core/src/TestComponents/StrokeWidth/StrokeWidthTest.tsx index 8b7dd08d9ac..3f6494855b7 100644 --- a/apps/tester-core/src/TestComponents/StrokeWidth/StrokeWidthTest.tsx +++ b/apps/tester-core/src/TestComponents/StrokeWidth/StrokeWidthTest.tsx @@ -19,7 +19,7 @@ import type { Theme } from '@fluentui-react-native/framework'; import { useFluentTheme } from '@fluentui-react-native/framework'; import { Stack } from '@fluentui-react-native/stack'; import { themedStyleSheet } from '@fluentui-react-native/themed-stylesheet'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import { stackStyle } from '../Common/styles'; import type { TestSection, PlatformStatus } from '../Test'; diff --git a/apps/tester-core/tsconfig.json b/apps/tester-core/tsconfig.json index 73d8f9be37c..0e882233a5d 100644 --- a/apps/tester-core/tsconfig.json +++ b/apps/tester-core/tsconfig.json @@ -145,9 +145,6 @@ { "path": "../../packages/framework/themed-stylesheet/tsconfig.json" }, - { - "path": "../../packages/theming/theming-utils/tsconfig.json" - }, { "path": "../../packages/experimental/Tooltip/tsconfig.json" }, diff --git a/packages/components/Avatar/package.json b/packages/components/Avatar/package.json index ae0edeb1b96..2a7e4b331af 100644 --- a/packages/components/Avatar/package.json +++ b/packages/components/Avatar/package.json @@ -37,7 +37,6 @@ "@fluentui-react-native/framework": "workspace:*", "@fluentui-react-native/framework-base": "workspace:*", "@fluentui-react-native/icon": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*", "unicode-segmenter": "^0.14.4" diff --git a/packages/components/Avatar/src/AvatarTokens.ts b/packages/components/Avatar/src/AvatarTokens.ts index 9505df879d8..484988f1adf 100644 --- a/packages/components/Avatar/src/AvatarTokens.ts +++ b/packages/components/Avatar/src/AvatarTokens.ts @@ -14,7 +14,7 @@ import { fontWeightRegular, fontWeightSemibold, } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { AvatarTokens } from '.'; diff --git a/packages/components/Avatar/src/AvatarTokens.win32.ts b/packages/components/Avatar/src/AvatarTokens.win32.ts index 77c88a11435..62a9351646b 100644 --- a/packages/components/Avatar/src/AvatarTokens.win32.ts +++ b/packages/components/Avatar/src/AvatarTokens.win32.ts @@ -14,7 +14,7 @@ import { fontWeightRegular, fontWeightSemibold, } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { AvatarTokens } from '.'; diff --git a/packages/components/Avatar/tsconfig.json b/packages/components/Avatar/tsconfig.json index 1add2faa0d1..69b25474847 100644 --- a/packages/components/Avatar/tsconfig.json +++ b/packages/components/Avatar/tsconfig.json @@ -29,9 +29,6 @@ { "path": "../../../scripts/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/Badge/package.json b/packages/components/Badge/package.json index 0b78a0ed0fc..abbb98b4413 100644 --- a/packages/components/Badge/package.json +++ b/packages/components/Badge/package.json @@ -34,7 +34,6 @@ "@fluentui-react-native/framework-base": "workspace:*", "@fluentui-react-native/icon": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*" }, diff --git a/packages/components/Badge/src/PresenceBadge/PresenceBadge.helpers.ts b/packages/components/Badge/src/PresenceBadge/PresenceBadge.helpers.ts index ce6ca622bf9..303e120bcba 100644 --- a/packages/components/Badge/src/PresenceBadge/PresenceBadge.helpers.ts +++ b/packages/components/Badge/src/PresenceBadge/PresenceBadge.helpers.ts @@ -1,4 +1,4 @@ -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { PresenceBadgeTokens } from './PresenceBadge.types'; import type { Theme } from '@fluentui-react-native/design/theming'; diff --git a/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.ts b/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.ts index b949ce39e6e..74419becd22 100644 --- a/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.ts +++ b/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.ts @@ -9,7 +9,7 @@ import { size20, sizeNone, } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { PresenceBadgeTokens } from './PresenceBadge.types'; diff --git a/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.win32.ts b/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.win32.ts index ac98c827633..f9d35709d10 100644 --- a/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.win32.ts +++ b/packages/components/Badge/src/PresenceBadge/PresenceBadgeTokens.win32.ts @@ -9,7 +9,7 @@ import { size20, sizeNone, } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import { getBadgeColor } from './PresenceBadge.helpers'; import type { PresenceBadgeTokens } from './PresenceBadge.types'; diff --git a/packages/components/Badge/tsconfig.json b/packages/components/Badge/tsconfig.json index aa60d21b6d6..db740780da4 100644 --- a/packages/components/Badge/tsconfig.json +++ b/packages/components/Badge/tsconfig.json @@ -35,9 +35,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/Button/package.json b/packages/components/Button/package.json index 0f62e90dc06..7cbb24a74fd 100644 --- a/packages/components/Button/package.json +++ b/packages/components/Button/package.json @@ -42,7 +42,6 @@ "@fluentui-react-native/pressable": "workspace:*", "@fluentui-react-native/styling-utils": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*", "@uifabricshared/foundation-composable": "workspace:*", diff --git a/packages/components/Button/src/ButtonColorTokens.macos.ts b/packages/components/Button/src/ButtonColorTokens.macos.ts index 40d78251379..b13db21d4d6 100644 --- a/packages/components/Button/src/ButtonColorTokens.macos.ts +++ b/packages/components/Button/src/ButtonColorTokens.macos.ts @@ -1,5 +1,5 @@ import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ButtonTokens } from './Button.types'; diff --git a/packages/components/Button/src/ButtonColorTokens.win32.ts b/packages/components/Button/src/ButtonColorTokens.win32.ts index 2a40e43d040..3bd71cdedbf 100644 --- a/packages/components/Button/src/ButtonColorTokens.win32.ts +++ b/packages/components/Button/src/ButtonColorTokens.win32.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ButtonTokens } from './Button.types'; diff --git a/packages/components/Button/src/ButtonColorTokens.windows.ts b/packages/components/Button/src/ButtonColorTokens.windows.ts index 17de26c3044..5c602420982 100644 --- a/packages/components/Button/src/ButtonColorTokens.windows.ts +++ b/packages/components/Button/src/ButtonColorTokens.windows.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ButtonTokens } from './Button.types'; diff --git a/packages/components/Button/src/ButtonTokens.win32.ts b/packages/components/Button/src/ButtonTokens.win32.ts index 16f285a7048..17c489862cd 100644 --- a/packages/components/Button/src/ButtonTokens.win32.ts +++ b/packages/components/Button/src/ButtonTokens.win32.ts @@ -12,7 +12,7 @@ import { strokeWidth10, strokeWidth20, } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ButtonTokens } from './Button.types'; diff --git a/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.win32.ts b/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.win32.ts index 2c7e8018146..51b5e580421 100644 --- a/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.win32.ts +++ b/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.win32.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { CompoundButtonTokens } from './CompoundButton.types'; diff --git a/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.windows.ts b/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.windows.ts index 9e9b64bde64..c67494bfc30 100644 --- a/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.windows.ts +++ b/packages/components/Button/src/CompoundButton/CompoundButtonColorTokens.windows.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { CompoundButtonTokens } from './CompoundButton.types'; diff --git a/packages/components/Button/src/CompoundButton/CompoundButtonTokens.win32.ts b/packages/components/Button/src/CompoundButton/CompoundButtonTokens.win32.ts index 6cb7614685f..dfc8b3950da 100644 --- a/packages/components/Button/src/CompoundButton/CompoundButtonTokens.win32.ts +++ b/packages/components/Button/src/CompoundButton/CompoundButtonTokens.win32.ts @@ -1,6 +1,6 @@ import type { Theme } from '@fluentui-react-native/framework'; import { size120, size160, size200, size80, strokeWidth10, strokeWidth20 } from '@fluentui-react-native/design/tokens/global'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { CompoundButtonTokens } from './CompoundButton.types'; diff --git a/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.win32.ts b/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.win32.ts index e2bee988a4d..979612ffd8b 100644 --- a/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.win32.ts +++ b/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.win32.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ToggleButtonTokens } from './ToggleButton.types'; diff --git a/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.windows.ts b/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.windows.ts index cfcc4338fc1..bf00a4391b3 100644 --- a/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.windows.ts +++ b/packages/components/Button/src/ToggleButton/ToggleButtonColorTokens.windows.ts @@ -1,7 +1,7 @@ import { PlatformColor } from 'react-native'; import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { ToggleButtonTokens } from './ToggleButton.types'; diff --git a/packages/components/Button/src/useButton.ts b/packages/components/Button/src/useButton.ts index 5d0d0cdca73..0f6c0e994d1 100644 --- a/packages/components/Button/src/useButton.ts +++ b/packages/components/Button/src/useButton.ts @@ -4,7 +4,7 @@ import type { LayoutChangeEvent } from 'react-native'; import { useFluentTheme } from '@fluentui-react-native/framework'; import { usePressableState, useKeyProps, useOnPressWithFocus, useViewCommandFocus } from '@fluentui-react-native/interactive-hooks'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { ButtonProps, ButtonInfo } from './Button.types'; diff --git a/packages/components/Button/tsconfig.json b/packages/components/Button/tsconfig.json index 3cf629d03ba..a0715dff5e2 100644 --- a/packages/components/Button/tsconfig.json +++ b/packages/components/Button/tsconfig.json @@ -47,9 +47,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/Checkbox/package.json b/packages/components/Checkbox/package.json index 93158eaa4af..cfcd53d6ff2 100644 --- a/packages/components/Checkbox/package.json +++ b/packages/components/Checkbox/package.json @@ -39,7 +39,6 @@ "@fluentui-react-native/pressable": "workspace:*", "@fluentui-react-native/styling-utils": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*", "@uifabricshared/foundation-composable": "workspace:*", diff --git a/packages/components/Checkbox/src/shouldUseThickCheckmark.win32.ts b/packages/components/Checkbox/src/shouldUseThickCheckmark.win32.ts index 2119db54524..e3b6762bf7e 100644 --- a/packages/components/Checkbox/src/shouldUseThickCheckmark.win32.ts +++ b/packages/components/Checkbox/src/shouldUseThickCheckmark.win32.ts @@ -1,5 +1,5 @@ import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; export function shouldUseThickCheckmark(theme: Theme): boolean { if (isHighContrast(theme)) { diff --git a/packages/components/Checkbox/tsconfig.json b/packages/components/Checkbox/tsconfig.json index bce07eeaa14..a8a68f96190 100644 --- a/packages/components/Checkbox/tsconfig.json +++ b/packages/components/Checkbox/tsconfig.json @@ -38,9 +38,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/Menu/package.json b/packages/components/Menu/package.json index 8a4e79a142f..d98aedae7be 100644 --- a/packages/components/Menu/package.json +++ b/packages/components/Menu/package.json @@ -40,7 +40,6 @@ "@fluentui-react-native/icon": "workspace:*", "@fluentui-react-native/interactive-hooks": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*" }, diff --git a/packages/components/Menu/src/MenuPopover/MenuPopoverTokens.macos.ts b/packages/components/Menu/src/MenuPopover/MenuPopoverTokens.macos.ts index 4154e88b258..05ab7e2f1b5 100644 --- a/packages/components/Menu/src/MenuPopover/MenuPopoverTokens.macos.ts +++ b/packages/components/Menu/src/MenuPopover/MenuPopoverTokens.macos.ts @@ -1,6 +1,6 @@ import type { Theme } from '@fluentui-react-native/framework'; import { buildUseTokens } from '@fluentui-react-native/framework'; -import { getCurrentAppearance, isHighContrast } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance, isHighContrast } from '@fluentui-react-native/design/theming'; import type { MenuPopoverTokens } from './MenuPopover.types'; import { menuPopoverName } from './MenuPopover.types'; diff --git a/packages/components/Menu/tsconfig.json b/packages/components/Menu/tsconfig.json index 52150077e90..edf42153da0 100644 --- a/packages/components/Menu/tsconfig.json +++ b/packages/components/Menu/tsconfig.json @@ -44,9 +44,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/Switch/package.json b/packages/components/Switch/package.json index 401bb939fd5..ba03e5857d6 100644 --- a/packages/components/Switch/package.json +++ b/packages/components/Switch/package.json @@ -30,11 +30,11 @@ "update-snapshots": "fluentui-scripts jest -u" }, "dependencies": { + "@fluentui-react-native/design": "workspace:*", "@fluentui-react-native/framework": "workspace:*", "@fluentui-react-native/framework-base": "workspace:*", "@fluentui-react-native/interactive-hooks": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*" }, diff --git a/packages/components/Switch/src/SwitchTokens.win32.ts b/packages/components/Switch/src/SwitchTokens.win32.ts index fce920148d1..8acf956fa25 100644 --- a/packages/components/Switch/src/SwitchTokens.win32.ts +++ b/packages/components/Switch/src/SwitchTokens.win32.ts @@ -1,5 +1,5 @@ import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { SwitchTokens } from './Switch.types'; diff --git a/packages/components/Switch/tsconfig.json b/packages/components/Switch/tsconfig.json index 36924fb2db3..a5616b02bfd 100644 --- a/packages/components/Switch/tsconfig.json +++ b/packages/components/Switch/tsconfig.json @@ -8,6 +8,9 @@ }, "include": ["src"], "references": [ + { + "path": "../../agentic-design/tsconfig.json" + }, { "path": "../../framework-base/tsconfig.json" }, @@ -26,9 +29,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/components/TabList/package.json b/packages/components/TabList/package.json index bc36334e2c4..634937094a7 100644 --- a/packages/components/TabList/package.json +++ b/packages/components/TabList/package.json @@ -31,13 +31,13 @@ }, "dependencies": { "@fluentui-react-native/adapters": "workspace:*", + "@fluentui-react-native/design": "workspace:*", "@fluentui-react-native/focus-zone": "workspace:*", "@fluentui-react-native/framework": "workspace:*", "@fluentui-react-native/framework-base": "workspace:*", "@fluentui-react-native/icon": "workspace:*", "@fluentui-react-native/interactive-hooks": "workspace:*", "@fluentui-react-native/text": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*" }, diff --git a/packages/components/TabList/src/Tab/TabColorTokens.win32.ts b/packages/components/TabList/src/Tab/TabColorTokens.win32.ts index 6eee30d094b..58a9fb18219 100644 --- a/packages/components/TabList/src/Tab/TabColorTokens.win32.ts +++ b/packages/components/TabList/src/Tab/TabColorTokens.win32.ts @@ -1,5 +1,5 @@ import type { Theme } from '@fluentui-react-native/framework'; -import { isHighContrast } from '@fluentui-react-native/theming-utils'; +import { isHighContrast } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import type { TabTokens } from '..'; diff --git a/packages/components/TabList/tsconfig.json b/packages/components/TabList/tsconfig.json index 34d69ae3221..1d959f03498 100644 --- a/packages/components/TabList/tsconfig.json +++ b/packages/components/TabList/tsconfig.json @@ -11,6 +11,9 @@ { "path": "../../utils/adapters/tsconfig.json" }, + { + "path": "../../agentic-design/tsconfig.json" + }, { "path": "../FocusZone/tsconfig.json" }, @@ -35,9 +38,6 @@ { "path": "../Text/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/experimental/Shimmer/package.json b/packages/experimental/Shimmer/package.json index a4751c9433b..5030ef95406 100644 --- a/packages/experimental/Shimmer/package.json +++ b/packages/experimental/Shimmer/package.json @@ -30,9 +30,9 @@ "update-snapshots": "fluentui-scripts jest -u" }, "dependencies": { + "@fluentui-react-native/design": "workspace:*", "@fluentui-react-native/framework": "workspace:*", "@fluentui-react-native/framework-base": "workspace:*", - "@fluentui-react-native/theming-utils": "workspace:*", "@fluentui-react-native/tokens": "workspace:*", "@fluentui-react-native/use-styling": "workspace:*", "assert-never": "^1.2.1" diff --git a/packages/experimental/Shimmer/src/ShimmerTokens.ts b/packages/experimental/Shimmer/src/ShimmerTokens.ts index f3a0706b5bb..c2c8d903b9a 100644 --- a/packages/experimental/Shimmer/src/ShimmerTokens.ts +++ b/packages/experimental/Shimmer/src/ShimmerTokens.ts @@ -1,5 +1,5 @@ import type { Theme } from '@fluentui-react-native/framework'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import type { TokenSettings } from '@fluentui-react-native/use-styling'; import { shimmerDefaultAngle, shimmerDefaultDelay, shimmerDefaultDuration } from './consts'; diff --git a/packages/experimental/Shimmer/tsconfig.json b/packages/experimental/Shimmer/tsconfig.json index 79f47ac5f70..4fa35d2f168 100644 --- a/packages/experimental/Shimmer/tsconfig.json +++ b/packages/experimental/Shimmer/tsconfig.json @@ -8,6 +8,9 @@ }, "include": ["src"], "references": [ + { + "path": "../../agentic-design/tsconfig.json" + }, { "path": "../../framework-base/tsconfig.json" }, @@ -17,9 +20,6 @@ { "path": "../../../scripts/tsconfig.json" }, - { - "path": "../../theming/theming-utils/tsconfig.json" - }, { "path": "../../utils/tokens/tsconfig.json" }, diff --git a/packages/theming/android-theme/src/androidShadows.ts b/packages/theming/android-theme/src/androidShadows.ts index 6b2e310d004..b9cadc9833b 100644 --- a/packages/theming/android-theme/src/androidShadows.ts +++ b/packages/theming/android-theme/src/androidShadows.ts @@ -1,7 +1,7 @@ import { Appearance } from 'react-native'; import type { ThemeShadowDefinition } from '@fluentui-react-native/design/theming'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import { createShadowAliasTokens } from './createAliasTokens'; diff --git a/packages/theming/apple-theme/src/__tests__/apple-theme.test.ts b/packages/theming/apple-theme/src/__tests__/apple-theme.test.ts index 7906a3d4fc7..08b0e43d037 100644 --- a/packages/theming/apple-theme/src/__tests__/apple-theme.test.ts +++ b/packages/theming/apple-theme/src/__tests__/apple-theme.test.ts @@ -1,6 +1,6 @@ +import { isHighContrast, setIsHighContrast } from '@fluentui-react-native/design/theming'; import type { AppearanceOptions } from '@fluentui-react-native/design/theming'; -import { getIsHighContrast, setIsHighContrast } from '../appleHighContrast.macos'; import { createAppleTheme } from '../createAppleTheme'; import { createMacOSColorAliasTokens, createMacOSShadowAliasTokens } from '../createMacOSAliasTokens'; @@ -39,9 +39,9 @@ it('createAppleTheme test', () => { it('IsHighContrast test', () => { setIsHighContrast(false); - expect(getIsHighContrast()).toBe(false); + expect(isHighContrast()).toBe(false); setIsHighContrast(true); - expect(getIsHighContrast()).toBe(true); + expect(isHighContrast()).toBe(true); }); it.concurrent.each(macOSAliasTokensTable)( diff --git a/packages/theming/apple-theme/src/appleColors.ios.ts b/packages/theming/apple-theme/src/appleColors.ios.ts index b72eab78c68..c4a092fb153 100644 --- a/packages/theming/apple-theme/src/appleColors.ios.ts +++ b/packages/theming/apple-theme/src/appleColors.ios.ts @@ -2,7 +2,7 @@ import { Appearance } from 'react-native'; import type { ThemeColorDefinition } from '@fluentui-react-native/design/theming'; import { colorGrey26 } from '@fluentui-react-native/design/tokens/global'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import type { ApplePalette } from './appleColors.types.ios'; import { createiOSColorAliasTokens } from './createiOSAliasTokens'; diff --git a/packages/theming/apple-theme/src/appleHighContrast.macos.ts b/packages/theming/apple-theme/src/appleHighContrast.macos.ts index 7bf1702091e..84fdb302c31 100644 --- a/packages/theming/apple-theme/src/appleHighContrast.macos.ts +++ b/packages/theming/apple-theme/src/appleHighContrast.macos.ts @@ -1,4 +1,4 @@ -import { isHighContrast, setIsHighContrast as setIsHighContrastCore } from '@fluentui-react-native/theming-utils'; +import { isHighContrast, setIsHighContrast as setIsHighContrastCore } from '@fluentui-react-native/design/theming'; export function setIsHighContrast(newIsHighContrast: boolean) { setIsHighContrastCore(newIsHighContrast); diff --git a/packages/theming/apple-theme/src/appleShadows.ios.ts b/packages/theming/apple-theme/src/appleShadows.ios.ts index 4d5b8107ca7..cd8fabf901a 100644 --- a/packages/theming/apple-theme/src/appleShadows.ios.ts +++ b/packages/theming/apple-theme/src/appleShadows.ios.ts @@ -1,7 +1,7 @@ import { Appearance } from 'react-native'; import type { ThemeShadowDefinition } from '@fluentui-react-native/design/theming'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import { createiOSShadowAliasTokens } from './createiOSAliasTokens'; diff --git a/packages/theming/apple-theme/src/createAppleTheme.macos.ts b/packages/theming/apple-theme/src/createAppleTheme.macos.ts index 7dc71fb7c23..8e5fc50fd2e 100644 --- a/packages/theming/apple-theme/src/createAppleTheme.macos.ts +++ b/packages/theming/apple-theme/src/createAppleTheme.macos.ts @@ -1,11 +1,9 @@ import { Appearance } from 'react-native'; -import { ThemeReference } from '@fluentui-react-native/design/theming'; +import { getCurrentAppearance, setIsHighContrast, ThemeReference } from '@fluentui-react-native/design/theming'; import type { Theme } from '@fluentui-react-native/design/theming'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; import { AccessibilityInfo } from 'react-native-macos'; -import { setIsHighContrast } from './appleHighContrast.macos'; import { getBaseAppleThemeMacOS } from './appleTheme.macos'; let appleThemeReference: ThemeReference; diff --git a/packages/theming/default-theme/src/createDefaultTheme.ts b/packages/theming/default-theme/src/createDefaultTheme.ts index 44bdf92ee55..b43ef64a426 100644 --- a/packages/theming/default-theme/src/createDefaultTheme.ts +++ b/packages/theming/default-theme/src/createDefaultTheme.ts @@ -2,7 +2,7 @@ import { Appearance } from 'react-native'; import { ThemeReference } from '@fluentui-react-native/design/theming'; import type { Theme, ThemeOptions } from '@fluentui-react-native/design/theming'; -import { getCurrentAppearance } from '@fluentui-react-native/theming-utils'; +import { getCurrentAppearance } from '@fluentui-react-native/design/theming'; import assertNever from 'assert-never'; import { defaultFluentDarkTheme, defaultFluentHighConstrastTheme, defaultFluentTheme } from './defaultTheme'; diff --git a/yarn.lock b/yarn.lock index cc1a9bb8443..a942c769342 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2717,7 +2717,6 @@ __metadata: "@fluentui-react-native/framework-base": "workspace:*" "@fluentui-react-native/icon": "workspace:*" "@fluentui-react-native/scripts": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -2769,7 +2768,6 @@ __metadata: "@fluentui-react-native/scripts": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -2824,7 +2822,6 @@ __metadata: "@fluentui-react-native/styling-utils": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -2922,7 +2919,6 @@ __metadata: "@fluentui-react-native/styling-utils": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -3977,10 +3973,10 @@ __metadata: resolution: "@fluentui-react-native/experimental-shimmer@workspace:packages/experimental/Shimmer" dependencies: "@babel/core": "catalog:" + "@fluentui-react-native/design": "workspace:*" "@fluentui-react-native/framework": "workspace:*" "@fluentui-react-native/framework-base": "workspace:*" "@fluentui-react-native/scripts": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@react-native-community/cli": "npm:^20.0.0" @@ -4425,7 +4421,6 @@ __metadata: "@fluentui-react-native/scripts": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -5016,13 +5011,13 @@ __metadata: resolution: "@fluentui-react-native/switch@workspace:packages/components/Switch" dependencies: "@babel/core": "catalog:" + "@fluentui-react-native/design": "workspace:*" "@fluentui-react-native/framework": "workspace:*" "@fluentui-react-native/framework-base": "workspace:*" "@fluentui-react-native/interactive-hooks": "workspace:*" "@fluentui-react-native/scripts": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -5063,6 +5058,7 @@ __metadata: dependencies: "@babel/core": "catalog:" "@fluentui-react-native/adapters": "workspace:*" + "@fluentui-react-native/design": "workspace:*" "@fluentui-react-native/focus-zone": "workspace:*" "@fluentui-react-native/framework": "workspace:*" "@fluentui-react-native/framework-base": "workspace:*" @@ -5071,7 +5067,6 @@ __metadata: "@fluentui-react-native/scripts": "workspace:*" "@fluentui-react-native/test-tools": "workspace:*" "@fluentui-react-native/text": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tokens": "workspace:*" "@fluentui-react-native/use-styling": "workspace:*" "@office-iss/react-native-win32": "npm:^0.81.8" @@ -5127,11 +5122,14 @@ __metadata: react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft @@ -5186,7 +5184,6 @@ __metadata: "@fluentui-react-native/theme": "workspace:*" "@fluentui-react-native/theme-tokens": "workspace:*" "@fluentui-react-native/themed-stylesheet": "workspace:*" - "@fluentui-react-native/theming-utils": "workspace:*" "@fluentui-react-native/tooltip": "workspace:*" "@fluentui-react-native/vibrancy-view": "workspace:*" "@fluentui-react-native/win32-theme": "workspace:*" @@ -5456,11 +5453,14 @@ __metadata: react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft @@ -5483,11 +5483,14 @@ __metadata: react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft @@ -5511,11 +5514,14 @@ __metadata: react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.6 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft @@ -10787,11 +10793,14 @@ __metadata: react: 18.2.0 || 19.0.0 || 19.1.4 react-native: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 react-native-macos: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 + react-native-windows: ^0.73.0 || ^0.74.0 || ^0.78.0 || ^0.81.0 peerDependenciesMeta: "@types/react": optional: true react-native-macos: optional: true + react-native-windows: + optional: true languageName: unknown linkType: soft From 48f41f541808a7ec40284f242da37b947449554a Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 13:58:05 -0700 Subject: [PATCH 5/8] add changeset --- .changeset/odd-taxis-do.md | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 .changeset/odd-taxis-do.md diff --git a/.changeset/odd-taxis-do.md b/.changeset/odd-taxis-do.md new file mode 100644 index 00000000000..a6f494e9168 --- /dev/null +++ b/.changeset/odd-taxis-do.md @@ -0,0 +1,21 @@ +--- +"@uifabricshared/theming-ramp": patch +"@fluentui-react-native/android-theme": patch +"@fluentui-react-native/default-theme": patch +"@fluentui-react-native/theming-utils": patch +"@fluentui-react-native/experimental-shimmer": patch +"@fluentui-react-native/theme-tokens": patch +"@fluentui-react-native/checkbox": patch +"@fluentui-react-native/apple-theme": patch +"@fluentui-react-native/theme-types": patch +"@fluentui-react-native/tablist": patch +"@fluentui-react-native/avatar": patch +"@fluentui-react-native/button": patch +"@fluentui-react-native/switch": patch +"@fluentui-react-native/badge": patch +"@fluentui-react-native/menu": patch +"@fluentui-react-native/theme": patch +"@fluentui-react-native/design": patch +--- + +Move platform theming utilities into the design package, update usage in the repo to use the new source" From 3e9ab17beea8af5fda04a0bab510b68ec34f9e8a Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 14:03:26 -0700 Subject: [PATCH 6/8] update dead links and add instructions to fix links --- AGENTS.md | 2 ++ docs/pages/Theming/CustomTheme.md | 6 +++--- docs/pages/Theming/Tokens/Basics.md | 2 +- packages/components/Text/MIGRATION.md | 2 +- 4 files changed, 7 insertions(+), 5 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index f2c07c0cbe3..38c2f798d55 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -71,6 +71,7 @@ yarn format:check # Check formatting without writing ```bash yarn lint-repo # Repo-wide structural lint (scripts/src/tasks/lintRepo.ts) yarn lint-lockfile # Validate the Yarn lockfile +yarn lage test-links # Validate links in repository Markdown files yarn check-publishing # Validate package publishing configuration yarn change # Create a change file for the current branch yarn change:check # Verify required change files exist @@ -85,6 +86,7 @@ The task pipeline is defined in `lage.config.mjs`: - `buildci` is the aggregate CI alias (lint-repo, check-publishing, build, test, lint) - Lage caches task outputs; add `--no-cache` to bypass caching and `--verbose` for detailed output - After a major rework (e.g. moving packages, large refactors, or renaming exports), run `yarn lage test --no-cache` from the root once to force every test to re-run without relying on stale cached results. This also resets the Lage cache, so subsequent plain `yarn lage test` runs will work incrementally again. +- Before checking in moved or renamed files, run `yarn lage test-links` and update any repository links that still reference the old paths. ### Package-Level Commands diff --git a/docs/pages/Theming/CustomTheme.md b/docs/pages/Theming/CustomTheme.md index 8d0f627192b..dae5b4c7016 100644 --- a/docs/pages/Theming/CustomTheme.md +++ b/docs/pages/Theming/CustomTheme.md @@ -8,7 +8,7 @@ There are two ways to make a custom theme: you can tack onto an existing one usi ### Extending an existing `ThemeReference` -We have a concept of `ThemeRecipes` which allow for layering of partial theme objects to create the ultimately desired theme. `ThemeRecipes` are functions which take a `Theme` and spit out a [`PartialTheme`](../../../packages/agentic-design/src/theming/Theme.types.ts), which is then deep merged into the base theme object. +We have a concept of `ThemeRecipes` which allow for layering of partial theme objects to create the ultimately desired theme. `ThemeRecipes` are functions which take a `Theme` and spit out a [`PartialTheme`](../../../packages/agentic-design/src/theming/types/Theme.types.ts), which is then deep merged into the base theme object. You can extend one of our default themes by creating a `ThemeReference` using the default theme as the base theme, and then add your customization as a `ThemeRecipe`: @@ -46,7 +46,7 @@ There's two ways to customize a FURN theme's properties: ### Changing theme tokens directly -Theme tokens can be overridden directly. You can specify different values for theme entries and add to the set of colors. You can see what can be overridden by looking at the [Theme type definition](../../../packages/agentic-design/src/theming/Theme.types.ts). +Theme tokens can be overridden directly. You can specify different values for theme entries and add to the set of colors. You can see what can be overridden by looking at the [Theme type definition](../../../packages/agentic-design/src/theming/types/Theme.types.ts). This approach is useful if you need the customizations to be applied to all components. @@ -161,7 +161,7 @@ interface Theme { } ``` -(Taken from the [`Theme` type definition](../../../packages/agentic-design/src/theming/Theme.types.ts).) +(Taken from the [`Theme` type definition](../../../packages/agentic-design/src/theming/types/Theme.types.ts).) NOTE: If you would prefer to customize one instance of a FURN component instead, use [the customize API](../../../packages/framework/composition/README.md). diff --git a/docs/pages/Theming/Tokens/Basics.md b/docs/pages/Theming/Tokens/Basics.md index 9da2133097f..62af9347591 100644 --- a/docs/pages/Theming/Tokens/Basics.md +++ b/docs/pages/Theming/Tokens/Basics.md @@ -74,7 +74,7 @@ export const defaultNotificationTokens: TokenSettings Notes about alias color tokens: -- Different platforms can have different sets of alias tokens; however, the entire set of alias tokens are all defined in the same interface. See [Color.types.ts](https://github.com/microsoft/fluentui-react-native/blob/main/packages/agentic-design/src/theming/Color.types.ts#L861) for this interface and which platforms define which alias tokens. +- Different platforms can have different sets of alias tokens; however, the entire set of alias tokens are all defined in the same interface. See [Color.types.ts](../../../../packages/agentic-design/src/theming/types/Color.types.ts#L861) for this interface and which platforms define which alias tokens. - As a result, if an alias token is referenced that does not exist for that platform, there won't be any compile-time or run-time errors. Instead, the color shown will default to black. Special case: if accessing a specific color, you can find it in the `globalTokens.color` property. diff --git a/packages/components/Text/MIGRATION.md b/packages/components/Text/MIGRATION.md index dea57968b5c..2748e84a516 100644 --- a/packages/components/Text/MIGRATION.md +++ b/packages/components/Text/MIGRATION.md @@ -21,7 +21,7 @@ import { TextV1 as Text } from '@fluentui-react-native/text'; ### Props changed -- `variant` => Prop name remains identical, but will support a different collection of named font variants. Newly defined v1 variants can be found in [Typography.types](../../agentic-design/src/theming/Typography.types.ts) under theme-types. +- `variant` => Prop name remains identical, but will support a different collection of named font variants. Newly defined v1 variants can be found in [Typography.types](../../agentic-design/src/theming/types/Typography.types.ts) under theme-types. ### Props added From 8f33ef1408a2d32dc32684f5f0558952da215a2b Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 14:17:48 -0700 Subject: [PATCH 7/8] add jsx-runtime.js to check build --- packages/framework-base/targets/tsconfig.check.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/framework-base/targets/tsconfig.check.json b/packages/framework-base/targets/tsconfig.check.json index c32bd0039f7..e15afdc6840 100644 --- a/packages/framework-base/targets/tsconfig.check.json +++ b/packages/framework-base/targets/tsconfig.check.json @@ -8,5 +8,5 @@ "composite": true, "tsBuildInfoFile": "../.cache/tsconfig.check.tsbuildinfo" }, - "include": ["../src"] + "include": ["../src", "../jsx-runtime.js"] } From 42ba8fdf69f00d3ed1061f2ea6a636b5f9e0f6b7 Mon Sep 17 00:00:00 2001 From: Jason Morse Date: Tue, 21 Jul 2026 14:25:34 -0700 Subject: [PATCH 8/8] add dependency on build for the check build --- packages/framework-base/targets/tsconfig.check.json | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/framework-base/targets/tsconfig.check.json b/packages/framework-base/targets/tsconfig.check.json index e15afdc6840..20854bef086 100644 --- a/packages/framework-base/targets/tsconfig.check.json +++ b/packages/framework-base/targets/tsconfig.check.json @@ -8,5 +8,10 @@ "composite": true, "tsBuildInfoFile": "../.cache/tsconfig.check.tsbuildinfo" }, - "include": ["../src", "../jsx-runtime.js"] + "include": ["../src", "../jsx-runtime.js"], + "references": [ + { + "path": "./tsconfig.build.json" + } + ] }