[Typography foundations] Add Text component

[laurkim]

WHY are these changes introduced?

Resolves #6509, #6565.

To do:

• Remove variant mapping functionality
• Determine default as -> 'p' make as required
• Determine default style/variant -> 'bodyMd' make variant required
• Transfer styles from TextStyle
• Add all values for color
• Add monospace variant to mimic text style from code variation on TextStyle to be done in subsequent pr
• Create new component (i.e., InlineCode) to mimic style from code variation on TextStyle to be done in subsequent pr
• Add functionality from VisuallyHidden component (?)

WHAT is this pull request doing?

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Copy-paste this code in playground/Playground.tsx:

import React from 'react';
import {Page, Text} from '../src';

export function Playground() {
  return (
    <Page title="Playground">
      {/* Add the code you want to test in here */}
      {/* Test different Text variants/styling here */}
      <Text as="h1" variant="headingLarge" alignment="end" color="positive">Hello</Text>
    </Page>
  );
}

🎩 checklist

• Tested on mobile
• Tested on multiple browsers
• Tested for accessibility
• Updated the component's README.md with documentation changes
• Tophatted documentation changes in the style guide

[github-actions]

size-limit report 📦

Path	Size
polaris-react-cjs	197.86 KB (+0.18% 🔺)
polaris-react-esm	132.96 KB (+0.28% 🔺)
polaris-react-esnext	188.51 KB (+0.49% 🔺)
polaris-react-css	41.97 KB (+0.63% 🔺)

[aveline]

🎉