@terrafirmagreg-team/mdx 1.2.1 → 1.2.3
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/package.json +5 -5
- package/src/components/docs-image.tsx +62 -62
- package/src/components/mdx-components.tsx +158 -158
- package/src/components/story-fields.tsx +318 -318
- package/src/components/story-panel.tsx +181 -181
- package/src/lib/md-plugins.ts +1 -0
- package/src/lib/mdx/directive-utils.ts +118 -118
- package/src/lib/pack-assets.ts +46 -46
- package/src/lib/story-remark.ts +468 -468
- package/src/lib/story.ts +11 -11
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@terrafirmagreg-team/mdx",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.3",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "MDX/markdown pipeline",
|
|
6
6
|
"license": "LGPL-3.0-only",
|
|
@@ -21,14 +21,14 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@fumadocs/story": "^1.5.3",
|
|
23
23
|
"@fumari/stf": "^1.1.2",
|
|
24
|
-
"@terrafirmagreg-team/translate": "1.2.
|
|
25
|
-
"@terrafirmagreg-team/ui": "1.2.
|
|
24
|
+
"@terrafirmagreg-team/translate": "^1.2.4",
|
|
25
|
+
"@terrafirmagreg-team/ui": "^1.2.4",
|
|
26
26
|
"@types/turndown": "^5.0.6",
|
|
27
|
-
"fumadocs-core": "16.17.
|
|
27
|
+
"fumadocs-core": "16.17.10",
|
|
28
28
|
"fumadocs-docgen": "^3.2.0",
|
|
29
29
|
"fumadocs-twoslash": "^4.0.4",
|
|
30
30
|
"fumadocs-typescript": "5.6.0",
|
|
31
|
-
"lucide-react": "^
|
|
31
|
+
"lucide-react": "^1.63.0",
|
|
32
32
|
"rehype-katex": "^7.0.1",
|
|
33
33
|
"rehype-raw": "^7.0.0",
|
|
34
34
|
"remark-directive": "^4.0.0",
|
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
import { ImageZoom } from '@terrafirmagreg-team/ui/components/mdx/image-zoom';
|
|
2
|
-
import { resolveSrc } from '../lib/pack-assets';
|
|
3
|
-
import type { DocsImageProps } from '../types/mdx';
|
|
4
|
-
|
|
5
|
-
export function DocsImage({
|
|
6
|
-
src,
|
|
7
|
-
pack,
|
|
8
|
-
mod,
|
|
9
|
-
path,
|
|
10
|
-
alt = '',
|
|
11
|
-
width,
|
|
12
|
-
height,
|
|
13
|
-
className,
|
|
14
|
-
caption,
|
|
15
|
-
defaultPack: pagePack,
|
|
16
|
-
...rest
|
|
17
|
-
}: DocsImageProps) {
|
|
18
|
-
const packHint = pack ?? pagePack;
|
|
19
|
-
const resolved = resolveSrc({ src, pack, mod, path }, packHint);
|
|
20
|
-
if (!resolved) {
|
|
21
|
-
return (
|
|
22
|
-
<p className="not-prose text-sm text-muted-foreground">
|
|
23
|
-
Missing image source (set <code>src</code> or <code>mod</code>+
|
|
24
|
-
<code>path</code>; pack defaults from the docs slug).
|
|
25
|
-
</p>
|
|
26
|
-
);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
const w = Number(width) || undefined;
|
|
30
|
-
const h = Number(height) || undefined;
|
|
31
|
-
|
|
32
|
-
return (
|
|
33
|
-
<figure className="not-prose my-4 space-y-2">
|
|
34
|
-
<ImageZoom
|
|
35
|
-
src={resolved}
|
|
36
|
-
alt={alt}
|
|
37
|
-
width={w ?? 960}
|
|
38
|
-
height={h ?? 540}
|
|
39
|
-
className={className}
|
|
40
|
-
{...rest}
|
|
41
|
-
>
|
|
42
|
-
{w === undefined || h === undefined ? (
|
|
43
|
-
// eslint-disable-next-line @next/next/no-img-element
|
|
44
|
-
<img
|
|
45
|
-
src={resolved}
|
|
46
|
-
alt={alt}
|
|
47
|
-
width={w}
|
|
48
|
-
height={h}
|
|
49
|
-
className={className}
|
|
50
|
-
style={{ width: w ?? 'auto', height: h ?? 'auto' }}
|
|
51
|
-
/>
|
|
52
|
-
) : undefined}
|
|
53
|
-
</ImageZoom>
|
|
54
|
-
{caption ? (
|
|
55
|
-
<figcaption className="text-center text-sm text-muted-foreground">
|
|
56
|
-
{caption}
|
|
57
|
-
</figcaption>
|
|
58
|
-
) : null}
|
|
59
|
-
</figure>
|
|
60
|
-
);
|
|
61
|
-
}
|
|
62
|
-
|
|
1
|
+
import { ImageZoom } from '@terrafirmagreg-team/ui/components/mdx/image-zoom';
|
|
2
|
+
import { resolveSrc } from '../lib/pack-assets';
|
|
3
|
+
import type { DocsImageProps } from '../types/mdx';
|
|
4
|
+
|
|
5
|
+
export function DocsImage({
|
|
6
|
+
src,
|
|
7
|
+
pack,
|
|
8
|
+
mod,
|
|
9
|
+
path,
|
|
10
|
+
alt = '',
|
|
11
|
+
width,
|
|
12
|
+
height,
|
|
13
|
+
className,
|
|
14
|
+
caption,
|
|
15
|
+
defaultPack: pagePack,
|
|
16
|
+
...rest
|
|
17
|
+
}: DocsImageProps) {
|
|
18
|
+
const packHint = pack ?? pagePack;
|
|
19
|
+
const resolved = resolveSrc({ src, pack, mod, path }, packHint);
|
|
20
|
+
if (!resolved) {
|
|
21
|
+
return (
|
|
22
|
+
<p className="not-prose text-sm text-muted-foreground">
|
|
23
|
+
Missing image source (set <code>src</code> or <code>mod</code>+
|
|
24
|
+
<code>path</code>; pack defaults from the docs slug).
|
|
25
|
+
</p>
|
|
26
|
+
);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const w = Number(width) || undefined;
|
|
30
|
+
const h = Number(height) || undefined;
|
|
31
|
+
|
|
32
|
+
return (
|
|
33
|
+
<figure className="not-prose my-4 space-y-2">
|
|
34
|
+
<ImageZoom
|
|
35
|
+
src={resolved}
|
|
36
|
+
alt={alt}
|
|
37
|
+
width={w ?? 960}
|
|
38
|
+
height={h ?? 540}
|
|
39
|
+
className={className}
|
|
40
|
+
{...rest}
|
|
41
|
+
>
|
|
42
|
+
{w === undefined || h === undefined ? (
|
|
43
|
+
// eslint-disable-next-line @next/next/no-img-element
|
|
44
|
+
<img
|
|
45
|
+
src={resolved}
|
|
46
|
+
alt={alt}
|
|
47
|
+
width={w}
|
|
48
|
+
height={h}
|
|
49
|
+
className={className}
|
|
50
|
+
style={{ width: w ?? 'auto', height: h ?? 'auto' }}
|
|
51
|
+
/>
|
|
52
|
+
) : undefined}
|
|
53
|
+
</ImageZoom>
|
|
54
|
+
{caption ? (
|
|
55
|
+
<figcaption className="text-center text-sm text-muted-foreground">
|
|
56
|
+
{caption}
|
|
57
|
+
</figcaption>
|
|
58
|
+
) : null}
|
|
59
|
+
</figure>
|
|
60
|
+
);
|
|
61
|
+
}
|
|
62
|
+
|
|
@@ -1,158 +1,158 @@
|
|
|
1
|
-
import {
|
|
2
|
-
Tab,
|
|
3
|
-
Tabs,
|
|
4
|
-
TabsContent,
|
|
5
|
-
TabsList,
|
|
6
|
-
TabsTrigger,
|
|
7
|
-
} from '@terrafirmagreg-team/ui/components/mdx/tabs';
|
|
8
|
-
import {
|
|
9
|
-
Accordion,
|
|
10
|
-
Accordions,
|
|
11
|
-
} from '@terrafirmagreg-team/ui/components/mdx/accordion';
|
|
12
|
-
import { Step, Steps } from '@terrafirmagreg-team/ui/components/mdx/steps';
|
|
13
|
-
import {
|
|
14
|
-
File,
|
|
15
|
-
Folder,
|
|
16
|
-
Files,
|
|
17
|
-
} from '@terrafirmagreg-team/ui/components/mdx/files';
|
|
18
|
-
import { ImageZoom } from '@terrafirmagreg-team/ui/components/mdx/image-zoom';
|
|
19
|
-
import { Banner } from '@terrafirmagreg-team/ui/components/mdx/banner';
|
|
20
|
-
import { TypeTable } from '@terrafirmagreg-team/ui/components/mdx/type-table';
|
|
21
|
-
import { Card, Cards } from '@terrafirmagreg-team/ui/components/mdx/card';
|
|
22
|
-
import { Table } from '@terrafirmagreg-team/ui/components/mdx/table';
|
|
23
|
-
import {
|
|
24
|
-
CalloutDescription,
|
|
25
|
-
CalloutTitle,
|
|
26
|
-
} from '@terrafirmagreg-team/ui/components/mdx/callout';
|
|
27
|
-
import {
|
|
28
|
-
CodeBlock,
|
|
29
|
-
CodeBlockTab,
|
|
30
|
-
CodeBlockTabs,
|
|
31
|
-
CodeBlockTabsList,
|
|
32
|
-
CodeBlockTabsTrigger,
|
|
33
|
-
Pre,
|
|
34
|
-
} from '@terrafirmagreg-team/ui/components/mdx/codeblock';
|
|
35
|
-
import { Heading } from '@terrafirmagreg-team/ui/components/blocks/page/heading';
|
|
36
|
-
import * as Twoslash from 'fumadocs-twoslash/ui';
|
|
37
|
-
import { Mermaid } from '@terrafirmagreg-team/ui/components/mdx/mermaid';
|
|
38
|
-
import { Callout, CalloutContainer } from '@terrafirmagreg-team/ui/components/mdx/callout';
|
|
39
|
-
import { Input, Output, Preview } from '@terrafirmagreg-team/ui/components/mdx/preview';
|
|
40
|
-
import { DocsImage } from './docs-image';
|
|
41
|
-
import { Multiblock } from '@terrafirmagreg-team/ui/components/mdx/multiblock';
|
|
42
|
-
import { GradientText } from '@terrafirmagreg-team/ui/components/mdx/gradient-text';
|
|
43
|
-
import { GlowHeader } from '@terrafirmagreg-team/ui/components/mdx/glow-header';
|
|
44
|
-
import { Icon } from '@terrafirmagreg-team/ui/components/mdx/icon';
|
|
45
|
-
import { LinkPreview } from '@terrafirmagreg-team/ui/components/blocks/link/link-preview';
|
|
46
|
-
import type { MDXComponents } from 'mdx/types';
|
|
47
|
-
import type { ComponentProps, HTMLAttributes } from 'react';
|
|
48
|
-
|
|
49
|
-
const extras: MDXComponents = {};
|
|
50
|
-
|
|
51
|
-
export function registerMdxComponents(map: MDXComponents): void {
|
|
52
|
-
Object.assign(extras, map);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
export function getMDXComponents(components?: MDXComponents) {
|
|
56
|
-
return {
|
|
57
|
-
CodeBlockTab,
|
|
58
|
-
CodeBlockTabs,
|
|
59
|
-
CodeBlockTabsList,
|
|
60
|
-
CodeBlockTabsTrigger,
|
|
61
|
-
Tab,
|
|
62
|
-
Tabs,
|
|
63
|
-
TabsContent,
|
|
64
|
-
TabsList,
|
|
65
|
-
TabsTrigger,
|
|
66
|
-
...Twoslash,
|
|
67
|
-
Accordion,
|
|
68
|
-
Accordions,
|
|
69
|
-
Step,
|
|
70
|
-
Steps,
|
|
71
|
-
File,
|
|
72
|
-
Folder,
|
|
73
|
-
Files,
|
|
74
|
-
Mermaid,
|
|
75
|
-
Banner,
|
|
76
|
-
TypeTable,
|
|
77
|
-
Card,
|
|
78
|
-
Cards,
|
|
79
|
-
Callout,
|
|
80
|
-
CalloutContainer,
|
|
81
|
-
CalloutTitle,
|
|
82
|
-
CalloutDescription,
|
|
83
|
-
Preview,
|
|
84
|
-
Input,
|
|
85
|
-
Output,
|
|
86
|
-
DocsImage,
|
|
87
|
-
Multiblock,
|
|
88
|
-
GradientText,
|
|
89
|
-
GlowHeader,
|
|
90
|
-
Icon,
|
|
91
|
-
a: LinkPreview,
|
|
92
|
-
pre: (props: HTMLAttributes<HTMLPreElement>) => (
|
|
93
|
-
<CodeBlock {...props}>
|
|
94
|
-
<Pre>{props.children}</Pre>
|
|
95
|
-
</CodeBlock>
|
|
96
|
-
),
|
|
97
|
-
h1: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
98
|
-
<Heading as="h1" {...props} />
|
|
99
|
-
),
|
|
100
|
-
h2: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
101
|
-
<Heading as="h2" {...props} />
|
|
102
|
-
),
|
|
103
|
-
h3: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
104
|
-
<Heading as="h3" {...props} />
|
|
105
|
-
),
|
|
106
|
-
h4: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
107
|
-
<Heading as="h4" {...props} />
|
|
108
|
-
),
|
|
109
|
-
h5: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
110
|
-
<Heading as="h5" {...props} />
|
|
111
|
-
),
|
|
112
|
-
h6: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
113
|
-
<Heading as="h6" {...props} />
|
|
114
|
-
),
|
|
115
|
-
table: Table,
|
|
116
|
-
img: (props: ComponentProps<'img'>) => {
|
|
117
|
-
const src =
|
|
118
|
-
typeof props.src === 'object' && props.src !== null
|
|
119
|
-
? ((props.src as { src?: string }).src ?? '')
|
|
120
|
-
: props.src;
|
|
121
|
-
if (typeof src !== 'string' || /^https?:\/\//i.test(src)) {
|
|
122
|
-
// eslint-disable-next-line @next/next/no-img-element
|
|
123
|
-
return <img {...props} src={src} alt={props.alt ?? ''} />;
|
|
124
|
-
}
|
|
125
|
-
const width = Number(props.width) || undefined;
|
|
126
|
-
const height = Number(props.height) || undefined;
|
|
127
|
-
return (
|
|
128
|
-
<ImageZoom
|
|
129
|
-
src={src}
|
|
130
|
-
alt={props.alt ?? ''}
|
|
131
|
-
width={width ?? 960}
|
|
132
|
-
height={height ?? 540}
|
|
133
|
-
sizes={props.sizes as string | undefined}
|
|
134
|
-
className={props.className}
|
|
135
|
-
>
|
|
136
|
-
{width === undefined || height === undefined ? (
|
|
137
|
-
// eslint-disable-next-line @next/next/no-img-element
|
|
138
|
-
<img
|
|
139
|
-
src={src}
|
|
140
|
-
alt={props.alt ?? ''}
|
|
141
|
-
width={width}
|
|
142
|
-
height={height}
|
|
143
|
-
className={props.className}
|
|
144
|
-
style={{ width: width ?? 'auto', height: height ?? 'auto' }}
|
|
145
|
-
/>
|
|
146
|
-
) : undefined}
|
|
147
|
-
</ImageZoom>
|
|
148
|
-
);
|
|
149
|
-
},
|
|
150
|
-
...extras,
|
|
151
|
-
...components,
|
|
152
|
-
} as MDXComponents;
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
declare global {
|
|
156
|
-
type MDXProvidedComponents = ReturnType<typeof getMDXComponents>;
|
|
157
|
-
}
|
|
158
|
-
|
|
1
|
+
import {
|
|
2
|
+
Tab,
|
|
3
|
+
Tabs,
|
|
4
|
+
TabsContent,
|
|
5
|
+
TabsList,
|
|
6
|
+
TabsTrigger,
|
|
7
|
+
} from '@terrafirmagreg-team/ui/components/mdx/tabs';
|
|
8
|
+
import {
|
|
9
|
+
Accordion,
|
|
10
|
+
Accordions,
|
|
11
|
+
} from '@terrafirmagreg-team/ui/components/mdx/accordion';
|
|
12
|
+
import { Step, Steps } from '@terrafirmagreg-team/ui/components/mdx/steps';
|
|
13
|
+
import {
|
|
14
|
+
File,
|
|
15
|
+
Folder,
|
|
16
|
+
Files,
|
|
17
|
+
} from '@terrafirmagreg-team/ui/components/mdx/files';
|
|
18
|
+
import { ImageZoom } from '@terrafirmagreg-team/ui/components/mdx/image-zoom';
|
|
19
|
+
import { Banner } from '@terrafirmagreg-team/ui/components/mdx/banner';
|
|
20
|
+
import { TypeTable } from '@terrafirmagreg-team/ui/components/mdx/type-table';
|
|
21
|
+
import { Card, Cards } from '@terrafirmagreg-team/ui/components/mdx/card';
|
|
22
|
+
import { Table } from '@terrafirmagreg-team/ui/components/mdx/table';
|
|
23
|
+
import {
|
|
24
|
+
CalloutDescription,
|
|
25
|
+
CalloutTitle,
|
|
26
|
+
} from '@terrafirmagreg-team/ui/components/mdx/callout';
|
|
27
|
+
import {
|
|
28
|
+
CodeBlock,
|
|
29
|
+
CodeBlockTab,
|
|
30
|
+
CodeBlockTabs,
|
|
31
|
+
CodeBlockTabsList,
|
|
32
|
+
CodeBlockTabsTrigger,
|
|
33
|
+
Pre,
|
|
34
|
+
} from '@terrafirmagreg-team/ui/components/mdx/codeblock';
|
|
35
|
+
import { Heading } from '@terrafirmagreg-team/ui/components/blocks/page/heading';
|
|
36
|
+
import * as Twoslash from 'fumadocs-twoslash/ui';
|
|
37
|
+
import { Mermaid } from '@terrafirmagreg-team/ui/components/mdx/mermaid';
|
|
38
|
+
import { Callout, CalloutContainer } from '@terrafirmagreg-team/ui/components/mdx/callout';
|
|
39
|
+
import { Input, Output, Preview } from '@terrafirmagreg-team/ui/components/mdx/preview';
|
|
40
|
+
import { DocsImage } from './docs-image';
|
|
41
|
+
import { Multiblock } from '@terrafirmagreg-team/ui/components/mdx/multiblock';
|
|
42
|
+
import { GradientText } from '@terrafirmagreg-team/ui/components/mdx/gradient-text';
|
|
43
|
+
import { GlowHeader } from '@terrafirmagreg-team/ui/components/mdx/glow-header';
|
|
44
|
+
import { Icon } from '@terrafirmagreg-team/ui/components/mdx/icon';
|
|
45
|
+
import { LinkPreview } from '@terrafirmagreg-team/ui/components/blocks/link/link-preview';
|
|
46
|
+
import type { MDXComponents } from 'mdx/types';
|
|
47
|
+
import type { ComponentProps, HTMLAttributes } from 'react';
|
|
48
|
+
|
|
49
|
+
const extras: MDXComponents = {};
|
|
50
|
+
|
|
51
|
+
export function registerMdxComponents(map: MDXComponents): void {
|
|
52
|
+
Object.assign(extras, map);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
export function getMDXComponents(components?: MDXComponents) {
|
|
56
|
+
return {
|
|
57
|
+
CodeBlockTab,
|
|
58
|
+
CodeBlockTabs,
|
|
59
|
+
CodeBlockTabsList,
|
|
60
|
+
CodeBlockTabsTrigger,
|
|
61
|
+
Tab,
|
|
62
|
+
Tabs,
|
|
63
|
+
TabsContent,
|
|
64
|
+
TabsList,
|
|
65
|
+
TabsTrigger,
|
|
66
|
+
...Twoslash,
|
|
67
|
+
Accordion,
|
|
68
|
+
Accordions,
|
|
69
|
+
Step,
|
|
70
|
+
Steps,
|
|
71
|
+
File,
|
|
72
|
+
Folder,
|
|
73
|
+
Files,
|
|
74
|
+
Mermaid,
|
|
75
|
+
Banner,
|
|
76
|
+
TypeTable,
|
|
77
|
+
Card,
|
|
78
|
+
Cards,
|
|
79
|
+
Callout,
|
|
80
|
+
CalloutContainer,
|
|
81
|
+
CalloutTitle,
|
|
82
|
+
CalloutDescription,
|
|
83
|
+
Preview,
|
|
84
|
+
Input,
|
|
85
|
+
Output,
|
|
86
|
+
DocsImage,
|
|
87
|
+
Multiblock,
|
|
88
|
+
GradientText,
|
|
89
|
+
GlowHeader,
|
|
90
|
+
Icon,
|
|
91
|
+
a: LinkPreview,
|
|
92
|
+
pre: (props: HTMLAttributes<HTMLPreElement>) => (
|
|
93
|
+
<CodeBlock {...props}>
|
|
94
|
+
<Pre>{props.children}</Pre>
|
|
95
|
+
</CodeBlock>
|
|
96
|
+
),
|
|
97
|
+
h1: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
98
|
+
<Heading as="h1" {...props} />
|
|
99
|
+
),
|
|
100
|
+
h2: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
101
|
+
<Heading as="h2" {...props} />
|
|
102
|
+
),
|
|
103
|
+
h3: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
104
|
+
<Heading as="h3" {...props} />
|
|
105
|
+
),
|
|
106
|
+
h4: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
107
|
+
<Heading as="h4" {...props} />
|
|
108
|
+
),
|
|
109
|
+
h5: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
110
|
+
<Heading as="h5" {...props} />
|
|
111
|
+
),
|
|
112
|
+
h6: (props: HTMLAttributes<HTMLHeadingElement>) => (
|
|
113
|
+
<Heading as="h6" {...props} />
|
|
114
|
+
),
|
|
115
|
+
table: Table,
|
|
116
|
+
img: (props: ComponentProps<'img'>) => {
|
|
117
|
+
const src =
|
|
118
|
+
typeof props.src === 'object' && props.src !== null
|
|
119
|
+
? ((props.src as { src?: string }).src ?? '')
|
|
120
|
+
: props.src;
|
|
121
|
+
if (typeof src !== 'string' || /^https?:\/\//i.test(src)) {
|
|
122
|
+
// eslint-disable-next-line @next/next/no-img-element
|
|
123
|
+
return <img {...props} src={src} alt={props.alt ?? ''} />;
|
|
124
|
+
}
|
|
125
|
+
const width = Number(props.width) || undefined;
|
|
126
|
+
const height = Number(props.height) || undefined;
|
|
127
|
+
return (
|
|
128
|
+
<ImageZoom
|
|
129
|
+
src={src}
|
|
130
|
+
alt={props.alt ?? ''}
|
|
131
|
+
width={width ?? 960}
|
|
132
|
+
height={height ?? 540}
|
|
133
|
+
sizes={props.sizes as string | undefined}
|
|
134
|
+
className={props.className}
|
|
135
|
+
>
|
|
136
|
+
{width === undefined || height === undefined ? (
|
|
137
|
+
// eslint-disable-next-line @next/next/no-img-element
|
|
138
|
+
<img
|
|
139
|
+
src={src}
|
|
140
|
+
alt={props.alt ?? ''}
|
|
141
|
+
width={width}
|
|
142
|
+
height={height}
|
|
143
|
+
className={props.className}
|
|
144
|
+
style={{ width: width ?? 'auto', height: height ?? 'auto' }}
|
|
145
|
+
/>
|
|
146
|
+
) : undefined}
|
|
147
|
+
</ImageZoom>
|
|
148
|
+
);
|
|
149
|
+
},
|
|
150
|
+
...extras,
|
|
151
|
+
...components,
|
|
152
|
+
} as MDXComponents;
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
declare global {
|
|
156
|
+
type MDXProvidedComponents = ReturnType<typeof getMDXComponents>;
|
|
157
|
+
}
|
|
158
|
+
|