fumadocs-ui 12.0.6 → 12.1.0

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 (10) hide show
  1. package/dist/{chunk-E5OQ6FBQ.js → chunk-GQSNSUPR.js} +16 -2
  2. package/dist/components/callout.d.ts +1 -1
  3. package/dist/components/codeblock.d.ts +4 -0
  4. package/dist/components/codeblock.js +1 -1
  5. package/dist/components/roll-button.js +1 -0
  6. package/dist/docs.client.js +22 -34
  7. package/dist/mdx.client.js +1 -1
  8. package/dist/provider.d.ts +2 -2
  9. package/dist/twoslash.css +1 -1
  10. package/package.json +3 -3
package/dist/{chunk-E5OQ6FBQ.js → chunk-GQSNSUPR.js} RENAMED
@@ -15,7 +15,11 @@ import {
15
15
 
16
16
  // src/components/codeblock.tsx
17
17
  import { Check, Copy } from "lucide-react";
18
- import { forwardRef, useCallback, useRef } from "react";
18
+ import {
19
+ forwardRef,
20
+ useCallback,
21
+ useRef
22
+ } from "react";
19
23
  import { jsx, jsxs } from "react/jsx-runtime";
20
24
  var Pre = forwardRef(
21
25
  ({ className, ...props }, ref) => {
@@ -46,7 +50,17 @@ var CodeBlock = forwardRef(
46
50
  ...props,
47
51
  children: [
48
52
  title ? /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-2 border-b bg-muted px-4 py-1.5", children: [
49
- /* @__PURE__ */ jsx("div", { className: "text-muted-foreground [&_svg]:size-3.5", children: icon }),
53
+ icon ? /* @__PURE__ */ jsx(
54
+ "div",
55
+ {
56
+ className: "text-muted-foreground [&_svg]:size-3.5",
57
+ ...typeof icon === "string" ? {
58
+ dangerouslySetInnerHTML: { __html: icon }
59
+ } : {
60
+ children: icon
61
+ }
62
+ }
63
+ ) : null,
50
64
  /* @__PURE__ */ jsx("figcaption", { className: "flex-1 truncate text-muted-foreground", children: title }),
51
65
  allowCopy ? /* @__PURE__ */ jsx(CopyButton, { className: "-me-2", onCopy }) : null
52
66
  ] }) : allowCopy && /* @__PURE__ */ jsx(
package/dist/components/callout.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { HTMLAttributes, ReactNode } from 'react';
3
3
 
4
- declare const Callout: React.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "title" | "icon" | "type"> & {
4
+ declare const Callout: React.ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "title" | "type" | "icon"> & {
5
5
  title?: ReactNode;
6
6
  /**
7
7
  * @defaultValue info
package/dist/components/codeblock.d.ts CHANGED
@@ -4,6 +4,8 @@ import { HTMLAttributes, ReactNode } from 'react';
4
4
  type CodeBlockProps = HTMLAttributes<HTMLElement> & {
5
5
  /**
6
6
  * Icon of code block
7
+ *
8
+ * When passed as a string, it assumes the value is the HTML of icon
7
9
  */
8
10
  icon?: ReactNode;
9
11
  allowCopy?: boolean;
@@ -12,6 +14,8 @@ declare const Pre: React.ForwardRefExoticComponent<HTMLAttributes<HTMLPreElement
12
14
  declare const CodeBlock: React.ForwardRefExoticComponent<HTMLAttributes<HTMLElement> & {
13
15
  /**
14
16
  * Icon of code block
17
+ *
18
+ * When passed as a string, it assumes the value is the HTML of icon
15
19
  */
16
20
  icon?: ReactNode;
17
21
  allowCopy?: boolean | undefined;
package/dist/components/codeblock.js CHANGED
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  CodeBlock,
4
4
  Pre
5
- } from "../chunk-E5OQ6FBQ.js";
5
+ } from "../chunk-GQSNSUPR.js";
6
6
  import "../chunk-VYTHQTZE.js";
7
7
  import "../chunk-2KMKNVSN.js";
8
8
  import "../chunk-7GZKFBAP.js";
package/dist/components/roll-button.js CHANGED
@@ -33,6 +33,7 @@ function RollButton({
33
33
  const nearTop = element.scrollTop / (element.scrollHeight - element.clientHeight) < percentage;
34
34
  setShow(!nearTop);
35
35
  };
36
+ listener();
36
37
  window.addEventListener("scroll", listener);
37
38
  return () => {
38
39
  window.removeEventListener("scroll", listener);
package/dist/docs.client.js CHANGED
@@ -58,7 +58,7 @@ import {
58
58
  useState
59
59
  } from "react";
60
60
  import Link from "fumadocs-core/link";
61
- import { jsx, jsxs } from "react/jsx-runtime";
61
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
62
62
  var itemVariants = cva(
63
63
  "flex w-full flex-row items-center gap-2 rounded-md px-2 py-1.5 text-muted-foreground transition-colors duration-100 [&_svg]:size-4",
64
64
  {
@@ -89,6 +89,7 @@ function Sidebar({
89
89
  bannerProps,
90
90
  footerProps
91
91
  }) {
92
+ const search = useSearchContext();
92
93
  const context = useMemo(
93
94
  () => ({
94
95
  defaultOpenLevel,
@@ -118,7 +119,7 @@ function Sidebar({
118
119
  ),
119
120
  children: [
120
121
  banner,
121
- /* @__PURE__ */ jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" })
122
+ search.enabled ? /* @__PURE__ */ jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" }) : null
122
123
  ]
123
124
  }
124
125
  ),
@@ -223,40 +224,26 @@ function FolderNode({
223
224
  },
224
225
  [closeOnRedirect, active]
225
226
  );
227
+ const content = /* @__PURE__ */ jsxs(Fragment, { children: [
228
+ icon,
229
+ name,
230
+ /* @__PURE__ */ jsx(
231
+ ChevronDown,
232
+ {
233
+ className: twMerge("ms-auto transition-transform", !extend && "-rotate-90")
234
+ }
235
+ )
236
+ ] });
226
237
  return /* @__PURE__ */ jsxs(Collapsible, { open: extend, onOpenChange: setExtend, children: [
227
- index ? /* @__PURE__ */ jsxs(
238
+ index ? /* @__PURE__ */ jsx(
228
239
  Link,
229
240
  {
230
241
  className: twMerge(itemVariants({ active })),
231
242
  href: index.url,
232
243
  onClick,
233
- children: [
234
- icon,
235
- name,
236
- /* @__PURE__ */ jsx(
237
- ChevronDown,
238
- {
239
- className: twMerge(
240
- "ms-auto transition-transform",
241
- !extend && "-rotate-90"
242
- )
243
- }
244
- )
245
- ]
244
+ children: content
246
245
  }
247
- ) : /* @__PURE__ */ jsxs(CollapsibleTrigger, { className: twMerge(itemVariants({ active })), children: [
248
- icon,
249
- name,
250
- /* @__PURE__ */ jsx(
251
- ChevronDown,
252
- {
253
- className: twMerge(
254
- "ms-auto transition-transform",
255
- !extend && "-rotate-90"
256
- )
257
- }
258
- )
259
- ] }),
246
+ ) : /* @__PURE__ */ jsx(CollapsibleTrigger, { className: twMerge(itemVariants({ active })), children: content }),
260
247
  /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx(
261
248
  NodeList,
262
249
  {
@@ -276,14 +263,15 @@ function SeparatorNode({
276
263
  // src/components/layout/dynamic-sidebar.tsx
277
264
  import { useCallback as useCallback2, useRef, useState as useState2 } from "react";
278
265
  import { SidebarIcon } from "lucide-react";
279
- import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
266
+ import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
280
267
  function DynamicSidebar(props) {
281
268
  const { collapsed, setCollapsed } = useSidebar();
282
269
  const [hover, setHover] = useState2(false);
283
270
  const timerRef = useRef(0);
284
271
  const onCollapse = useCallback2(() => {
285
- setCollapsed(!collapsed);
286
- }, [collapsed, setCollapsed]);
272
+ setCollapsed((v) => !v);
273
+ setHover(false);
274
+ }, [setCollapsed]);
287
275
  const onHover = useCallback2((e) => {
288
276
  if (e.pointerType === "touch") return;
289
277
  window.clearTimeout(timerRef.current);
@@ -296,7 +284,7 @@ function DynamicSidebar(props) {
296
284
  setHover(false);
297
285
  }, 300);
298
286
  }, []);
299
- return /* @__PURE__ */ jsxs2(Fragment, { children: [
287
+ return /* @__PURE__ */ jsxs2(Fragment2, { children: [
300
288
  collapsed ? /* @__PURE__ */ jsx2(
301
289
  "div",
302
290
  {
@@ -336,7 +324,7 @@ function DynamicSidebar(props) {
336
324
  collapsed && "md:fixed md:inset-y-2 md:start-2 md:h-auto md:rounded-xl md:border md:shadow-md"
337
325
  )
338
326
  },
339
- footer: /* @__PURE__ */ jsxs2(Fragment, { children: [
327
+ footer: /* @__PURE__ */ jsxs2(Fragment2, { children: [
340
328
  props.footer,
341
329
  /* @__PURE__ */ jsx2(
342
330
  "button",
package/dist/mdx.client.js CHANGED
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  CodeBlock,
4
4
  Pre
5
- } from "./chunk-E5OQ6FBQ.js";
5
+ } from "./chunk-GQSNSUPR.js";
6
6
  import "./chunk-VYTHQTZE.js";
7
7
  import "./chunk-2KMKNVSN.js";
8
8
  import "./chunk-7GZKFBAP.js";
package/dist/provider.d.ts CHANGED
@@ -53,9 +53,9 @@ declare function useSearchContext(): SearchContextType;
53
53
 
54
54
  interface SidebarContext {
55
55
  open: boolean;
56
- setOpen: (v: boolean) => void;
56
+ setOpen: React.Dispatch<React.SetStateAction<boolean>>;
57
57
  collapsed: boolean;
58
- setCollapsed: (v: boolean) => void;
58
+ setCollapsed: React.Dispatch<React.SetStateAction<boolean>>;
59
59
  /**
60
60
  * When set to true, close the sidebar on redirection
61
61
  */
package/dist/twoslash.css CHANGED
@@ -1 +1 @@
1
- :root{--twoslash-error-color:#d45656;--twoslash-error-bg:rgba(212,86,86,.125);--twoslash-tag-color:#3772cf;--twoslash-tag-bg:rgba(55,114,207,.125);--twoslash-tag-warn-color:#c37d0d;--twoslash-tag-warn-bg:rgba(195,125,13,.125);--twoslash-tag-annotate-color:#1ba673;--twoslash-tag-annotate-bg:rgba(27,166,115,.125)}.twoslash-query-presisted .twoslash-popup-container,.twoslash-completion-list{-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:normal;background-color:hsl(var(--popover));color:hsl(var(--popover-foreground));z-index:10;border-width:1px;border-radius:6px;flex-direction:column;width:20rem;padding:8px;display:flex;position:absolute;top:0;left:0;transform:translateY(16px);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1)}.twoslash-query-presisted .twoslash-popup-container:hover,.twoslash-completion-list:hover{-webkit-user-select:auto;-ms-user-select:auto;user-select:auto}.twoslash-popup-arrow{pointer-events:none;background-color:hsl(var(--popover));border-top-width:1px;border-right-width:1px;width:6px;height:6px;position:absolute;top:-4px;left:1em;transform:rotate(-45deg)}.twoslash-popup-docs-tag{flex-direction:column;gap:.5em;display:flex}.twoslash-popup-docs-tag-name{font-weight:600}.twoslash-popup-code{font-size:14px;display:block!important}.twoslash-popup-code .line{padding-left:0!important}.twoslash-popup-docs{color:hsl(var(--muted-foreground))!important;margin-top:8px!important;font-size:14px!important;line-height:20px!important}.twoslash:hover .twoslash-hover{border-color:currentColor}.twoslash .twoslash-hover{border-color:transparent;border-bottom-style:dotted;border-bottom-width:1px;transition:border .3s;position:relative}.twoslash .twoslash-error-line{background-color:var(--twoslash-error-bg);border-left:3px solid var(--twoslash-error-color);color:var(--twoslash-error-color);margin:.2em 0;padding:6px 12px;position:relative}.twoslash .twoslash-error{-webkit-text-decoration:wavy underline var(--twoslash-error-color);text-decoration:wavy underline var(--twoslash-error-color);padding-bottom:2px}.twoslash .twoslash-completion-cursor{position:relative}.twoslash-completion-list:before{content:" ";background-color:hsl(var(--foreground));width:1px;height:1em;position:absolute;top:-1.2em;left:-1px}.twoslash-completion-list li{text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:.5rem;font-size:13px;display:inline-flex;overflow:hidden}.twoslash-completion-list li span.twoslash-completions-unmatched{color:hsl(var(--muted-foreground))}.twoslash-completion-list .deprecated{opacity:.5;text-decoration:line-through}.twoslash-completion-list .twoslash-completions-icon{color:hsl(var(--muted-foreground));flex:none;width:1em}.twoslash .twoslash-tag-line{background-color:var(--twoslash-tag-bg);border-left:3px solid var(--twoslash-tag-color);color:var(--twoslash-tag-color);align-items:center;gap:.3em;margin:.2em 0;padding:6px 10px;display:flex;position:relative}.twoslash .twoslash-tag-line .twoslash-tag-icon{color:inherit;width:1.1em}.twoslash .twoslash-tag-line.twoslash-tag-error-line{background-color:var(--twoslash-error-bg);border-left:3px solid var(--twoslash-error-color);color:var(--twoslash-error-color)}.twoslash .twoslash-tag-line.twoslash-tag-warn-line{background-color:var(--twoslash-tag-warn-bg);border-left:3px solid var(--twoslash-tag-warn-color);color:var(--twoslash-tag-warn-color)}.twoslash .twoslash-tag-line.twoslash-tag-annotate-line{background-color:var(--twoslash-tag-annotate-bg);border-left:3px solid var(--twoslash-tag-annotate-color);color:var(--twoslash-tag-annotate-color)}@media (prefers-reduced-motion:reduce){.twoslash *{transition:none!important}}
1
+ :root{--twoslash-error-color:#d45656;--twoslash-error-bg:rgba(212,86,86,.125);--twoslash-tag-color:#3772cf;--twoslash-tag-bg:rgba(55,114,207,.125);--twoslash-tag-warn-color:#c37d0d;--twoslash-tag-warn-bg:rgba(195,125,13,.125);--twoslash-tag-annotate-color:#1ba673;--twoslash-tag-annotate-bg:rgba(27,166,115,.125)}.twoslash-query-presisted .twoslash-popup-container,.twoslash-completion-list{-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:normal;background-color:hsl(var(--popover));color:hsl(var(--popover-foreground));z-index:10;border-width:1px;border-radius:6px;flex-direction:column;width:20rem;padding:8px;display:flex;position:absolute;top:0;left:0;transform:translateY(16px);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1)}.twoslash-query-presisted .twoslash-popup-container:hover,.twoslash-completion-list:hover{-webkit-user-select:auto;-ms-user-select:auto;user-select:auto}.twoslash-popup-arrow{pointer-events:none;background-color:hsl(var(--popover));border-top-width:1px;border-right-width:1px;width:6px;height:6px;position:absolute;top:-4px;left:1em;transform:rotate(-45deg)}.twoslash-popup-docs-tag{flex-direction:column;gap:.5em;display:flex}.twoslash-popup-docs-tag-name{font-weight:600}.twoslash-popup-code{font-size:14px;display:block!important}.twoslash-popup-code .line{padding-left:0!important}.twoslash-popup-docs,.twoslash-popup-docs-tags{color:hsl(var(--muted-foreground))!important;margin-top:8px!important;font-size:14px!important;line-height:20px!important}.twoslash:hover .twoslash-hover{border-color:currentColor}.twoslash .twoslash-hover{border-color:transparent;border-bottom-style:dotted;border-bottom-width:1px;transition:border .3s;position:relative}.twoslash .twoslash-error-line{background-color:var(--twoslash-error-bg);border-left:3px solid var(--twoslash-error-color);color:var(--twoslash-error-color);margin:.2em 0;padding:6px 12px;position:relative}.twoslash .twoslash-error{-webkit-text-decoration:wavy underline var(--twoslash-error-color);text-decoration:wavy underline var(--twoslash-error-color);padding-bottom:2px}.twoslash .twoslash-completion-cursor{position:relative}.twoslash-completion-list:before{content:" ";background-color:hsl(var(--foreground));width:1px;height:1em;position:absolute;top:-1.2em;left:-1px}.twoslash-completion-list li{text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:.5rem;font-size:13px;display:inline-flex;overflow:hidden}.twoslash-completion-list li span.twoslash-completions-unmatched{color:hsl(var(--muted-foreground))}.twoslash-completion-list .deprecated{opacity:.5;text-decoration:line-through}.twoslash-completion-list .twoslash-completions-icon{color:hsl(var(--muted-foreground));flex:none;width:1em}.twoslash .twoslash-tag-line{background-color:var(--twoslash-tag-bg);border-left:3px solid var(--twoslash-tag-color);color:var(--twoslash-tag-color);align-items:center;gap:.3em;margin:.2em 0;padding:6px 10px;display:flex;position:relative}.twoslash .twoslash-tag-line .twoslash-tag-icon{color:inherit;width:1.1em}.twoslash .twoslash-tag-line.twoslash-tag-error-line{background-color:var(--twoslash-error-bg);border-left:3px solid var(--twoslash-error-color);color:var(--twoslash-error-color)}.twoslash .twoslash-tag-line.twoslash-tag-warn-line{background-color:var(--twoslash-tag-warn-bg);border-left:3px solid var(--twoslash-tag-warn-color);color:var(--twoslash-tag-warn-color)}.twoslash .twoslash-tag-line.twoslash-tag-annotate-line{background-color:var(--twoslash-tag-annotate-bg);border-left:3px solid var(--twoslash-tag-annotate-color);color:var(--twoslash-tag-annotate-color)}@media (prefers-reduced-motion:reduce){.twoslash *{transition:none!important}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "12.0.6",
3
+ "version": "12.1.0",
4
4
  "description": "The framework for building a documentation website in Next.js",
5
5
  "keywords": [
6
6
  "NextJs",
@@ -91,11 +91,11 @@
91
91
  "@tailwindcss/typography": "^0.5.13",
92
92
  "class-variance-authority": "^0.7.0",
93
93
  "cmdk": "^1.0.0",
94
- "lucide-react": "^0.394.0",
94
+ "lucide-react": "^0.395.0",
95
95
  "next-themes": "^0.3.0",
96
96
  "react-medium-image-zoom": "^5.2.4",
97
97
  "tailwind-merge": "^2.3.0",
98
- "fumadocs-core": "12.0.6"
98
+ "fumadocs-core": "12.1.0"
99
99
  },
100
100
  "devDependencies": {
101
101
  "@algolia/client-search": "^4.23.3",