@fumadocs/base-ui 16.4.0 → 16.4.2

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.
Files changed (265) hide show
  1. package/dist/_virtual/rolldown_runtime.js +36 -0
  2. package/dist/components/accordion.d.ts +23 -7
  3. package/dist/components/accordion.d.ts.map +1 -1
  4. package/dist/components/accordion.js +66 -36
  5. package/dist/components/accordion.js.map +1 -0
  6. package/dist/components/banner.d.ts +33 -22
  7. package/dist/components/banner.d.ts.map +1 -1
  8. package/dist/components/banner.js +63 -47
  9. package/dist/components/banner.js.map +1 -0
  10. package/dist/components/callout.d.ts +41 -17
  11. package/dist/components/callout.d.ts.map +1 -1
  12. package/dist/components/callout.js +57 -28
  13. package/dist/components/callout.js.map +1 -0
  14. package/dist/components/card.d.ts +19 -9
  15. package/dist/components/card.d.ts.map +1 -1
  16. package/dist/components/card.js +39 -8
  17. package/dist/components/card.js.map +1 -0
  18. package/dist/components/codeblock.d.ts +66 -40
  19. package/dist/components/codeblock.d.ts.map +1 -1
  20. package/dist/components/codeblock.js +116 -58
  21. package/dist/components/codeblock.js.map +1 -0
  22. package/dist/components/dialog/search-algolia.d.ts +37 -23
  23. package/dist/components/dialog/search-algolia.d.ts.map +1 -1
  24. package/dist/components/dialog/search-algolia.js +64 -31
  25. package/dist/components/dialog/search-algolia.js.map +1 -0
  26. package/dist/components/dialog/search-default.d.ts +42 -27
  27. package/dist/components/dialog/search-default.d.ts.map +1 -1
  28. package/dist/components/dialog/search-default.js +64 -38
  29. package/dist/components/dialog/search-default.js.map +1 -0
  30. package/dist/components/dialog/search-orama.d.ts +41 -25
  31. package/dist/components/dialog/search-orama.d.ts.map +1 -1
  32. package/dist/components/dialog/search-orama.js +68 -35
  33. package/dist/components/dialog/search-orama.js.map +1 -0
  34. package/dist/components/dialog/search.d.ts +107 -64
  35. package/dist/components/dialog/search.d.ts.map +1 -1
  36. package/dist/components/dialog/search.js +264 -185
  37. package/dist/components/dialog/search.js.map +1 -0
  38. package/dist/components/dynamic-codeblock.d.ts +30 -19
  39. package/dist/components/dynamic-codeblock.d.ts.map +1 -1
  40. package/dist/components/dynamic-codeblock.js +60 -27
  41. package/dist/components/dynamic-codeblock.js.map +1 -0
  42. package/dist/components/files.d.ts +32 -16
  43. package/dist/components/files.d.ts.map +1 -1
  44. package/dist/components/files.js +40 -14
  45. package/dist/components/files.js.map +1 -0
  46. package/dist/components/github-info.d.ts +18 -7
  47. package/dist/components/github-info.d.ts.map +1 -1
  48. package/dist/components/github-info.js +63 -48
  49. package/dist/components/github-info.js.map +1 -0
  50. package/dist/components/heading.d.ts +11 -4
  51. package/dist/components/heading.d.ts.map +1 -1
  52. package/dist/components/heading.js +28 -8
  53. package/dist/components/heading.js.map +1 -0
  54. package/dist/components/image-zoom-CtfZieBH.css +80 -0
  55. package/dist/components/image-zoom-CtfZieBH.css.map +1 -0
  56. package/dist/components/image-zoom.d.ts +23 -14
  57. package/dist/components/image-zoom.d.ts.map +1 -1
  58. package/dist/components/image-zoom.js +32 -19
  59. package/dist/components/image-zoom.js.map +1 -0
  60. package/dist/components/image-zoom2.js +1 -0
  61. package/dist/components/inline-toc.d.ts +15 -6
  62. package/dist/components/inline-toc.d.ts.map +1 -1
  63. package/dist/components/inline-toc.js +28 -8
  64. package/dist/components/inline-toc.js.map +1 -0
  65. package/dist/components/sidebar/base.d.ts +105 -65
  66. package/dist/components/sidebar/base.d.ts.map +1 -1
  67. package/dist/components/sidebar/base.js +278 -191
  68. package/dist/components/sidebar/base.js.map +1 -0
  69. package/dist/components/sidebar/link-item.d.ts +23 -10
  70. package/dist/components/sidebar/link-item.d.ts.map +1 -1
  71. package/dist/components/sidebar/link-item.js +32 -12
  72. package/dist/components/sidebar/link-item.js.map +1 -0
  73. package/dist/components/sidebar/page-tree.d.ts +28 -17
  74. package/dist/components/sidebar/page-tree.d.ts.map +1 -1
  75. package/dist/components/sidebar/page-tree.js +57 -33
  76. package/dist/components/sidebar/page-tree.js.map +1 -0
  77. package/dist/components/sidebar/tabs/dropdown.d.ts +18 -9
  78. package/dist/components/sidebar/tabs/dropdown.d.ts.map +1 -1
  79. package/dist/components/sidebar/tabs/dropdown.js +75 -31
  80. package/dist/components/sidebar/tabs/dropdown.js.map +1 -0
  81. package/dist/components/sidebar/tabs/index.d.ts +24 -18
  82. package/dist/components/sidebar/tabs/index.d.ts.map +1 -1
  83. package/dist/components/sidebar/tabs/index.js +45 -45
  84. package/dist/components/sidebar/tabs/index.js.map +1 -0
  85. package/dist/components/steps.d.ts +16 -7
  86. package/dist/components/steps.d.ts.map +1 -1
  87. package/dist/components/steps.js +17 -5
  88. package/dist/components/steps.js.map +1 -0
  89. package/dist/components/tabs.d.ts +49 -28
  90. package/dist/components/tabs.d.ts.map +1 -1
  91. package/dist/components/tabs.js +88 -51
  92. package/dist/components/tabs.js.map +1 -0
  93. package/dist/components/toc/clerk.d.ts +1 -2
  94. package/dist/components/toc/clerk.js +12 -1
  95. package/dist/components/toc/clerk.js.map +1 -0
  96. package/dist/components/toc/default.d.ts +1 -2
  97. package/dist/components/toc/default.js +12 -1
  98. package/dist/components/toc/default.js.map +1 -0
  99. package/dist/components/toc/index.d.ts +1 -2
  100. package/dist/components/toc/index.js +12 -1
  101. package/dist/components/toc/index.js.map +1 -0
  102. package/dist/components/type-table.d.ts +36 -29
  103. package/dist/components/type-table.d.ts.map +1 -1
  104. package/dist/components/type-table.js +106 -25
  105. package/dist/components/type-table.js.map +1 -0
  106. package/dist/components/ui/accordion.d.ts +30 -7
  107. package/dist/components/ui/accordion.d.ts.map +1 -1
  108. package/dist/components/ui/accordion.js +39 -14
  109. package/dist/components/ui/accordion.js.map +1 -0
  110. package/dist/components/ui/button.d.ts +12 -7
  111. package/dist/components/ui/button.d.ts.map +1 -1
  112. package/dist/components/ui/button.js +21 -18
  113. package/dist/components/ui/button.js.map +1 -0
  114. package/dist/components/ui/collapsible.d.ts +19 -8
  115. package/dist/components/ui/collapsible.d.ts.map +1 -1
  116. package/dist/components/ui/collapsible.js +18 -7
  117. package/dist/components/ui/collapsible.js.map +1 -0
  118. package/dist/components/ui/navigation-menu.d.ts +15 -11
  119. package/dist/components/ui/navigation-menu.d.ts.map +1 -1
  120. package/dist/components/ui/navigation-menu.js +33 -14
  121. package/dist/components/ui/navigation-menu.js.map +1 -0
  122. package/dist/components/ui/popover.d.ts +11 -7
  123. package/dist/components/ui/popover.d.ts.map +1 -1
  124. package/dist/components/ui/popover.js +26 -10
  125. package/dist/components/ui/popover.js.map +1 -0
  126. package/dist/components/ui/scroll-area.d.ts +11 -7
  127. package/dist/components/ui/scroll-area.d.ts.map +1 -1
  128. package/dist/components/ui/scroll-area.js +35 -10
  129. package/dist/components/ui/scroll-area.js.map +1 -0
  130. package/dist/components/ui/tabs.d.ts +39 -20
  131. package/dist/components/ui/tabs.d.ts.map +1 -1
  132. package/dist/components/ui/tabs.js +75 -73
  133. package/dist/components/ui/tabs.js.map +1 -0
  134. package/dist/contexts/i18n.d.ts +1 -2
  135. package/dist/contexts/i18n.js +12 -1
  136. package/dist/contexts/i18n.js.map +1 -0
  137. package/dist/contexts/search.d.ts +7 -1
  138. package/dist/contexts/search.d.ts.map +1 -1
  139. package/dist/contexts/search.js +12 -1
  140. package/dist/contexts/search.js.map +1 -0
  141. package/dist/contexts/tree.d.ts +1 -2
  142. package/dist/contexts/tree.js +12 -1
  143. package/dist/contexts/tree.js.map +1 -0
  144. package/dist/i18n.d.ts +1 -2
  145. package/dist/i18n.js +3 -1
  146. package/dist/layouts/docs/client.d.ts +30 -13
  147. package/dist/layouts/docs/client.d.ts.map +1 -1
  148. package/dist/layouts/docs/client.js +61 -34
  149. package/dist/layouts/docs/client.js.map +1 -0
  150. package/dist/layouts/docs/index.d.ts +55 -32
  151. package/dist/layouts/docs/index.d.ts.map +1 -1
  152. package/dist/layouts/docs/index.js +177 -68
  153. package/dist/layouts/docs/index.js.map +1 -0
  154. package/dist/layouts/docs/page/client.d.ts +43 -21
  155. package/dist/layouts/docs/page/client.d.ts.map +1 -1
  156. package/dist/layouts/docs/page/client.js +213 -105
  157. package/dist/layouts/docs/page/client.js.map +1 -0
  158. package/dist/layouts/docs/page/index.d.ts +82 -46
  159. package/dist/layouts/docs/page/index.d.ts.map +1 -1
  160. package/dist/layouts/docs/page/index.js +98 -45
  161. package/dist/layouts/docs/page/index.js.map +1 -0
  162. package/dist/layouts/docs/sidebar.d.ts +62 -16
  163. package/dist/layouts/docs/sidebar.d.ts.map +1 -1
  164. package/dist/layouts/docs/sidebar.js +150 -82
  165. package/dist/layouts/docs/sidebar.js.map +1 -0
  166. package/dist/layouts/home/client.d.ts +18 -5
  167. package/dist/layouts/home/client.d.ts.map +1 -1
  168. package/dist/layouts/home/client.js +273 -126
  169. package/dist/layouts/home/client.js.map +1 -0
  170. package/dist/layouts/home/index.d.ts +10 -5
  171. package/dist/layouts/home/index.d.ts.map +1 -1
  172. package/dist/layouts/home/index.js +24 -7
  173. package/dist/layouts/home/index.js.map +1 -0
  174. package/dist/layouts/home/navbar.d.ts +19 -6
  175. package/dist/layouts/home/navbar.d.ts.map +1 -1
  176. package/dist/layouts/home/navbar.js +31 -12
  177. package/dist/layouts/home/navbar.js.map +1 -0
  178. package/dist/layouts/notebook/client.d.ts +44 -20
  179. package/dist/layouts/notebook/client.d.ts.map +1 -1
  180. package/dist/layouts/notebook/client.js +148 -93
  181. package/dist/layouts/notebook/client.js.map +1 -0
  182. package/dist/layouts/notebook/index.d.ts +34 -30
  183. package/dist/layouts/notebook/index.d.ts.map +1 -1
  184. package/dist/layouts/notebook/index.js +216 -90
  185. package/dist/layouts/notebook/index.js.map +1 -0
  186. package/dist/layouts/notebook/page/client.d.ts +43 -21
  187. package/dist/layouts/notebook/page/client.d.ts.map +1 -1
  188. package/dist/layouts/notebook/page/client.js +213 -105
  189. package/dist/layouts/notebook/page/client.js.map +1 -0
  190. package/dist/layouts/notebook/page/index.d.ts +82 -46
  191. package/dist/layouts/notebook/page/index.d.ts.map +1 -1
  192. package/dist/layouts/notebook/page/index.js +98 -45
  193. package/dist/layouts/notebook/page/index.js.map +1 -0
  194. package/dist/layouts/notebook/sidebar.d.ts +58 -16
  195. package/dist/layouts/notebook/sidebar.d.ts.map +1 -1
  196. package/dist/layouts/notebook/sidebar.js +121 -79
  197. package/dist/layouts/notebook/sidebar.js.map +1 -0
  198. package/dist/layouts/shared/index.d.ts +62 -50
  199. package/dist/layouts/shared/index.d.ts.map +1 -1
  200. package/dist/layouts/shared/index.js +36 -20
  201. package/dist/layouts/shared/index.js.map +1 -0
  202. package/dist/layouts/shared/language-toggle.d.ts +9 -4
  203. package/dist/layouts/shared/language-toggle.d.ts.map +1 -1
  204. package/dist/layouts/shared/language-toggle.js +44 -21
  205. package/dist/layouts/shared/language-toggle.js.map +1 -0
  206. package/dist/layouts/shared/search-toggle.d.ts +20 -8
  207. package/dist/layouts/shared/search-toggle.d.ts.map +1 -1
  208. package/dist/layouts/shared/search-toggle.js +53 -24
  209. package/dist/layouts/shared/search-toggle.js.map +1 -0
  210. package/dist/layouts/shared/theme-toggle.d.ts +13 -4
  211. package/dist/layouts/shared/theme-toggle.d.ts.map +1 -1
  212. package/dist/layouts/shared/theme-toggle.js +58 -34
  213. package/dist/layouts/shared/theme-toggle.js.map +1 -0
  214. package/dist/mdx.d.ts +34 -29
  215. package/dist/mdx.d.ts.map +1 -1
  216. package/dist/mdx.js +68 -34
  217. package/dist/mdx.js.map +1 -0
  218. package/dist/mdx.server.d.ts +9 -5
  219. package/dist/mdx.server.d.ts.map +1 -1
  220. package/dist/mdx.server.js +21 -13
  221. package/dist/mdx.server.js.map +1 -0
  222. package/dist/og.d.ts +1 -2
  223. package/dist/og.js +3 -1
  224. package/dist/page.d.ts +30 -20
  225. package/dist/page.d.ts.map +1 -1
  226. package/dist/page.js +34 -18
  227. package/dist/page.js.map +1 -0
  228. package/dist/provider/base.d.ts +44 -34
  229. package/dist/provider/base.d.ts.map +1 -1
  230. package/dist/provider/base.js +37 -17
  231. package/dist/provider/base.js.map +1 -0
  232. package/dist/provider/next.d.ts +20 -12
  233. package/dist/provider/next.d.ts.map +1 -1
  234. package/dist/provider/next.js +19 -5
  235. package/dist/provider/next.js.map +1 -0
  236. package/dist/provider/react-router.d.ts +20 -12
  237. package/dist/provider/react-router.d.ts.map +1 -1
  238. package/dist/provider/react-router.js +19 -5
  239. package/dist/provider/react-router.js.map +1 -0
  240. package/dist/provider/tanstack.d.ts +20 -12
  241. package/dist/provider/tanstack.d.ts.map +1 -1
  242. package/dist/provider/tanstack.js +19 -5
  243. package/dist/provider/tanstack.js.map +1 -0
  244. package/dist/provider/waku.d.ts +20 -12
  245. package/dist/provider/waku.d.ts.map +1 -1
  246. package/dist/provider/waku.js +19 -5
  247. package/dist/provider/waku.js.map +1 -0
  248. package/dist/style.css +24 -6
  249. package/dist/utils/use-copy-button.d.ts +1 -2
  250. package/dist/utils/use-copy-button.js +3 -1
  251. package/dist/utils/use-footer-items.d.ts +1 -2
  252. package/dist/utils/use-footer-items.js +3 -1
  253. package/dist/utils/use-is-scroll-top.d.ts +1 -2
  254. package/dist/utils/use-is-scroll-top.js +3 -1
  255. package/package.json +47 -48
  256. package/dist/components/toc/clerk.d.ts.map +0 -1
  257. package/dist/components/toc/default.d.ts.map +0 -1
  258. package/dist/components/toc/index.d.ts.map +0 -1
  259. package/dist/contexts/i18n.d.ts.map +0 -1
  260. package/dist/contexts/tree.d.ts.map +0 -1
  261. package/dist/i18n.d.ts.map +0 -1
  262. package/dist/og.d.ts.map +0 -1
  263. package/dist/utils/use-copy-button.d.ts.map +0 -1
  264. package/dist/utils/use-footer-items.d.ts.map +0 -1
  265. package/dist/utils/use-is-scroll-top.d.ts.map +0 -1
