React-native-paper: put all Typography components in a group in documentation

[alikazemkhanloo]

Current behaviour

Typography components are in seperate headings in docs

Expected behaviour

They should be grouped together

Code sample

Screenshots (if applicable)

What have you tried

Your Environment

[justinlawrence]

Agreed. I suggest we put these under a Typography heading and provide an example of each. See closed task at https://github.com/callstack/react-native-paper/issues/532 for a screenshot.

[byCedric]

As a beginner, this is also a bit weird to find the typography spread out over the docs menu. But, I sure want to help with this! I think there are several approaches to this, not sure if there are others or which one is the best one. 😄

1. Hardcode typography as a group in docs/component-docs.config.js.
   This is probably not the "desired approach". It works, kind of, but you put references to the contents in a "global" config file. Which shouldn't need to know about this, right?

   You can check on the component folder name for example. In this case, Typography and group them based on that.

2. Create an "extra" file to Typography, just like src/Components/Avatar/Avatar.tsx.
   I'm not sure how the avatar works, but it seems a bit similar. They are both similar-structured, so I thought that might work as well.

3. Add a new @component-group <name> annotation (or something named similar)
   Personally, I like this approach the most. With that, you can simply add @component-group to the components you want to group and give them similar names. I think it matches the current distributed documentation within the components perfectly.

---

If any of these approaches sound like something anyone likes or want, I can try and make a PR 😄

[satya164]

@byCedric I like the annotation approach too. Will be awesome if you can make PR :D

[byCedric]

@satya164 Done! 🚀 See PR #1221 😄 Let me know what you think