@fluentui/react-provider 0.0.0-nightlydd0f007b3f20220119.1 → 0.0.0-nightlye0b8e1fa6920220128.1

package/CHANGELOG.json

@@ -2,15 +2,15 @@
   "name": "@fluentui/react-provider",
   "entries": [
     {
-      "date": "Wed, 19 Jan 2022 04:16:38 GMT",
-      "tag": "@fluentui/react-provider_v0.0.0-nightlydd0f007b3f20220119.1",
-      "version": "0.0.0-nightlydd0f007b3f20220119.1",
+      "date": "Fri, 28 Jan 2022 04:13:22 GMT",
+      "tag": "@fluentui/react-provider_v0.0.0-nightlye0b8e1fa6920220128.1",
+      "version": "0.0.0-nightlye0b8e1fa6920220128.1",
       "comments": {
         "prerelease": [
           {
             "author": "email not defined",
             "package": "@fluentui/react-provider",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a",
             "comment": "Release nightly v9"
           },
           {
@@ -19,6 +19,18 @@
             "commit": "00a5d945904c896a0664de6ba72c145a255f0848",
             "comment": "Updating use of tokens.fontWeight now that we don't need to use casting."
           },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-provider",
+            "commit": "706305303fcf03a82052c0a9e74d8aecb102885e",
+            "comment": "use Griffel packages"
+          },
+          {
+            "author": "Humberto.Morimoto@microsoft.com",
+            "package": "@fluentui/react-provider",
+            "commit": "e0b8e1fa6980077e7b311fd1c72c28d3e4305db0",
+            "comment": "Updating based on changes to composition types."
+          },
           {
             "author": "martinhochel@microsoft.com",
             "package": "@fluentui/react-provider",
@@ -50,72 +62,78 @@
             "comment": "Remove component's shorthandProps array"
           },
           {
-            "author": "beachball",
-            "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-make-styles to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
-          },
-          {
-            "author": "beachball",
+            "author": "behowell@microsoft.com",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
+            "comment": "BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
           },
           {
-            "author": "beachball",
+            "author": "Humberto.Morimoto@microsoft.com",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-tabster to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "commit": "0bc161458eae5ae8d387172430496ce9829b1bb1",
+            "comment": "Using ComponentSlotProps instead of ObjectShorthandProps."
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-theme to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightlye0b8e1fa6920220128.1",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "comment": "Bump @fluentui/react-tabster to v0.0.0-nightlye0b8e1fa6920220128.1",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/babel-make-styles to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "comment": "Bump @fluentui/react-theme to v0.0.0-nightlye0b8e1fa6920220128.1",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightlye0b8e1fa6920220128.1",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-provider",
-            "comment": "Bump @fluentui/react-conformance-make-styles to v0.0.0-nightlydd0f007b3f20220119.1",
-            "commit": "6044506cc626a9a155e0df40645426ddcc080c55"
+            "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightlye0b8e1fa6920220128.1",
+            "commit": "90d10ec8c2d159575962c4d3d913317633b44a7a"
           }
         ],
         "none": [
           {
             "author": "martinhochel@microsoft.com",
             "package": "@fluentui/react-provider",
-            "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
-            "comment": "chore: use storybook runner for all vNext packages"
+            "commit": "28ceaaa83cd92a0389c466f0b15b283e3d9b08e4",
+            "comment": "chore: update all jest deps to v25 + apply single version policy"
           },
           {
             "author": "olfedias@microsoft.com",
             "package": "@fluentui/react-provider",
-            "commit": "d11a238f944b891c13b3bfa56a17ddace52f37d5",
-            "comment": "update stories to not use CSS shorthands in styles"
+            "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
+            "comment": "remove inline-style-expand-shorthand from tsconfigs"
+          },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-provider",
+            "commit": "0fe5ae5d94918a8f8805ed3e587ed98acb17c4b2",
+            "comment": "add @types/react-test-renderer to devDependencies"
           },
           {
             "author": "martinhochel@microsoft.com",
             "package": "@fluentui/react-provider",
-            "commit": "28ceaaa83cd92a0389c466f0b15b283e3d9b08e4",
-            "comment": "chore: update all jest deps to v25 + apply single version policy"
+            "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
+            "comment": "chore: use storybook runner for all vNext packages"
+          },
+          {
+            "author": "olfedias@microsoft.com",
+            "package": "@fluentui/react-provider",
+            "commit": "d11a238f944b891c13b3bfa56a17ddace52f37d5",
+            "comment": "update stories to not use CSS shorthands in styles"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,31 +1,32 @@
 # Change Log - @fluentui/react-provider
 
-This log was last generated on Wed, 19 Jan 2022 04:16:38 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Jan 2022 04:13:22 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightlydd0f007b3f20220119.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-provider_v0.0.0-nightlydd0f007b3f20220119.1)
+## [0.0.0-nightlye0b8e1fa6920220128.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-provider_v0.0.0-nightlye0b8e1fa6920220128.1)
 
-Wed, 19 Jan 2022 04:16:38 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-provider_v9.0.0-beta.5..@fluentui/react-provider_v0.0.0-nightlydd0f007b3f20220119.1)
+Fri, 28 Jan 2022 04:13:22 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-provider_v9.0.0-beta.5..@fluentui/react-provider_v0.0.0-nightlye0b8e1fa6920220128.1)
 
 ### Changes
 
-- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by email not defined)
+- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by email not defined)
 - Updating use of tokens.fontWeight now that we don't need to use casting. ([PR #21217](https://github.com/microsoft/fluentui/pull/21217) by Humberto.Morimoto@microsoft.com)
+- use Griffel packages ([PR #21360](https://github.com/microsoft/fluentui/pull/21360) by olfedias@microsoft.com)
+- Updating based on changes to composition types. ([PR #20891](https://github.com/microsoft/fluentui/pull/20891) by Humberto.Morimoto@microsoft.com)
 - make the FluentProvider#theme TS API reflect runtime and add warning if there is a violation ([PR #21286](https://github.com/microsoft/fluentui/pull/21286) by martinhochel@microsoft.com)
 - Replacing use of functions in makeStyles with direct use of tokens ([PR #21052](https://github.com/microsoft/fluentui/pull/21052) by Humberto.Morimoto@microsoft.com)
 - replace mergeThemes functionality from react-theme ([PR #21278](https://github.com/microsoft/fluentui/pull/21278) by martinhochel@microsoft.com)
 - Remove `themeToCSSVariables` function ([PR #20828](https://github.com/microsoft/fluentui/pull/20828) by bsunderhus@microsoft.com)
 - Remove component's shorthandProps array ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
-- Bump @fluentui/react-make-styles to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/react-tabster to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/react-theme to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/babel-make-styles to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/jest-serializer-make-styles to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
-- Bump @fluentui/react-conformance-make-styles to v0.0.0-nightlydd0f007b3f20220119.1 ([commit](https://github.com/microsoft/fluentui/commit/6044506cc626a9a155e0df40645426ddcc080c55) by beachball)
+- BREAKING: Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
+- Using ComponentSlotProps instead of ObjectShorthandProps. ([PR #20890](https://github.com/microsoft/fluentui/pull/20890) by Humberto.Morimoto@microsoft.com)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightlye0b8e1fa6920220128.1 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by beachball)
+- Bump @fluentui/react-tabster to v0.0.0-nightlye0b8e1fa6920220128.1 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by beachball)
+- Bump @fluentui/react-theme to v0.0.0-nightlye0b8e1fa6920220128.1 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by beachball)
+- Bump @fluentui/react-utilities to v0.0.0-nightlye0b8e1fa6920220128.1 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by beachball)
+- Bump @fluentui/react-conformance-griffel to v0.0.0-nightlye0b8e1fa6920220128.1 ([commit](https://github.com/microsoft/fluentui/commit/90d10ec8c2d159575962c4d3d913317633b44a7a) by beachball)
 
 ## [9.0.0-beta.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-provider_v9.0.0-beta.5)
 

package/dist/react-provider.d.ts

@@ -1,6 +1,6 @@
 import type { ComponentProps } from '@fluentui/react-utilities';
 import type { ComponentState } from '@fluentui/react-utilities';
-import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
+import type { IntrinsicSlotProps } from '@fluentui/react-utilities';
 import type { PartialTheme } from '@fluentui/react-theme';
 import type { ProviderContextValue } from '@fluentui/react-shared-contexts';
 import * as React_2 from 'react';
@@ -24,6 +24,7 @@ export declare interface FluentProviderCommons {
 export declare interface FluentProviderContextValues extends Pick<FluentProviderState, 'theme'> {
     provider: ProviderContextValue;
     themeClassName: ThemeClassNameContextValue;
+    textDirection: 'ltr' | 'rtl';
     tooltip: TooltipContextType;
 }
 
@@ -32,7 +33,7 @@ export declare interface FluentProviderProps extends Omit<ComponentProps<FluentP
 }
 
 export declare type FluentProviderSlots = {
-    root: IntrinsicShorthandProps<'div'>;
+    root: IntrinsicSlotProps<'div'>;
 };
 
 export declare interface FluentProviderState extends ComponentState<FluentProviderSlots>, FluentProviderCommons {
@@ -43,25 +44,25 @@ export declare interface FluentProviderState extends ComponentState<FluentProvid
 /**
  * Render the final JSX of FluentProvider
  */
-export declare const renderFluentProvider: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;
+export declare const renderFluentProvider_unstable: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;
 
 export { useFluent }
 
 /**
  * Create the state required to render FluentProvider.
  *
- * The returned state can be modified with hooks such as useFluentProviderStyles,
- * before being passed to renderFluentProvider.
+ * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
+ * before being passed to renderFluentProvider_unstable.
  *
  * @param props - props from this instance of FluentProvider
  * @param ref - reference to root HTMLElement of FluentProvider
  */
-export declare const useFluentProvider: (props: FluentProviderProps, ref: React_2.Ref<HTMLElement>) => FluentProviderState;
+export declare const useFluentProvider_unstable: (props: FluentProviderProps, ref: React_2.Ref<HTMLElement>) => FluentProviderState;
 
-export declare function useFluentProviderContextValues(state: FluentProviderState): FluentProviderContextValues;
+export declare function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues;
 
 /** Applies style classnames to slots */
-export declare const useFluentProviderStyles: (state: FluentProviderState) => FluentProviderState;
+export declare const useFluentProviderStyles_unstable: (state: FluentProviderState) => FluentProviderState;
 
 export { useTheme }
 

package/lib/components/FluentProvider/FluentProvider.js

@@ -1,13 +1,13 @@
 import * as React from 'react';
-import { renderFluentProvider } from './renderFluentProvider';
-import { useFluentProvider } from './useFluentProvider';
-import { useFluentProviderStyles } from './useFluentProviderStyles';
-import { useFluentProviderContextValues } from './useFluentProviderContextValues';
+import { renderFluentProvider_unstable } from './renderFluentProvider';
+import { useFluentProvider_unstable } from './useFluentProvider';
+import { useFluentProviderStyles_unstable } from './useFluentProviderStyles';
+import { useFluentProviderContextValues_unstable } from './useFluentProviderContextValues';
 export const FluentProvider = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useFluentProvider(props, ref);
-  useFluentProviderStyles(state);
-  const contextValues = useFluentProviderContextValues(state);
-  return renderFluentProvider(state, contextValues);
+  const state = useFluentProvider_unstable(props, ref);
+  useFluentProviderStyles_unstable(state);
+  const contextValues = useFluentProviderContextValues_unstable(state);
+  return renderFluentProvider_unstable(state, contextValues);
 });
 FluentProvider.displayName = 'FluentProvider';
 //# sourceMappingURL=FluentProvider.js.map

package/lib/components/FluentProvider/FluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,wBAArC;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,uBAAT,QAAwC,2BAAxC;AACA,SAAS,8BAAT,QAA+C,kCAA/C;AAGA,OAAO,MAAM,cAAc,gBAAG,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,iBAAiB,CAAC,KAAD,EAAQ,GAAR,CAA/B;AACA,EAAA,uBAAuB,CAAC,KAAD,CAAvB;AAEA,QAAM,aAAa,GAAG,8BAA8B,CAAC,KAAD,CAApD;AAEA,SAAO,oBAAoB,CAAC,KAAD,EAAQ,aAAR,CAA3B;AACD,CAP6B,CAAvB;AASP,cAAc,CAAC,WAAf,GAA6B,gBAA7B","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,gCAAT,QAAiD,2BAAjD;AACA,SAAS,uCAAT,QAAwD,kCAAxD;AAGA,OAAO,MAAM,cAAc,gBAAG,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,0BAA0B,CAAC,KAAD,EAAQ,GAAR,CAAxC;AACA,EAAA,gCAAgC,CAAC,KAAD,CAAhC;AAEA,QAAM,aAAa,GAAG,uCAAuC,CAAC,KAAD,CAA7D;AAEA,SAAO,6BAA6B,CAAC,KAAD,EAAQ,aAAR,CAApC;AACD,CAP6B,CAAvB;AASP,cAAc,CAAC,WAAf,GAA6B,gBAA7B","sourceRoot":""}

package/lib/components/FluentProvider/FluentProvider.types.d.ts

@@ -1,8 +1,8 @@
-import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
-import type { PartialTheme, Theme } from '@fluentui/react-theme';
 import type { ProviderContextValue, TooltipContextType, ThemeClassNameContextValue } from '@fluentui/react-shared-contexts';
+import type { PartialTheme, Theme } from '@fluentui/react-theme';
+import type { ComponentProps, ComponentState, IntrinsicSlotProps } from '@fluentui/react-utilities';
 export declare type FluentProviderSlots = {
-    root: IntrinsicShorthandProps<'div'>;
+    root: IntrinsicSlotProps<'div'>;
 };
 export interface FluentProviderCommons {
     /** Sets the direction of text & generated styles. */
@@ -20,5 +20,6 @@ export interface FluentProviderState extends ComponentState<FluentProviderSlots>
 export interface FluentProviderContextValues extends Pick<FluentProviderState, 'theme'> {
     provider: ProviderContextValue;
     themeClassName: ThemeClassNameContextValue;
+    textDirection: 'ltr' | 'rtl';
     tooltip: TooltipContextType;
 }

package/lib/components/FluentProvider/renderFluentProvider.d.ts

@@ -2,4 +2,4 @@ import type { FluentProviderContextValues, FluentProviderState } from './FluentP
 /**
  * Render the final JSX of FluentProvider
  */
-export declare const renderFluentProvider: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;
+export declare const renderFluentProvider_unstable: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;

package/lib/components/FluentProvider/renderFluentProvider.js

@@ -1,11 +1,12 @@
 import * as React from 'react';
+import { TextDirectionProvider } from '@griffel/react';
 import { ProviderContext, TooltipContext, ThemeContext, ThemeClassNameContext } from '@fluentui/react-shared-contexts';
 import { getSlots } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of FluentProvider
  */
 
-export const renderFluentProvider = (state, contextValues) => {
+export const renderFluentProvider_unstable = (state, contextValues) => {
   const {
     slots,
     slotProps
@@ -18,7 +19,9 @@ export const renderFluentProvider = (state, contextValues) => {
     value: contextValues.themeClassName
   }, /*#__PURE__*/React.createElement(TooltipContext.Provider, {
     value: contextValues.tooltip
+  }, /*#__PURE__*/React.createElement(TextDirectionProvider, {
+    dir: contextValues.textDirection
   }, /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
-  }, state.root.children)))));
+  }, state.root.children))))));
 };
 //# sourceMappingURL=renderFluentProvider.js.map

package/lib/components/FluentProvider/renderFluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,eAAT,EAA0B,cAA1B,EAA0C,YAA1C,EAAwD,qBAAxD,QAAqF,iCAArF;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,oBAAoB,GAAG,CAAC,KAAD,EAA6B,aAA7B,KAA2E;AAC7G,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAsB,KAAtB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,eAAe,CAAC,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,eACE,KAAA,CAAA,aAAA,CAAC,YAAY,CAAC,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,eACE,KAAA,CAAA,aAAA,CAAC,qBAAqB,CAAC,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,eACE,KAAA,CAAA,aAAA,CAAC,cAAc,CAAC,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF;AAWD,CAdM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,eAAT,EAA0B,cAA1B,EAA0C,YAA1C,EAAwD,qBAAxD,QAAqF,iCAArF;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,6BAA6B,GAAG,CAC3C,KAD2C,EAE3C,aAF2C,KAGzC;AACF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAsB,KAAtB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,eAAe,CAAC,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,eACE,KAAA,CAAA,aAAA,CAAC,YAAY,CAAC,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,eACE,KAAA,CAAA,aAAA,CAAC,qBAAqB,CAAC,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,eACE,KAAA,CAAA,aAAA,CAAC,cAAc,CAAC,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,eACE,KAAA,CAAA,aAAA,CAAC,qBAAD,EAAsB;AAAC,IAAA,GAAG,EAAE,aAAa,CAAC;AAApB,GAAtB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF,CADF;AAaD,CAnBM","sourceRoot":""}

package/lib/components/FluentProvider/useFluentProvider.d.ts

@@ -3,10 +3,10 @@ import type { FluentProviderProps, FluentProviderState } from './FluentProvider.
 /**
  * Create the state required to render FluentProvider.
  *
- * The returned state can be modified with hooks such as useFluentProviderStyles,
- * before being passed to renderFluentProvider.
+ * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
+ * before being passed to renderFluentProvider_unstable.
  *
  * @param props - props from this instance of FluentProvider
  * @param ref - reference to root HTMLElement of FluentProvider
  */
-export declare const useFluentProvider: (props: FluentProviderProps, ref: React.Ref<HTMLElement>) => FluentProviderState;
+export declare const useFluentProvider_unstable: (props: FluentProviderProps, ref: React.Ref<HTMLElement>) => FluentProviderState;

package/lib/components/FluentProvider/useFluentProvider.js

@@ -6,14 +6,14 @@ import { useThemeStyleTag } from './useThemeStyleTag';
 /**
  * Create the state required to render FluentProvider.
  *
- * The returned state can be modified with hooks such as useFluentProviderStyles,
- * before being passed to renderFluentProvider.
+ * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
+ * before being passed to renderFluentProvider_unstable.
  *
  * @param props - props from this instance of FluentProvider
  * @param ref - reference to root HTMLElement of FluentProvider
  */
 
-export const useFluentProvider = (props, ref) => {
+export const useFluentProvider_unstable = (props, ref) => {
   const parentContext = useFluent();
   const parentTheme = useTheme();
   /**

package/lib/components/FluentProvider/useFluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":"AAAA,SAAS,uBAAT,QAAwC,yBAAxC;AAEA,SAAS,SAAT,EAAoB,QAApB,QAAoC,iCAApC;AACA,SAAS,qBAAT,EAAgC,aAAhC,QAAqD,2BAArD;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAA6B,GAA7B,KAAiF;AAChH,QAAM,aAAa,GAAG,SAAS,EAA/B;AACA,QAAM,WAAW,GAAG,QAAQ,EAA5B;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,gBAAgB,CAAC;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAAD,CAJ3B;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,aAAa,CAAC,GAAD,EAAM,uBAAuB,EAA7B;AAHe,KAAR;AAVtB,GAAP;AAgBD,CAxCM;;AA0CP,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":"AAAA,SAAS,uBAAT,QAAwC,yBAAxC;AAEA,SAAS,SAAT,EAAoB,QAApB,QAAoC,iCAApC;AACA,SAAS,qBAAT,EAAgC,aAAhC,QAAqD,2BAArD;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;AACvB,QAAM,aAAa,GAAG,SAAS,EAA/B;AACA,QAAM,WAAW,GAAG,QAAQ,EAA5B;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,gBAAgB,CAAC;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAAD,CAJ3B;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,aAAa,CAAC,GAAD,EAAM,uBAAuB,EAA7B;AAHe,KAAR;AAVtB,GAAP;AAgBD,CA3CM;;AA6CP,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourceRoot":""}

package/lib/components/FluentProvider/useFluentProviderContextValues.d.ts

@@ -1,2 +1,2 @@
 import type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';
-export declare function useFluentProviderContextValues(state: FluentProviderState): FluentProviderContextValues;
+export declare function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues;

package/lib/components/FluentProvider/useFluentProviderContextValues.js

@@ -1,6 +1,6 @@
 import { useConst } from '@fluentui/react-utilities';
 import * as React from 'react';
-export function useFluentProviderContextValues(state) {
+export function useFluentProviderContextValues_unstable(state) {
   const {
     root,
     dir,
@@ -15,6 +15,7 @@ export function useFluentProviderContextValues(state) {
   const tooltip = useConst({});
   return {
     provider,
+    textDirection: dir,
     tooltip,
     theme,
     themeClassName: root.className

package/lib/components/FluentProvider/useFluentProviderContextValues.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":"AAAA,SAAS,QAAT,QAAyB,2BAAzB;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,OAAM,SAAU,8BAAV,CAAyC,KAAzC,EAAmE;AACvE,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHuE,CAIvE;;AACA,QAAM,OAAO,GAAG,QAAQ,CAAC,EAAD,CAAxB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,OAFK;AAGL,IAAA,KAHK;AAIL,IAAA,cAAc,EAAE,IAAI,CAAC;AAJhB,GAAP;AAMD","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":"AAAA,SAAS,QAAT,QAAyB,2BAAzB;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,OAAM,SAAU,uCAAV,CAAkD,KAAlD,EAA4E;AAChF,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHgF,CAIhF;;AACA,QAAM,OAAO,GAAG,QAAQ,CAAC,EAAD,CAAxB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,aAAa,EAAE,GAFV;AAGL,IAAA,OAHK;AAIL,IAAA,KAJK;AAKL,IAAA,cAAc,EAAE,IAAI,CAAC;AALhB,GAAP;AAOD","sourceRoot":""}

package/lib/components/FluentProvider/useFluentProviderStyles.d.ts

@@ -1,4 +1,4 @@
 import type { FluentProviderState } from './FluentProvider.types';
 export declare const fluentProviderClassName = "fui-FluentProvider";
 /** Applies style classnames to slots */
-export declare const useFluentProviderStyles: (state: FluentProviderState) => FluentProviderState;
+export declare const useFluentProviderStyles_unstable: (state: FluentProviderState) => FluentProviderState;

package/lib/components/FluentProvider/useFluentProviderStyles.js

@@ -1,4 +1,4 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { __styles, mergeClasses } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
 export const fluentProviderClassName = 'fui-FluentProvider';
 
@@ -16,7 +16,7 @@ const useStyles = /*#__PURE__*/__styles({
 /** Applies style classnames to slots */
 
 
-export const useFluentProviderStyles = state => {
+export const useFluentProviderStyles_unstable = state => {
   const styles = useStyles();
   state.root.className = mergeClasses(fluentProviderClassName, state.themeClassName, styles.root, state.root.className);
   return state;

package/lib/components/FluentProvider/useFluentProviderStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,6BAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,uBAAuB,GAAG,oBAAhC;;AAEP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACA,OAAO,MAAM,uBAAuB,GAAI,KAAD,IAA+B;AACpE,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAD,EAA0B,KAAK,CAAC,cAAhC,EAAgD,MAAM,CAAC,IAAvD,EAA6D,KAAK,CAAC,IAAN,CAAW,SAAxE,CAAnC;AAEA,SAAO,KAAP;AACD,CANM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAGA,OAAO,MAAM,uBAAuB,GAAG,oBAAhC;;AAEP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACA,OAAO,MAAM,gCAAgC,GAAI,KAAD,IAA+B;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAD,EAA0B,KAAK,CAAC,cAAhC,EAAgD,MAAM,CAAC,IAAvD,EAA6D,KAAK,CAAC,IAAN,CAAW,SAAxE,CAAnC;AAEA,SAAO,KAAP;AACD,CANM","sourceRoot":""}

package/lib-commonjs/components/FluentProvider/FluentProvider.js

@@ -16,10 +16,10 @@ const useFluentProviderStyles_1 = /*#__PURE__*/require("./useFluentProviderStyle
 const useFluentProviderContextValues_1 = /*#__PURE__*/require("./useFluentProviderContextValues");
 
 exports.FluentProvider = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useFluentProvider_1.useFluentProvider(props, ref);
-  useFluentProviderStyles_1.useFluentProviderStyles(state);
-  const contextValues = useFluentProviderContextValues_1.useFluentProviderContextValues(state);
-  return renderFluentProvider_1.renderFluentProvider(state, contextValues);
+  const state = useFluentProvider_1.useFluentProvider_unstable(props, ref);
+  useFluentProviderStyles_1.useFluentProviderStyles_unstable(state);
+  const contextValues = useFluentProviderContextValues_1.useFluentProviderContextValues_unstable(state);
+  return renderFluentProvider_1.renderFluentProvider_unstable(state, contextValues);
 });
 exports.FluentProvider.displayName = 'FluentProvider';
 //# sourceMappingURL=FluentProvider.js.map

package/lib-commonjs/components/FluentProvider/FluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gCAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAGa,OAAA,CAAA,cAAA,gBAAiB,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,mBAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAAd;AACA,EAAA,yBAAA,CAAA,uBAAA,CAAwB,KAAxB;AAEA,QAAM,aAAa,GAAG,gCAAA,CAAA,8BAAA,CAA+B,KAA/B,CAAtB;AAEA,SAAO,sBAAA,CAAA,oBAAA,CAAqB,KAArB,EAA4B,aAA5B,CAAP;AACD,CAP6B,CAAjB;AASb,OAAA,CAAA,cAAA,CAAe,WAAf,GAA6B,gBAA7B","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gCAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAGa,OAAA,CAAA,cAAA,gBAAiB,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,EAAkC,GAAlC,CAAd;AACA,EAAA,yBAAA,CAAA,gCAAA,CAAiC,KAAjC;AAEA,QAAM,aAAa,GAAG,gCAAA,CAAA,uCAAA,CAAwC,KAAxC,CAAtB;AAEA,SAAO,sBAAA,CAAA,6BAAA,CAA8B,KAA9B,EAAqC,aAArC,CAAP;AACD,CAP6B,CAAjB;AASb,OAAA,CAAA,cAAA,CAAe,WAAf,GAA6B,gBAA7B","sourceRoot":""}

package/lib-commonjs/components/FluentProvider/FluentProvider.types.d.ts

@@ -1,8 +1,8 @@
-import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
-import type { PartialTheme, Theme } from '@fluentui/react-theme';
 import type { ProviderContextValue, TooltipContextType, ThemeClassNameContextValue } from '@fluentui/react-shared-contexts';
+import type { PartialTheme, Theme } from '@fluentui/react-theme';
+import type { ComponentProps, ComponentState, IntrinsicSlotProps } from '@fluentui/react-utilities';
 export declare type FluentProviderSlots = {
-    root: IntrinsicShorthandProps<'div'>;
+    root: IntrinsicSlotProps<'div'>;
 };
 export interface FluentProviderCommons {
     /** Sets the direction of text & generated styles. */
@@ -20,5 +20,6 @@ export interface FluentProviderState extends ComponentState<FluentProviderSlots>
 export interface FluentProviderContextValues extends Pick<FluentProviderState, 'theme'> {
     provider: ProviderContextValue;
     themeClassName: ThemeClassNameContextValue;
+    textDirection: 'ltr' | 'rtl';
     tooltip: TooltipContextType;
 }

package/lib-commonjs/components/FluentProvider/renderFluentProvider.d.ts

@@ -2,4 +2,4 @@ import type { FluentProviderContextValues, FluentProviderState } from './FluentP
 /**
  * Render the final JSX of FluentProvider
  */
-export declare const renderFluentProvider: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;
+export declare const renderFluentProvider_unstable: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;

package/lib-commonjs/components/FluentProvider/renderFluentProvider.js

@@ -3,10 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.renderFluentProvider = void 0;
+exports.renderFluentProvider_unstable = void 0;
 
 const React = /*#__PURE__*/require("react");
 
+const react_1 = /*#__PURE__*/require("@griffel/react");
+
 const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
 
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
@@ -15,7 +17,7 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
  */
 
 
-const renderFluentProvider = (state, contextValues) => {
+const renderFluentProvider_unstable = (state, contextValues) => {
   const {
     slots,
     slotProps
@@ -28,9 +30,11 @@ const renderFluentProvider = (state, contextValues) => {
     value: contextValues.themeClassName
   }, React.createElement(react_shared_contexts_1.TooltipContext.Provider, {
     value: contextValues.tooltip
+  }, React.createElement(react_1.TextDirectionProvider, {
+    dir: contextValues.textDirection
   }, React.createElement(slots.root, { ...slotProps.root
-  }, state.root.children)))));
+  }, state.root.children))))));
 };
 
-exports.renderFluentProvider = renderFluentProvider;
+exports.renderFluentProvider_unstable = renderFluentProvider_unstable;
 //# sourceMappingURL=renderFluentProvider.js.map

package/lib-commonjs/components/FluentProvider/renderFluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,oBAAoB,GAAG,CAAC,KAAD,EAA6B,aAA7B,KAA2E;AAC7G,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA8B,KAA9B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,eAAA,CAAgB,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,YAAA,CAAa,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,qBAAA,CAAsB,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,cAAA,CAAe,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF;AAWD,CAdM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,6BAA6B,GAAG,CAC3C,KAD2C,EAE3C,aAF2C,KAGzC;AACF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA8B,KAA9B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,eAAA,CAAgB,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,YAAA,CAAa,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,qBAAA,CAAsB,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,cAAA,CAAe,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,EACE,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,qBAAD,EAAsB;AAAC,IAAA,GAAG,EAAE,aAAa,CAAC;AAApB,GAAtB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF,CADF;AAaD,CAnBM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourceRoot":""}

package/lib-commonjs/components/FluentProvider/useFluentProvider.d.ts

@@ -3,10 +3,10 @@ import type { FluentProviderProps, FluentProviderState } from './FluentProvider.
 /**
  * Create the state required to render FluentProvider.
  *
- * The returned state can be modified with hooks such as useFluentProviderStyles,
- * before being passed to renderFluentProvider.
+ * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
+ * before being passed to renderFluentProvider_unstable.
  *
  * @param props - props from this instance of FluentProvider
  * @param ref - reference to root HTMLElement of FluentProvider
  */
-export declare const useFluentProvider: (props: FluentProviderProps, ref: React.Ref<HTMLElement>) => FluentProviderState;
+export declare const useFluentProvider_unstable: (props: FluentProviderProps, ref: React.Ref<HTMLElement>) => FluentProviderState;

package/lib-commonjs/components/FluentProvider/useFluentProvider.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFluentProvider = void 0;
+exports.useFluentProvider_unstable = void 0;
 
 const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
 
@@ -17,15 +17,15 @@ const useThemeStyleTag_1 = /*#__PURE__*/require("./useThemeStyleTag");
 /**
  * Create the state required to render FluentProvider.
  *
- * The returned state can be modified with hooks such as useFluentProviderStyles,
- * before being passed to renderFluentProvider.
+ * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
+ * before being passed to renderFluentProvider_unstable.
  *
  * @param props - props from this instance of FluentProvider
  * @param ref - reference to root HTMLElement of FluentProvider
  */
 
 
-const useFluentProvider = (props, ref) => {
+const useFluentProvider_unstable = (props, ref) => {
   const parentContext = react_shared_contexts_1.useFluent();
   const parentTheme = react_shared_contexts_1.useTheme();
   /**
@@ -69,7 +69,7 @@ const useFluentProvider = (props, ref) => {
   };
 };
 
-exports.useFluentProvider = useFluentProvider;
+exports.useFluentProvider_unstable = useFluentProvider_unstable;
 
 function mergeThemes(a, b) {
   // Merge impacts perf: we should like to avoid it if it's possible

package/lib-commonjs/components/FluentProvider/useFluentProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AAEA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAA6B,GAA7B,KAAiF;AAChH,QAAM,aAAa,GAAG,uBAAA,CAAA,SAAA,EAAtB;AACA,QAAM,WAAW,GAAG,uBAAA,CAAA,QAAA,EAApB;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,kBAAA,CAAA,gBAAA,CAAiB;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAAjB,CAJX;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,iBAAA,CAAA,aAAA,CAAc,GAAd,EAAmB,eAAA,CAAA,uBAAA,EAAnB;AAH4B,KAA7B;AAVD,GAAP;AAgBD,CAxCM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB;;AA0Cb,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AAEA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;AACvB,QAAM,aAAa,GAAG,uBAAA,CAAA,SAAA,EAAtB;AACA,QAAM,WAAW,GAAG,uBAAA,CAAA,QAAA,EAApB;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,kBAAA,CAAA,gBAAA,CAAiB;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAAjB,CAJX;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,iBAAA,CAAA,aAAA,CAAc,GAAd,EAAmB,eAAA,CAAA,uBAAA,EAAnB;AAH4B,KAA7B;AAVD,GAAP;AAgBD,CA3CM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B;;AA6Cb,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourceRoot":""}

package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.d.ts

@@ -1,2 +1,2 @@
 import type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';
-export declare function useFluentProviderContextValues(state: FluentProviderState): FluentProviderContextValues;
+export declare function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues;

package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFluentProviderContextValues = void 0;
+exports.useFluentProviderContextValues_unstable = void 0;
 
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 
 const React = /*#__PURE__*/require("react");
 
-function useFluentProviderContextValues(state) {
+function useFluentProviderContextValues_unstable(state) {
   const {
     root,
     dir,
@@ -24,11 +24,12 @@ function useFluentProviderContextValues(state) {
   const tooltip = react_utilities_1.useConst({});
   return {
     provider,
+    textDirection: dir,
     tooltip,
     theme,
     themeClassName: root.className
   };
 }
 
-exports.useFluentProviderContextValues = useFluentProviderContextValues;
+exports.useFluentProviderContextValues_unstable = useFluentProviderContextValues_unstable;
 //# sourceMappingURL=useFluentProviderContextValues.js.map

package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAGA,SAAgB,8BAAhB,CAA+C,KAA/C,EAAyE;AACvE,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHuE,CAIvE;;AACA,QAAM,OAAO,GAAG,iBAAA,CAAA,QAAA,CAAS,EAAT,CAAhB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,OAFK;AAGL,IAAA,KAHK;AAIL,IAAA,cAAc,EAAE,IAAI,CAAC;AAJhB,GAAP;AAMD;;AAbD,OAAA,CAAA,8BAAA,GAAA,8BAAA","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAGA,SAAgB,uCAAhB,CAAwD,KAAxD,EAAkF;AAChF,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHgF,CAIhF;;AACA,QAAM,OAAO,GAAG,iBAAA,CAAA,QAAA,CAAS,EAAT,CAAhB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,aAAa,EAAE,GAFV;AAGL,IAAA,OAHK;AAIL,IAAA,KAJK;AAKL,IAAA,cAAc,EAAE,IAAI,CAAC;AALhB,GAAP;AAOD;;AAdD,OAAA,CAAA,uCAAA,GAAA,uCAAA","sourceRoot":""}

package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.d.ts

@@ -1,4 +1,4 @@
 import type { FluentProviderState } from './FluentProvider.types';
 export declare const fluentProviderClassName = "fui-FluentProvider";
 /** Applies style classnames to slots */
-export declare const useFluentProviderStyles: (state: FluentProviderState) => FluentProviderState;
+export declare const useFluentProviderStyles_unstable: (state: FluentProviderState) => FluentProviderState;

package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js

@@ -3,15 +3,15 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useFluentProviderStyles = exports.fluentProviderClassName = void 0;
+exports.useFluentProviderStyles_unstable = exports.fluentProviderClassName = void 0;
 
-const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
+const react_1 = /*#__PURE__*/require("@griffel/react");
 
 const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
 
 exports.fluentProviderClassName = 'fui-FluentProvider';
 
-const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useStyles = /*#__PURE__*/react_1.__styles({
   "root": {
     "sj55zd": "f19n0e5",
     "De3pzq": "fxugw4r",
@@ -25,11 +25,11 @@ const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
 /** Applies style classnames to slots */
 
 
-const useFluentProviderStyles = state => {
+const useFluentProviderStyles_unstable = state => {
   const styles = useStyles();
-  state.root.className = react_make_styles_1.mergeClasses(exports.fluentProviderClassName, state.themeClassName, styles.root, state.root.className);
+  state.root.className = react_1.mergeClasses(exports.fluentProviderClassName, state.themeClassName, styles.root, state.root.className);
   return state;
 };
 
-exports.useFluentProviderStyles = useFluentProviderStyles;
+exports.useFluentProviderStyles_unstable = useFluentProviderStyles_unstable;
 //# sourceMappingURL=useFluentProviderStyles.js.map

package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,uBAAA,GAA0B,oBAA1B;;AAEb,MAAM,SAAS,gBAAG,mBAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACO,MAAM,uBAAuB,GAAI,KAAD,IAA+B;AACpE,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,mBAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAb,EAAsC,KAAK,CAAC,cAA5C,EAA4D,MAAM,CAAC,IAAnE,EAAyE,KAAK,CAAC,IAAN,CAAW,SAApF,CAAvB;AAEA,SAAO,KAAP;AACD,CANM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAGa,OAAA,CAAA,uBAAA,GAA0B,oBAA1B;;AAEb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACO,MAAM,gCAAgC,GAAI,KAAD,IAA+B;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,uBAAb,EAAsC,KAAK,CAAC,cAA5C,EAA4D,MAAM,CAAC,IAAnE,EAAyE,KAAK,CAAC,IAAN,CAAW,SAApF,CAAvB;AAEA,SAAO,KAAP;AACD,CANM;;AAAM,OAAA,CAAA,gCAAA,GAAgC,gCAAhC","sourceRoot":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-provider",
-  "version": "0.0.0-nightlydd0f007b3f20220119.1",
+  "version": "0.0.0-nightlye0b8e1fa6920220128.1",
   "description": "Fluent UI React provider component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -26,16 +26,15 @@
     "type-check": "tsc -b tsconfig.json"
   },
   "devDependencies": {
-    "@fluentui/babel-make-styles": "0.0.0-nightlydd0f007b3f20220119.1",
     "@fluentui/eslint-plugin": "*",
-    "@fluentui/jest-serializer-make-styles": "0.0.0-nightlydd0f007b3f20220119.1",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-make-styles": "0.0.0-nightlydd0f007b3f20220119.1",
+    "@fluentui/react-conformance-griffel": "0.0.0-nightlye0b8e1fa6920220128.1",
     "@fluentui/scripts": "^1.0.0",
     "@types/enzyme": "3.10.3",
     "@types/enzyme-adapter-react-16": "1.0.3",
     "@types/react": "16.9.42",
     "@types/react-dom": "16.9.10",
+    "@types/react-test-renderer": "^16.0.0",
     "enzyme": "~3.10.0",
     "enzyme-adapter-react-16": "^1.15.0",
     "react": "16.8.6",
@@ -43,11 +42,11 @@
     "react-test-renderer": "^16.3.0"
   },
   "dependencies": {
-    "@fluentui/react-make-styles": "0.0.0-nightlydd0f007b3f20220119.1",
-    "@fluentui/react-shared-contexts": "0.0.0-nightlydd0f007b3f20220119.1",
-    "@fluentui/react-tabster": "0.0.0-nightlydd0f007b3f20220119.1",
-    "@fluentui/react-theme": "0.0.0-nightlydd0f007b3f20220119.1",
-    "@fluentui/react-utilities": "0.0.0-nightlydd0f007b3f20220119.1",
+    "@griffel/react": "1.0.0",
+    "@fluentui/react-shared-contexts": "0.0.0-nightlye0b8e1fa6920220128.1",
+    "@fluentui/react-tabster": "0.0.0-nightlye0b8e1fa6920220128.1",
+    "@fluentui/react-theme": "0.0.0-nightlye0b8e1fa6920220128.1",
+    "@fluentui/react-utilities": "0.0.0-nightlye0b8e1fa6920220128.1",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {