Update Compressible inline documentation (#2471)

* Update Compressible documentation

* Change files

* lowercase

* More!

Author: Saadnajmi

change/@fluentui-react-native-framework-6950ec96-3368-404c-8cab-821eeb06e02f.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Update Compressible documentation",
+  "packageName": "@fluentui-react-native/framework",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/framework/framework/src/compressible.ts

@@ -1,9 +1,16 @@
 import { Theme } from '@fluentui-react-native/theme-types';
 import { stagedComponent, StagedRender } from '@fluentui-react-native/use-slot';
 import { CustomizableComponent } from '@fluentui-react-native/use-tokens';
-import { UseTokens } from './useTokens';
 import { TokenSettings } from './useStyling';
+import { UseTokens } from './useTokens';
 
+/**
+ * Utility function which can create function components that can be tree compressed (using the stagedRender pattern),
+ * and also have customize functionality.
+ * @param fn StagedRender function that defines your component
+ * @param useTokens a hook function to build a set of tokens from a passed in theme as well as a cache object
+ * @returns A tree compressed function component with the `.customize` method exposed to it
+ */
 export function compressible<TProps, TTokens>(
   fn: StagedRender<TProps>,
   useTokens: UseTokens<TTokens>,

packages/framework/framework/src/useTokens.ts

@@ -5,6 +5,7 @@ import { TokenSettings } from './useStyling';
 
 export { applyTokenLayers, applyPropsToTokens, customizable, patchTokens } from '@fluentui-react-native/use-tokens';
 
+// A hook function to build a set of tokens from a passed in theme as well as a cache object
 export type UseTokens<TTokens> = UseTokensCore<TTokens, Theme>;
 
 export function buildUseTokens<TTokens>(...tokens: TokenSettings<TTokens>[]): UseTokens<TTokens> {