@vx-oss/docs-react 1.0.4 → 1.0.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.
Files changed (255) hide show
  1. package/README.md +3 -3
  2. package/css/generated/docs.css +1 -1
  3. package/css/generated/flux.css +1 -1
  4. package/css/generated/glass.css +1 -1
  5. package/css/generated/home.css +1 -1
  6. package/css/generated/notebook.css +1 -1
  7. package/css/generated/shared.css +1 -1
  8. package/css/lib/base.css +0 -127
  9. package/css/preset.css +1 -2
  10. package/css/style.css +1 -0
  11. package/dist/components/accordion.js +1 -68
  12. package/dist/components/banner.js +1 -85
  13. package/dist/components/callout.js +1 -60
  14. package/dist/components/card.js +1 -39
  15. package/dist/components/codeblock.js +1 -126
  16. package/dist/components/codeblock.rsc.js +1 -22
  17. package/dist/components/dialog/search-algolia.js +2 -64
  18. package/dist/components/dialog/search-default.js +2 -66
  19. package/dist/components/dialog/search-orama.js +2 -69
  20. package/dist/components/dialog/search.js +1 -351
  21. package/dist/components/dynamic-codeblock.core.js +1 -51
  22. package/dist/components/dynamic-codeblock.js +1 -17
  23. package/dist/components/files.js +1 -40
  24. package/dist/components/github-info.js +1 -75
  25. package/dist/components/heading.js +1 -38
  26. package/dist/components/image-zoom.js +1 -32
  27. package/dist/components/inline-toc.js +1 -28
  28. package/dist/components/sidebar/base.js +1 -277
  29. package/dist/components/sidebar/link-item.js +1 -37
  30. package/dist/components/sidebar/page-tree.js +1 -69
  31. package/dist/components/sidebar/tabs/dropdown.js +1 -83
  32. package/dist/components/sidebar/tabs/index.js +1 -46
  33. package/dist/components/steps.js +1 -16
  34. package/dist/components/tabs.js +1 -95
  35. package/dist/components/toc/clerk.js +1 -227
  36. package/dist/components/toc/default.js +1 -260
  37. package/dist/components/toc/index.js +1 -45
  38. package/dist/components/type-table.js +1 -117
  39. package/dist/components/ui/accordion.js +1 -42
  40. package/dist/components/ui/button.js +1 -20
  41. package/dist/components/ui/collapsible.js +1 -21
  42. package/dist/components/ui/popover.js +1 -20
  43. package/dist/components/ui/scroll-area.js +1 -34
  44. package/dist/components/ui/tabs.js +1 -102
  45. package/dist/contexts/i18n.js +1 -37
  46. package/dist/contexts/search.js +1 -68
  47. package/dist/contexts/tree.js +1 -91
  48. package/dist/i18n.js +1 -38
  49. package/dist/index.js +1 -0
  50. package/dist/layouts/docs/index.js +1 -23
  51. package/dist/layouts/docs/page/index.js +1 -124
  52. package/dist/layouts/docs/page/slots/breadcrumb.js +1 -44
  53. package/dist/layouts/docs/page/slots/container.js +1 -22
  54. package/dist/layouts/docs/page/slots/footer.js +1 -56
  55. package/dist/layouts/docs/page/slots/toc.js +1 -182
  56. package/dist/layouts/docs/slots/container.js +1 -36
  57. package/dist/layouts/docs/slots/header.js +1 -38
  58. package/dist/layouts/docs/slots/sidebar.js +1 -268
  59. package/dist/layouts/flux/index.js +1 -146
  60. package/dist/layouts/flux/page/index.js +1 -104
  61. package/dist/layouts/flux/page/slots/breadcrumb.js +1 -44
  62. package/dist/layouts/flux/page/slots/container.js +1 -22
  63. package/dist/layouts/flux/page/slots/footer.js +1 -56
  64. package/dist/layouts/flux/page/slots/toc.js +1 -181
  65. package/dist/layouts/flux/slots/container.js +1 -13
  66. package/dist/layouts/flux/slots/sidebar.js +1 -243
  67. package/dist/layouts/flux/slots/tab-dropdown.js +1 -88
  68. package/dist/layouts/glass/index.js +1 -70
  69. package/dist/layouts/glass/page/index.js +1 -92
  70. package/dist/layouts/glass/page/slots/breadcrumb.js +1 -44
  71. package/dist/layouts/glass/page/slots/footer.js +1 -56
  72. package/dist/layouts/glass/page/slots/toc.js +1 -108
  73. package/dist/layouts/glass/slots/header.js +1 -68
  74. package/dist/layouts/glass/slots/sidebar.js +1 -267
  75. package/dist/layouts/home/index.js +1 -40
  76. package/dist/layouts/home/navbar.js +1 -34
  77. package/dist/layouts/home/not-found.js +1 -41
  78. package/dist/layouts/home/slots/container.js +1 -13
  79. package/dist/layouts/home/slots/header.js +1 -239
  80. package/dist/layouts/notebook/index.js +1 -23
  81. package/dist/layouts/notebook/page/index.js +1 -124
  82. package/dist/layouts/notebook/page/slots/breadcrumb.js +1 -44
  83. package/dist/layouts/notebook/page/slots/container.js +1 -22
  84. package/dist/layouts/notebook/page/slots/footer.js +1 -56
  85. package/dist/layouts/notebook/page/slots/toc.js +1 -181
  86. package/dist/layouts/notebook/slots/container.js +1 -38
  87. package/dist/layouts/notebook/slots/header.js +1 -204
  88. package/dist/layouts/notebook/slots/sidebar.js +1 -240
  89. package/dist/layouts/shared/index.js +1 -98
  90. package/dist/layouts/shared/slots/language-select.js +1 -43
  91. package/dist/layouts/shared/slots/search-trigger.js +1 -53
  92. package/dist/layouts/shared/slots/theme-switch.js +1 -70
  93. package/dist/mdx.d.ts +2 -44
  94. package/dist/mdx.js +2 -70
  95. package/dist/mdx.server.js +2 -20
  96. package/dist/og/takumi.js +1 -91
  97. package/dist/og.js +1 -91
  98. package/dist/page.js +1 -33
  99. package/dist/primitives/accordion.js +1 -0
  100. package/dist/primitives/collapsible.js +1 -0
  101. package/dist/primitives/dialog.js +1 -0
  102. package/dist/primitives/direction-provider.js +1 -0
  103. package/dist/primitives/drawer.js +1 -0
  104. package/dist/primitives/navigation-menu.js +1 -0
  105. package/dist/primitives/popover.js +1 -0
  106. package/dist/primitives/scroll-area.js +1 -0
  107. package/dist/primitives/shared.js +1 -0
  108. package/dist/primitives/tabs.js +1 -0
  109. package/dist/provider/astro.js +1 -20
  110. package/dist/provider/base.js +1 -73
  111. package/dist/provider/next.js +1 -17
  112. package/dist/provider/react-router.js +1 -17
  113. package/dist/provider/tanstack.js +1 -17
  114. package/dist/provider/waku.js +1 -17
  115. package/dist/style.css +11577 -310
  116. package/dist/utils/use-copy-button.js +1 -26
  117. package/dist/utils/use-footer-items.js +1 -24
  118. package/dist/utils/use-is-scroll-top.js +1 -20
  119. package/package.json +28 -66
  120. package/css/preset-legacy.css +0 -43
  121. package/dist/.translations/index.d.ts +0 -55
  122. package/dist/.translations/keys.js +0 -55
  123. package/dist/_virtual/_rolldown/runtime.js +0 -13
  124. package/dist/components/accordion.d.ts +0 -10
  125. package/dist/components/banner.d.ts +0 -25
  126. package/dist/components/callout.d.ts +0 -21
  127. package/dist/components/card.d.ts +0 -13
  128. package/dist/components/codeblock.d.ts +0 -45
  129. package/dist/components/codeblock.rsc.d.ts +0 -15
  130. package/dist/components/dialog/search-algolia.d.ts +0 -27
  131. package/dist/components/dialog/search-default.d.ts +0 -29
  132. package/dist/components/dialog/search-orama.d.ts +0 -32
  133. package/dist/components/dialog/search.d.ts +0 -76
  134. package/dist/components/dynamic-codeblock.core.d.ts +0 -26
  135. package/dist/components/dynamic-codeblock.d.ts +0 -8
  136. package/dist/components/files.d.ts +0 -21
  137. package/dist/components/github-info.d.ts +0 -20
  138. package/dist/components/heading.d.ts +0 -9
  139. package/dist/components/image-zoom.d.ts +0 -18
  140. package/dist/components/inline-toc.d.ts +0 -10
  141. package/dist/components/sidebar/base.d.ts +0 -85
  142. package/dist/components/sidebar/link-item.d.ts +0 -12
  143. package/dist/components/sidebar/page-tree.d.ts +0 -20
  144. package/dist/components/sidebar/tabs/dropdown.d.ts +0 -15
  145. package/dist/components/sidebar/tabs/index.d.ts +0 -8
  146. package/dist/components/steps.d.ts +0 -10
  147. package/dist/components/tabs.d.ts +0 -33
  148. package/dist/components/toc/clerk.d.ts +0 -11
  149. package/dist/components/toc/default.d.ts +0 -13
  150. package/dist/components/toc/index.d.ts +0 -10
  151. package/dist/components/type-table.d.ts +0 -37
  152. package/dist/components/ui/accordion.d.ts +0 -10
  153. package/dist/components/ui/button.d.ts +0 -10
  154. package/dist/components/ui/collapsible.d.ts +0 -11
  155. package/dist/components/ui/navigation-menu.d.ts +0 -14
  156. package/dist/components/ui/navigation-menu.js +0 -41
  157. package/dist/components/ui/popover.d.ts +0 -9
  158. package/dist/components/ui/scroll-area.d.ts +0 -9
  159. package/dist/components/ui/tabs.d.ts +0 -23
  160. package/dist/contexts/i18n.d.ts +0 -34
  161. package/dist/contexts/search.d.ts +0 -64
  162. package/dist/contexts/tree.d.ts +0 -29
  163. package/dist/i18n.d.ts +0 -15
  164. package/dist/layouts/docs/client.d.ts +0 -33
  165. package/dist/layouts/docs/client.js +0 -94
  166. package/dist/layouts/docs/index.d.ts +0 -32
  167. package/dist/layouts/docs/page/index.d.ts +0 -76
  168. package/dist/layouts/docs/page/slots/breadcrumb.d.ts +0 -7
  169. package/dist/layouts/docs/page/slots/container.d.ts +0 -5
  170. package/dist/layouts/docs/page/slots/footer.d.ts +0 -16
  171. package/dist/layouts/docs/page/slots/toc.d.ts +0 -47
  172. package/dist/layouts/docs/slots/container.d.ts +0 -5
  173. package/dist/layouts/docs/slots/header.d.ts +0 -5
  174. package/dist/layouts/docs/slots/sidebar.d.ts +0 -22
  175. package/dist/layouts/flux/index.d.ts +0 -61
  176. package/dist/layouts/flux/page/index.d.ts +0 -67
  177. package/dist/layouts/flux/page/slots/breadcrumb.d.ts +0 -7
  178. package/dist/layouts/flux/page/slots/container.d.ts +0 -5
  179. package/dist/layouts/flux/page/slots/footer.d.ts +0 -16
  180. package/dist/layouts/flux/page/slots/toc.d.ts +0 -29
  181. package/dist/layouts/flux/slots/container.d.ts +0 -5
  182. package/dist/layouts/flux/slots/sidebar.d.ts +0 -16
  183. package/dist/layouts/flux/slots/tab-dropdown.d.ts +0 -10
  184. package/dist/layouts/glass/index.d.ts +0 -39
  185. package/dist/layouts/glass/layout-tabs.js +0 -54
  186. package/dist/layouts/glass/page/index.d.ts +0 -31
  187. package/dist/layouts/glass/page/slots/breadcrumb.d.ts +0 -7
  188. package/dist/layouts/glass/page/slots/footer.d.ts +0 -16
  189. package/dist/layouts/glass/page/slots/toc.d.ts +0 -19
  190. package/dist/layouts/glass/slots/header.d.ts +0 -6
  191. package/dist/layouts/glass/slots/sidebar.d.ts +0 -21
  192. package/dist/layouts/home/index.d.ts +0 -27
  193. package/dist/layouts/home/navbar.d.ts +0 -9
  194. package/dist/layouts/home/not-found.d.ts +0 -7
  195. package/dist/layouts/home/slots/container.d.ts +0 -5
  196. package/dist/layouts/home/slots/header.d.ts +0 -8
  197. package/dist/layouts/notebook/client.d.ts +0 -35
  198. package/dist/layouts/notebook/client.js +0 -69
  199. package/dist/layouts/notebook/index.d.ts +0 -26
  200. package/dist/layouts/notebook/page/index.d.ts +0 -76
  201. package/dist/layouts/notebook/page/slots/breadcrumb.d.ts +0 -7
  202. package/dist/layouts/notebook/page/slots/container.d.ts +0 -5
  203. package/dist/layouts/notebook/page/slots/footer.d.ts +0 -16
  204. package/dist/layouts/notebook/page/slots/toc.d.ts +0 -47
  205. package/dist/layouts/notebook/slots/container.d.ts +0 -5
  206. package/dist/layouts/notebook/slots/header.d.ts +0 -5
  207. package/dist/layouts/notebook/slots/sidebar.d.ts +0 -23
  208. package/dist/layouts/shared/client.d.ts +0 -37
  209. package/dist/layouts/shared/client.js +0 -85
  210. package/dist/layouts/shared/index.d.ts +0 -169
  211. package/dist/layouts/shared/page-actions.d.ts +0 -27
  212. package/dist/layouts/shared/page-actions.js +0 -199
  213. package/dist/layouts/shared/slots/language-select.d.ts +0 -12
  214. package/dist/layouts/shared/slots/search-trigger.d.ts +0 -13
  215. package/dist/layouts/shared/slots/theme-switch.d.ts +0 -8
  216. package/dist/legacy/layout.d.ts +0 -29
  217. package/dist/legacy/layout.js +0 -44
  218. package/dist/legacy/sidebar.d.ts +0 -14
  219. package/dist/legacy/sidebar.js +0 -34
  220. package/dist/mdx.server.d.ts +0 -14
  221. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/controlled.d.ts +0 -30
  222. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/controlled.js +0 -461
  223. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/index.d.ts +0 -3
  224. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/uncontrolled.d.ts +0 -6
  225. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/uncontrolled.js +0 -17
  226. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/adjust-svg-ids.js +0 -53
  227. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/compute-positioned-style.js +0 -25
  228. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/element-tests.js +0 -12
  229. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-div-img-style.js +0 -45
  230. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-img-alt.js +0 -10
  231. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-img-object-fit-style.js +0 -57
  232. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-img-regular-style.js +0 -21
  233. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-img-src.js +0 -14
  234. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-modal-img-transform.js +0 -22
  235. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-scale.js +0 -27
  236. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-style-ghost.js +0 -31
  237. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-style-modal-img.js +0 -75
  238. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/get-target-dimension.js +0 -4
  239. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/parse-position.js +0 -7
  240. package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.9_react-dom@19.2.8_react@19.2.8__react@19.2.8/node_modules/react-medium-image-zoom/dist/utils/test-has-scalable-src.js +0 -5
  241. package/dist/og/takumi.d.ts +0 -15
  242. package/dist/og.d.ts +0 -16
  243. package/dist/page.d.ts +0 -29
  244. package/dist/provider/astro.d.ts +0 -29
  245. package/dist/provider/base.d.ts +0 -48
  246. package/dist/provider/next.d.ts +0 -16
  247. package/dist/provider/react-router.d.ts +0 -16
  248. package/dist/provider/tanstack.d.ts +0 -16
  249. package/dist/provider/waku.d.ts +0 -16
  250. package/dist/utils/cn.js +0 -2
  251. package/dist/utils/merge-refs.js +0 -11
  252. package/dist/utils/urls.js +0 -15
  253. package/dist/utils/use-copy-button.d.ts +0 -5
  254. package/dist/utils/use-footer-items.d.ts +0 -8
  255. package/dist/utils/use-is-scroll-top.d.ts +0 -6