@@ -1,197 +1,284 @@
1
1
  'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { ChevronDown, ExternalLink } from '@fumadocs/ui/icons';
4
- import { createContext, use, useEffect, useMemo, useRef, useState, } from 'react';
5
- import Link from 'fumadocs-core/link';
6
- import { useOnChange } from 'fumadocs-core/utils/use-on-change';
7
- import { cn } from '@fumadocs/ui/cn';
8
- import { ScrollArea, ScrollViewport, } from '../../components/ui/scroll-area.js';
9
- import { isActive } from '@fumadocs/ui/urls';
10
- import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../../components/ui/collapsible.js';
11
- import { useMediaQuery } from 'fumadocs-core/utils/use-media-query';
12
- import scrollIntoView from 'scroll-into-view-if-needed';
13
- import { usePathname } from 'fumadocs-core/framework';
14
- import ReactDOM from 'react-dom';
2
+
3
+ import { __exportAll } from "../../_virtual/rolldown_runtime.js";
4
+ import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../ui/collapsible.js";
5
+ import { ScrollArea, ScrollViewport } from "../ui/scroll-area.js";
6
+ import Link from "fumadocs-core/link";
7
+ import { usePathname } from "fumadocs-core/framework";
8
+ import { cn } from "@fumadocs/ui/cn";
9
+ import { jsx, jsxs } from "react/jsx-runtime";
10
+ import { ChevronDown, ExternalLink } from "lucide-react";
11
+ import { createContext, use, useEffect, useMemo, useRef, useState } from "react";
12
+ import { isActive } from "@fumadocs/ui/urls";
13
+ import { useOnChange } from "fumadocs-core/utils/use-on-change";
14
+ import { useMediaQuery } from "fumadocs-core/utils/use-media-query";
15
+ import scrollIntoView from "scroll-into-view-if-needed";
16
+ import ReactDOM from "react-dom";
17
+
18
+ //#region src/components/sidebar/base.tsx
19
+ var base_exports = /* @__PURE__ */ __exportAll({
20
+ SidebarCollapseTrigger: () => SidebarCollapseTrigger,
21
+ SidebarContent: () => SidebarContent,
22
+ SidebarDrawerContent: () => SidebarDrawerContent,
23
+ SidebarDrawerOverlay: () => SidebarDrawerOverlay,
24
+ SidebarFolder: () => SidebarFolder,
25
+ SidebarFolderContent: () => SidebarFolderContent,
26
+ SidebarFolderLink: () => SidebarFolderLink,
27
+ SidebarFolderTrigger: () => SidebarFolderTrigger,
28
+ SidebarItem: () => SidebarItem,
29
+ SidebarProvider: () => SidebarProvider,
30
+ SidebarSeparator: () => SidebarSeparator,
31
+ SidebarTrigger: () => SidebarTrigger,
32
+ SidebarViewport: () => SidebarViewport,
33
+ useFolder: () => useFolder,
34
+ useFolderDepth: () => useFolderDepth,
35
+ useSidebar: () => useSidebar
36
+ });
15
37
  const SidebarContext = createContext(null);
16
38
  const FolderContext = createContext(null);
17
- export function SidebarProvider({ defaultOpenLevel = 0, prefetch = true, children, }) {
18
- const closeOnRedirect = useRef(true);
19
- const [open, setOpen] = useState(false);
20
- const [collapsed, setCollapsed] = useState(false);
21
- const pathname = usePathname();
22
- const mode = useMediaQuery('(width < 768px)') ? 'drawer' : 'full';
23
- useOnChange(pathname, () => {
24
- if (closeOnRedirect.current) {
25
- setOpen(false);
26
- }
27
- closeOnRedirect.current = true;
28
- });
29
- return (_jsx(SidebarContext, { value: useMemo(() => ({
30
- open,
31
- setOpen,
32
- collapsed,
33
- setCollapsed,
34
- closeOnRedirect,
35
- defaultOpenLevel,
36
- prefetch,
37
- mode,
38
- }), [open, collapsed, defaultOpenLevel, prefetch, mode]), children: children }));
39
- }
40
- export function useSidebar() {
41
- const ctx = use(SidebarContext);
42
- if (!ctx)
43
- throw new Error('Missing SidebarContext, make sure you have wrapped the component in <DocsLayout /> and the context is available.');
44
- return ctx;
45
- }
46
- export function useFolder() {
47
- return use(FolderContext);
48
- }
49
- export function useFolderDepth() {
50
- return use(FolderContext)?.depth ?? 0;
51
- }
52
- export function SidebarContent({ children, }) {
53
- const { collapsed, mode } = useSidebar();
54
- const [hover, setHover] = useState(false);
55
- const ref = useRef(null);
56
- const timerRef = useRef(0);
57
- useOnChange(collapsed, () => {
58
- if (collapsed)
59
- setHover(false);
60
- });
61
- if (mode !== 'full')
62
- return;
63
- function shouldIgnoreHover(e) {
64
- const element = ref.current;
65
- if (!element)
66
- return true;
67
- return (!collapsed ||
68
- e.pointerType === 'touch' ||
69
- element.getAnimations().length > 0);
70
- }
71
- return children({
72
- ref,
73
- collapsed,
74
- hovered: hover,
75
- onPointerEnter(e) {
76
- if (shouldIgnoreHover(e))
77
- return;
78
- window.clearTimeout(timerRef.current);
79
- setHover(true);
80
- },
81
- onPointerLeave(e) {
82
- if (shouldIgnoreHover(e))
83
- return;
84
- window.clearTimeout(timerRef.current);
85
- timerRef.current = window.setTimeout(() => setHover(false),
86
- // if mouse is leaving the viewport, add a close delay
87
- Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100
88
- ? 0
89
- : 500);
90
- },
91
- });
92
- }
93
- export function SidebarDrawerOverlay(props) {
94
- const { open, setOpen, mode } = useSidebar();
95
- const [hidden, setHidden] = useState(!open);
96
- if (open && hidden)
97
- setHidden(false);
98
- if (mode !== 'drawer' || hidden)
99
- return;
100
- return (_jsx("div", { "data-state": open ? 'open' : 'closed', onClick: () => setOpen(false), onAnimationEnd: () => {
101
- if (!open)
102
- ReactDOM.flushSync(() => setHidden(true));
103
- }, ...props }));
104
- }
105
- export function SidebarDrawerContent({ className, children, ...props }) {
106
- const { open, mode } = useSidebar();
107
- const [hidden, setHidden] = useState(!open);
108
- if (open && hidden)
109
- setHidden(false);
110
- if (mode !== 'drawer')
111
- return;
112
- return (_jsx("aside", { id: "nd-sidebar-mobile", "data-state": open ? 'open' : 'closed', className: cn(hidden && 'invisible', className), onAnimationEnd: () => {
113
- if (!open)
114
- ReactDOM.flushSync(() => setHidden(true));
115
- }, ...props, children: children }));
116
- }
117
- export function SidebarViewport({ className, ...props }) {
118
- return (_jsx(ScrollArea, { className: (s) => cn('min-h-0 flex-1', typeof className === 'function' ? className(s) : className), ...props, children: _jsx(ScrollViewport, { className: "p-4 overscroll-contain", style: {
119
- maskImage: 'linear-gradient(to bottom, transparent, white 12px, white calc(100% - 12px), transparent)',
120
- }, children: props.children }) }));
121
- }
122
- export function SidebarSeparator(props) {
123
- const depth = useFolderDepth();
124
- return (_jsx("p", { ...props, className: cn('inline-flex items-center gap-2 mb-1.5 px-2 mt-6 empty:mb-0', depth === 0 && 'first:mt-0', props.className), children: props.children }));
125
- }
126
- export function SidebarItem({ icon, children, ...props }) {
127
- const pathname = usePathname();
128
- const ref = useRef(null);
129
- const { prefetch } = useSidebar();
130
- const active = props.href !== undefined && isActive(props.href, pathname, false);
131
- useAutoScroll(active, ref);
132
- return (_jsxs(Link, { ref: ref, "data-active": active, prefetch: prefetch, ...props, children: [icon ?? (props.external ? _jsx(ExternalLink, {}) : null), children] }));
133
- }
134
- export function SidebarFolder({ defaultOpen: defaultOpenProp, collapsible = true, active = false, children, ...props }) {
135
- const { defaultOpenLevel } = useSidebar();
136
- const depth = useFolderDepth() + 1;
137
- const defaultOpen = collapsible === false ||
138
- active ||
139
- (defaultOpenProp ?? defaultOpenLevel >= depth);
140
- const [open, setOpen] = useState(defaultOpen);
141
- useOnChange(defaultOpen, (v) => {
142
- if (v)
143
- setOpen(v);
144
- });
145
- return (_jsx(Collapsible, { open: open, onOpenChange: setOpen, disabled: !collapsible, ...props, children: _jsx(FolderContext, { value: useMemo(() => ({ open, setOpen, depth, collapsible }), [collapsible, depth, open]), children: children }) }));
146
- }
147
- export function SidebarFolderTrigger({ children, ...props }) {
148
- const { open, collapsible } = use(FolderContext);
149
- if (collapsible) {
150
- return (_jsxs(CollapsibleTrigger, { ...props, children: [children, _jsx(ChevronDown, { "data-icon": true, className: cn('ms-auto transition-transform', !open && '-rotate-90') })] }));
151
- }
152
- return _jsx("div", { ...props, children: children });
153
- }
154
- export function SidebarFolderLink({ children, ...props }) {
155
- const ref = useRef(null);
156
- const { open, setOpen, collapsible } = use(FolderContext);
157
- const { prefetch } = useSidebar();
158
- const pathname = usePathname();
159
- const active = props.href !== undefined && isActive(props.href, pathname, false);
160
- useAutoScroll(active, ref);
161
- return (_jsxs(Link, { ref: ref, "data-active": active, onClick: (e) => {
162
- if (!collapsible)
163
- return;
164
- if (e.target instanceof Element &&
165
- e.target.matches('[data-icon], [data-icon] *')) {
166
- setOpen(!open);
167
- e.preventDefault();
168
- }
169
- else {
170
- setOpen(active ? !open : true);
171
- }
172
- }, prefetch: prefetch, ...props, children: [children, collapsible && (_jsx(ChevronDown, { "data-icon": true, className: cn('ms-auto transition-transform', !open && '-rotate-90') }))] }));
173
- }
174
- export function SidebarFolderContent(props) {
175
- return _jsx(CollapsibleContent, { ...props, children: props.children });
176
- }
177
- export function SidebarTrigger({ children, ...props }) {
178
- const { setOpen } = useSidebar();
179
- return (_jsx("button", { "aria-label": "Open Sidebar", onClick: () => setOpen((prev) => !prev), ...props, children: children }));
180
- }
181
- export function SidebarCollapseTrigger(props) {
182
- const { collapsed, setCollapsed } = useSidebar();
183
- return (_jsx("button", { type: "button", "aria-label": "Collapse Sidebar", "data-collapsed": collapsed, onClick: () => {
184
- setCollapsed((prev) => !prev);
185
- }, ...props, children: props.children }));
39
+ function SidebarProvider({ defaultOpenLevel = 0, prefetch = true, children }) {
40
+ const closeOnRedirect = useRef(true);
41
+ const [open, setOpen] = useState(false);
42
+ const [collapsed, setCollapsed] = useState(false);
43
+ const pathname = usePathname();
44
+ const mode = useMediaQuery("(width < 768px)") ? "drawer" : "full";
45
+ useOnChange(pathname, () => {
46
+ if (closeOnRedirect.current) setOpen(false);
47
+ closeOnRedirect.current = true;
48
+ });
49
+ return /* @__PURE__ */ jsx(SidebarContext, {
50
+ value: useMemo(() => ({
51
+ open,
52
+ setOpen,
53
+ collapsed,
54
+ setCollapsed,
55
+ closeOnRedirect,
56
+ defaultOpenLevel,
57
+ prefetch,
58
+ mode
59
+ }), [
60
+ open,
61
+ collapsed,
62
+ defaultOpenLevel,
63
+ prefetch,
64
+ mode
65
+ ]),
66
+ children
67
+ });
68
+ }
69
+ function useSidebar() {
70
+ const ctx = use(SidebarContext);
71
+ if (!ctx) throw new Error("Missing SidebarContext, make sure you have wrapped the component in <DocsLayout /> and the context is available.");
72
+ return ctx;
73
+ }
74
+ function useFolder() {
75
+ return use(FolderContext);
76
+ }
77
+ function useFolderDepth() {
78
+ return use(FolderContext)?.depth ?? 0;
79
+ }
80
+ function SidebarContent({ children }) {
81
+ const { collapsed, mode } = useSidebar();
82
+ const [hover, setHover] = useState(false);
83
+ const ref = useRef(null);
84
+ const timerRef = useRef(0);
85
+ useOnChange(collapsed, () => {
86
+ if (collapsed) setHover(false);
87
+ });
88
+ if (mode !== "full") return;
89
+ function shouldIgnoreHover(e) {
90
+ const element = ref.current;
91
+ if (!element) return true;
92
+ return !collapsed || e.pointerType === "touch" || element.getAnimations().length > 0;
93
+ }
94
+ return children({
95
+ ref,
96
+ collapsed,
97
+ hovered: hover,
98
+ onPointerEnter(e) {
99
+ if (shouldIgnoreHover(e)) return;
100
+ window.clearTimeout(timerRef.current);
101
+ setHover(true);
102
+ },
103
+ onPointerLeave(e) {
104
+ if (shouldIgnoreHover(e)) return;
105
+ window.clearTimeout(timerRef.current);
106
+ timerRef.current = window.setTimeout(() => setHover(false), Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100 ? 0 : 500);
107
+ }
108
+ });
109
+ }
110
+ function SidebarDrawerOverlay(props) {
111
+ const { open, setOpen, mode } = useSidebar();
112
+ const [hidden, setHidden] = useState(!open);
113
+ if (open && hidden) setHidden(false);
114
+ if (mode !== "drawer" || hidden) return;
115
+ return /* @__PURE__ */ jsx("div", {
116
+ "data-state": open ? "open" : "closed",
117
+ onClick: () => setOpen(false),
118
+ onAnimationEnd: () => {
119
+ if (!open) ReactDOM.flushSync(() => setHidden(true));
120
+ },
121
+ ...props
122
+ });
123
+ }
124
+ function SidebarDrawerContent({ className, children, ...props }) {
125
+ const { open, mode } = useSidebar();
126
+ const [hidden, setHidden] = useState(!open);
127
+ if (open && hidden) setHidden(false);
128
+ if (mode !== "drawer") return;
129
+ return /* @__PURE__ */ jsx("aside", {
130
+ id: "nd-sidebar-mobile",
131
+ "data-state": open ? "open" : "closed",
132
+ className: cn(hidden && "invisible", className),
133
+ onAnimationEnd: () => {
134
+ if (!open) ReactDOM.flushSync(() => setHidden(true));
135
+ },
136
+ ...props,
137
+ children
138
+ });
139
+ }
140
+ function SidebarViewport({ className, ...props }) {
141
+ return /* @__PURE__ */ jsx(ScrollArea, {
142
+ className: (s) => cn("min-h-0 flex-1", typeof className === "function" ? className(s) : className),
143
+ ...props,
144
+ children: /* @__PURE__ */ jsx(ScrollViewport, {
145
+ className: "p-4 overscroll-contain",
146
+ style: { maskImage: "linear-gradient(to bottom, transparent, white 12px, white calc(100% - 12px), transparent)" },
147
+ children: props.children
148
+ })
149
+ });
150
+ }
151
+ function SidebarSeparator(props) {
152
+ const depth = useFolderDepth();
153
+ return /* @__PURE__ */ jsx("p", {
154
+ ...props,
155
+ className: cn("inline-flex items-center gap-2 mb-1.5 px-2 mt-6 empty:mb-0", depth === 0 && "first:mt-0", props.className),
156
+ children: props.children
157
+ });
158
+ }
159
+ function SidebarItem({ icon, children, ...props }) {
160
+ const pathname = usePathname();
161
+ const ref = useRef(null);
162
+ const { prefetch } = useSidebar();
163
+ const active = props.href !== void 0 && isActive(props.href, pathname, false);
164
+ useAutoScroll(active, ref);
165
+ return /* @__PURE__ */ jsxs(Link, {
166
+ ref,
167
+ "data-active": active,
168
+ prefetch,
169
+ ...props,
170
+ children: [icon ?? (props.external ? /* @__PURE__ */ jsx(ExternalLink, {}) : null), children]
171
+ });
172
+ }
173
+ function SidebarFolder({ defaultOpen: defaultOpenProp, collapsible = true, active = false, children, ...props }) {
174
+ const { defaultOpenLevel } = useSidebar();
175
+ const depth = useFolderDepth() + 1;
176
+ const defaultOpen = collapsible === false || active || (defaultOpenProp ?? defaultOpenLevel >= depth);
177
+ const [open, setOpen] = useState(defaultOpen);
178
+ useOnChange(defaultOpen, (v) => {
179
+ if (v) setOpen(v);
180
+ });
181
+ return /* @__PURE__ */ jsx(Collapsible, {
182
+ open,
183
+ onOpenChange: setOpen,
184
+ disabled: !collapsible,
185
+ ...props,
186
+ children: /* @__PURE__ */ jsx(FolderContext, {
187
+ value: useMemo(() => ({
188
+ open,
189
+ setOpen,
190
+ depth,
191
+ collapsible
192
+ }), [
193
+ collapsible,
194
+ depth,
195
+ open
196
+ ]),
197
+ children
198
+ })
199
+ });
200
+ }
201
+ function SidebarFolderTrigger({ children, ...props }) {
202
+ const { open, collapsible } = use(FolderContext);
203
+ if (collapsible) return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
204
+ ...props,
205
+ children: [children, /* @__PURE__ */ jsx(ChevronDown, {
206
+ "data-icon": true,
207
+ className: cn("ms-auto transition-transform", !open && "-rotate-90")
208
+ })]
209
+ });
210
+ return /* @__PURE__ */ jsx("div", {
211
+ ...props,
212
+ children
213
+ });
214
+ }
215
+ function SidebarFolderLink({ children, ...props }) {
216
+ const ref = useRef(null);
217
+ const { open, setOpen, collapsible } = use(FolderContext);
218
+ const { prefetch } = useSidebar();
219
+ const pathname = usePathname();
220
+ const active = props.href !== void 0 && isActive(props.href, pathname, false);
221
+ useAutoScroll(active, ref);
222
+ return /* @__PURE__ */ jsxs(Link, {
223
+ ref,
224
+ "data-active": active,
225
+ onClick: (e) => {
226
+ if (!collapsible) return;
227
+ if (e.target instanceof Element && e.target.matches("[data-icon], [data-icon] *")) {
228
+ setOpen(!open);
229
+ e.preventDefault();
230
+ } else setOpen(active ? !open : true);
231
+ },
232
+ prefetch,
233
+ ...props,
234
+ children: [children, collapsible && /* @__PURE__ */ jsx(ChevronDown, {
235
+ "data-icon": true,
236
+ className: cn("ms-auto transition-transform", !open && "-rotate-90")
237
+ })]
238
+ });
239
+ }
240
+ function SidebarFolderContent(props) {
241
+ return /* @__PURE__ */ jsx(CollapsibleContent, {
242
+ ...props,
243
+ children: props.children
244
+ });
245
+ }
246
+ function SidebarTrigger({ children, ...props }) {
247
+ const { setOpen } = useSidebar();
248
+ return /* @__PURE__ */ jsx("button", {
249
+ "aria-label": "Open Sidebar",
250
+ onClick: () => setOpen((prev) => !prev),
251
+ ...props,
252
+ children
253
+ });
254
+ }
255
+ function SidebarCollapseTrigger(props) {
256
+ const { collapsed, setCollapsed } = useSidebar();
257
+ return /* @__PURE__ */ jsx("button", {
258
+ type: "button",
259
+ "aria-label": "Collapse Sidebar",
260
+ "data-collapsed": collapsed,
261
+ onClick: () => {
262
+ setCollapsed((prev) => !prev);
263
+ },
264
+ ...props,
265
+ children: props.children
266
+ });
186
267
  }
