chore: Update cards permutation to match expected usage (#1418)

Author: gethinwebster

pages/cards/permutations.page.tsx

@@ -28,7 +28,14 @@ function createSimpleItems(count: number) {
 }
 
 const cardDefinition: CardsProps.CardDefinition<Item> = {
-  header: item => (item.number === 2 ? <Link href="#">{item.text}</Link> : item.text),
+  header: item =>
+    item.number === 2 ? (
+      <Link href="#" fontSize="inherit">
+        {item.text}
+      </Link>
+    ) : (
+      item.text
+    ),
   sections: [
     {
       id: 'description',

src/__tests__/__snapshots__/documenter.test.ts.snap

@@ -3587,7 +3587,7 @@ add a meaningful description to the whole selection.",
     Object {
       "description": " Defines what to display in each card. It has the following properties:
  * \`header\` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.
-     Use \`fontSize=\\"heading-m\\"\` on [link](/components/link/) components inside card header.
+     Use \`fontSize=\\"inherit\\"\` on [link](/components/link/) components inside card header.
  * \`sections\` (array) - Responsible for displaying the card content. Cards can have many sections in their
    body. Each entry in the array is responsible for displaying a section. An entry has the following properties:
    * \`id\`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)

src/cards/interfaces.tsx

@@ -64,7 +64,7 @@ export interface CardsProps<T = any> extends BaseComponentProps {
   /**
    *  Defines what to display in each card. It has the following properties:
    *  * `header` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.
-   *      Use `fontSize="heading-m"` on [link](/components/link/) components inside card header.
+   *      Use `fontSize="inherit"` on [link](/components/link/) components inside card header.
    *  * `sections` (array) - Responsible for displaying the card content. Cards can have many sections in their
    *    body. Each entry in the array is responsible for displaying a section. An entry has the following properties:
    *    * `id`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)