@@ -1,146 +1 @@
1
- "use client";
2
- import { cn } from "../../utils/cn.js";
3
- import { buttonVariants } from "../../components/ui/button.js";
4
- import { TreeContextProvider } from "../../contexts/tree.js";
5
- import { useSearchContext } from "../../contexts/search.js";
6
- import { LinkItem, baseSlots } from "../shared/client.js";
7
- import { getLayoutTabs, useLinkItems } from "../shared/index.js";
8
- import { TabDropdown } from "./slots/tab-dropdown.js";
9
- import { Sidebar as Sidebar$1, SidebarProvider, SidebarTrigger, useSidebar } from "./slots/sidebar.js";
10
- import { Container } from "./slots/container.js";
11
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
12
- import { Languages } from "lucide-react";
13
- import { createContext, use, useMemo } from "react";
14
- import { motion } from "motion/react";
15
- import { RemoveScroll } from "react-remove-scroll";
16
- //#region src/layouts/flux/index.tsx
17
- const LayoutContext = createContext(null);
18
- function useFluxLayout() {
19
- const context = use(LayoutContext);
20
- if (!context) throw new Error("Please use Flux layout components under <DocsLayout /> (`@vx-oss/docs-react/layouts/flux`).");
21
- return context;
22
- }
23
- const { useBaseSlots } = baseSlots({ useProps() {
24
- return useFluxLayout().props;
25
- } });
26
- function DocsLayout(props) {
27
- const { tree, nav = {}, sidebar: { enabled: sidebarEnabled = true, tabs: _tabs, defaultOpenLevel, prefetch, ...sidebarProps } = {}, tabs: defaultTabs = _tabs, children, containerProps, renderNavigationPanel = (props) => /* @__PURE__ */ jsx(NavigationPanel, { ...props }), slots: defaultSlots = {} } = props;
28
- const linkItems = useLinkItems(props);
29
- const { baseSlots, baseProps } = useBaseSlots(props);
30
- const tabs = useMemo(() => {
31
- if (Array.isArray(defaultTabs)) return defaultTabs;
32
- if (typeof defaultTabs === "object") return getLayoutTabs(tree, defaultTabs);
33
- if (defaultTabs !== false) return getLayoutTabs(tree);
34
- return [];
35
- }, [tree, defaultTabs]);
36
- const slots = {
37
- ...baseSlots,
38
- container: defaultSlots.container ?? Container,
39
- tabDropdown: defaultSlots.tabDropdown ?? TabDropdown,
40
- sidebar: defaultSlots.sidebar ?? {
41
- root: Sidebar$1,
42
- provider: SidebarProvider,
43
- trigger: SidebarTrigger,
44
- useSidebar
45
- }
46
- };
47
- return /* @__PURE__ */ jsx(LayoutContext, {
48
- value: {
49
- props: baseProps,
50
- slots,
51
- ...linkItems
52
- },
53
- children: /* @__PURE__ */ jsxs(TreeContextProvider, {
54
- tree,
55
- children: [/* @__PURE__ */ jsx(slots.sidebar.provider, {
56
- defaultOpenLevel,
57
- prefetch,
58
- children: /* @__PURE__ */ jsxs(slots.container, {
59
- ...containerProps,
60
- children: [sidebarEnabled && /* @__PURE__ */ jsx(slots.sidebar.root, { ...sidebarProps }), children]
61
- })
62
- }), renderNavigationPanel({
63
- head: /* @__PURE__ */ jsxs(Fragment, { children: [slots.navTitle && /* @__PURE__ */ jsx(slots.navTitle, { className: "inline-flex items-center gap-2.5 text-sm font-semibold" }), nav.children] }),
64
- tabDropdown: slots.tabDropdown && tabs.length > 0 && /* @__PURE__ */ jsx(slots.tabDropdown, {
65
- className: "flex-1",
66
- tabs
67
- }),
68
- tool: /* @__PURE__ */ jsxs(Fragment, { children: [
69
- slots.languageSelect && /* @__PURE__ */ jsx(slots.languageSelect.root, { children: /* @__PURE__ */ jsx(Languages, { className: "size-4.5" }) }),
70
- slots.searchTrigger && /* @__PURE__ */ jsx(slots.searchTrigger.sm, {
71
- hideIfDisabled: true,
72
- className: "rounded-lg"
73
- }),
74
- slots.sidebar && /* @__PURE__ */ jsx(slots.sidebar.trigger, { className: cn(buttonVariants({
75
- variant: "ghost",
76
- size: "icon-sm",
77
- className: "overflow-hidden"
78
- })) }),
79
- slots.themeSwitch && /* @__PURE__ */ jsx(slots.themeSwitch, { className: "p-1 h-full ms-1 rounded-xl bg-fd-muted *:rounded-lg" })
80
- ] }),
81
- link: linkItems.menuItems.filter((item) => item.type === "icon").map((item, i) => /* @__PURE__ */ jsx(LinkItem, {
82
- item,
83
- className: cn(buttonVariants({
84
- size: "icon-sm",
85
- color: "ghost"
86
- })),
87
- "aria-label": item.label,
88
- children: item.icon
89
- }, i))
90
- })]
91
- })
92
- });
93
- }
94
- function NavigationPanel({ head, tabDropdown, tool, link, children = (v) => v, ...props }) {
95
- const { open } = useSearchContext();
96
- return /* @__PURE__ */ jsx(motion.div, {
97
- ...props,
98
- className: cn("fixed left-1/2 w-[calc(100%-var(--removed-body-scroll-bar-size,0px))] translate-x-[calc(-50%-var(--removed-body-scroll-bar-size,0px)/2)] bottom-0 z-40 bg-fd-popover text-fd-popover-foreground border-t shadow-lg sm:bottom-6 sm:rounded-2xl sm:border sm:max-w-[380px]", props.className),
99
- animate: props.animate ?? {
100
- scale: open ? .9 : 1,
101
- translateY: open ? 20 : 0,
102
- opacity: open ? .8 : 1
103
- },
104
- children: children(/* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
105
- className: "flex flex-row items-center ps-2.5 p-1 gap-2 min-h-11",
106
- children: [head, /* @__PURE__ */ jsx("div", {
107
- id: "flux-layout-slot",
108
- className: "flex-1"
109
- })]
110
- }), /* @__PURE__ */ jsxs("div", {
111
- className: "flex flex-row gap-1.5 overflow-x-auto overflow-y-hidden p-2 sm:p-1",
112
- children: [
113
- /* @__PURE__ */ jsx("div", {
114
- className: "flex flex-row items-center gap-2 min-w-0 flex-1",
115
- children: tabDropdown
116
- }),
117
- /* @__PURE__ */ jsx("div", {
118
- className: "flex flex-row items-center text-fd-muted-foreground border-x px-0.5 empty:hidden",
119
- children: link
120
- }),
121
- /* @__PURE__ */ jsx("div", {
122
- className: "flex flex-row items-center text-fd-muted-foreground empty:hidden",
123
- children: tool
124
- })
125
- ]
126
- })] }))
127
- });
128
- }
129
- function NavigationPanelOverlay({ enabled = false, className, ...props }) {
130
- return /* @__PURE__ */ jsx(RemoveScroll, {
131
- enabled,
132
- children: /* @__PURE__ */ jsx(motion.div, {
133
- className: cn("fixed inset-0 z-30 pr-(--removed-body-scroll-bar-size,0) backdrop-blur-md bg-fd-background/60", !enabled && "pointer-events-none", className),
134
- initial: "hide",
135
- variants: {
136
- show: { opacity: 1 },
137
- hide: { opacity: 0 }
138
- },
139
- animate: enabled ? "show" : "hide",
140
- exit: "hide",
141
- ...props
142
- })
143
- });
144
- }
145
- //#endregion
146
- export { DocsLayout, NavigationPanel, NavigationPanelOverlay, useFluxLayout };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux';
@@ -1,104 +1 @@
1
- "use client";
2
- import { cn } from "../../../utils/cn.js";
3
- import { buttonVariants } from "../../../components/ui/button.js";
4
- import { MarkdownCopyButton, ViewOptionsPopover } from "../../shared/page-actions.js";
5
- import { TOC, TOCProvider } from "./slots/toc.js";
6
- import { Footer } from "./slots/footer.js";
7
- import { Breadcrumb } from "./slots/breadcrumb.js";
8
- import { Container } from "./slots/container.js";
9
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
10
- import { Edit } from "lucide-react";
11
- import { createContext, use, useEffect, useState } from "react";
12
- import { useTranslations } from "@fuma-translate/react";
13
- //#region src/layouts/flux/page/index.tsx
14
- const PageContext = createContext(null);
15
- function useDocsPage() {
16
- const context = use(PageContext);
17
- if (!context) throw new Error("Please use page components under <DocsPage /> (`@vx-oss/docs-react/layouts/flux/page`).");
18
- return context;
19
- }
20
- function DocsPage({ full = false, tableOfContent: { enabled: tocEnabled = !full, single, ...tocProps } = {}, breadcrumb: { enabled: breadcrumbEnabled = true, ...breadcrumb } = {}, footer: { enabled: footerEnabled = true, ...footer } = {}, toc = [], slots: defaultSlots = {}, children, ...containerProps }) {
21
- const slots = {
22
- breadcrumb: defaultSlots.breadcrumb ?? Breadcrumb,
23
- footer: defaultSlots.footer ?? Footer,
24
- container: defaultSlots.container ?? Container,
25
- toc: defaultSlots.toc ?? {
26
- provider: TOCProvider,
27
- main: TOC
28
- }
29
- };
30
- return /* @__PURE__ */ jsx(PageContext, {
31
- value: {
32
- full,
33
- slots
34
- },
35
- children: /* @__PURE__ */ jsxs(slots.toc.provider, {
36
- single,
37
- toc: tocEnabled ? toc : [],
38
- children: [tocEnabled && (tocProps.component ?? /* @__PURE__ */ jsx(slots.toc.main, { ...tocProps })), /* @__PURE__ */ jsxs(slots.container, {
39
- ...containerProps,
40
- children: [
41
- breadcrumbEnabled && (breadcrumb.component ?? /* @__PURE__ */ jsx(slots.breadcrumb, { ...breadcrumb })),
42
- children,
43
- footerEnabled && (footer.component ?? /* @__PURE__ */ jsx(slots.footer, { ...footer }))
44
- ]
45
- })]
46
- })
47
- });
48
- }
49
- function EditOnGitHub(props) {
50
- const t = useTranslations({ note: "edit page" });
51
- return /* @__PURE__ */ jsx("a", {
52
- target: "_blank",
53
- rel: "noreferrer noopener",
54
- ...props,
55
- className: cn(buttonVariants({
56
- color: "secondary",
57
- size: "sm"
58
- }), "gap-1.5 not-prose", props.className),
59
- children: props.children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Edit, { className: "size-3.5" }), t("Edit on GitHub")] })
60
- });
61
- }
62
- /**
63
- * Add typography styles
64
- */
65
- function DocsBody({ children, className, ...props }) {
66
- return /* @__PURE__ */ jsx("div", {
67
- ...props,
68
- className: cn("prose flex-1", className),
69
- children
70
- });
71
- }
72
- function DocsDescription({ children, className, ...props }) {
73
- if (children === void 0) return null;
74
- return /* @__PURE__ */ jsx("p", {
75
- ...props,
76
- className: cn("mb-8 text-lg text-fd-muted-foreground", className),
77
- children
78
- });
79
- }
80
- function DocsTitle({ children, className, ...props }) {
81
- return /* @__PURE__ */ jsx("h1", {
82
- ...props,
83
- className: cn("text-[1.75em] font-semibold", className),
84
- children
85
- });
86
- }
87
- function PageLastUpdate({ date: value, ...props }) {
88
- const t = useTranslations({ note: "page footer" });
89
- const [date, setDate] = useState("");
90
- useEffect(() => {
91
- setDate(value.toLocaleDateString());
92
- }, [value]);
93
- return /* @__PURE__ */ jsxs("p", {
94
- ...props,
95
- className: cn("text-sm text-fd-muted-foreground", props.className),
96
- children: [
97
- t("Last updated on"),
98
- " ",
99
- date
100
- ]
101
- });
102
- }
103
- //#endregion
104
- export { DocsBody, DocsDescription, DocsPage, DocsTitle, EditOnGitHub, MarkdownCopyButton, Breadcrumb as PageBreadcrumb, Footer as PageFooter, PageLastUpdate, ViewOptionsPopover, useDocsPage };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/page';
@@ -1,44 +1 @@
1
- "use client";
2
- import { cn } from "../../../../utils/cn.js";
3
- import { useTreeContext, useTreePath } from "../../../../contexts/tree.js";
4
- import Link from "@vx-oss/docs-core/link";
5
- import { jsx, jsxs } from "react/jsx-runtime";
6
- import { ChevronRight } from "lucide-react";
7
- import { Fragment as Fragment$1, useMemo } from "react";
8
- import { getBreadcrumbItemsFromPath } from "@vx-oss/docs-core/breadcrumb";
9
- //#region src/layouts/flux/page/slots/breadcrumb.tsx
10
- function Breadcrumb({ includeRoot, includeSeparator, includePage, ...props }) {
11
- const path = useTreePath();
12
- const { root } = useTreeContext();
13
- const items = useMemo(() => {
14
- return getBreadcrumbItemsFromPath(root, path, {
15
- includePage,
16
- includeSeparator,
17
- includeRoot
18
- });
19
- }, [
20
- includePage,
21
- includeRoot,
22
- includeSeparator,
23
- path,
24
- root
25
- ]);
26
- if (items.length === 0) return null;
27
- return /* @__PURE__ */ jsx("div", {
28
- ...props,
29
- className: cn("flex items-center gap-1.5 text-sm text-fd-muted-foreground", props.className),
30
- children: items.map((item, i) => {
31
- const className = cn("truncate", i === items.length - 1 && "text-fd-primary font-medium");
32
- return /* @__PURE__ */ jsxs(Fragment$1, { children: [i !== 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 shrink-0" }), item.url ? /* @__PURE__ */ jsx(Link, {
33
- href: item.url,
34
- className: cn(className, "transition-opacity hover:opacity-80"),
35
- children: item.name
36
- }) : /* @__PURE__ */ jsx("span", {
37
- className,
38
- children: item.name
39
- })] }, i);
40
- })
41
- });
42
- }
43
- //#endregion
44
- export { Breadcrumb };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/page/slots/breadcrumb';
@@ -1,22 +1 @@
1
- "use client";
2
- import { cn } from "../../../../utils/cn.js";
3
- import { useDocsPage } from "../index.js";
4
- import { jsx } from "react/jsx-runtime";
5
- //#region src/layouts/flux/page/slots/container.tsx
6
- function Container(props) {
7
- const { full } = useDocsPage();
8
- return /* @__PURE__ */ jsx("main", {
9
- className: "grid [grid-area:main] justify-items-center",
10
- "data-layout-main": "",
11
- children: /* @__PURE__ */ jsx("article", {
12
- id: "nd-page",
13
- "data-layout-content": "",
14
- "data-full": full,
15
- ...props,
16
- className: cn("flex flex-col min-w-0 w-full max-w-[900px] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14", full && "max-w-[1200px]", props.className),
17
- children: props.children
18
- })
19
- });
20
- }
21
- //#endregion
22
- export { Container };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/page/slots/container';
@@ -1,56 +1 @@
1
- "use client";
2
- import { cn } from "../../../../utils/cn.js";
3
- import { isActive } from "../../../../utils/urls.js";
4
- import { useFooterItems } from "../../../../utils/use-footer-items.js";
5
- import Link from "@vx-oss/docs-core/link";
6
- import { usePathname } from "@vx-oss/docs-core/framework";
7
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
8
- import { ChevronLeft, ChevronRight } from "lucide-react";
9
- import { useMemo } from "react";
10
- import { useTranslations } from "@fuma-translate/react";
11
- //#region src/layouts/flux/page/slots/footer.tsx
12
- function Footer({ items, children, className, ...props }) {
13
- const footerList = useFooterItems();
14
- const pathname = usePathname();
15
- const { previous, next } = useMemo(() => {
16
- if (items) return items;
17
- const idx = footerList.findIndex((item) => isActive(item.url, pathname));
18
- if (idx === -1) return {};
19
- return {
20
- previous: footerList[idx - 1],
21
- next: footerList[idx + 1]
22
- };
23
- }, [
24
- footerList,
25
- items,
26
- pathname
27
- ]);
28
- return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
29
- className: cn("@container grid gap-4", previous && next ? "grid-cols-2" : "grid-cols-1", className),
30
- ...props,
31
- children: [previous && /* @__PURE__ */ jsx(FooterItem, {
32
- item: previous,
33
- index: 0
34
- }), next && /* @__PURE__ */ jsx(FooterItem, {
35
- item: next,
36
- index: 1
37
- })]
38
- }), children] });
39
- }
40
- function FooterItem({ item, index }) {
41
- const t = useTranslations({ note: "pagination" });
42
- const Icon = index === 0 ? ChevronLeft : ChevronRight;
43
- return /* @__PURE__ */ jsxs(Link, {
44
- href: item.url,
45
- className: cn("flex flex-col gap-2 rounded-lg border p-4 text-sm transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground @max-lg:col-span-full", index === 1 && "text-end"),
46
- children: [/* @__PURE__ */ jsxs("div", {
47
- className: cn("inline-flex items-center gap-1.5 font-medium", index === 1 && "flex-row-reverse"),
48
- children: [/* @__PURE__ */ jsx(Icon, { className: "-mx-1 size-4 shrink-0 rtl:rotate-180" }), /* @__PURE__ */ jsx("p", { children: item.name })]
49
- }), /* @__PURE__ */ jsx("p", {
50
- className: "text-fd-muted-foreground truncate",
51
- children: item.description ?? (index === 0 ? t("Previous Page") : t("Next Page"))
52
- })]
53
- });
54
- }
55
- //#endregion
56
- export { Footer };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/page/slots/footer';
@@ -1,181 +1 @@
1
- "use client";
2
- import { cn } from "../../../../utils/cn.js";
3
- import { TOCScrollArea, toc_exports, useItems, useTOCItems } from "../../../../components/toc/index.js";
4
- import { default_exports } from "../../../../components/toc/default.js";
5
- import { clerk_exports } from "../../../../components/toc/clerk.js";
6
- import { useTreePath } from "../../../../contexts/tree.js";
7
- import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../../components/ui/collapsible.js";
8
- import { jsx, jsxs } from "react/jsx-runtime";
9
- import { ChevronDown } from "lucide-react";
10
- import { createContext, use, useEffect, useEffectEvent, useMemo, useRef, useState } from "react";
11
- import { useTranslations } from "@fuma-translate/react";
12
- import { createPortal } from "react-dom";
13
- import { AnimatePresence, motion } from "motion/react";
14
- //#region src/layouts/flux/page/slots/toc.tsx
15
- const TocPopoverContext = createContext(null);
16
- const { TOCProvider } = toc_exports;
17
- function TOC({ container, trigger, content, header, footer, style = "normal", list }) {
18
- const items = useTOCItems();
19
- const { TOCItems, TOCEmpty, TOCItem } = style === "clerk" ? clerk_exports : default_exports;
20
- if (items.length === 0 && !header && !footer) return;
21
- return /* @__PURE__ */ jsxs(PageTOCPopover, {
22
- ...container,
23
- children: [/* @__PURE__ */ jsxs(PageTOCPopoverContent, {
24
- ...content,
25
- children: [
26
- header,
27
- /* @__PURE__ */ jsx(TOCScrollArea, { children: /* @__PURE__ */ jsxs(TOCItems, {
28
- ...list,
29
- children: [items.length === 0 && /* @__PURE__ */ jsx(TOCEmpty, {}), items.map((item) => /* @__PURE__ */ jsx(TOCItem, { item }, item.url))]
30
- }) }),
31
- footer
32
- ]
33
- }), /* @__PURE__ */ jsx(PageTOCPopoverTrigger, { ...trigger })]
34
- });
35
- }
36
- function PageTOCPopover(props) {
37
- const [container, setContainer] = useState(null);
38
- useEffect(() => {
39
- const element = document.getElementById("flux-layout-slot");
40
- if (!element) return;
41
- setContainer(element);
42
- }, []);
43
- if (!container) return;
44
- return createPortal(/* @__PURE__ */ jsx(PageTOCPopoverPhysical, { ...props }), container);
45
- }
46
- function PageTOCPopoverPhysical({ className, children, ...rest }) {
47
- const ref = useRef(null);
48
- const [open, setOpen] = useState(false);
49
- const onClick = useEffectEvent((e) => {
50
- if (!open) return;
51
- if (ref.current && !ref.current.contains(e.target)) setOpen(false);
52
- });
53
- useEffect(() => {
54
- window.addEventListener("click", onClick);
55
- return () => {
56
- window.removeEventListener("click", onClick);
57
- };
58
- }, []);
59
- return /* @__PURE__ */ jsx(TocPopoverContext, {
60
- value: useMemo(() => ({
61
- open,
62
- setOpen
63
- }), [setOpen, open]),
64
- children: /* @__PURE__ */ jsx(Collapsible, {
65
- open,
66
- onOpenChange: setOpen,
67
- "data-toc-popover": "",
68
- className: cn("relative h-9 animate-fd-fade-in", className),
69
- ...rest,
70
- children: /* @__PURE__ */ jsx("header", {
71
- ref,
72
- className: cn("absolute w-full bottom-0 border rounded-xl transition-colors bg-fd-secondary text-fd-secondary-foreground backdrop-blur-sm", open && "shadow-lg bg-fd-popover/80 text-fd-popover-foreground"),
73
- children
74
- })
75
- })
76
- });
77
- }
78
- function PageTOCPopoverTrigger({ className, ...props }) {
79
- const t = useTranslations({ note: "table of contents" });
80
- const { open } = use(TocPopoverContext);
81
- const items = useItems();
82
- const selectedIdx = items.findIndex((item) => item.active);
83
- const path = useTreePath().at(-1);
84
- const spanProps = {
85
- transition: { duration: .1 },
86
- initial: {
87
- opacity: 0,
88
- y: 10
89
- },
90
- animate: {
91
- opacity: 1,
92
- y: 0
93
- },
94
- exit: {
95
- opacity: 0,
96
- y: -10
97
- },
98
- className: cn(open && "text-fd-popover-foreground")
99
- };
100
- return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
101
- className: cn("flex w-full h-8.5 items-center text-sm text-fd-muted-foreground gap-2.5 px-2 text-start focus-visible:outline-none [&_svg]:size-4", className),
102
- "data-toc-popover-trigger": "",
103
- ...props,
104
- children: [
105
- /* @__PURE__ */ jsx(ProgressCircle, {
106
- value: (items.findLastIndex((item) => item.active) + 1) / Math.max(1, items.length),
107
- max: 1,
108
- className: cn("shrink-0", open && "text-fd-primary")
109
- }),
110
- /* @__PURE__ */ jsx(AnimatePresence, {
111
- mode: "wait",
112
- children: items[selectedIdx] && !open ? /* @__PURE__ */ jsx(motion.span, {
113
- ...spanProps,
114
- children: items[selectedIdx].original.title
115
- }, selectedIdx) : path ? /* @__PURE__ */ jsx(motion.span, {
116
- ...spanProps,
117
- children: path.name
118
- }, path.$id ?? ":pathId") : /* @__PURE__ */ jsx(motion.span, {
119
- ...spanProps,
120
- children: t("On this page")
121
- }, ":toc")
122
- }),
123
- /* @__PURE__ */ jsx(ChevronDown, { className: cn("ms-auto shrink-0 transition-transform", open && "rotate-180") })
124
- ]
125
- });
126
- }
127
- function clamp(input, min, max) {
128
- if (input < min) return min;
129
- if (input > max) return max;
130
- return input;
131
- }
132
- function ProgressCircle({ value, strokeWidth = 1.5, size = 18, min = 0, max = 100, style, ...restSvgProps }) {
133
- const normalizedValue = clamp(value, min, max);
134
- const radius = size / 2 - strokeWidth;
135
- const circumference = 2 * Math.PI * radius;
136
- const progress = normalizedValue / max * circumference;
137
- const circleProps = {
138
- cx: size / 2,
139
- cy: size / 2,
140
- r: radius,
141
- fill: "none",
142
- strokeWidth
143
- };
144
- return /* @__PURE__ */ jsxs("svg", {
145
- role: "progressbar",
146
- viewBox: `0 0 ${size} ${size}`,
147
- "aria-valuenow": normalizedValue,
148
- "aria-valuemin": min,
149
- "aria-valuemax": max,
150
- style: {
151
- width: size,
152
- height: size,
153
- ...style
154
- },
155
- ...restSvgProps,
156
- children: [/* @__PURE__ */ jsx("circle", {
157
- ...circleProps,
158
- className: "stroke-current/25"
159
- }), /* @__PURE__ */ jsx("circle", {
160
- ...circleProps,
161
- stroke: "currentColor",
162
- strokeDasharray: circumference,
163
- strokeDashoffset: circumference - progress,
164
- strokeLinecap: "round",
165
- transform: `rotate(-90 ${size / 2} ${size / 2})`,
166
- className: "transition-all"
167
- })]
168
- });
169
- }
170
- function PageTOCPopoverContent(props) {
171
- return /* @__PURE__ */ jsx(CollapsibleContent, {
172
- "data-toc-popover-content": "",
173
- ...props,
174
- children: /* @__PURE__ */ jsx("div", {
175
- className: "flex flex-col px-2 max-h-[50vh]",
176
- children: props.children
177
- })
178
- });
179
- }
180
- //#endregion
181
- export { TOC, TOCProvider };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/page/slots/toc';
@@ -1,13 +1 @@
1
- "use client";
2
- import { cn } from "../../../utils/cn.js";
3
- import { jsx } from "react/jsx-runtime";
4
- //#region src/layouts/flux/slots/container.tsx
5
- function Container(props) {
6
- return /* @__PURE__ */ jsx("div", {
7
- id: "nd-flux-layout",
8
- ...props,
9
- className: cn("flex flex-col items-center pb-24 overflow-x-clip", props.className)
10
- });
11
- }
12
- //#endregion
13
- export { Container };
1
+ export * from '@vx-oss/docs-vezham-ui/layouts/flux/slots/container';