fumadocs-ui 15.7.10 → 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.
Files changed (4) hide show
  1. package/css/shiki.css +33 -29
  2. package/dist/components/type-table.js +5 -4
  3. package/dist/style.css +31 -30
  4. package/package.json +3 -3
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
- }
package/dist/components/type-table.js CHANGED
@@ -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
@@ -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
  }
@@ -2661,64 +2658,73 @@
2661
2658
  --color-fd-secondary: hsl(0, 0%, 18%);
2662
2659
  --color-fd-muted-foreground: hsl(0, 0%, 72%);
2663
2660
  }
2664
- .shiki:not(.not-fumadocs-codeblock *) {
2661
+ :root {
2665
2662
  --padding-left: calc(var(--spacing) * 4);
2666
2663
  --padding-right: calc(var(--spacing) * 4);
2664
+ }
2665
+ .shiki:not(.not-fumadocs-codeblock *) {
2667
2666
  code span {
2668
2667
  color: var(--shiki-light);
2669
2668
  }
2670
- 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& {
2671
2677
  position: relative;
2672
2678
  min-height: 1lh;
2673
2679
  padding-left: var(--padding-left);
2674
2680
  padding-right: var(--padding-right);
2675
2681
  }
2676
- &.has-focused code .line:not(.focused) {
2682
+ .has-focused .line&:not(.focused) {
2677
2683
  filter: blur(2px);
2678
2684
  transition: filter 200ms;
2679
2685
  }
2680
- &.has-focused:hover code .line:not(.focused) {
2686
+ .has-focused:hover .line&:not(.focused) {
2681
2687
  filter: blur(0);
2682
2688
  }
2683
- &[data-line-numbers] code .twoslash-meta-line {
2689
+ [data-line-numbers] .twoslash-meta-line& {
2684
2690
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
2685
2691
  }
2686
- &[data-line-numbers] code .line {
2692
+ [data-line-numbers] .line& {
2687
2693
  counter-increment: line;
2688
2694
  padding-left: calc(var(--padding-left) + 7 * var(--spacing));
2689
- &::after {
2690
- position: absolute;
2691
- content: counter(line);
2692
- color: var(--fd-counter-color, hsl(0, 0%, 45.1%));
2693
- @supports (color: color-mix(in lab, red, red)) {
2694
- color: color-mix( in oklab, var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%, transparent );
2695
- }
2696
- top: calc(var(--spacing) * 0);
2697
- 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 );
2698
2702
  }
2703
+ top: calc(var(--spacing) * 0);
2704
+ left: calc(var(--spacing) * 4);
2699
2705
  }
2700
- code .diff::before {
2706
+ .diff&::before {
2701
2707
  position: absolute;
2702
2708
  left: calc(var(--spacing) * 1.5);
2703
2709
  }
2704
- code .diff.remove {
2710
+ .diff.remove& {
2705
2711
  opacity: 0.7;
2706
2712
  --fd-counter-color: var(--color-fd-diff-remove-symbol);
2707
2713
  background-color: var(--color-fd-diff-remove);
2708
2714
  }
2709
- code .diff.remove::before {
2715
+ .diff.remove&::before {
2710
2716
  content: '-';
2711
2717
  color: var(--color-fd-diff-remove-symbol);
2712
2718
  }
2713
- code .diff.add {
2719
+ .diff.add& {
2714
2720
  --fd-counter-color: var(--color-fd-diff-add-symbol);
2715
2721
  background-color: var(--color-fd-diff-add);
2716
2722
  }
2717
- code .diff.add::before {
2723
+ .diff.add&::before {
2718
2724
  content: '+';
2719
2725
  color: var(--color-fd-diff-add-symbol);
2720
2726
  }
2721
- code .highlighted {
2727
+ .highlighted& {
2722
2728
  --fd-counter-color: var(--color-fd-primary);
2723
2729
  padding-left: calc(var(--padding-left) - 2px);
2724
2730
  border-left-style: var(--tw-border-style);
@@ -2732,7 +2738,7 @@
2732
2738
  background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2733
2739
  }
2734
2740
  }
2735
- code .highlighted-word {
2741
+ .highlighted-word& {
2736
2742
  padding: 1px;
2737
2743
  margin-block: -1px;
2738
2744
  border-radius: var(--radius-md);
@@ -2750,11 +2756,6 @@
2750
2756
  font-weight: var(--font-weight-medium);
2751
2757
  }
2752
2758
  }
2753
- .dark .shiki:not(.not-fumadocs-codeblock *) {
2754
- code span {
2755
- color: var(--shiki-dark);
2756
- }
2757
- }
2758
2759
  [dir='rtl'] {
2759
2760
  --fd-sidebar-mobile-offset: -100%;
2760
2761
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "15.7.10",
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,7 +121,7 @@
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.10"
124
+ "fumadocs-core": "15.7.11"
125
125
  },
126
126
  "devDependencies": {
127
127
  "@next/eslint-plugin-next": "^15.5.2",
@@ -134,7 +134,7 @@
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.10",
137
+ "fumadocs-core": "15.7.11",
138
138
  "tsconfig": "0.0.0"
139
139
  },
140
140
  "peerDependencies": {