fix: others headless change

This commit is contained in:
Joel
2025-01-23 15:11:05 +08:00
parent e797e97b18
commit 333aae6795
13 changed files with 152 additions and 153 deletions

View File

@ -7,7 +7,7 @@ import {
useRef,
useState,
} from 'react'
import { Tab } from '@headlessui/react'
import { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react'
import { Tag } from './tag'
import classNames from '@/utils/classnames'
@ -161,7 +161,7 @@ function CodeGroupHeader({ title, children, selectedIndex }: IChildrenProps) {
</h3>
)}
{hasTabs && (
<Tab.List className="flex gap-4 -mb-px text-xs font-medium">
<TabList className="flex gap-4 -mb-px text-xs font-medium">
{Children.map(children, (child, childIndex) => (
<Tab
className={classNames(
@ -174,7 +174,7 @@ function CodeGroupHeader({ title, children, selectedIndex }: IChildrenProps) {
{getPanelTitle(child.props.children.props)}
</Tab>
))}
</Tab.List>
</TabList>
)}
</div>
)
@ -189,13 +189,13 @@ function CodeGroupPanels({ children, targetCode, ...props }: ICodeGroupPanelsPro
if (hasTabs) {
return (
<Tab.Panels>
<TabPanels>
{Children.map(children, child => (
<Tab.Panel>
<TabPanel>
<CodePanel {...props}>{child}</CodePanel>
</Tab.Panel>
</TabPanel>
))}
</Tab.Panels>
</TabPanels>
)
}
@ -260,7 +260,7 @@ export function CodeGroup({ children, title, inputs, targetCode, ...props }: ICh
)
const tabGroupProps = useTabGroupProps(languages)
const hasTabs = Children.count(children) > 1
const Container = hasTabs ? Tab.Group : 'div'
const Container = hasTabs ? TabGroup : 'div'
const containerProps = hasTabs ? tabGroupProps : {}
const headerProps = hasTabs
? { selectedIndex: tabGroupProps.selectedIndex }