From 7f157cabf975f532bead00b0b75664c5e5db488f Mon Sep 17 00:00:00 2001
From: Srirag <77497081+strawhatrag@users.noreply.github.com>
Date: Fri, 18 Aug 2023 22:24:12 +0530
Subject: [PATCH] Deprecation message has been added above @mixin H1 (#20500)

---
 ui/css/design-system/typography.scss | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/ui/css/design-system/typography.scss b/ui/css/design-system/typography.scss
index a7b16b46c..a70f745e2 100644
--- a/ui/css/design-system/typography.scss
+++ b/ui/css/design-system/typography.scss
@@ -111,6 +111,15 @@ $font-size-h9: map-get($typography-variants, 'h9');
   font-weight: normal;
 }
 
+/**
+* @deprecated The typography mixins `@include H1` - `@include H9` have been deprecated in favor of the `<Text>` component from the component-library.
+* Please update your code to use the `<Text>` component instead, which can be found in ui/components/component-library/text/text.tsx.
+* You can find documentation for the new `<Text>` component in the MetaMask Storybook:
+* {@link https://metamask.github.io/metamask-storybook/?path=/docs/components-componentlibrary-text--docs}
+* If you would like to help with the replacement of the old mixins `@include H1` - `@include H9`, please submit a pull request against this GitHub issue:
+* {@link https://github.com/MetaMask/metamask-extension/issues/19533}
+*/
+
 // Typography
 @mixin H1 {
   @include typography('h1');