fumadocs-ui 16.7.14 → 16.7.16
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.
- package/css/generated/shared.css +15 -9
- package/css/lib/shiki.css +11 -0
- package/dist/components/toc/clerk.d.ts +1 -0
- package/dist/components/toc/clerk.js +75 -61
- package/dist/components/toc/default.js +21 -7
- package/dist/layouts/home/slots/header.d.ts +1 -1
- package/dist/provider/base.d.ts +13 -12
- package/dist/provider/base.js +2 -2
- package/dist/style.css +19 -15
- package/package.json +6 -10
package/css/generated/shared.css
CHANGED
|
@@ -14,12 +14,13 @@
|
|
|
14
14
|
@source inline("*:has-[+:last-child[data-empty=true]]:border-b-0");
|
|
15
15
|
@source inline("*:last:border-b-0");
|
|
16
16
|
@source inline("*:rounded-full");
|
|
17
|
-
@source inline("--b");
|
|
18
17
|
@source inline("--callout-color");
|
|
19
18
|
@source inline("--color-fd-");
|
|
20
19
|
@source inline("--color-fd-muted");
|
|
21
20
|
@source inline("--fd-animated-height");
|
|
22
21
|
@source inline("--fd-banner-height");
|
|
22
|
+
@source inline("--offset-distance");
|
|
23
|
+
@source inline("--opacity");
|
|
23
24
|
@source inline("--padding-right");
|
|
24
25
|
@source inline("--radix-navigation-menu-viewport-height");
|
|
25
26
|
@source inline("--radix-popover-content-available-height");
|
|
@@ -28,7 +29,8 @@
|
|
|
28
29
|
@source inline("--shiki-dark-bg");
|
|
29
30
|
@source inline("--shiki-light-bg");
|
|
30
31
|
@source inline("--spacing");
|
|
31
|
-
@source inline("--
|
|
32
|
+
@source inline("--track-bottom");
|
|
33
|
+
@source inline("--track-top");
|
|
32
34
|
@source inline("-circle");
|
|
33
35
|
@source inline("-mb-px");
|
|
34
36
|
@source inline("-me-0.5");
|
|
@@ -69,6 +71,7 @@
|
|
|
69
71
|
@source inline("[&_svg]:size-5");
|
|
70
72
|
@source inline("[&_svg]:size-full");
|
|
71
73
|
@source inline("[&_svg]:text-fd-muted-foreground");
|
|
74
|
+
@source inline("[offset-distance:var(--offset-distance,0)]");
|
|
72
75
|
@source inline("[scrollbar-width:none]");
|
|
73
76
|
@source inline("a");
|
|
74
77
|
@source inline("about");
|
|
@@ -315,6 +318,7 @@
|
|
|
315
318
|
@source inline("display");
|
|
316
319
|
@source inline("displayName");
|
|
317
320
|
@source inline("displayed");
|
|
321
|
+
@source inline("distance");
|
|
318
322
|
@source inline("div");
|
|
319
323
|
@source inline("divide-fd-border");
|
|
320
324
|
@source inline("divide-x");
|
|
@@ -433,8 +437,6 @@
|
|
|
433
437
|
@source inline("group-data-[state=active]:bg-fd-primary");
|
|
434
438
|
@source inline("group-data-[state=open]:rotate-180");
|
|
435
439
|
@source inline("group-data-[state=open]:rotate-90");
|
|
436
|
-
@source inline("group-first:[--t:--spacing(0.75)]");
|
|
437
|
-
@source inline("group-last:[--b:--spacing(0.75)]");
|
|
438
440
|
@source inline("groupListeners");
|
|
439
441
|
@source inline("guides");
|
|
440
442
|
@source inline("h");
|
|
@@ -513,6 +515,8 @@
|
|
|
513
515
|
@source inline("invisible");
|
|
514
516
|
@source inline("is");
|
|
515
517
|
@source inline("isActive");
|
|
518
|
+
@source inline("isFirst");
|
|
519
|
+
@source inline("isLast");
|
|
516
520
|
@source inline("isLoading");
|
|
517
521
|
@source inline("isOpen");
|
|
518
522
|
@source inline("isTabActive");
|
|
@@ -638,6 +642,7 @@
|
|
|
638
642
|
@source inline("my-4");
|
|
639
643
|
@source inline("my-6");
|
|
640
644
|
@source inline("my-auto");
|
|
645
|
+
@source inline("n");
|
|
641
646
|
@source inline("name");
|
|
642
647
|
@source inline("namespace");
|
|
643
648
|
@source inline("nav");
|
|
@@ -682,7 +687,6 @@
|
|
|
682
687
|
@source inline("of");
|
|
683
688
|
@source inline("official");
|
|
684
689
|
@source inline("offset");
|
|
685
|
-
@source inline("offsetDistance");
|
|
686
690
|
@source inline("offsetPath");
|
|
687
691
|
@source inline("offsetTop");
|
|
688
692
|
@source inline("on");
|
|
@@ -707,6 +711,7 @@
|
|
|
707
711
|
@source inline("onTagChangeCallback");
|
|
708
712
|
@source inline("onValueChange");
|
|
709
713
|
@source inline("only");
|
|
714
|
+
@source inline("opacity-(--opacity,0)");
|
|
710
715
|
@source inline("opacity-0");
|
|
711
716
|
@source inline("open");
|
|
712
717
|
@source inline("opening");
|
|
@@ -721,6 +726,7 @@
|
|
|
721
726
|
@source inline("origin-[top_center]");
|
|
722
727
|
@source inline("original");
|
|
723
728
|
@source inline("other");
|
|
729
|
+
@source inline("out");
|
|
724
730
|
@source inline("outer");
|
|
725
731
|
@source inline("outline");
|
|
726
732
|
@source inline("outline-none");
|
|
@@ -753,6 +759,7 @@
|
|
|
753
759
|
@source inline("path");
|
|
754
760
|
@source inline("pathname");
|
|
755
761
|
@source inline("paths");
|
|
762
|
+
@source inline("pb-0");
|
|
756
763
|
@source inline("pb-2");
|
|
757
764
|
@source inline("pe-2");
|
|
758
765
|
@source inline("peer");
|
|
@@ -821,6 +828,7 @@
|
|
|
821
828
|
@source inline("rainbowColors");
|
|
822
829
|
@source inline("raw");
|
|
823
830
|
@source inline("rawTree");
|
|
831
|
+
@source inline("re-exported");
|
|
824
832
|
@source inline("react");
|
|
825
833
|
@source inline("react-hooks/exhaustive-deps");
|
|
826
834
|
@source inline("react-hooks/rules-of-hooks");
|
|
@@ -874,7 +882,6 @@
|
|
|
874
882
|
@source inline("rtl:rotate-180");
|
|
875
883
|
@source inline("rtl:rotate-90");
|
|
876
884
|
@source inline("s");
|
|
877
|
-
@source inline("scale");
|
|
878
885
|
@source inline("scope");
|
|
879
886
|
@source inline("scroll");
|
|
880
887
|
@source inline("scroll-into-view-if-needed");
|
|
@@ -1033,6 +1040,7 @@
|
|
|
1033
1040
|
@source inline("title");
|
|
1034
1041
|
@source inline("to");
|
|
1035
1042
|
@source inline("toc");
|
|
1043
|
+
@source inline("tocInfo");
|
|
1036
1044
|
@source inline("tocNoHeadings");
|
|
1037
1045
|
@source inline("toolbar");
|
|
1038
1046
|
@source inline("top");
|
|
@@ -1042,13 +1050,11 @@
|
|
|
1042
1050
|
@source inline("top-2.5");
|
|
1043
1051
|
@source inline("top-3");
|
|
1044
1052
|
@source inline("top-4");
|
|
1045
|
-
@source inline("top-[calc(50%-var(--t,0px)+var(--b,0px))]");
|
|
1046
|
-
@source inline("topL");
|
|
1047
1053
|
@source inline("touch");
|
|
1048
1054
|
@source inline("transform");
|
|
1049
1055
|
@source inline("transition-[clip-path]");
|
|
1050
1056
|
@source inline("transition-[height]");
|
|
1051
|
-
@source inline("transition-[offset-distance]");
|
|
1057
|
+
@source inline("transition-[opacity,offset-distance]");
|
|
1052
1058
|
@source inline("transition-[width,height]");
|
|
1053
1059
|
@source inline("transition-all");
|
|
1054
1060
|
@source inline("transition-colors");
|
package/css/lib/shiki.css
CHANGED
|
@@ -95,3 +95,14 @@
|
|
|
95
95
|
font-style: var(--shiki-dark-font-style);
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
|
+
|
|
99
|
+
/* inline code */
|
|
100
|
+
code.shiki span {
|
|
101
|
+
color: var(--shiki-light);
|
|
102
|
+
font-style: var(--shiki-light-font-style);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.dark code.shiki span {
|
|
106
|
+
color: var(--shiki-dark);
|
|
107
|
+
font-style: var(--shiki-dark-font-style);
|
|
108
|
+
}
|
|
@@ -5,7 +5,7 @@ import { cn } from "../../utils/cn.js";
|
|
|
5
5
|
import { mergeRefs } from "../../utils/merge-refs.js";
|
|
6
6
|
import { useTOCItems } from "./index.js";
|
|
7
7
|
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
8
|
-
import {
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
import * as Primitive from "fumadocs-core/toc";
|
|
10
10
|
//#region src/components/toc/clerk.tsx
|
|
11
11
|
var clerk_exports = /* @__PURE__ */ __exportAll({
|
|
@@ -13,7 +13,7 @@ var clerk_exports = /* @__PURE__ */ __exportAll({
|
|
|
13
13
|
TOCItem: () => TOCItem,
|
|
14
14
|
TOCItems: () => TOCItems
|
|
15
15
|
});
|
|
16
|
-
function TOCItems({ ref, className, thumbBox = true, ...props }) {
|
|
16
|
+
function TOCItems({ ref, className, thumbBox = true, children, ...props }) {
|
|
17
17
|
const containerRef = useRef(null);
|
|
18
18
|
const items = useTOCItems();
|
|
19
19
|
const [svg, setSvg] = useState(null);
|
|
@@ -78,12 +78,12 @@ function TOCItems({ ref, className, thumbBox = true, ...props }) {
|
|
|
78
78
|
if (thumbBox) {
|
|
79
79
|
const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
80
80
|
path.setAttribute("d", d);
|
|
81
|
-
|
|
82
|
-
for (
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
while (path.getPointAtLength(l).y <
|
|
86
|
-
itemLineLengths.push([
|
|
81
|
+
const n = path.getTotalLength();
|
|
82
|
+
for (let i = 0; i < positions.length; i++) {
|
|
83
|
+
const [top, bottom] = positions[i];
|
|
84
|
+
let l = i > 0 ? itemLineLengths[i - 1][1] + (top - positions[i - 1][1]) : top;
|
|
85
|
+
while (l < n && path.getPointAtLength(l).y < top) l++;
|
|
86
|
+
itemLineLengths.push([l, l + bottom - top]);
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
setSvg({
|
|
@@ -105,18 +105,15 @@ function TOCItems({ ref, className, thumbBox = true, ...props }) {
|
|
|
105
105
|
observer.unobserve(container);
|
|
106
106
|
};
|
|
107
107
|
}, [onPrint]);
|
|
108
|
-
return /* @__PURE__ */ jsxs(
|
|
109
|
-
className: "absolute top-0 inset-s-0",
|
|
110
|
-
style: {
|
|
111
|
-
width: svg.width,
|
|
112
|
-
height: svg.height
|
|
113
|
-
},
|
|
114
|
-
children: [/* @__PURE__ */ jsx(ThumbTrack, { computed: svg }), thumbBox && /* @__PURE__ */ jsx(ThumbBox, { computed: svg })]
|
|
115
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
108
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
116
109
|
ref: mergeRefs(containerRef, ref),
|
|
117
|
-
className: cn("flex flex-col", className),
|
|
118
|
-
...props
|
|
119
|
-
|
|
110
|
+
className: cn("relative flex flex-col", className),
|
|
111
|
+
...props,
|
|
112
|
+
children: [svg && /* @__PURE__ */ jsx(ThumbTrack, {
|
|
113
|
+
computed: svg,
|
|
114
|
+
thumbBox
|
|
115
|
+
}), children]
|
|
116
|
+
});
|
|
120
117
|
}
|
|
121
118
|
function TOCEmpty() {
|
|
122
119
|
const { text } = useI18n();
|
|
@@ -125,48 +122,60 @@ function TOCEmpty() {
|
|
|
125
122
|
children: text.tocNoHeadings
|
|
126
123
|
});
|
|
127
124
|
}
|
|
128
|
-
function ThumbTrack({ computed }) {
|
|
129
|
-
const
|
|
130
|
-
const
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
125
|
+
function ThumbTrack({ computed, thumbBox }) {
|
|
126
|
+
const ref = useRef(null);
|
|
127
|
+
const previousRef = useRef(null);
|
|
128
|
+
const tocInfo = Primitive.useTOC();
|
|
129
|
+
function calculate(items) {
|
|
130
|
+
const out = {};
|
|
131
|
+
const startIdx = items.findIndex((item) => item.active);
|
|
132
|
+
if (startIdx === -1) return out;
|
|
133
|
+
const endIdx = items.findLastIndex((item) => item.active);
|
|
134
|
+
out["--track-top"] = `${computed.positions[startIdx][0]}px`;
|
|
135
|
+
out["--track-bottom"] = `${computed.positions[endIdx][1]}px`;
|
|
136
|
+
if (thumbBox) {
|
|
137
|
+
let isUp = false;
|
|
138
|
+
if (previousRef.current) {
|
|
139
|
+
const prev = previousRef.current;
|
|
140
|
+
isUp = prev.startIdx > startIdx || prev.endIdx > endIdx || prev.startIdx === startIdx && prev.endIdx === endIdx && prev.isUp;
|
|
141
|
+
}
|
|
142
|
+
previousRef.current = {
|
|
143
|
+
startIdx,
|
|
144
|
+
endIdx,
|
|
145
|
+
isUp
|
|
146
|
+
};
|
|
147
|
+
out["--offset-distance"] = isUp ? `${computed.itemLineLengths[startIdx][0]}px` : `${computed.itemLineLengths[endIdx][1]}px`;
|
|
148
|
+
out["--opacity"] = items[isUp ? startIdx : endIdx].original._step !== void 0 ? "0" : "1";
|
|
149
|
+
}
|
|
150
|
+
return out;
|
|
151
|
+
}
|
|
152
|
+
Primitive.useTOCListener((items) => {
|
|
153
|
+
const element = ref.current;
|
|
154
|
+
if (!element) return;
|
|
155
|
+
for (const [k, v] of Object.entries(calculate(items))) element.style.setProperty(k, v);
|
|
156
|
+
});
|
|
157
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
158
|
+
ref,
|
|
159
|
+
className: "absolute top-0 inset-s-0",
|
|
139
160
|
style: {
|
|
140
161
|
width: computed.width,
|
|
141
162
|
height: computed.height,
|
|
142
|
-
|
|
163
|
+
...calculate(tocInfo.get())
|
|
143
164
|
},
|
|
144
|
-
children:
|
|
145
|
-
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
previousRef.current = {
|
|
159
|
-
startIdx,
|
|
160
|
-
endIdx,
|
|
161
|
-
isUp
|
|
162
|
-
};
|
|
163
|
-
return /* @__PURE__ */ jsx("div", {
|
|
164
|
-
className: "absolute size-1 bg-fd-primary rounded-full transition-[offset-distance]",
|
|
165
|
-
style: {
|
|
166
|
-
offsetPath: `path("${computed.d}")`,
|
|
167
|
-
offsetDistance: isUp ? computed.itemLineLengths[startIdx][0] : computed.itemLineLengths[endIdx][1],
|
|
168
|
-
scale: items[isUp ? startIdx : endIdx].original._step !== void 0 ? "0" : "1"
|
|
169
|
-
}
|
|
165
|
+
children: [/* @__PURE__ */ jsx("svg", {
|
|
166
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
167
|
+
viewBox: `0 0 ${computed.width} ${computed.height}`,
|
|
168
|
+
className: "absolute transition-[clip-path]",
|
|
169
|
+
style: {
|
|
170
|
+
width: computed.width,
|
|
171
|
+
height: computed.height,
|
|
172
|
+
clipPath: `polygon(0 var(--track-top,0), 100% var(--track-top,0), 100% var(--track-bottom,0), 0 var(--track-bottom,0))`
|
|
173
|
+
},
|
|
174
|
+
children: computed.content
|
|
175
|
+
}), thumbBox && /* @__PURE__ */ jsx("div", {
|
|
176
|
+
className: "absolute size-1 bg-fd-primary rounded-full [offset-distance:var(--offset-distance,0)] opacity-(--opacity,0) transition-[opacity,offset-distance]",
|
|
177
|
+
style: { offsetPath: `path("${computed.d}")` }
|
|
178
|
+
})]
|
|
170
179
|
});
|
|
171
180
|
}
|
|
172
181
|
const a = 8;
|
|
@@ -182,11 +191,13 @@ function getLineOffset(depth) {
|
|
|
182
191
|
}
|
|
183
192
|
function TOCItem({ item, ...props }) {
|
|
184
193
|
const items = useTOCItems();
|
|
185
|
-
const { lowerOffset, offset, upperOffset } = useMemo(() => {
|
|
194
|
+
const { lowerOffset, offset, upperOffset, isFirst, isLast } = useMemo(() => {
|
|
186
195
|
const index = items.indexOf(item);
|
|
187
196
|
const offset = getLineOffset(item.depth);
|
|
188
197
|
return {
|
|
189
198
|
offset,
|
|
199
|
+
isFirst: index === 0,
|
|
200
|
+
isLast: index === items.length - 1,
|
|
190
201
|
upperOffset: index > 0 ? getLineOffset(items[index - 1].depth) : offset,
|
|
191
202
|
lowerOffset: index + 1 < items.length ? getLineOffset(items[index + 1].depth) : offset
|
|
192
203
|
};
|
|
@@ -194,7 +205,7 @@ function TOCItem({ item, ...props }) {
|
|
|
194
205
|
return /* @__PURE__ */ jsxs(Primitive.TOCItem, {
|
|
195
206
|
href: item.url,
|
|
196
207
|
...props,
|
|
197
|
-
className: cn("
|
|
208
|
+
className: cn("prose relative py-1.5 text-sm scroll-m-4 text-fd-muted-foreground hover:text-fd-accent-foreground transition-colors wrap-anywhere data-[active=true]:text-fd-primary", isFirst && "pt-0", isLast && "pb-0", props.className),
|
|
198
209
|
style: {
|
|
199
210
|
paddingInlineStart: getItemOffset(item.depth),
|
|
200
211
|
...props.style
|
|
@@ -222,8 +233,11 @@ function TOCItem({ item, ...props }) {
|
|
|
222
233
|
style: { insetInlineStart: offset }
|
|
223
234
|
}),
|
|
224
235
|
item._step !== void 0 && /* @__PURE__ */ jsx("div", {
|
|
225
|
-
className: "absolute flex items-center justify-center -translate-1/2 -z-1
|
|
226
|
-
style: {
|
|
236
|
+
className: "absolute flex items-center justify-center -translate-1/2 -z-1 size-4 font-mono font-medium text-xs bg-fd-muted text-fd-muted-foreground rounded-full leading-none",
|
|
237
|
+
style: {
|
|
238
|
+
top: `calc(50% + ${(isFirst ? -.75 : 0) + (isLast ? .75 : 0)} * var(--spacing))`,
|
|
239
|
+
insetInlineStart: offset
|
|
240
|
+
},
|
|
227
241
|
children: item._step
|
|
228
242
|
}),
|
|
229
243
|
item.title
|
|
@@ -53,15 +53,29 @@ function TOCItems({ ref, className, ...props }) {
|
|
|
53
53
|
});
|
|
54
54
|
}
|
|
55
55
|
function TocThumb({ computed }) {
|
|
56
|
-
const
|
|
57
|
-
const
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
56
|
+
const ref = useRef(null);
|
|
57
|
+
const tocInfo = Primitive.useTOC();
|
|
58
|
+
function calculate(items) {
|
|
59
|
+
const out = {};
|
|
60
|
+
const startIdx = items.findIndex((item) => item.active);
|
|
61
|
+
if (startIdx === -1) return out;
|
|
62
|
+
const endIdx = items.findLastIndex((item) => item.active);
|
|
63
|
+
out["--track-top"] = `${computed.positions[startIdx][0]}px`;
|
|
64
|
+
out["--track-bottom"] = `${computed.positions[endIdx][1]}px`;
|
|
65
|
+
return out;
|
|
66
|
+
}
|
|
67
|
+
Primitive.useTOCListener((items) => {
|
|
68
|
+
const element = ref.current;
|
|
69
|
+
if (!element) return;
|
|
70
|
+
for (const [k, v] of Object.entries(calculate(items))) element.style.setProperty(k, v);
|
|
71
|
+
});
|
|
62
72
|
return /* @__PURE__ */ jsx("div", {
|
|
73
|
+
ref,
|
|
63
74
|
className: "absolute inset-y-0 inset-s-0 bg-fd-primary w-px transition-[clip-path]",
|
|
64
|
-
style: {
|
|
75
|
+
style: {
|
|
76
|
+
clipPath: `polygon(0 var(--track-top,0), 100% var(--track-top,0), 100% var(--track-bottom,0), 0 var(--track-bottom,0))`,
|
|
77
|
+
...calculate(tocInfo.get())
|
|
78
|
+
}
|
|
65
79
|
});
|
|
66
80
|
}
|
|
67
81
|
function TOCEmpty() {
|
|
@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
5
5
|
|
|
6
6
|
//#region src/layouts/home/slots/header.d.ts
|
|
7
7
|
declare const navItemVariants: (props?: ({
|
|
8
|
-
variant?: "
|
|
8
|
+
variant?: "icon" | "main" | "button" | null | undefined;
|
|
9
9
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
10
|
declare function Header(props: ComponentProps<'header'>): string | number | bigint | true | _$react_jsx_runtime0.JSX.Element | Iterable<_$react.ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<_$react.ReactNode> | null | undefined>;
|
|
11
11
|
//#endregion
|
package/dist/provider/base.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { SearchProviderProps } from "../contexts/search.js";
|
|
2
2
|
import { DefaultSearchDialogProps } from "../components/dialog/search-default.js";
|
|
3
3
|
import { I18nProviderProps } from "../contexts/i18n.js";
|
|
4
|
-
import {
|
|
4
|
+
import { ReactNode } from "react";
|
|
5
5
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
-
import {
|
|
6
|
+
import { ThemeProviderProps, UseThemeProps, useTheme } from "next-themes";
|
|
7
7
|
|
|
8
8
|
//#region src/provider/base.d.ts
|
|
9
9
|
interface SearchOptions extends Omit<SearchProviderProps, 'options' | 'children'> {
|
|
@@ -15,6 +15,14 @@ interface SearchOptions extends Omit<SearchProviderProps, 'options' | 'children'
|
|
|
15
15
|
*/
|
|
16
16
|
enabled?: boolean;
|
|
17
17
|
}
|
|
18
|
+
interface ThemeOptions extends ThemeProviderProps {
|
|
19
|
+
/**
|
|
20
|
+
* Enable `next-themes`
|
|
21
|
+
*
|
|
22
|
+
* @defaultValue true
|
|
23
|
+
*/
|
|
24
|
+
enabled?: boolean;
|
|
25
|
+
}
|
|
18
26
|
interface RootProviderProps {
|
|
19
27
|
/**
|
|
20
28
|
* `dir` option for Radix UI
|
|
@@ -25,16 +33,9 @@ interface RootProviderProps {
|
|
|
25
33
|
*/
|
|
26
34
|
search?: Partial<SearchOptions>;
|
|
27
35
|
/**
|
|
28
|
-
* Customise options
|
|
36
|
+
* Customise options for `next-themes`
|
|
29
37
|
*/
|
|
30
|
-
theme?:
|
|
31
|
-
/**
|
|
32
|
-
* Enable `next-themes`
|
|
33
|
-
*
|
|
34
|
-
* @defaultValue true
|
|
35
|
-
*/
|
|
36
|
-
enabled?: boolean;
|
|
37
|
-
};
|
|
38
|
+
theme?: ThemeOptions;
|
|
38
39
|
i18n?: Omit<I18nProviderProps, 'children'>;
|
|
39
40
|
children?: ReactNode;
|
|
40
41
|
}
|
|
@@ -46,4 +47,4 @@ declare function RootProvider({
|
|
|
46
47
|
i18n
|
|
47
48
|
}: RootProviderProps): _$react_jsx_runtime0.JSX.Element;
|
|
48
49
|
//#endregion
|
|
49
|
-
export { RootProvider, RootProviderProps };
|
|
50
|
+
export { RootProvider, RootProviderProps, type UseThemeProps, useTheme };
|
package/dist/provider/base.js
CHANGED
|
@@ -3,7 +3,7 @@ import { I18nProvider } from "../contexts/i18n.js";
|
|
|
3
3
|
import { SearchProvider } from "../contexts/search.js";
|
|
4
4
|
import { lazy } from "react";
|
|
5
5
|
import { jsx } from "react/jsx-runtime";
|
|
6
|
-
import { ThemeProvider } from "next-themes";
|
|
6
|
+
import { ThemeProvider, useTheme } from "next-themes";
|
|
7
7
|
import { DirectionProvider } from "@radix-ui/react-direction";
|
|
8
8
|
//#region src/provider/base.tsx
|
|
9
9
|
const DefaultSearchDialog = lazy(() => import("../components/dialog/search-default.js"));
|
|
@@ -32,4 +32,4 @@ function RootProvider({ children, dir = "ltr", theme = {}, search, i18n }) {
|
|
|
32
32
|
});
|
|
33
33
|
}
|
|
34
34
|
//#endregion
|
|
35
|
-
export { RootProvider };
|
|
35
|
+
export { RootProvider, useTheme };
|
package/dist/style.css
CHANGED
|
@@ -374,9 +374,6 @@
|
|
|
374
374
|
.top-\[calc\(--spacing\(4\)\+var\(--fd-docs-row-3\)\)\] {
|
|
375
375
|
top: calc(calc(var(--spacing) * 4) + var(--fd-docs-row-3));
|
|
376
376
|
}
|
|
377
|
-
.top-\[calc\(50\%-var\(--t\,0px\)\+var\(--b\,0px\)\)\] {
|
|
378
|
-
top: calc(50% - var(--t,0px) + var(--b,0px));
|
|
379
|
-
}
|
|
380
377
|
.right-2 {
|
|
381
378
|
right: calc(var(--spacing) * 2);
|
|
382
379
|
}
|
|
@@ -1688,6 +1685,9 @@
|
|
|
1688
1685
|
.pr-\(--removed-body-scroll-bar-size\,0\) {
|
|
1689
1686
|
padding-right: var(--removed-body-scroll-bar-size,0);
|
|
1690
1687
|
}
|
|
1688
|
+
.pb-0 {
|
|
1689
|
+
padding-bottom: calc(var(--spacing) * 0);
|
|
1690
|
+
}
|
|
1691
1691
|
.pb-1\.5 {
|
|
1692
1692
|
padding-bottom: calc(var(--spacing) * 1.5);
|
|
1693
1693
|
}
|
|
@@ -1827,6 +1827,9 @@
|
|
|
1827
1827
|
.underline {
|
|
1828
1828
|
text-decoration-line: underline;
|
|
1829
1829
|
}
|
|
1830
|
+
.opacity-\(--opacity\,0\) {
|
|
1831
|
+
opacity: var(--opacity,0);
|
|
1832
|
+
}
|
|
1830
1833
|
.opacity-0 {
|
|
1831
1834
|
opacity: 0%;
|
|
1832
1835
|
}
|
|
@@ -1894,8 +1897,8 @@
|
|
|
1894
1897
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1895
1898
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1896
1899
|
}
|
|
1897
|
-
.transition-\[offset-distance\] {
|
|
1898
|
-
transition-property: offset-distance;
|
|
1900
|
+
.transition-\[opacity\,offset-distance\] {
|
|
1901
|
+
transition-property: opacity,offset-distance;
|
|
1899
1902
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1900
1903
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1901
1904
|
}
|
|
@@ -2000,6 +2003,9 @@
|
|
|
2000
2003
|
.\[grid-area\:toc\] {
|
|
2001
2004
|
grid-area: toc;
|
|
2002
2005
|
}
|
|
2006
|
+
.\[offset-distance\:var\(--offset-distance\,0\)\] {
|
|
2007
|
+
offset-distance: var(--offset-distance,0);
|
|
2008
|
+
}
|
|
2003
2009
|
.\[scrollbar-width\:none\] {
|
|
2004
2010
|
scrollbar-width: none;
|
|
2005
2011
|
}
|
|
@@ -2104,16 +2110,6 @@
|
|
|
2104
2110
|
margin-bottom: calc(var(--spacing) * 2);
|
|
2105
2111
|
}
|
|
2106
2112
|
}
|
|
2107
|
-
.group-first\:\[--t\:--spacing\(0\.75\)\] {
|
|
2108
|
-
&:is(:where(.group):first-child *) {
|
|
2109
|
-
--t: calc(var(--spacing) * 0.75);
|
|
2110
|
-
}
|
|
2111
|
-
}
|
|
2112
|
-
.group-last\:\[--b\:--spacing\(0\.75\)\] {
|
|
2113
|
-
&:is(:where(.group):last-child *) {
|
|
2114
|
-
--b: calc(var(--spacing) * 0.75);
|
|
2115
|
-
}
|
|
2116
|
-
}
|
|
2117
2113
|
.group-data-\[state\=active\]\:bg-fd-primary {
|
|
2118
2114
|
&:is(:where(.group)[data-state="active"] *) {
|
|
2119
2115
|
background-color: var(--color-fd-primary);
|
|
@@ -3100,6 +3096,14 @@
|
|
|
3100
3096
|
font-style: var(--shiki-dark-font-style);
|
|
3101
3097
|
}
|
|
3102
3098
|
}
|
|
3099
|
+
code.shiki span {
|
|
3100
|
+
color: var(--shiki-light);
|
|
3101
|
+
font-style: var(--shiki-light-font-style);
|
|
3102
|
+
}
|
|
3103
|
+
.dark code.shiki span {
|
|
3104
|
+
color: var(--shiki-dark);
|
|
3105
|
+
font-style: var(--shiki-dark-font-style);
|
|
3106
|
+
}
|
|
3103
3107
|
@property --radix-collapsible-content-height {
|
|
3104
3108
|
syntax: '<length>';
|
|
3105
3109
|
inherits: false;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fumadocs-ui",
|
|
3
|
-
"version": "16.7.
|
|
3
|
+
"version": "16.7.16",
|
|
4
4
|
"description": "The Radix UI version of Fumadocs UI",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Docs",
|
|
@@ -141,13 +141,14 @@
|
|
|
141
141
|
"react-remove-scroll": "^2.7.2",
|
|
142
142
|
"rehype-raw": "^7.0.0",
|
|
143
143
|
"scroll-into-view-if-needed": "^3.1.0",
|
|
144
|
+
"shiki": "^4.0.2",
|
|
144
145
|
"tailwind-merge": "^3.5.0",
|
|
145
146
|
"unist-util-visit": "^5.1.0",
|
|
146
147
|
"@fumadocs/tailwind": "0.0.5"
|
|
147
148
|
},
|
|
148
149
|
"devDependencies": {
|
|
149
150
|
"@tailwindcss/cli": "^4.2.2",
|
|
150
|
-
"@tsdown/css": "^0.21.
|
|
151
|
+
"@tsdown/css": "^0.21.8",
|
|
151
152
|
"@types/hast": "^3.0.4",
|
|
152
153
|
"@types/mdx": "^2.0.13",
|
|
153
154
|
"@types/node": "^25.6.0",
|
|
@@ -155,12 +156,11 @@
|
|
|
155
156
|
"@types/react-dom": "^19.2.3",
|
|
156
157
|
"fuma-cli": "^0.0.5",
|
|
157
158
|
"react-medium-image-zoom": "^5.4.3",
|
|
158
|
-
"shiki": "^4.0.2",
|
|
159
159
|
"tailwindcss": "^4.2.2",
|
|
160
|
-
"tsdown": "0.21.
|
|
160
|
+
"tsdown": "0.21.8",
|
|
161
161
|
"unified": "^11.0.5",
|
|
162
162
|
"@fumadocs/cli": "1.3.7",
|
|
163
|
-
"fumadocs-core": "16.7.
|
|
163
|
+
"fumadocs-core": "16.7.16",
|
|
164
164
|
"tsconfig": "0.0.0"
|
|
165
165
|
},
|
|
166
166
|
"peerDependencies": {
|
|
@@ -170,16 +170,12 @@
|
|
|
170
170
|
"next": "16.x.x",
|
|
171
171
|
"react": "^19.2.0",
|
|
172
172
|
"react-dom": "^19.2.0",
|
|
173
|
-
"
|
|
174
|
-
"fumadocs-core": "16.7.14"
|
|
173
|
+
"fumadocs-core": "16.7.16"
|
|
175
174
|
},
|
|
176
175
|
"peerDependenciesMeta": {
|
|
177
176
|
"next": {
|
|
178
177
|
"optional": true
|
|
179
178
|
},
|
|
180
|
-
"shiki": {
|
|
181
|
-
"optional": true
|
|
182
|
-
},
|
|
183
179
|
"@takumi-rs/image-response": {
|
|
184
180
|
"optional": true
|
|
185
181
|
},
|