feat(text): change default color to "inherit"

BREAKING CHANGE
Text component will inherit the color from the surrounding context by default. In most of the cases it will be the primary color.

New `primary` prop is added to enforce the primary text color

src/components/Text/Text.tsx

@@ -29,6 +29,11 @@ interface TextProps
      * @default normal
      */
     fontWeight?: ResponsiveValue<'normal' | 'semibold' | 'bold'>;
+    /**
+     * Enforce primary color
+     */
+
+    primary?: boolean;
     /**
      * Adjust color to indicate secondary information
      * @deprecated use `secondary` instead
@@ -45,7 +50,7 @@ interface TextProps
 }
 
 function determineTextColor(props: TextProps) {
-    const { weak, secondary, disabled } = props;
+    const { primary, weak, secondary, disabled } = props;
     if (weak !== undefined) {
         deprecatedProperty('Text', weak, 'weak', 'secondary', 'Rename `weak` to `secondary` to remove the warning.');
     }
@@ -58,7 +63,11 @@ function determineTextColor(props: TextProps) {
         return getSemanticValue('foreground-neutral-emphasized');
     }
 
-    return getSemanticValue('foreground-primary');
+    if (primary) {
+        return getSemanticValue('foreground-primary');
+    }
+
+    return 'inherit';
 }
 
 const Text = styled.span.attrs({ theme })<TextProps>`

src/components/Text/docs/Text.stories.tsx

@@ -68,6 +68,12 @@ type Story = StoryObj<typeof Text>;
 
 export const Default: Story = {};
 
+export const Primary: Story = {
+    args: {
+        primary: true
+    }
+};
+
 export const Secondary: Story = {
     args: {
         secondary: true

src/components/Text/docs/Text.storybook.mdx

@@ -17,7 +17,8 @@ The Text component is a wrapper component that will apply typography styles to t
 
 ## Usage
 
-By default, `Text` uses the primary color, which is the color for most interface text, whether body or headlines.
+By default, `Text` uses the color of the container, which is the primary color in most of the cases.
+This approach allows the component to adapt to the container needs. Use the `primary` property in order to force the primary color of the theme.
 
 Use the `secondary` color for supplemental information with diminished contrast (often, the “gray text”).
 Like form microcopy, captions, helper text, and other medium emphasized text elements.