docs: 📚 add migration guide for sd-leadtext (#630)

packages/components/src/docs/Migration/ui-leadtext.mdx

@@ -0,0 +1,35 @@
+# Migration Guide: From `ui-leadtext` to `sd-leadtext`
+
+The new `sd-leadtext` is designed to replace the `ui-leadtext`. Rather than offering a complex component structure, they primarily focus on providing CSS styles to highlight important text.
+
+## 💾 Slots
+
+### ❌ Removed Slots
+
+The following slots have been removed from the new sd-leadtext component:
+
+1. [default]
+
+<hr />
+
+### ❌ Removed Attributes
+
+The following attributes have been removed from the new sd-leadtext component:
+
+1. [variant]
+
+<hr />
+
+## 🎨 CSS Classes
+
+### ✨ New CSS Classes
+
+#### [sd-leadtext--size-lg]
+
+This class sets the size of the leadtext element. You can use this option for a larger text size to accomodate smaller container/screen sizes.
+
+#### [sd-leadtext--inverted]
+
+This class inverts the leadtext text.
+
+<hr />