feat(tabs): revamp tabs

[ldez]

The current way to set up the tabs does not seem straightforward.

This PR allows setting up the name on each tab instead of on the tab group.

This is non-breaking: the previous behavior is still supported.

To understand how it works, you should know two things:

1. The parameters of a parent shortcode are available in child shortcodes. (This is like a constructor, from root to leaves)
2. The child shortcodes are called/render before calling the parent shortcode (evaluation from leaves to root):
   • The child shortcodes can access the parameters and the Store of the parent.
   • But the first child will always get an empty Store from the parent, because the render of the parent is called after the render of all the children.
   • The children can fill the parents' Store, and the parents will get the child's values from their Store.
   • But a parent shortcode cannot define a default value inside the Store (because it will be called after the children).
   • It must try to get the value from the Store (filled by children) before defining the default value.

This approach is powerful, but it also has some limitations (ex, the parent shortcode should always call .Inner or .InnerDeindent, but it's possible to store the .Inner inside an unused variable)

I also added the possibility to enable/disable synchronized tabs per page.

Before

{{< tabs items="JSON,YAML,TOML" defaultIndex="1" >}}
  {{< tab >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
  {{< tab >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
  {{< tab >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
{{< /tabs >}}

After

{{< tabs >}}
  {{< tab name="JSON" >}}**JSON**: JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.{{< /tab >}}
  {{< tab name="YAML" selected=true >}}**YAML**: YAML is a human-readable data serialization language.{{< /tab >}}
  {{< tab name="TOML" >}}**TOML**: TOML aims to be a minimal configuration file format that's easy to read due to obvious semantics.{{< /tab >}}
{{< /tabs >}}

Demo: https://deploy-preview-815--hugo-hextra.netlify.app/docs/guide/shortcodes/tabs/

[netlify]

✅ Deploy Preview for hugo-hextra ready!

Name	Link
🔨 Latest commit	89bb40b
🔍 Latest deploy log	https://app.netlify.com/projects/hugo-hextra/deploys/68c1f5c8d05a7000085bdff0
😎 Deploy Preview	https://deploy-preview-815--hugo-hextra.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[imfing]

Thanks for the detailed explanation! I skimmed through it on my phone and the interface looks great and more intuitive.

I’ll take a closer look at the implementations later.