Document tab and code group synchronization #2740
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com>
Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com>
![tembo[bot]](https://avatars.githubusercontent.com/in/1223475?s=60&v=4){kind=small}
| Code groups inherit global styling from your `docs.json` file. Customize your theme using `styling.codeblocks`. See [Settings](/organize/settings#styling) for configuration options. | ||
|
|
||
| ## Creating code groups | ||
| Code groups automatically synchronize with other code groups and [tabs](/components/tabs) on the same page when their labels match. When you select a language in one code group, all tabs and code groups with matching labels update to show the same language. |
Contributor
There was a problem hiding this comment.
Might be worth keeping this as its own section heading for scanability. Also, if language selection still persists across reloads (mentioned in the PR description), calling that out here helps set expectations.
Suggested change
| Code groups automatically synchronize with other code groups and [tabs](/components/tabs) on the same page when their labels match. When you select a language in one code group, all tabs and code groups with matching labels update to show the same language. | |
| ## Synchronized selections | |
| Code groups automatically synchronize with other code groups and [tabs](/components/tabs) on the same page when their labels match. When you select a language in one code group, all tabs and code groups with matching labels update to show the same language. | |
| Your language selection persists across page reloads. |
| </Tabs> | ||
| ```` | ||
| Tabs automatically synchronize with other tabs and [code groups](/components/code-groups) on the same page when their labels match. When you select a tab, all other tabs and code groups with the same label update to match your selection. |
Contributor
There was a problem hiding this comment.
Minor clarity tweak: since this is driven by tab labels, consider explicitly tying "labels" to Tab title values.
Suggested change
| Tabs automatically synchronize with other tabs and [code groups](/components/code-groups) on the same page when their labels match. When you select a tab, all other tabs and code groups with the same label update to match your selection. | |
| Tabs automatically synchronize with other tabs and [code groups](/components/code-groups) on the same page when their labels match (the `title` values). When you select a tab, all other tabs and code groups with the same label update to match your selection. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Added documentation for the automatic synchronization feature between tabs and code groups when their labels match. Also documented the new
borderBottomproperty for the Tabs component.Files changed:
components/tabs.mdx- Added synchronization section, updated property descriptions, and documentedborderBottompropertycomponents/code-groups.mdx- Added synchronization section explaining cross-component syncing and language persistenceGenerated from feat: add optional bottom border to Tabs component @rtbarnes
Note
Documents new cross-component selection syncing and updates Tabs props.
TabsandCodeGroupnow coordinate selections across components with matching labelscomponents/tabs.mdx: clarifiestitlebehavior (matching titles synchronize), and documents newborderBottomboolean propcomponents/code-groups.mdx: adds syncing section and adjusts heading to## Create code groupsWritten by Cursor Bugbot for commit 1756609. This will update automatically on new commits. Configure here.