fumadocs-ui 14.7.4 → 14.7.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,5 @@
1
- import { type ButtonHTMLAttributes } from 'react';
2
- export declare function ThemeToggle({ className, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): React.ReactElement;
1
+ import { type HTMLAttributes } from 'react';
2
+ export declare function ThemeToggle({ className, mode, ...props }: HTMLAttributes<HTMLElement> & {
3
+ mode?: 'light-dark' | 'light-dark-system';
4
+ }): import("react/jsx-runtime").JSX.Element;
3
5
  //# sourceMappingURL=theme-toggle.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/theme-toggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAgBlD,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,YAAY,CAuB9D"}
1
+ {"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/theme-toggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,cAAc,EAA6B,MAAM,OAAO,CAAC;AAYvE,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,IAAmB,EACnB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,CAAC,EAAE,YAAY,GAAG,mBAAmB,CAAC;CAC3C,2CAiDA"}
@@ -1,21 +1,33 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { cva } from 'class-variance-authority';
4
- import { Moon, Sun } from 'lucide-react';
4
+ import { Moon, Sun, Airplay } from 'lucide-react';
5
5
  import { useTheme } from 'next-themes';
6
+ import { useLayoutEffect, useState } from 'react';
6
7
  import { cn } from '../../utils/cn';
7
- const buttonVariants = cva('size-7 rounded-full p-1.5 text-fd-muted-foreground', {
8
+ const itemVariants = cva('size-7 rounded-full p-1.5 text-fd-muted-foreground', {
8
9
  variants: {
9
- dark: {
10
- true: 'dark:bg-fd-accent dark:text-fd-accent-foreground',
11
- false: 'bg-fd-accent text-fd-accent-foreground dark:bg-transparent dark:text-fd-muted-foreground',
10
+ active: {
11
+ true: 'bg-fd-accent text-fd-accent-foreground',
12
+ false: 'text-fd-muted-foreground',
12
13
  },
13
14
  },
14
15
  });
15
- export function ThemeToggle({ className, ...props }) {
16
- const { setTheme, resolvedTheme } = useTheme();
17
- const onToggle = () => {
18
- setTheme(resolvedTheme === 'dark' ? 'light' : 'dark');
19
- };
20
- return (_jsxs("button", { type: "button", className: cn('inline-flex items-center rounded-full border p-[3px]', className), "data-theme-toggle": "", "aria-label": "Toggle Theme", onClick: onToggle, ...props, children: [_jsx(Sun, { className: cn(buttonVariants({ dark: false })) }), _jsx(Moon, { className: cn(buttonVariants({ dark: true })) })] }));
16
+ export function ThemeToggle({ className, mode = 'light-dark', ...props }) {
17
+ const { setTheme, theme, resolvedTheme } = useTheme();
18
+ const [mounted, setMounted] = useState(false);
19
+ useLayoutEffect(() => {
20
+ setMounted(true);
21
+ }, []);
22
+ const container = cn('inline-flex items-center rounded-full border p-[3px]', className);
23
+ if (mode === 'light-dark') {
24
+ const value = mounted ? resolvedTheme : null;
25
+ return (_jsxs("button", { className: container, onClick: () => setTheme(value === 'light' ? 'dark' : 'light'), "data-theme-toggle": "", ...props, children: [_jsx(Sun, { className: cn(itemVariants({ active: value === 'light' })) }), _jsx(Moon, { className: cn(itemVariants({ active: value === 'dark' })) })] }));
26
+ }
27
+ const value = mounted ? theme : null;
28
+ return (_jsx("div", { className: container, "data-theme-toggle": "", ...props, children: [
29
+ ['light', Sun],
30
+ ['dark', Moon],
31
+ ['system', Airplay],
32
+ ].map(([key, Icon]) => (_jsx("button", { "aria-label": key, className: cn(itemVariants({ active: value === key })), onClick: () => setTheme(key), children: _jsx(Icon, { className: "size-full" }) }, key))) }));
21
33
  }
@@ -1,8 +1,8 @@
1
1
  import type { ReactNode } from 'react';
2
- export declare function Steps({ children, }: {
2
+ export declare function Steps({ children }: {
3
3
  children: ReactNode;
4
- }): React.ReactElement;
5
- export declare function Step({ children, }: {
4
+ }): import("react/jsx-runtime").JSX.Element;
5
+ export declare function Step({ children }: {
6
6
  children: ReactNode;
7
- }): React.ReactElement;
7
+ }): import("react/jsx-runtime").JSX.Element;
8
8
  //# sourceMappingURL=steps.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"steps.d.ts","sourceRoot":"","sources":["../../src/components/steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,KAAK,CAAC,EACpB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,KAAK,CAAC,YAAY,CAErB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,KAAK,CAAC,YAAY,CAErB"}
1
+ {"version":3,"file":"steps.d.ts","sourceRoot":"","sources":["../../src/components/steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAE1D;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAEzD"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- export function Steps({ children, }) {
3
- return _jsx("div", { className: "steps", children: children });
2
+ export function Steps({ children }) {
3
+ return _jsx("div", { className: "fd-steps", children: children });
4
4
  }
5
- export function Step({ children, }) {
6
- return _jsx("div", { className: "step", children: children });
5
+ export function Step({ children }) {
6
+ return _jsx("div", { className: "fd-step", children: children });
7
7
  }
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CASlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAarD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CA8BjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAyB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}
1
+ {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CASlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAarD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CA8BjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAwB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}
@@ -14,11 +14,11 @@ import { useSidebar } from '../../contexts/sidebar';
14
14
  import { buttonVariants } from '../../components/ui/button';
15
15
  import { cva } from 'class-variance-authority';
16
16
  import { useTreeContext, useTreePath } from '../../contexts/tree';
17
- const itemVariants = cva('flex flex-row items-center gap-2 rounded-md p-2 text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4', {
17
+ const itemVariants = cva('flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0', {
18
18
  variants: {
19
19
  active: {
20
20
  true: 'bg-fd-primary/10 font-medium text-fd-primary',
21
- false: 'transition-colors duration-100 hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',
21
+ false: 'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',
22
22
  },
23
23
  },
24
24
  });
@@ -122,7 +122,7 @@ export function SidebarCollapseTrigger(props) {
122
122
  return (_jsx("button", { type: "button", "aria-label": "Collapse Sidebar", "data-collapsed": collapsed, ...props, className: cn(buttonVariants({
123
123
  color: 'ghost',
124
124
  size: 'icon',
125
- }), 'backdrop-blur-lg', props.className), onClick: () => {
125
+ }), props.className), onClick: () => {
126
126
  setCollapsed((prev) => !prev);
127
127
  }, children: props.children ?? _jsx(SidebarIcon, {}) }));
128
128
  }
@@ -32,7 +32,7 @@ export function DocsLayout({ nav: { enabled: navEnabled = true, component: navRe
32
32
  return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [replaceOrDefault({ enabled: navEnabled, component: navReplace }, _jsxs(Navbar, { className: "md:hidden", children: [_jsx(Title, { url: nav.url, title: nav.title }), _jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children: nav.children }), _jsx(SearchOnly, { children: _jsx(SearchToggle, {}) }), _jsx(NavbarSidebarTrigger, { className: "-me-2 md:hidden" })] }), nav), _jsxs("main", { id: "nd-docs-layout", ...props.containerProps, className: cn('flex flex-1 flex-row pe-[var(--fd-layout-offset)]', variables, props.containerProps?.className), style: {
33
33
  ...layoutVariables,
34
34
  ...props.containerProps?.style,
35
- }, children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 z-30 data-[collapsed=false]:hidden max-md:hidden", style: {
35
+ }, children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 z-30 backdrop-blur-lg data-[collapsed=false]:hidden max-md:hidden", style: {
36
36
  insetInlineStart: 'calc(var(--fd-layout-offset) + 0.5rem)',
37
37
  } })) : null, replaceOrDefault({ enabled: sidebarEnabled, component: sidebarReplace }, _jsxs(Aside, { ...sidebar, className: cn('md:ps-[var(--fd-layout-offset)]', sidebar.className), children: [_jsxs(SidebarHeader, { children: [_jsx(SidebarHeaderItems, { ...nav, links: links }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null, !sidebarHideSearch ? (_jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" }) })) : null] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "pt-4 empty:hidden md:hidden", children: links
38
38
  .filter((v) => v.type !== 'icon')
@@ -13,7 +13,7 @@ export function Navbar(props) {
13
13
  paddingInlineStart: collapsed
14
14
  ? 'calc(var(--fd-layout-offset))'
15
15
  : 'calc(var(--fd-layout-offset) + var(--fd-sidebar-width))',
16
- }, children: _jsx("div", { className: "mx-auto flex size-full flex-row items-center border-b border-fd-foreground/10 px-4 md:gap-1.5 lg:px-8", children: props.children }) }));
16
+ }, children: _jsx("div", { className: "mx-auto flex size-full flex-row items-center border-b border-fd-foreground/10 px-4 md:gap-1.5", children: props.children }) }));
17
17
  }
18
18
  export function NavbarSidebarTrigger(props) {
19
19
  const { open } = useSidebar();
@@ -25,7 +25,7 @@ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { c
25
25
  const tabs = getSidebarTabsFromOptions(tabOptions, props.tree) ?? [];
26
26
  const variables = cn('[--fd-nav-height:3.5rem] [--fd-tocnav-height:36px] md:[--fd-sidebar-width:268px] xl:[--fd-toc-width:268px] xl:[--fd-tocnav-height:0px]');
27
27
  const pageStyles = {
28
- tocNav: cn('lg:px-4 xl:hidden'),
28
+ tocNav: cn('xl:hidden'),
29
29
  toc: cn('max-xl:hidden'),
30
30
  page: cn('mt-[var(--fd-nav-height)]'),
31
31
  };
@@ -39,7 +39,7 @@ function DocsNavbar({ sidebarCollapsible, links, nav = {}, i18n, }) {
39
39
  .filter((item) => item.type !== 'icon')
40
40
  .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground max-lg:hidden" }, i))), nav.children] }), _jsx(SearchOnly, { children: _jsx(SearchToggle, { className: "md:hidden" }) }), _jsx(NavbarSidebarTrigger, { className: "-me-1.5 md:hidden" }), _jsx("div", { className: "flex flex-row items-center empty:hidden max-lg:hidden", children: links
41
41
  .filter((item) => item.type === 'icon')
42
- .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon', color: 'ghost' }), 'text-fd-muted-foreground'), "aria-label": item.label, children: item.icon }, i))) }), i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-5" }) })) : null, _jsx(ThemeToggle, { className: "p-0 max-md:hidden" })] }));
42
+ .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon', color: 'ghost' }), 'text-fd-muted-foreground'), "aria-label": item.label, children: item.icon }, i))) }), i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-5" }) })) : null, _jsx(ThemeToggle, { className: "max-md:hidden", mode: "light-dark-system" })] }));
43
43
  }
44
44
  function NavbarLinkItem({ item, ...props }) {
45
45
  if (item.type === 'menu') {
package/dist/style.css CHANGED
@@ -1896,6 +1896,35 @@ body {
1896
1896
  .prose-no-margin > :last-child {
1897
1897
  margin-bottom: 0;
1898
1898
  }
1899
+ .fd-steps {
1900
+ counter-reset: step;
1901
+ border-left-width: 1px;
1902
+ margin-left: 1rem;
1903
+ padding-left: 1.75rem;
1904
+ position: relative;
1905
+ }
1906
+ .fd-step:before {
1907
+ background-color: hsl(var(--fd-secondary) / 1);
1908
+ color: hsl(var(--fd-secondary-foreground) / 1);
1909
+ content: counter(step);
1910
+ counter-increment: step;
1911
+ border-radius: 9999px;
1912
+ justify-content: center;
1913
+ align-items: center;
1914
+ width: 2rem;
1915
+ height: 2rem;
1916
+ font-size: .875rem;
1917
+ line-height: 1.25rem;
1918
+ display: flex;
1919
+ position: absolute;
1920
+ left: -1rem;
1921
+ }
1922
+ .prose-no-margin > :first-child {
1923
+ margin-top: 0;
1924
+ }
1925
+ .prose-no-margin > :last-child {
1926
+ margin-bottom: 0;
1927
+ }
1899
1928
  .\[--fd-nav-height\:3\.5rem\] {
1900
1929
  --fd-nav-height: 3.5rem;
1901
1930
  }
@@ -2318,25 +2347,6 @@ body {
2318
2347
  background-color: var(--shiki-dark-bg);
2319
2348
  }
2320
2349
 
2321
- .dark\:bg-fd-accent:is(.dark *) {
2322
- --tw-bg-opacity: 1;
2323
- background-color: hsl(var(--fd-accent) / var(--tw-bg-opacity, 1));
2324
- }
2325
-
2326
- .dark\:bg-transparent:is(.dark *) {
2327
- background-color: transparent;
2328
- }
2329
-
2330
- .dark\:text-fd-accent-foreground:is(.dark *) {
2331
- --tw-text-opacity: 1;
2332
- color: hsl(var(--fd-accent-foreground) / var(--tw-text-opacity, 1));
2333
- }
2334
-
2335
- .dark\:text-fd-muted-foreground:is(.dark *) {
2336
- --tw-text-opacity: 1;
2337
- color: hsl(var(--fd-muted-foreground) / var(--tw-text-opacity, 1));
2338
- }
2339
-
2340
2350
  @media not all and (min-width: 1280px) {
2341
2351
 
2342
2352
  .max-xl\:hidden {
@@ -2550,11 +2560,6 @@ body {
2550
2560
  border-width: 1px;
2551
2561
  }
2552
2562
 
2553
- .lg\:px-4 {
2554
- padding-left: 1rem;
2555
- padding-right: 1rem;
2556
- }
2557
-
2558
2563
  .lg\:px-8 {
2559
2564
  padding-left: 2rem;
2560
2565
  padding-right: 2rem;
@@ -2625,3 +2630,7 @@ body {
2625
2630
  width: 1.25rem;
2626
2631
  height: 1.25rem;
2627
2632
  }
2633
+
2634
+ .\[\&_svg\]\:shrink-0 svg {
2635
+ flex-shrink: 0;
2636
+ }
@@ -31,6 +31,12 @@ export interface DocsUIOptions extends Pick<TypographyOptions, 'disableRoundedTa
31
31
  */
32
32
  preset?: keyof typeof presets | Preset;
33
33
  typography?: TypographyOptions;
34
+ /**
35
+ * Add Fumadocs UI `fd-*` utilities
36
+ *
37
+ * @defaultValue true
38
+ */
39
+ addGlobalUtils?: boolean;
34
40
  }
35
41
  type Keys = 'background' | 'foreground' | 'muted' | 'muted-foreground' | 'popover' | 'popover-foreground' | 'card' | 'card-foreground' | 'border' | 'primary' | 'primary-foreground' | 'secondary' | 'secondary-foreground' | 'accent' | 'accent-foreground' | 'ring';
36
42
  type Theme = Record<Keys, string>;
@@ -1 +1 @@
1
- {"version":3,"file":"tailwind-plugin.d.ts","sourceRoot":"","sources":["../src/tailwind-plugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EACL,KAAK,OAAO,IAAI,iBAAiB,EACjC,UAAU,EACX,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,qBAAqB,CAAC;IACtD;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,GAAG,MAAM,CAAC;IAEvC,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AAED,KAAK,IAAI,GACL,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,SAAS,GACT,oBAAoB,GACpB,MAAM,GACN,iBAAiB,GACjB,QAAQ,GACR,SAAS,GACT,oBAAoB,GACpB,WAAW,GACX,sBAAsB,GACtB,QAAQ,GACR,mBAAmB,GACnB,MAAM,CAAC;AAEX,KAAK,KAAK,GAAG,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAkDD,eAAO,MAAM,MAAM;;;cApHH,CAAC;;;CA6QhB,CAAC;AAEF,wBAAgB,YAAY,CAAC,OAAO,GAAE,aAAkB,GAAG,aAAa,CAWvE;AAED,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC"}
1
+ {"version":3,"file":"tailwind-plugin.d.ts","sourceRoot":"","sources":["../src/tailwind-plugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EACL,KAAK,OAAO,IAAI,iBAAiB,EACjC,UAAU,EACX,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,qBAAqB,CAAC;IACtD;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,GAAG,MAAM,CAAC;IAEvC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAG/B;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,KAAK,IAAI,GACL,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,SAAS,GACT,oBAAoB,GACpB,MAAM,GACN,iBAAiB,GACjB,QAAQ,GACR,SAAS,GACT,oBAAoB,GACpB,WAAW,GACX,sBAAsB,GACtB,QAAQ,GACR,mBAAmB,GACnB,MAAM,CAAC;AAEX,KAAK,KAAK,GAAG,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAwFD,eAAO,MAAM,MAAM;;;cAlKH,CAAC;;;CAoShB,CAAC;AAEF,wBAAgB,YAAY,CAAC,OAAO,GAAE,aAAkB,GAAG,aAAa,CAWvE;AAED,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC"}
@@ -37,7 +37,43 @@ function createTailwindColors(prefix, cloneToGlobal) {
37
37
  }
38
38
  return Object.fromEntries(v.entries());
39
39
  }
40
- export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default', layoutWidth = '100vw' } = {}) => {
40
+ function createTailwindUtilities(prefix) {
41
+ const append = prefix.length > 0 ? prefix + '-' : prefix;
42
+ return {
43
+ [`.${append}steps`]: {
44
+ 'counter-reset': 'step',
45
+ 'border-left-width': '1px',
46
+ 'margin-left': '1rem',
47
+ 'padding-left': '1.75rem',
48
+ position: 'relative',
49
+ },
50
+ [`.${append}step:before`]: {
51
+ 'background-color': `theme('colors.fd-secondary.DEFAULT')`,
52
+ color: `theme('colors.fd-secondary.foreground')`,
53
+ content: 'counter(step)',
54
+ 'counter-increment': 'step',
55
+ 'border-radius': `theme('borderRadius.full')`,
56
+ 'justify-content': 'center',
57
+ 'align-items': 'center',
58
+ width: '2rem',
59
+ height: '2rem',
60
+ 'font-size': '.875rem',
61
+ 'line-height': '1.25rem',
62
+ display: 'flex',
63
+ position: 'absolute',
64
+ left: '-1rem',
65
+ },
66
+ '.prose-no-margin': {
67
+ '& > :first-child': {
68
+ marginTop: '0',
69
+ },
70
+ '& > :last-child': {
71
+ marginBottom: '0',
72
+ },
73
+ },
74
+ };
75
+ }
76
+ export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default', layoutWidth = '100vw', addGlobalUtils = true, } = {}) => {
41
77
  return ({ addBase, addComponents, addUtilities }) => {
42
78
  const { light, dark, css } = typeof preset === 'string' ? presets[preset] : preset;
43
79
  addBase({
@@ -118,39 +154,10 @@ export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default'
118
154
  borderRadius: '2px',
119
155
  },
120
156
  });
121
- addUtilities({
122
- '.steps': {
123
- 'counter-reset': 'step',
124
- 'border-left-width': '1px',
125
- 'margin-left': '1rem',
126
- 'padding-left': '1.75rem',
127
- position: 'relative',
128
- },
129
- '.step:before': {
130
- 'background-color': `theme('colors.fd-secondary.DEFAULT')`,
131
- color: `theme('colors.fd-secondary.foreground')`,
132
- content: 'counter(step)',
133
- 'counter-increment': 'step',
134
- 'border-radius': `theme('borderRadius.full')`,
135
- 'justify-content': 'center',
136
- 'align-items': 'center',
137
- width: '2rem',
138
- height: '2rem',
139
- 'font-size': '.875rem',
140
- 'line-height': '1.25rem',
141
- display: 'flex',
142
- position: 'absolute',
143
- left: '-1rem',
144
- },
145
- '.prose-no-margin': {
146
- '& > :first-child': {
147
- marginTop: '0',
148
- },
149
- '& > :last-child': {
150
- marginBottom: '0',
151
- },
152
- },
153
- });
157
+ if (addGlobalUtils) {
158
+ addUtilities(createTailwindUtilities(''));
159
+ }
160
+ addUtilities(createTailwindUtilities('fd'));
154
161
  };
155
162
  }, ({ cssPrefix = 'fd', modifyContainer = true, addGlobalColors = false, } = {}) => ({
156
163
  theme: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "14.7.4",
3
+ "version": "14.7.5",
4
4
  "description": "The framework for building a documentation website in Next.js",
5
5
  "keywords": [
6
6
  "NextJs",
@@ -63,34 +63,34 @@
63
63
  "@radix-ui/react-tabs": "^1.1.2",
64
64
  "class-variance-authority": "^0.7.1",
65
65
  "lodash.merge": "^4.6.2",
66
- "lucide-react": "^0.471.1",
66
+ "lucide-react": "^0.473.0",
67
67
  "next-themes": "^0.4.4",
68
68
  "postcss-selector-parser": "^7.0.0",
69
69
  "react-medium-image-zoom": "^5.2.13",
70
70
  "tailwind-merge": "^2.6.0"
71
71
  },
72
72
  "devDependencies": {
73
- "@next/eslint-plugin-next": "^15.1.4",
73
+ "@next/eslint-plugin-next": "^15.1.5",
74
74
  "@types/lodash.merge": "^4.6.9",
75
75
  "@types/react": "^19.0.7",
76
76
  "@types/react-dom": "^19.0.3",
77
77
  "autoprefixer": "^10.4.20",
78
- "next": "15.1.4",
78
+ "next": "15.1.5",
79
79
  "postcss": "^8.5.1",
80
80
  "postcss-cli": "^11.0.0",
81
81
  "tailwindcss": "^3.4.17",
82
82
  "tsc-alias": "^1.8.10",
83
- "@fumadocs/cli": "0.0.7",
84
83
  "eslint-config-custom": "0.0.0",
85
- "fumadocs-core": "14.7.4",
86
- "tsconfig": "0.0.0"
84
+ "fumadocs-core": "14.7.5",
85
+ "tsconfig": "0.0.0",
86
+ "@fumadocs/cli": "0.0.7"
87
87
  },
88
88
  "peerDependencies": {
89
89
  "next": "14.x.x || 15.x.x",
90
90
  "react": "18.x.x || 19.x.x",
91
91
  "react-dom": "18.x.x || 19.x.x",
92
92
  "tailwindcss": "^3.4.14",
93
- "fumadocs-core": "14.7.4"
93
+ "fumadocs-core": "14.7.5"
94
94
  },
95
95
  "peerDependenciesMeta": {
96
96
  "tailwindcss": {