diff --git a/apps/docs/features/ui/Tabs.tsx b/apps/docs/features/ui/Tabs.tsx index f0f3f8529d8..9f7d45edc1f 100644 --- a/apps/docs/features/ui/Tabs.tsx +++ b/apps/docs/features/ui/Tabs.tsx @@ -1,15 +1,15 @@ 'use client' -import { useCallback, type ComponentPropsWithoutRef, type PropsWithChildren } from 'react' -import { Tabs as TabsPrimitive, type TabsProps } from 'ui' -import { withQueryParams, withSticky, type QueryParamsProps } from 'ui-patterns/ComplexTabs' import { useTocRerenderTrigger } from '~/features/docs/GuidesMdx.state' +import { useCallback, type ComponentPropsWithoutRef, type PropsWithChildren } from 'react' +import { DocsTabs } from 'ui' +import { withQueryParams, withSticky, type QueryParamsProps } from 'ui-patterns/ComplexTabs' -const TabsWithStickyAndQueryParams = withSticky>( - withQueryParams(TabsPrimitive) -) +const TabsWithStickyAndQueryParams = withSticky< + PropsWithChildren +>(withQueryParams(DocsTabs.Tabs)) -const TabPanel = TabsPrimitive.Panel +const TabPanel = DocsTabs.Tabs.Panel const Tabs = ({ onChange, stickyTabList, diff --git a/packages/ui-patterns/src/ComplexTabs/withQueryParams.tsx b/packages/ui-patterns/src/ComplexTabs/withQueryParams.tsx index 6645f3653f1..2e30aa450c4 100644 --- a/packages/ui-patterns/src/ComplexTabs/withQueryParams.tsx +++ b/packages/ui-patterns/src/ComplexTabs/withQueryParams.tsx @@ -3,7 +3,7 @@ import { useSearchParamsShallow } from 'common' import { xor } from 'lodash' import { Children, isValidElement, useEffect, useRef, type FC, type PropsWithChildren } from 'react' -import { type TabsProps } from 'ui' +import { type DocsTabs } from 'ui' const isString = (maybeStr: unknown): maybeStr is string => typeof maybeStr === 'string' @@ -18,7 +18,7 @@ interface QueryParamsProps { * selection state in query params. */ const withQueryParams = - >( + >( Component: FC> ) => ({ diff --git a/packages/ui/index.tsx b/packages/ui/index.tsx index f8cc6ed682d..c5d3cdffeac 100644 --- a/packages/ui/index.tsx +++ b/packages/ui/index.tsx @@ -5,7 +5,7 @@ export * from './src/components/Icon/IconBackground' // DISPLAYS -export * from './src/components/Tabs' +export * as DocsTabs from './src/components/Tabs' // NAV