fumadocs-ui 15.7.9 → 15.7.11

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/shiki.css CHANGED
@@ -1,88 +1,92 @@
1
- .shiki:not(.not-fumadocs-codeblock *) {
1
+ :root {
2
2
  --padding-left: calc(var(--spacing) * 4);
3
3
  --padding-right: calc(var(--spacing) * 4);
4
+ }
4
5
 
6
+ .shiki:not(.not-fumadocs-codeblock *) {
5
7
  code span {
6
8
  color: var(--shiki-light);
7
9
  }
10
+ }
11
+
12
+ .dark .shiki:not(.not-fumadocs-codeblock *) {
13
+ code span {
14
+ color: var(--shiki-dark);
15
+ }
16
+ }
8
17
 
9
- code .line {
18
+ :is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
19
+ .line& {
10
20
  position: relative;
11
21
  min-height: 1lh;
12
22
  padding-left: var(--padding-left);
13
23
  padding-right: var(--padding-right);
14
24
  }
15
25
 
16
- &.has-focused code .line:not(.focused) {
26
+ .has-focused .line&:not(.focused) {
17
27
  filter: blur(2px);
18
28
  transition: filter 200ms;
19
29
  }
20
30
 
21
- &.has-focused:hover code .line:not(.focused) {
31
+ .has-focused:hover .line&:not(.focused) {
22
32
  filter: blur(0);
23
33
  }
24
34
 
25
- &[data-line-numbers] code .twoslash-meta-line {
35
+ [data-line-numbers] .twoslash-meta-line& {
26
36
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
27
37
  }
28
38
 
29
- &[data-line-numbers] code .line {
39
+ [data-line-numbers] .line& {
30
40
  counter-increment: line;
31
41
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
42
+ }
32
43
 
33
- &::after {
34
- position: absolute;
35
- content: counter(line);
36
- color: color-mix(
37
- in oklab,
38
- var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%,
39
- transparent
40
- );
41
- @apply top-0 left-4;
42
- }
44
+ [data-line-numbers] .line&::after {
45
+ position: absolute;
46
+ content: counter(line);
47
+ color: color-mix(
48
+ in oklab,
49
+ var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%,
50
+ transparent
51
+ );
52
+ @apply top-0 left-4;
43
53
  }
44
54
 
45
- code .diff::before {
55
+ .diff&::before {
46
56
  position: absolute;
47
57
  left: calc(var(--spacing) * 1.5);
48
58
  }
49
59
 
50
- code .diff.remove {
60
+ .diff.remove& {
51
61
  opacity: 0.7;
52
62
  --fd-counter-color: var(--color-fd-diff-remove-symbol);
53
63
  @apply bg-fd-diff-remove;
54
64
  }
55
65
 
56
- code .diff.remove::before {
66
+ .diff.remove&::before {
57
67
  content: '-';
58
68
  @apply text-fd-diff-remove-symbol;
59
69
  }
60
70
 
61
- code .diff.add {
71
+ .diff.add& {
62
72
  --fd-counter-color: var(--color-fd-diff-add-symbol);
63
73
  @apply bg-fd-diff-add;
64
74
  }
65
75
 
66
- code .diff.add::before {
76
+ .diff.add&::before {
67
77
  content: '+';
68
78
  @apply text-fd-diff-add-symbol;
69
79
  }
70
80
 
71
- code .highlighted {
81
+ .highlighted& {
72
82
  --fd-counter-color: var(--color-fd-primary);
73
83
  padding-left: calc(var(--padding-left) - 2px);
74
84
 
75
85
  @apply border-l-2 border-fd-primary/50 bg-fd-primary/10;
76
86
  }
77
87
 
78
- code .highlighted-word {
88
+ .highlighted-word& {
79
89
  padding: 1px;
80
90
  @apply border -my-px border-fd-primary/30 bg-fd-primary/10 rounded-md font-medium;
81
91
  }
82
92
  }
83
-
84
- .dark .shiki:not(.not-fumadocs-codeblock *) {
85
- code span {
86
- color: var(--shiki-dark);
87
- }
88
- }
@@ -13,7 +13,7 @@ const keyVariants = cva('text-fd-primary', {
13
13
  },
14
14
  },
15
15
  });
16
- const fieldVariants = cva('text-fd-muted-foreground not-prose');
16
+ const fieldVariants = cva('text-fd-muted-foreground not-prose pe-2');
17
17
  export function TypeTable({ type }) {
18
18
  return (_jsxs("div", { className: "@container flex flex-col p-1 bg-fd-card text-fd-card-foreground rounded-2xl border my-6 text-sm overflow-hidden", children: [_jsxs("div", { className: "flex font-medium items-center px-3 py-1 not-prose text-fd-muted-foreground", children: [_jsx("p", { className: "w-[25%]", children: "Prop" }), _jsx("p", { className: "@max-xl:hidden", children: "Type" })] }), Object.entries(type).map(([key, value]) => (_jsx(Item, { name: key, item: value }, key)))] }));
19
19
  }
@@ -21,7 +21,8 @@ function Item({ name, item: { parameters = [], description, required = false, de
21
21
  const [open, setOpen] = useState(false);
22
22
  return (_jsxs(Collapsible, { open: open, onOpenChange: setOpen, className: cn('rounded-xl border overflow-hidden transition-all', open
23
23
  ? 'shadow-sm bg-fd-background not-last:mb-2'
24
- : 'border-transparent'), children: [_jsxs(CollapsibleTrigger, { className: "relative flex flex-row items-center w-full group text-start px-3 py-2 not-prose hover:bg-fd-accent", children: [_jsx("span", { className: "pe-2 min-w-fit font-medium w-[25%]", children: _jsxs("code", { className: cn(keyVariants({
25
- deprecated,
26
- })), children: [name, !required && '?'] }) }), typeDescriptionLink ? (_jsx(Link, { href: typeDescriptionLink, className: "underline @max-xl:hidden", children: type })) : (_jsx("span", { className: "@max-xl:hidden", children: type })), _jsx(ChevronDown, { className: "absolute end-2 size-4 text-fd-muted-foreground transition-transform group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsxs("div", { className: "grid grid-cols-[1fr_3fr] gap-x-2 gap-y-4 text-sm p-3 overflow-auto fd-scroll-container border-t", children: [_jsx("div", { className: "text-sm prose col-span-full prose-no-margin empty:hidden", children: description }), typeDescription && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Type" }), _jsx("p", { className: "my-auto not-prose", children: typeDescription })] })), defaultValue && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Default" }), _jsx("p", { className: "my-auto not-prose", children: defaultValue })] })), parameters.length > 0 && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Parameters" }), _jsx("div", { className: "flex flex-col gap-2", children: parameters.map((param) => (_jsxs("div", { className: "inline-flex items-center gap-1", children: [_jsxs("p", { className: "font-medium not-prose", children: [param.name, " -"] }), _jsx("div", { className: "text-sm prose prose-no-margin", children: param.description })] }, param.name))) })] })), returns && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Returns" }), _jsx("div", { className: "my-auto text-sm prose prose-no-margin", children: returns })] }))] }) })] }));
24
+ : 'border-transparent'), children: [_jsxs(CollapsibleTrigger, { className: "relative flex flex-row items-center w-full group text-start px-3 py-2 not-prose hover:bg-fd-accent", children: [_jsxs("code", { className: cn(keyVariants({
25
+ deprecated,
26
+ className: 'min-w-fit w-[25%] font-medium',
27
+ })), children: [name, !required && '?'] }), typeDescriptionLink ? (_jsx(Link, { href: typeDescriptionLink, className: "underline @max-xl:hidden", children: type })) : (_jsx("span", { className: "@max-xl:hidden", children: type })), _jsx(ChevronDown, { className: "absolute end-2 size-4 text-fd-muted-foreground transition-transform group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsxs("div", { className: "grid grid-cols-[1fr_3fr] gap-y-4 text-sm p-3 overflow-auto fd-scroll-container border-t", children: [_jsx("div", { className: "text-sm prose col-span-full prose-no-margin empty:hidden", children: description }), typeDescription && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Type" }), _jsx("p", { className: "my-auto not-prose", children: typeDescription })] })), defaultValue && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Default" }), _jsx("p", { className: "my-auto not-prose", children: defaultValue })] })), parameters.length > 0 && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Parameters" }), _jsx("div", { className: "flex flex-col gap-2", children: parameters.map((param) => (_jsxs("div", { className: "inline-flex items-center flex-wrap gap-1", children: [_jsxs("p", { className: "font-medium not-prose text-nowrap", children: [param.name, " -"] }), _jsx("div", { className: "text-sm prose prose-no-margin", children: param.description })] }, param.name))) })] })), returns && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Returns" }), _jsx("div", { className: "my-auto text-sm prose prose-no-margin", children: returns })] }))] }) })] }));
27
28
  }
package/dist/style.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */
1
+ /*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
@@ -1215,9 +1215,6 @@
1215
1215
  .gap-6 {
1216
1216
  gap: calc(var(--spacing) * 6);
1217
1217
  }
1218
- .gap-x-2 {
1219
- column-gap: calc(var(--spacing) * 2);
1220
- }
1221
1218
  .gap-y-4 {
1222
1219
  row-gap: calc(var(--spacing) * 4);
1223
1220
  }
@@ -1718,7 +1715,7 @@
1718
1715
  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1719
1716
  }
1720
1717
  .transition {
1721
- transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;
1718
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
1722
1719
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1723
1720
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1724
1721
  }
@@ -1908,7 +1905,6 @@
1908
1905
  }
1909
1906
  .before\:content-\[\'\'\] {
1910
1907
  &::before {
1911
- content: var(--tw-content);
1912
1908
  --tw-content: '';
1913
1909
  content: var(--tw-content);
1914
1910
  }
@@ -2130,7 +2126,6 @@
2130
2126
  :is(& *) {
2131
2127
  &[data-active="true"] {
2132
2128
  &::before {
2133
- content: var(--tw-content);
2134
2129
  --tw-content: '';
2135
2130
  content: var(--tw-content);
2136
2131
  }
@@ -2663,64 +2658,73 @@
2663
2658
  --color-fd-secondary: hsl(0, 0%, 18%);
2664
2659
  --color-fd-muted-foreground: hsl(0, 0%, 72%);
2665
2660
  }
2666
- .shiki:not(.not-fumadocs-codeblock *) {
2661
+ :root {
2667
2662
  --padding-left: calc(var(--spacing) * 4);
2668
2663
  --padding-right: calc(var(--spacing) * 4);
2664
+ }
2665
+ .shiki:not(.not-fumadocs-codeblock *) {
2669
2666
  code span {
2670
2667
  color: var(--shiki-light);
2671
2668
  }
2672
- code .line {
2669
+ }
2670
+ .dark .shiki:not(.not-fumadocs-codeblock *) {
2671
+ code span {
2672
+ color: var(--shiki-dark);
2673
+ }
2674
+ }
2675
+ :is(pre *):is(.shiki *):not(.not-fumadocs-codeblock *) {
2676
+ .line& {
2673
2677
  position: relative;
2674
2678
  min-height: 1lh;
2675
2679
  padding-left: var(--padding-left);
2676
2680
  padding-right: var(--padding-right);
2677
2681
  }
2678
- &.has-focused code .line:not(.focused) {
2682
+ .has-focused .line&:not(.focused) {
2679
2683
  filter: blur(2px);
2680
2684
  transition: filter 200ms;
2681
2685
  }
2682
- &.has-focused:hover code .line:not(.focused) {
2686
+ .has-focused:hover .line&:not(.focused) {
2683
2687
  filter: blur(0);
2684
2688
  }
2685
- &[data-line-numbers] code .twoslash-meta-line {
2689
+ [data-line-numbers] .twoslash-meta-line& {
2686
2690
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
2687
2691
  }
2688
- &[data-line-numbers] code .line {
2692
+ [data-line-numbers] .line& {
2689
2693
  counter-increment: line;
2690
2694
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
2691
- &::after {
2692
- position: absolute;
2693
- content: counter(line);
2694
- color: var(--fd-counter-color, hsl(0, 0%, 45.1%));
2695
- @supports (color: color-mix(in lab, red, red)) {
2696
- color: color-mix( in oklab, var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%, transparent );
2697
- }
2698
- top: calc(var(--spacing) * 0);
2699
- left: calc(var(--spacing) * 4);
2695
+ }
2696
+ [data-line-numbers] .line&::after {
2697
+ position: absolute;
2698
+ content: counter(line);
2699
+ color: var(--fd-counter-color, hsl(0, 0%, 45.1%));
2700
+ @supports (color: color-mix(in lab, red, red)) {
2701
+ color: color-mix( in oklab, var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%, transparent );
2700
2702
  }
2703
+ top: calc(var(--spacing) * 0);
2704
+ left: calc(var(--spacing) * 4);
2701
2705
  }
2702
- code .diff::before {
2706
+ .diff&::before {
2703
2707
  position: absolute;
2704
2708
  left: calc(var(--spacing) * 1.5);
2705
2709
  }
2706
- code .diff.remove {
2710
+ .diff.remove& {
2707
2711
  opacity: 0.7;
2708
2712
  --fd-counter-color: var(--color-fd-diff-remove-symbol);
2709
2713
  background-color: var(--color-fd-diff-remove);
2710
2714
  }
2711
- code .diff.remove::before {
2715
+ .diff.remove&::before {
2712
2716
  content: '-';
2713
2717
  color: var(--color-fd-diff-remove-symbol);
2714
2718
  }
2715
- code .diff.add {
2719
+ .diff.add& {
2716
2720
  --fd-counter-color: var(--color-fd-diff-add-symbol);
2717
2721
  background-color: var(--color-fd-diff-add);
2718
2722
  }
2719
- code .diff.add::before {
2723
+ .diff.add&::before {
2720
2724
  content: '+';
2721
2725
  color: var(--color-fd-diff-add-symbol);
2722
2726
  }
2723
- code .highlighted {
2727
+ .highlighted& {
2724
2728
  --fd-counter-color: var(--color-fd-primary);
2725
2729
  padding-left: calc(var(--padding-left) - 2px);
2726
2730
  border-left-style: var(--tw-border-style);
@@ -2734,7 +2738,7 @@
2734
2738
  background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2735
2739
  }
2736
2740
  }
2737
- code .highlighted-word {
2741
+ .highlighted-word& {
2738
2742
  padding: 1px;
2739
2743
  margin-block: -1px;
2740
2744
  border-radius: var(--radius-md);
@@ -2752,11 +2756,6 @@
2752
2756
  font-weight: var(--font-weight-medium);
2753
2757
  }
2754
2758
  }
2755
- .dark .shiki:not(.not-fumadocs-codeblock *) {
2756
- code span {
2757
- color: var(--shiki-dark);
2758
- }
2759
- }
2760
2759
  [dir='rtl'] {
2761
2760
  --fd-sidebar-mobile-offset: -100%;
2762
2761
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "15.7.9",
3
+ "version": "15.7.11",
4
4
  "description": "The framework for building a documentation website in Next.js",
5
5
  "keywords": [
6
6
  "NextJs",
@@ -121,20 +121,20 @@
121
121
  "react-medium-image-zoom": "^5.3.0",
122
122
  "scroll-into-view-if-needed": "^3.1.0",
123
123
  "tailwind-merge": "^3.3.1",
124
- "fumadocs-core": "15.7.9"
124
+ "fumadocs-core": "15.7.11"
125
125
  },
126
126
  "devDependencies": {
127
127
  "@next/eslint-plugin-next": "^15.5.2",
128
- "@tailwindcss/cli": "^4.1.12",
128
+ "@tailwindcss/cli": "^4.1.13",
129
129
  "@types/lodash.merge": "^4.6.9",
130
130
  "@types/react": "^19.1.12",
131
131
  "@types/react-dom": "^19.1.9",
132
132
  "next": "15.5.2",
133
- "tailwindcss": "^4.1.12",
133
+ "tailwindcss": "^4.1.13",
134
134
  "tsc-alias": "^1.8.16",
135
135
  "@fumadocs/cli": "1.0.1",
136
136
  "eslint-config-custom": "0.0.0",
137
- "fumadocs-core": "15.7.9",
137
+ "fumadocs-core": "15.7.11",
138
138
  "tsconfig": "0.0.0"
139
139
  },
140
140
  "peerDependencies": {