diff --git a/apps/docs/content/docs/ui/internationalization.mdx b/apps/docs/content/docs/ui/internationalization.mdx index 891c76ffb..c17160887 100644 --- a/apps/docs/content/docs/ui/internationalization.mdx +++ b/apps/docs/content/docs/ui/internationalization.mdx @@ -68,20 +68,20 @@ See [Middleware](/docs/headless/internationalization#middleware) for customisabl ### Routing Create a dynamic route `/app/[lang]`, and move all special files from `/app` to -the folder. +the folder (e.g. `page.tsx`, `layout.tsx`). A `I18nProvider` is needed for localization. Wrap the root provider inside your I18n provider, and provide available languages & translations to it. Note that only English translations are provided by default. -```tsx +```tsx title="app/[lang]/layout.tsx" import { RootProvider } from 'fumadocs-ui/provider'; import { I18nProvider, type Translations } from 'fumadocs-ui/i18n'; -const cn: Translations = { +const cn: Partial = { search: 'Translated Content', - // other props + // other translations }; // available languages that will be displayed on UI @@ -104,16 +104,18 @@ export default async function RootLayout({ params: Promise<{ lang: string }>; children: React.ReactNode; }) { + const lang = (await params).lang; + return ( - + {children} @@ -126,7 +128,7 @@ export default async function RootLayout({ ### Source -Update the usages to your source to include a locale code: +Update the references to your `source` object to include a locale code: ```ts import { source } from '@/lib/source'; @@ -141,9 +143,10 @@ source.getPage(params.slug, params.lang); source.getPages(params.lang); ``` -like: +In code editors, you can click on the variable in `lib/source.ts` to quickly find its references. +For example, it looks like this for docs layout: -```tsx title="app/[lang]/layout.tsx" +```tsx title="app/[lang]/docs/layout.tsx" import { source } from '@/lib/source'; import { DocsLayout } from 'fumadocs-ui/docs'; import type { ReactNode } from 'react'; diff --git a/apps/docs/content/docs/ui/theme.mdx b/apps/docs/content/docs/ui/theme.mdx index 27bf17d54..66135e0fe 100644 --- a/apps/docs/content/docs/ui/theme.mdx +++ b/apps/docs/content/docs/ui/theme.mdx @@ -44,11 +44,7 @@ To enable RTL, set the `dir` prop to `rtl` in body and root provider (required f import { RootProvider } from 'fumadocs-ui/provider'; import type { ReactNode } from 'react'; -export default function RootLayout({ - children, -}: { - children: ReactNode; -}): ReactNode { +export default function RootLayout({ children }: { children: ReactNode }) { return ( @@ -63,6 +59,26 @@ export default function RootLayout({ Fumadocs UI provides some CSS variables for customising the layout. +### Prefix + +By default, it has a `fd-` prefix to avoid conflicts with Shadcn UI or your own CSS variables. + +You can set or remove the prefix in `createPreset`: + +```js +import { createPreset } from 'fumadocs-ui/tailwind-plugin'; + +/** @type {import('tailwindcss').Config} */ +export default { + presets: [ + createPreset({ + // no prefix + cssPrefix: '', + }), + ], +}; +``` + ### Navbar Height When the default navbar is replaced, the layout may overlap with your new navbar. diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md index 4590856c3..b256f8129 100644 --- a/packages/core/CHANGELOG.md +++ b/packages/core/CHANGELOG.md @@ -1,5 +1,13 @@ # next-docs-zeta +## 14.6.8 + +## 14.6.7 + +### Patch Changes + +- 5474343: Export dynamic-link + ## 14.6.6 ## 14.6.5 diff --git a/packages/core/package.json b/packages/core/package.json index b54384be3..77b2e6eb0 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "fumadocs-core", - "version": "14.6.6", + "version": "14.6.8", "description": "The library for building a documentation website in Next.js", "keywords": [ "NextJs", @@ -60,6 +60,10 @@ "import": "./dist/link.js", "types": "./dist/link.d.ts" }, + "./dynamic-link": { + "import": "./dist/dynamic-link.js", + "types": "./dist/dynamic-link.d.ts" + }, "./mdx-plugins": { "import": "./dist/mdx-plugins/index.js", "types": "./dist/mdx-plugins/index.d.ts" diff --git a/packages/create-app/CHANGELOG.md b/packages/create-app/CHANGELOG.md index 77ff7fc9b..3723a411e 100644 --- a/packages/create-app/CHANGELOG.md +++ b/packages/create-app/CHANGELOG.md @@ -1,5 +1,9 @@ # create-next-docs-app +## 14.6.8 + +## 14.6.7 + ## 14.6.6 ## 14.6.5 diff --git a/packages/create-app/package.json b/packages/create-app/package.json index 85aefa496..40adbe324 100644 --- a/packages/create-app/package.json +++ b/packages/create-app/package.json @@ -1,6 +1,6 @@ { "name": "create-fumadocs-app", - "version": "14.6.6", + "version": "14.6.8", "description": "Create a new documentation site with Fumadocs", "keywords": [ "NextJs", diff --git a/packages/create-app/template/+shared/app/(home)/layout.tsx b/packages/create-app/template/+shared/app/(home)/layout.tsx index 608a58b1d..1dd4684d0 100644 --- a/packages/create-app/template/+shared/app/(home)/layout.tsx +++ b/packages/create-app/template/+shared/app/(home)/layout.tsx @@ -2,10 +2,6 @@ import type { ReactNode } from 'react'; import { HomeLayout } from 'fumadocs-ui/layouts/home'; import { baseOptions } from '@/app/layout.config'; -export default function Layout({ - children, -}: { - children: ReactNode; -}): React.ReactElement { +export default function Layout({ children }: { children: ReactNode }) { return {children}; } diff --git a/packages/create-app/template/+tailwindcss/tailwind.config.js b/packages/create-app/template/+tailwindcss/tailwind.config.js index c9b20f90c..c343ccec8 100644 --- a/packages/create-app/template/+tailwindcss/tailwind.config.js +++ b/packages/create-app/template/+tailwindcss/tailwind.config.js @@ -1,3 +1,4 @@ +// @ts-check import { createPreset } from 'fumadocs-ui/tailwind-plugin'; /** @type {import('tailwindcss').Config} */ diff --git a/packages/openapi/CHANGELOG.md b/packages/openapi/CHANGELOG.md index 02fc6bf22..0cc8e5d66 100644 --- a/packages/openapi/CHANGELOG.md +++ b/packages/openapi/CHANGELOG.md @@ -1,5 +1,22 @@ # @fuma-docs/openapi +## 5.10.6 + +### Patch Changes + +- Updated dependencies [e95be52] +- Updated dependencies [f3298ea] + - fumadocs-ui@14.6.8 + - fumadocs-core@14.6.8 + +## 5.10.5 + +### Patch Changes + +- Updated dependencies [5474343] + - fumadocs-core@14.6.7 + - fumadocs-ui@14.6.7 + ## 5.10.4 ### Patch Changes diff --git a/packages/openapi/package.json b/packages/openapi/package.json index 40ad2a3b1..af1a002ad 100644 --- a/packages/openapi/package.json +++ b/packages/openapi/package.json @@ -1,6 +1,6 @@ { "name": "fumadocs-openapi", - "version": "5.10.4", + "version": "5.10.6", "description": "Generate MDX docs for your OpenAPI spec", "keywords": [ "NextJs", diff --git a/packages/ui/CHANGELOG.md b/packages/ui/CHANGELOG.md index f3ccda611..5cbe49a38 100644 --- a/packages/ui/CHANGELOG.md +++ b/packages/ui/CHANGELOG.md @@ -1,5 +1,20 @@ # next-docs-ui +## 14.6.8 + +### Patch Changes + +- e95be52: Fix i18n toggle +- f3298ea: Add css prefix by default + - fumadocs-core@14.6.8 + +## 14.6.7 + +### Patch Changes + +- Updated dependencies [5474343] + - fumadocs-core@14.6.7 + ## 14.6.6 ### Patch Changes diff --git a/packages/ui/package.json b/packages/ui/package.json index 405e961d1..b0d272ecd 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -1,6 +1,6 @@ { "name": "fumadocs-ui", - "version": "14.6.6", + "version": "14.6.8", "description": "The framework for building a documentation website in Next.js", "keywords": [ "NextJs", diff --git a/packages/ui/src/i18n.tsx b/packages/ui/src/i18n.tsx index ac8b70f11..e68dd6f0e 100644 --- a/packages/ui/src/i18n.tsx +++ b/packages/ui/src/i18n.tsx @@ -43,14 +43,14 @@ export function I18nProvider({ const router = useRouter(); const pathname = usePathname(); - const onChangeCallback = (locale: string) => { + const onChangeCallback = (value: string) => { const segments = pathname.split('/').filter((v) => v.length > 0); // If locale prefix hidden if (segments[0] !== locale) { - segments.unshift(locale); + segments.unshift(value); } else { - segments[0] = locale; + segments[0] = value; } router.push(`/${segments.join('/')}`); diff --git a/packages/ui/src/tailwind-plugin.ts b/packages/ui/src/tailwind-plugin.ts index 769d1be15..ef5ff9421 100644 --- a/packages/ui/src/tailwind-plugin.ts +++ b/packages/ui/src/tailwind-plugin.ts @@ -120,7 +120,7 @@ function createTailwindColors( } export const docsUi = plugin.withOptions( - ({ cssPrefix = '', preset = 'default', layoutWidth = '100vw' } = {}) => { + ({ cssPrefix = 'fd', preset = 'default', layoutWidth = '100vw' } = {}) => { return ({ addBase, addComponents, addUtilities }) => { const { light, dark, css } = typeof preset === 'string' ? presets[preset] : preset; @@ -240,7 +240,7 @@ export const docsUi = plugin.withOptions( }; }, ({ - cssPrefix = '', + cssPrefix = 'fd', modifyContainer = true, addGlobalColors = false, } = {}) => ({