diff --git a/src/components/lab/router/README.md b/src/components/lab/router/README.md index b89df2cba..2f6f2eb7a 100644 --- a/src/components/lab/router/README.md +++ b/src/components/lab/router/README.md @@ -31,12 +31,12 @@ function App() { const navigate = useNavigation(); return ( - + - Post 1 (local link) + Posts (local link) Gravity UI (external link) @@ -83,7 +83,9 @@ function App() { const navigate = useNavigate(); return ( - {/*...*/} + + {/*...*/} + ); } ``` @@ -151,7 +153,6 @@ import type {NavigateOptions, ToOptions} from '@tanstack/react-router'; declare module '@gravity-ui/uikit' { interface RouterConfig { - href: ToOptions; routerOptions: Omit; } } @@ -161,10 +162,9 @@ function App() { return ( router.navigate({...to, ...opts})} - useHref={(to) => router.buildLocation(to).href} + router={(to, opts) => router.navigate({to, ...opts})} > - {/*...*/} + {/*...*/} ); } diff --git a/src/components/lab/router/__stories__/RouterProvider.stories.tsx b/src/components/lab/router/__stories__/RouterProvider.stories.tsx index 679d69d5b..702c41272 100644 --- a/src/components/lab/router/__stories__/RouterProvider.stories.tsx +++ b/src/components/lab/router/__stories__/RouterProvider.stories.tsx @@ -4,7 +4,7 @@ import type {Meta, StoryObj} from '@storybook/react'; import {Link} from '../../../Link'; import {Flex} from '../../../layout'; -import type {Href, RouterOptions} from '../../../types'; +import type {RouterOptions} from '../../../types'; import {RouterProvider} from '../router'; const meta: Meta = { @@ -26,21 +26,15 @@ export const Default = { * } * } */ - type HrefType = {to: string; params: Record} | string; return ( - console.log('Navigate to: ', {href, opts})} - useHref={(href: HrefType) => - typeof href === 'string' ? href : href.to.replace('$pastId', href.params.pastId) - } - > + console.log('Navigate to: ', {href, opts})}> - Post 1 (local link) + Posts (local link) Gravity UI (external link) diff --git a/src/components/lab/router/router.tsx b/src/components/lab/router/router.tsx index 76b26d51d..623983ba1 100644 --- a/src/components/lab/router/router.tsx +++ b/src/components/lab/router/router.tsx @@ -9,21 +9,18 @@ interface RouterProps { href: Href, routerOptions: RouterOptions | undefined, ) => boolean; - useHref: (href: Href) => string; } const routerContext = React.createContext({ openLink: () => false, - useHref: (href) => href, }); export interface RouterProviderProps { navigate: (href: Href, routerOptions: RouterOptions | undefined) => void; - useHref?: (href: Href) => string; children: React.ReactNode; } -export function RouterProvider({navigate, useHref, children}: RouterProviderProps) { +export function RouterProvider({navigate, children}: RouterProviderProps) { const value: RouterProps = React.useMemo( () => ({ openLink: (link, modifiers, href, routerOptions) => { @@ -33,9 +30,8 @@ export function RouterProvider({navigate, useHref, children}: RouterProviderProp } return false; }, - useHref: useHref || ((href: Href) => href), }), - [navigate, useHref], + [navigate], ); return {children}; @@ -89,10 +85,9 @@ interface LinkProps { } export function useLinkProps(props: LinkProps) { - const {useHref, openLink} = useRouter(); - const href = useHref(props.href ?? ''); + const {openLink} = useRouter(); return { - href: props.href ? href : undefined, + href: props.href, hrefLang: props.hrefLang, target: props.target, rel: props.target === '_blank' && !props.rel ? 'noopener noreferrer' : props.rel,