diff --git a/.changeset/warm-glasses-smile.md b/.changeset/warm-glasses-smile.md new file mode 100644 index 0000000000..644628fa0c --- /dev/null +++ b/.changeset/warm-glasses-smile.md @@ -0,0 +1,7 @@ +--- +'nextra-theme-blog': patch +'nextra-theme-docs': patch +'nextra': patch +--- + +avoid focus-visible style being cut off by overflow-hidden diff --git a/examples/swr-site/theme.config.tsx b/examples/swr-site/theme.config.tsx index e6328bc5de..0ca22332d3 100644 --- a/examples/swr-site/theme.config.tsx +++ b/examples/swr-site/theme.config.tsx @@ -191,7 +191,7 @@ const config: DocsThemeConfig = { }, toc: { extraContent: ( - + ), float: true } diff --git a/packages/nextra-theme-docs/src/components/sidebar.tsx b/packages/nextra-theme-docs/src/components/sidebar.tsx index b825e03304..e679dbf606 100644 --- a/packages/nextra-theme-docs/src/components/sidebar.tsx +++ b/packages/nextra-theme-docs/src/components/sidebar.tsx @@ -183,7 +183,7 @@ function FolderImpl({ item, anchors }: FolderProps): ReactElement { )} /> - + {Array.isArray(item.children) ? ( )} - { - setFocused(item) - }} - > + {/* without asPopover check 's inner.clientWidth on `layout: "raw"` will be 0 and element will not have width on initial loading */} {(!asPopover || !showSidebar) && ( - + diff --git a/packages/nextra-theme-docs/src/mdx-components.tsx b/packages/nextra-theme-docs/src/mdx-components.tsx index fb16cf8ccd..60bf035ab2 100644 --- a/packages/nextra-theme-docs/src/mdx-components.tsx +++ b/packages/nextra-theme-docs/src/mdx-components.tsx @@ -370,7 +370,7 @@ const DEFAULT_COMPONENTS: MDXComponents = { ) ) : ( {renderComponent(themeConfig.toc.component, { diff --git a/packages/nextra/src/client/components/tabs.tsx b/packages/nextra/src/client/components/tabs.tsx index ecb27df1a8..424a72719b 100644 --- a/packages/nextra/src/client/components/tabs.tsx +++ b/packages/nextra/src/client/components/tabs.tsx @@ -90,6 +90,7 @@ function Tabs_({ disabled={disabled} className={({ selected }) => cn( + index === 0 && '_ml-1', // avoid focus-visible style being cut off '_mr-2 _rounded-t _p-2 _font-medium _leading-5 _transition-colors', '_-mb-0.5 _select-none _border-b-2', selected