187
268
  function useAutoScroll(active, ref) {
188
- const { mode } = useSidebar();
189
- useEffect(() => {
190
- if (active && ref.current) {
191
- scrollIntoView(ref.current, {
192
- boundary: document.getElementById(mode === 'drawer' ? 'nd-sidebar-mobile' : 'nd-sidebar'),
193
- scrollMode: 'if-needed',
194
- });
195
- }
196
- }, [active, mode, ref]);
269
+ const { mode } = useSidebar();
270
+ useEffect(() => {
271
+ if (active && ref.current) scrollIntoView(ref.current, {
272
+ boundary: document.getElementById(mode === "drawer" ? "nd-sidebar-mobile" : "nd-sidebar"),
273
+ scrollMode: "if-needed"
274
+ });
275
+ }, [
276
+ active,
277
+ mode,
278
+ ref
279
+ ]);
197
280
  }
281
+
282
+ //#endregion
283
+ export { SidebarCollapseTrigger, SidebarContent, SidebarDrawerContent, SidebarDrawerOverlay, SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, SidebarProvider, SidebarSeparator, SidebarTrigger, SidebarViewport, base_exports, useFolder, useFolderDepth, useSidebar };
284
+ //# sourceMappingURL=base.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"base.js","names":["mode: Mode"],"sources":["../../../src/components/sidebar/base.tsx"],"sourcesContent":["'use client';\nimport { ChevronDown, ExternalLink } from 'lucide-react';\nimport {\n type ComponentProps,\n createContext,\n type PointerEvent,\n type ReactNode,\n type RefObject,\n use,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport Link, { type LinkProps } from 'fumadocs-core/link';\nimport { useOnChange } from 'fumadocs-core/utils/use-on-change';\nimport { cn } from '@fumadocs/ui/cn';\nimport { ScrollArea, type ScrollAreaProps, ScrollViewport } from '@/components/ui/scroll-area';\nimport { isActive } from '@fumadocs/ui/urls';\nimport {\n Collapsible,\n CollapsibleContent,\n type CollapsibleContentProps,\n CollapsibleTrigger,\n type CollapsibleTriggerProps,\n} from '@/components/ui/collapsible';\nimport { useMediaQuery } from 'fumadocs-core/utils/use-media-query';\nimport scrollIntoView from 'scroll-into-view-if-needed';\nimport { usePathname } from 'fumadocs-core/framework';\nimport ReactDOM from 'react-dom';\n\ninterface SidebarContext {\n open: boolean;\n setOpen: React.Dispatch<React.SetStateAction<boolean>>;\n collapsed: boolean;\n setCollapsed: React.Dispatch<React.SetStateAction<boolean>>;\n\n /**\n * When set to false, don't close the sidebar when navigate to another page\n */\n closeOnRedirect: RefObject<boolean>;\n defaultOpenLevel: number;\n prefetch: boolean;\n mode: Mode;\n}\n\nexport interface SidebarProviderProps {\n /**\n * Open folders by default if their level is lower or equal to a specific level\n * (Starting from 1)\n *\n * @defaultValue 0\n */\n defaultOpenLevel?: number;\n\n /**\n * Prefetch links\n *\n * @defaultValue true\n */\n prefetch?: boolean;\n\n children?: ReactNode;\n}\n\ntype Mode = 'drawer' | 'full';\n\nconst SidebarContext = createContext<SidebarContext | null>(null);\n\nconst FolderContext = createContext<{\n open: boolean;\n setOpen: React.Dispatch<React.SetStateAction<boolean>>;\n depth: number;\n collapsible: boolean;\n} | null>(null);\n\nexport function SidebarProvider({\n defaultOpenLevel = 0,\n prefetch = true,\n children,\n}: SidebarProviderProps) {\n const closeOnRedirect = useRef(true);\n const [open, setOpen] = useState(false);\n const [collapsed, setCollapsed] = useState(false);\n const pathname = usePathname();\n const mode: Mode = useMediaQuery('(width < 768px)') ? 'drawer' : 'full';\n\n useOnChange(pathname, () => {\n if (closeOnRedirect.current) {\n setOpen(false);\n }\n closeOnRedirect.current = true;\n });\n\n return (\n <SidebarContext\n value={useMemo(\n () => ({\n open,\n setOpen,\n collapsed,\n setCollapsed,\n closeOnRedirect,\n defaultOpenLevel,\n prefetch,\n mode,\n }),\n [open, collapsed, defaultOpenLevel, prefetch, mode],\n )}\n >\n {children}\n </SidebarContext>\n );\n}\n\nexport function useSidebar(): SidebarContext {\n const ctx = use(SidebarContext);\n if (!ctx)\n throw new Error(\n 'Missing SidebarContext, make sure you have wrapped the component in <DocsLayout /> and the context is available.',\n );\n\n return ctx;\n}\n\nexport function useFolder() {\n return use(FolderContext);\n}\n\nexport function useFolderDepth() {\n return use(FolderContext)?.depth ?? 0;\n}\n\nexport function SidebarContent({\n children,\n}: {\n children: (state: {\n ref: RefObject<HTMLElement | null>;\n collapsed: boolean;\n hovered: boolean;\n onPointerEnter: (event: PointerEvent) => void;\n onPointerLeave: (event: PointerEvent) => void;\n }) => ReactNode;\n}) {\n const { collapsed, mode } = useSidebar();\n const [hover, setHover] = useState(false);\n const ref = useRef<HTMLElement>(null);\n const timerRef = useRef(0);\n\n useOnChange(collapsed, () => {\n if (collapsed) setHover(false);\n });\n\n if (mode !== 'full') return;\n\n function shouldIgnoreHover(e: PointerEvent): boolean {\n const element = ref.current;\n if (!element) return true;\n\n return !collapsed || e.pointerType === 'touch' || element.getAnimations().length > 0;\n }\n\n return children({\n ref,\n collapsed,\n hovered: hover,\n onPointerEnter(e) {\n if (shouldIgnoreHover(e)) return;\n window.clearTimeout(timerRef.current);\n setHover(true);\n },\n onPointerLeave(e) {\n if (shouldIgnoreHover(e)) return;\n window.clearTimeout(timerRef.current);\n\n timerRef.current = window.setTimeout(\n () => setHover(false),\n // if mouse is leaving the viewport, add a close delay\n Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100 ? 0 : 500,\n );\n },\n });\n}\n\nexport function SidebarDrawerOverlay(props: ComponentProps<'div'>) {\n const { open, setOpen, mode } = useSidebar();\n const [hidden, setHidden] = useState(!open);\n\n if (open && hidden) setHidden(false);\n if (mode !== 'drawer' || hidden) return;\n return (\n <div\n data-state={open ? 'open' : 'closed'}\n onClick={() => setOpen(false)}\n onAnimationEnd={() => {\n if (!open) ReactDOM.flushSync(() => setHidden(true));\n }}\n {...props}\n />\n );\n}\n\nexport function SidebarDrawerContent({ className, children, ...props }: ComponentProps<'aside'>) {\n const { open, mode } = useSidebar();\n const [hidden, setHidden] = useState(!open);\n\n if (open && hidden) setHidden(false);\n if (mode !== 'drawer') return;\n return (\n <aside\n id=\"nd-sidebar-mobile\"\n data-state={open ? 'open' : 'closed'}\n className={cn(hidden && 'invisible', className)}\n onAnimationEnd={() => {\n if (!open) ReactDOM.flushSync(() => setHidden(true));\n }}\n {...props}\n >\n {children}\n </aside>\n );\n}\n\nexport function SidebarViewport({ className, ...props }: ScrollAreaProps) {\n return (\n <ScrollArea\n className={(s) =>\n cn('min-h-0 flex-1', typeof className === 'function' ? className(s) : className)\n }\n {...props}\n >\n <ScrollViewport\n className=\"p-4 overscroll-contain\"\n style={\n {\n maskImage:\n 'linear-gradient(to bottom, transparent, white 12px, white calc(100% - 12px), transparent)',\n } as object\n }\n >\n {props.children}\n </ScrollViewport>\n </ScrollArea>\n );\n}\n\nexport function SidebarSeparator(props: ComponentProps<'p'>) {\n const depth = useFolderDepth();\n return (\n <p\n {...props}\n className={cn(\n 'inline-flex items-center gap-2 mb-1.5 px-2 mt-6 empty:mb-0',\n depth === 0 && 'first:mt-0',\n props.className,\n )}\n >\n {props.children}\n </p>\n );\n}\n\nexport function SidebarItem({\n icon,\n children,\n ...props\n}: LinkProps & {\n icon?: ReactNode;\n}) {\n const pathname = usePathname();\n const ref = useRef<HTMLAnchorElement>(null);\n const { prefetch } = useSidebar();\n const active = props.href !== undefined && isActive(props.href, pathname, false);\n\n useAutoScroll(active, ref);\n\n return (\n <Link ref={ref} data-active={active} prefetch={prefetch} {...props}>\n {icon ?? (props.external ? <ExternalLink /> : null)}\n {children}\n </Link>\n );\n}\n\nexport function SidebarFolder({\n defaultOpen: defaultOpenProp,\n collapsible = true,\n active = false,\n children,\n ...props\n}: ComponentProps<'div'> & {\n active?: boolean;\n defaultOpen?: boolean;\n collapsible?: boolean;\n}) {\n const { defaultOpenLevel } = useSidebar();\n const depth = useFolderDepth() + 1;\n const defaultOpen =\n collapsible === false || active || (defaultOpenProp ?? defaultOpenLevel >= depth);\n const [open, setOpen] = useState(defaultOpen);\n\n useOnChange(defaultOpen, (v) => {\n if (v) setOpen(v);\n });\n\n return (\n <Collapsible open={open} onOpenChange={setOpen} disabled={!collapsible} {...props}>\n <FolderContext\n value={useMemo(() => ({ open, setOpen, depth, collapsible }), [collapsible, depth, open])}\n >\n {children}\n </FolderContext>\n </Collapsible>\n );\n}\n\nexport function SidebarFolderTrigger({ children, ...props }: CollapsibleTriggerProps) {\n const { open, collapsible } = use(FolderContext)!;\n\n if (collapsible) {\n return (\n <CollapsibleTrigger {...props}>\n {children}\n <ChevronDown\n data-icon\n className={cn('ms-auto transition-transform', !open && '-rotate-90')}\n />\n </CollapsibleTrigger>\n );\n }\n\n return <div {...(props as ComponentProps<'div'>)}>{children}</div>;\n}\n\nexport function SidebarFolderLink({ children, ...props }: LinkProps) {\n const ref = useRef<HTMLAnchorElement>(null);\n const { open, setOpen, collapsible } = use(FolderContext)!;\n const { prefetch } = useSidebar();\n const pathname = usePathname();\n const active = props.href !== undefined && isActive(props.href, pathname, false);\n\n useAutoScroll(active, ref);\n\n return (\n <Link\n ref={ref}\n data-active={active}\n onClick={(e) => {\n if (!collapsible) return;\n\n if (e.target instanceof Element && e.target.matches('[data-icon], [data-icon] *')) {\n setOpen(!open);\n e.preventDefault();\n } else {\n setOpen(active ? !open : true);\n }\n }}\n prefetch={prefetch}\n {...props}\n >\n {children}\n {collapsible && (\n <ChevronDown\n data-icon\n className={cn('ms-auto transition-transform', !open && '-rotate-90')}\n />\n )}\n </Link>\n );\n}\n\nexport function SidebarFolderContent(props: CollapsibleContentProps) {\n return <CollapsibleContent {...props}>{props.children}</CollapsibleContent>;\n}\n\nexport function SidebarTrigger({ children, ...props }: ComponentProps<'button'>) {\n const { setOpen } = useSidebar();\n\n return (\n <button aria-label=\"Open Sidebar\" onClick={() => setOpen((prev) => !prev)} {...props}>\n {children}\n </button>\n );\n}\n\nexport function SidebarCollapseTrigger(props: ComponentProps<'button'>) {\n const { collapsed, setCollapsed } = useSidebar();\n\n return (\n <button\n type=\"button\"\n aria-label=\"Collapse Sidebar\"\n data-collapsed={collapsed}\n onClick={() => {\n setCollapsed((prev) => !prev);\n }}\n {...props}\n >\n {props.children}\n </button>\n );\n}\n\nfunction useAutoScroll(active: boolean, ref: RefObject<HTMLAnchorElement | null>) {\n const { mode } = useSidebar();\n\n useEffect(() => {\n if (active && ref.current) {\n scrollIntoView(ref.current, {\n boundary: document.getElementById(mode === 'drawer' ? 'nd-sidebar-mobile' : 'nd-sidebar'),\n scrollMode: 'if-needed',\n });\n }\n }, [active, mode, ref]);\n}\n"],"mappings":"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"}
@@ -1,11 +1,24 @@
1
- import type { HTMLAttributes } from 'react';
2
- import type * as Base from './base.js';
3
- import type { LinkItemType } from '@fumadocs/ui/link-item';
4
- type InternalComponents = Pick<typeof Base, 'SidebarFolder' | 'SidebarFolderLink' | 'SidebarFolderContent' | 'SidebarFolderTrigger' | 'SidebarItem'>;
5
- export declare function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, }: InternalComponents): ({ item, ...props }: HTMLAttributes<HTMLElement> & {
6
- item: Exclude<LinkItemType, {
7
- type: "icon";
8
- }>;
9
- }) => import("react/jsx-runtime").JSX.Element;
10
- export {};
1
+ import { base_d_exports } from "./base.js";
2
+ import * as react_jsx_runtime23 from "react/jsx-runtime";
3
+ import { HTMLAttributes } from "react";
4
+ import { LinkItemType } from "@fumadocs/ui/link-item";
5
+
6
+ //#region src/components/sidebar/link-item.d.ts
7
+ type InternalComponents = Pick<typeof base_d_exports, 'SidebarFolder' | 'SidebarFolderLink' | 'SidebarFolderContent' | 'SidebarFolderTrigger' | 'SidebarItem'>;
8
+ declare function createLinkItemRenderer({
9
+ SidebarFolder,
10
+ SidebarFolderContent,
11
+ SidebarFolderLink,
12
+ SidebarFolderTrigger,
13
+ SidebarItem
14
+ }: InternalComponents): ({
15
+ item,
16
+ ...props
17
+ }: HTMLAttributes<HTMLElement> & {
18
+ item: Exclude<LinkItemType, {
19
+ type: "icon";
20
+ }>;
21
+ }) => react_jsx_runtime23.JSX.Element;
22
+ //#endregion
23
+ export { createLinkItemRenderer };
11
24
  //# sourceMappingURL=link-item.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"link-item.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/link-item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,KAAK,IAAI,MAAM,QAAQ,CAAC;AACpC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE3D,KAAK,kBAAkB,GAAG,IAAI,CAC5B,OAAO,IAAI,EACT,eAAe,GACf,mBAAmB,GACnB,sBAAsB,GACtB,sBAAsB,GACtB,aAAa,CAChB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,EACrC,aAAa,EACb,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,WAAW,GACZ,EAAE,kBAAkB,IAIa,oBAG7B,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,EAAE,OAAO,CAAC,YAAY,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC/C,6CAoCF"}
