@djangocfg/layouts 2.1.294 → 2.1.298

package/README.md

@@ -87,7 +87,7 @@ Wraps `BaseApp` and picks **admin → private → public** layout by path (`matc
 
 | Component | Use |
 |---|---|
-| **`PublicLayout`** | Marketing / docs. Slots for navbar + footer. Supports `LinkComponentProvider` to inject an i18n-aware `Link` (e.g. `next-intl`) so every anchor picks up the locale prefix. All three navbars accept `controls` + `i18n` to show theme / locale switchers next to UserMenu (same shape as `DefaultFooter.controls`). **[See PublicLayout README](./src/layouts/PublicLayout/README.md)** for full props, navbar variants (`FloatingNavbar` / `FlushNavbar` / `MinimalNavbar`), `DefaultFooter`, `NavAction`, `NavControls`, and hooks. |
+| **`PublicLayout`** | Marketing / docs. Slots for navbar + footer. All anchors render through `<Link>` from `@djangocfg/ui-core/components` — wrap with `LinkProvider` higher in the tree to inject a locale-aware Link (e.g. `next-intl`). All three navbars accept `controls` + `i18n` to show theme / locale switchers next to UserMenu (same shape as `DefaultFooter.controls`). **[See PublicLayout README](./src/layouts/PublicLayout/README.md)** for full props, navbar variants (`FloatingNavbar` / `FlushNavbar` / `MinimalNavbar`), `DefaultFooter`, `NavAction`, `NavControls`, and hooks. |
 | **`PrivateLayout`** | App shell — sidebar + header. |
 | **`AuthLayout`** | Sign-in flows. |
 | **`AdminLayout`** | Admin console. |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/layouts",
-  "version": "2.1.294",
+  "version": "2.1.298",
   "description": "Simple, straightforward layout components for Next.js - import and use with props",
   "keywords": [
     "layouts",
@@ -74,14 +74,14 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/api": "^2.1.294",
-    "@djangocfg/centrifugo": "^2.1.294",
-    "@djangocfg/debuger": "^2.1.294",
-    "@djangocfg/i18n": "^2.1.294",
-    "@djangocfg/monitor": "^2.1.294",
-    "@djangocfg/ui-core": "^2.1.294",
-    "@djangocfg/ui-nextjs": "^2.1.294",
-    "@djangocfg/ui-tools": "^2.1.294",
+    "@djangocfg/api": "^2.1.298",
+    "@djangocfg/centrifugo": "^2.1.298",
+    "@djangocfg/debuger": "^2.1.298",
+    "@djangocfg/i18n": "^2.1.298",
+    "@djangocfg/monitor": "^2.1.298",
+    "@djangocfg/ui-core": "^2.1.298",
+    "@djangocfg/ui-nextjs": "^2.1.298",
+    "@djangocfg/ui-tools": "^2.1.298",
     "@hookform/resolvers": "^5.2.2",
     "consola": "^3.4.2",
     "lucide-react": "^0.545.0",
@@ -110,15 +110,15 @@
     "uuid": "^11.1.0"
   },
   "devDependencies": {
-    "@djangocfg/api": "^2.1.294",
-    "@djangocfg/centrifugo": "^2.1.294",
-    "@djangocfg/debuger": "^2.1.294",
-    "@djangocfg/i18n": "^2.1.294",
-    "@djangocfg/monitor": "^2.1.294",
-    "@djangocfg/typescript-config": "^2.1.294",
-    "@djangocfg/ui-core": "^2.1.294",
-    "@djangocfg/ui-nextjs": "^2.1.294",
-    "@djangocfg/ui-tools": "^2.1.294",
+    "@djangocfg/api": "^2.1.298",
+    "@djangocfg/centrifugo": "^2.1.298",
+    "@djangocfg/debuger": "^2.1.298",
+    "@djangocfg/i18n": "^2.1.298",
+    "@djangocfg/monitor": "^2.1.298",
+    "@djangocfg/typescript-config": "^2.1.298",
+    "@djangocfg/ui-core": "^2.1.298",
+    "@djangocfg/ui-nextjs": "^2.1.298",
+    "@djangocfg/ui-tools": "^2.1.298",
     "@types/node": "^24.7.2",
     "@types/react": "^19.1.0",
     "@types/react-dom": "^19.1.0",

package/src/layouts/AppLayout/BaseApp.tsx

@@ -48,7 +48,7 @@ import { AuthProvider } from '@djangocfg/api/auth';
 import { CentrifugoProvider } from '@djangocfg/centrifugo';
 import { Toaster, TooltipProvider } from '@djangocfg/ui-core/components';
 import { DialogProvider } from '@djangocfg/ui-core/lib/dialog-service';
-import { NextRouterAdapter } from '@djangocfg/ui-core/adapters/nextjs';
+import { NextRouterAdapter, NextLinkProvider } from '@djangocfg/ui-core/adapters/nextjs';
 import { ThemeProvider } from '@djangocfg/ui-nextjs/theme';
 import { ThemeStyleBridge } from '../../theme/ThemeStyleBridge';
 import { ErrorBoundary } from '../../components/errors/ErrorBoundary';
@@ -126,6 +126,7 @@ export function BaseApp({
        * (Auth, Centrifugo, anything that may navigate) gets it.
        */}
       <NextRouterAdapter>
+      <NextLinkProvider>
       <DialogProvider>
       <TooltipProvider>
         <SWRConfig
@@ -191,6 +192,7 @@ export function BaseApp({
         </SWRConfig>
       </TooltipProvider>
       </DialogProvider>
+      </NextLinkProvider>
       </NextRouterAdapter>
     </ThemeProvider>
   );

package/src/layouts/PrivateLayout/components/PrivateSidebar.tsx

@@ -5,7 +5,7 @@
 
 'use client';
 
-import Link from 'next/link';
+import { Link } from '@djangocfg/ui-core/components';
 import { usePathname as useNextPathname } from 'next/navigation';
 import React from 'react';
 

package/src/layouts/PublicLayout/README.md

@@ -23,30 +23,27 @@ import { PublicLayout, FloatingNavbar, DefaultFooter } from '@djangocfg/layouts'
 | `contentTopSpacing` | `'auto' \| 'none'` | `'auto'` | Auto pads `<main>` based on the navbar variant. |
 | `contentBottomSpacing` | `'auto' \| 'none' \| 'compact'` | `'auto'` | Bottom breathing room before footer. |
 
-## `LinkComponentProvider` — inject a custom Link
+## Links
 
-All internal anchors (navbar, footer, mobile drawer) render through a single
-injectable `Link` component. Default is plain `next/link`. Wrap the layout in
-`LinkComponentProvider` to swap it — for example to pipe in a locale-aware
-`Link` from `next-intl`:
+All internal anchors (navbar, footer, mobile drawer) use `<Link>` from
+`@djangocfg/ui-core/components`. In Next.js apps it renders through `next/link`
+automatically (via `NextLinkProvider`, which `BaseApp` mounts for you).
+
+For a locale-aware Link (e.g. `next-intl`'s `createNavigation().Link`), swap
+the underlying component by mounting your own `LinkProvider` from
+`@djangocfg/ui-core/components` higher in the tree:
 
 ```tsx
-import { LinkComponentProvider, PublicLayout, FloatingNavbar } from '@djangocfg/layouts';
-import { Link } from '@/i18n/navigation'; // next-intl createNavigation().Link
+import { LinkProvider } from '@djangocfg/ui-core/components';
+import { Link as I18nLink } from '@/i18n/navigation';
 
-<LinkComponentProvider value={Link}>
+<LinkProvider value={I18nLink}>
   <PublicLayout navbar={<FloatingNavbar config={…} />} footer={…}>
     {children}
   </PublicLayout>
-</LinkComponentProvider>
+</LinkProvider>
 ```
 
-Why: with `next-intl`'s `localePrefix: 'as-needed'`, plain `next/link` does
-not prepend the active locale, so every navbar item drops the `/ru/` prefix
-on click. Injecting the i18n-aware `Link` fixes that once for the whole tree.
-
-Monolingual apps don't need the provider — the default `next/link` is fine.
-
 ## Navbar variants
 
 Three variants. All share the same core props (below); only the chrome differs.
@@ -200,7 +197,7 @@ Three variants: `full` (default) with brand column + menus + controls; `compact`
 
 ## Primitives
 
-`NavBrand`, `NavActions`, `NavActionItem`, `NavControls`, `NavDesktopItems`, `ThemeBrandMark`, `ThemeBrandMarkImg`, `LinkComponentProvider`, `useLinkComponent`, `PublicLayoutProvider`, `usePublicLayout`.
+`NavBrand`, `NavActions`, `NavActionItem`, `NavControls`, `NavDesktopItems`, `ThemeBrandMark`, `ThemeBrandMarkImg`, `PublicLayoutProvider`, `usePublicLayout`.
 
 ## Context
 

package/src/layouts/PublicLayout/footers/DefaultFooter/DefaultFooter.tsx

@@ -12,8 +12,9 @@ import { Laptop, Moon, Sun } from 'lucide-react';
 import { Button } from '@djangocfg/ui-core/components';
 import { useForcedTheme, useThemeContext } from '@djangocfg/ui-nextjs/theme';
 
+import { Link } from '@djangocfg/ui-core/components';
+
 import { LocaleSwitcher } from '../../../_components/LocaleSwitcher';
-import { useLinkComponent } from '../../primitives/LinkComponentContext';
 import { FooterMenuSections } from './FooterMenuSections';
 import { FooterProjectInfo } from './FooterProjectInfo';
 
@@ -103,7 +104,6 @@ function ThemeModeControl({
 }
 
 export function DefaultFooter({ config }: DefaultFooterProps) {
-  const Link = useLinkComponent();
   const variant = config.variant ?? 'full';
   const shellClass = config.shell?.className;
   const brandSlot = config.brand?.slot;

package/src/layouts/PublicLayout/footers/DefaultFooter/FooterBottom.tsx

@@ -2,7 +2,7 @@
 
 import React from 'react';
 
-import { useLinkComponent } from '../../primitives/LinkComponentContext';
+import { Link } from '@djangocfg/ui-core/components';
 import { DjangoCFGLogo } from './DjangoCFGLogo';
 
 import type { FooterLink } from './types';
@@ -23,7 +23,6 @@ export function FooterBottom({
   links = [],
   variant = 'desktop',
 }: FooterBottomProps) {
-  const Link = useLinkComponent();
   const isMobile = variant === 'mobile';
 
   if (isMobile) {

package/src/layouts/PublicLayout/footers/DefaultFooter/FooterMenuSections.tsx

@@ -2,7 +2,7 @@
 
 import React from 'react';
 
-import { useLinkComponent } from '../../primitives/LinkComponentContext';
+import { Link } from '@djangocfg/ui-core/components';
 
 import type { FooterMenuSection } from './types';
 
@@ -17,7 +17,6 @@ export function FooterMenuSections({
   minColumnWidth = 180,
   maxColumns = 5,
 }: FooterMenuSectionsProps) {
-  const Link = useLinkComponent();
   if (menuSections.length === 0) return null;
 
   const effectiveColumns = Math.max(1, Math.min(maxColumns, menuSections.length));

package/src/layouts/PublicLayout/index.ts

@@ -38,17 +38,12 @@ export {
   NavDesktopItems,
   ThemeBrandMark,
   ThemeBrandMarkImg,
-  LinkComponentProvider,
-  useLinkComponent,
 } from './primitives';
 export type {
   NavAction,
   NavControlsProps,
   ThemeBrandMarkProps,
   ThemeBrandMarkImgProps,
-  LinkComponent,
-  LinkComponentProps,
-  LinkComponentProviderProps,
 } from './primitives';
 
 // Navbar variants

package/src/layouts/PublicLayout/primitives/NavActionItem.tsx

@@ -9,10 +9,9 @@
 
 import React, { type ReactNode } from 'react';
 
+import { Link } from '@djangocfg/ui-core/components';
 import { cn } from '@djangocfg/ui-core/lib';
 
-import { useLinkComponent } from './LinkComponentContext';
-
 export interface NavAction {
   label: string;
   href: string;
@@ -55,7 +54,6 @@ interface NavActionItemProps {
 }
 
 export function NavActionItem({ action, className }: NavActionItemProps) {
-  const Link = useLinkComponent();
   const variant = action.variant ?? 'ghost';
   const cls = cn(
     baseCls,

package/src/layouts/PublicLayout/primitives/NavBrand.tsx

@@ -2,7 +2,7 @@
 
 import React, { type ReactNode } from 'react';
 
-import { useLinkComponent } from './LinkComponentContext';
+import { Link } from '@djangocfg/ui-core/components';
 
 interface NavBrandProps {
   brand?: ReactNode;
@@ -10,8 +10,6 @@ interface NavBrandProps {
 }
 
 export function NavBrand({ brand, brandHref = '/' }: NavBrandProps) {
-  const Link = useLinkComponent();
-
   if (brand == null || brand === '' || brand === false) return null;
 
   if (typeof brand === 'string') {

package/src/layouts/PublicLayout/primitives/NavDesktopItems.tsx

@@ -3,14 +3,13 @@
 import { ChevronDown } from 'lucide-react';
 import React from 'react';
 
-import { Button } from '@djangocfg/ui-core/components';
+import { Button, Link } from '@djangocfg/ui-core/components';
 import { cn } from '@djangocfg/ui-core/lib';
 
 import type { NavigationItem } from '../../types';
 import type { UseDropdownMenuReturn } from '../hooks/useDropdownMenu';
 import { useResponsiveOverflow } from '../hooks/useResponsiveOverflow';
 import type { PublicDesktopDropdownRenderer } from '../navbarTypes';
-import { useLinkComponent } from './LinkComponentContext';
 
 interface NavDesktopItemsProps {
   /** Full ordered item list; overflow is computed responsively. */
@@ -57,7 +56,6 @@ export function NavDesktopItems({
   dropdown,
   renderDesktopDropdown,
 }: NavDesktopItemsProps) {
-  const Link = useLinkComponent();
   const { openDropdownKey, scheduleOpen, scheduleClose, closeDropdown } = dropdown;
 
   const { visibleCount, containerRef, itemRef, measured } = useResponsiveOverflow({

package/src/layouts/PublicLayout/primitives/index.ts

@@ -7,12 +7,3 @@ export type { NavControlsProps } from './NavControls';
 export { NavDesktopItems } from './NavDesktopItems';
 export { ThemeBrandMark, ThemeBrandMarkImg } from './ThemeBrandMark';
 export type { ThemeBrandMarkProps, ThemeBrandMarkImgProps } from './ThemeBrandMark';
-export {
-  LinkComponentProvider,
-  useLinkComponent,
-} from './LinkComponentContext';
-export type {
-  LinkComponent,
-  LinkComponentProps,
-  LinkComponentProviderProps,
-} from './LinkComponentContext';

package/src/layouts/PublicLayout/shared/MobileDrawerShell.tsx

@@ -12,7 +12,7 @@ import React, { useMemo } from 'react';
 
 import { useAuth } from '@djangocfg/api/auth';
 import { useAppT } from '@djangocfg/i18n';
-import { Button } from '@djangocfg/ui-core/components';
+import { Button, Link } from '@djangocfg/ui-core/components';
 import { useBodyScrollLock, useIsTabletOrBelow } from '@djangocfg/ui-core/hooks';
 import { cn } from '@djangocfg/ui-core/lib';
 
@@ -20,7 +20,6 @@ import { usePathnameWithoutLocale } from '../../../hooks';
 import { UserMenu } from '../../_components/UserMenu';
 import { usePublicLayoutOptional } from '../context';
 import { useMobileNavPanel } from '../hooks';
-import { useLinkComponent } from '../primitives/LinkComponentContext';
 import { NavControls } from '../primitives/NavControls';
 
 import type { I18nLayoutConfig, NavigationItem, UserMenuConfig } from '../../types';
@@ -44,7 +43,6 @@ export interface MobileDrawerShellProps {
 }
 
 export function MobileDrawerShell(props: MobileDrawerShellProps) {
-  const Link = useLinkComponent();
   const context = usePublicLayoutOptional();
   const mobileMenuOpen = props.isOpen ?? context?.mobileMenuOpen ?? false;
   const closeMobileMenu = props.onClose ?? context?.closeMobileMenu ?? (() => {});

package/src/layouts/_components/PrivateSidebarAccount.tsx

@@ -6,7 +6,7 @@
 'use client';
 
 import { ChevronDown, LogOut } from 'lucide-react';
-import Link from 'next/link';
+import { Link } from '@djangocfg/ui-core/components';
 import React from 'react';
 
 import { useAuth } from '@djangocfg/api/auth';

package/src/layouts/_components/UserMenu.tsx

@@ -31,7 +31,7 @@
 'use client';
 
 import { ArrowRight, Globe, LogOut } from 'lucide-react';
-import Link from 'next/link';
+import { Link } from '@djangocfg/ui-core/components';
 import React, { useMemo } from 'react';
 
 import { useAuth } from '@djangocfg/api/auth';

package/src/snippets/Breadcrumbs.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { ChevronRight, Home } from 'lucide-react';
-import Link from 'next/link';
-import { usePathname } from 'next/navigation';
+import { Link } from '@djangocfg/ui-core/components';
+import { useLocation } from '@djangocfg/ui-core/hooks';
 import React, { useMemo } from 'react';
 
 import { useAppT } from '@djangocfg/i18n';
@@ -18,7 +18,7 @@ interface BreadcrumbsProps {
 }
 
 const Breadcrumbs: React.FC<BreadcrumbsProps> = ({ items, className = "" }) => {
-  const pathname = usePathname();
+  const { pathname } = useLocation();
   const t = useAppT();
 
   const labels = useMemo(() => ({

package/src/layouts/PublicLayout/primitives/LinkComponentContext.tsx

@@ -1,50 +0,0 @@
-/**
- * LinkComponentContext
- *
- * Dependency-injects the Link component used by navbars, footers, and mobile
- * drawers. Apps wire in their own i18n-aware Link (e.g. next-intl's
- * `createNavigation().Link`) so internal navigation picks up the locale
- * prefix. Default falls back to plain `next/link`.
- */
-
-'use client';
-
-import NextLink, { type LinkProps as NextLinkProps } from 'next/link';
-import React, {
-  createContext,
-  useContext,
-  type AnchorHTMLAttributes,
-  type ComponentType,
-  type ReactNode,
-} from 'react';
-
-type AnchorProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>;
-
-export type LinkComponentProps = Omit<NextLinkProps, 'passHref' | 'legacyBehavior'> &
-  AnchorProps & {
-    children?: ReactNode;
-  };
-
-export type LinkComponent = ComponentType<LinkComponentProps>;
-
-const LinkComponentContext = createContext<LinkComponent>(NextLink as LinkComponent);
-
-export interface LinkComponentProviderProps {
-  value: LinkComponent;
-  children: ReactNode;
-}
-
-export function LinkComponentProvider({
-  value,
-  children,
-}: LinkComponentProviderProps) {
-  return (
-    <LinkComponentContext.Provider value={value}>
-      {children}
-    </LinkComponentContext.Provider>
-  );
-}
-
-export function useLinkComponent(): LinkComponent {
-  return useContext(LinkComponentContext);
-}