1
+ {"version":3,"file":"link-item.d.ts","names":[],"sources":["../../../src/components/sidebar/link-item.tsx"],"sourcesContent":[],"mappings":";;;;;;KAIK,kBAAA,GAAqB,YACjB;iBAQO,sBAAA;;;;;;GAMb;;;GAOE,eAAe;QACV,QAAQ;IAvBb,IAAA,EAAA,MAAA;EASW,CAAA,CAAA;CACd,EAAA,GAcC,mBAAA,CAAA,GAAA,CAAA,OAdD"}
@@ -1,13 +1,33 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- export function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem, }) {
3
- /**
4
- * Render sidebar items from page tree
5
- */
6
- return function SidebarLinkItem({ item, ...props }) {
7
- if (item.type === 'custom')
8
- return _jsx("div", { ...props, children: item.children });
9
- if (item.type === 'menu')
10
- return (_jsxs(SidebarFolder, { ...props, children: [item.url ? (_jsxs(SidebarFolderLink, { href: item.url, external: item.external, children: [item.icon, item.text] })) : (_jsxs(SidebarFolderTrigger, { children: [item.icon, item.text] })), _jsx(SidebarFolderContent, { children: item.items.map((child, i) => (_jsx(SidebarLinkItem, { item: child }, i))) })] }));
11
- return (_jsx(SidebarItem, { href: item.url, icon: item.icon, external: item.external, ...props, children: item.text }));
12
- };
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+
3
+ //#region src/components/sidebar/link-item.tsx
4
+ function createLinkItemRenderer({ SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarItem }) {
5
+ /**
6
+ * Render sidebar items from page tree
7
+ */
8
+ return function SidebarLinkItem({ item, ...props }) {
9
+ if (item.type === "custom") return /* @__PURE__ */ jsx("div", {
10
+ ...props,
11
+ children: item.children
12
+ });
13
+ if (item.type === "menu") return /* @__PURE__ */ jsxs(SidebarFolder, {
14
+ ...props,
15
+ children: [item.url ? /* @__PURE__ */ jsxs(SidebarFolderLink, {
16
+ href: item.url,
17
+ external: item.external,
18
+ children: [item.icon, item.text]
19
+ }) : /* @__PURE__ */ jsxs(SidebarFolderTrigger, { children: [item.icon, item.text] }), /* @__PURE__ */ jsx(SidebarFolderContent, { children: item.items.map((child, i) => /* @__PURE__ */ jsx(SidebarLinkItem, { item: child }, i)) })]
20
+ });
21
+ return /* @__PURE__ */ jsx(SidebarItem, {
22
+ href: item.url,
23
+ icon: item.icon,
24
+ external: item.external,
25
+ ...props,
26
+ children: item.text
27
+ });
28
+ };
13
29
  }
30
+
31
+ //#endregion
32
+ export { createLinkItemRenderer };
33
+ //# sourceMappingURL=link-item.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"link-item.js","names":[],"sources":["../../../src/components/sidebar/link-item.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport type * as Base from './base';\nimport type { LinkItemType } from '@fumadocs/ui/link-item';\n\ntype InternalComponents = Pick<\n typeof Base,\n | 'SidebarFolder'\n | 'SidebarFolderLink'\n | 'SidebarFolderContent'\n | 'SidebarFolderTrigger'\n | 'SidebarItem'\n>;\n\nexport function createLinkItemRenderer({\n SidebarFolder,\n SidebarFolderContent,\n SidebarFolderLink,\n SidebarFolderTrigger,\n SidebarItem,\n}: InternalComponents) {\n /**\n * Render sidebar items from page tree\n */\n return function SidebarLinkItem({\n item,\n ...props\n }: HTMLAttributes<HTMLElement> & {\n item: Exclude<LinkItemType, { type: 'icon' }>;\n }) {\n if (item.type === 'custom') return <div {...props}>{item.children}</div>;\n\n if (item.type === 'menu')\n return (\n <SidebarFolder {...props}>\n {item.url ? (\n <SidebarFolderLink href={item.url} external={item.external}>\n {item.icon}\n {item.text}\n </SidebarFolderLink>\n ) : (\n <SidebarFolderTrigger>\n {item.icon}\n {item.text}\n </SidebarFolderTrigger>\n )}\n <SidebarFolderContent>\n {item.items.map((child, i) => (\n <SidebarLinkItem key={i} item={child} />\n ))}\n </SidebarFolderContent>\n </SidebarFolder>\n );\n\n return (\n <SidebarItem href={item.url} icon={item.icon} external={item.external} {...props}>\n {item.text}\n </SidebarItem>\n );\n };\n}\n"],"mappings":";;;AAaA,SAAgB,uBAAuB,EACrC,eACA,sBACA,mBACA,sBACA,eACqB;;;;AAIrB,QAAO,SAAS,gBAAgB,EAC9B,MACA,GAAG,SAGF;AACD,MAAI,KAAK,SAAS,SAAU,QAAO,oBAAC;GAAI,GAAI;aAAQ,KAAK;IAAe;AAExE,MAAI,KAAK,SAAS,OAChB,QACE,qBAAC;GAAc,GAAI;cAChB,KAAK,MACJ,qBAAC;IAAkB,MAAM,KAAK;IAAK,UAAU,KAAK;eAC/C,KAAK,MACL,KAAK;KACY,GAEpB,qBAAC,mCACE,KAAK,MACL,KAAK,QACe,EAEzB,oBAAC,kCACE,KAAK,MAAM,KAAK,OAAO,MACtB,oBAAC,mBAAwB,MAAM,SAAT,EAAkB,CACxC,GACmB;IACT;AAGpB,SACE,oBAAC;GAAY,MAAM,KAAK;GAAK,MAAM,KAAK;GAAM,UAAU,KAAK;GAAU,GAAI;aACxE,KAAK;IACM"}