postfolio 1.0.5 → 1.0.6
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/dist/chunk-4KA42OXK.js +44 -0
- package/dist/chunk-6PC5ONQ5.js +12 -0
- package/dist/server.d.ts +7 -2
- package/dist/server.js +12 -5
- package/dist/src/client.d.ts +8 -3
- package/dist/src/client.js +8 -37
- package/dist/src/utils.d.ts +8 -0
- package/dist/src/utils.js +6 -0
- package/package.json +17 -3
- package/dist/src/renderer.d.ts +0 -9
- package/dist/src/renderer.js +0 -16
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
// src/client.tsx
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { useEffect, useState } from "react";
|
|
4
|
+
import { getMDXComponent } from "mdx-bundler/client/index.js";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
|
+
function useActiveHeading() {
|
|
7
|
+
const [activeId, setActiveId] = useState("");
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
const headings = document.querySelectorAll(
|
|
10
|
+
"h1[id], h2[id], h3[id], h4[id]"
|
|
11
|
+
);
|
|
12
|
+
const observer = new IntersectionObserver(
|
|
13
|
+
(entries) => {
|
|
14
|
+
const visible = entries.filter((entry) => entry.isIntersecting).sort(
|
|
15
|
+
(a, b) => a.boundingClientRect.top - b.boundingClientRect.top
|
|
16
|
+
);
|
|
17
|
+
if (visible.length > 0) {
|
|
18
|
+
setActiveId(
|
|
19
|
+
visible[0].target.getAttribute("id") || ""
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
{
|
|
24
|
+
rootMargin: "0px 0px -70% 0px",
|
|
25
|
+
threshold: 0
|
|
26
|
+
}
|
|
27
|
+
);
|
|
28
|
+
headings.forEach((heading) => observer.observe(heading));
|
|
29
|
+
return () => observer.disconnect();
|
|
30
|
+
}, []);
|
|
31
|
+
return activeId;
|
|
32
|
+
}
|
|
33
|
+
function Content({
|
|
34
|
+
code,
|
|
35
|
+
components
|
|
36
|
+
}) {
|
|
37
|
+
const Render = React.useMemo(() => getMDXComponent(code), [code]);
|
|
38
|
+
return /* @__PURE__ */ jsx(Render, { components });
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
export {
|
|
42
|
+
useActiveHeading,
|
|
43
|
+
Content
|
|
44
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// src/utils.ts
|
|
2
|
+
function generateSlug(text) {
|
|
3
|
+
if (text === void 0) {
|
|
4
|
+
return "";
|
|
5
|
+
}
|
|
6
|
+
const textString = typeof text === "string" ? text : String(text);
|
|
7
|
+
return textString.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^-+|-+$/g, "");
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
export {
|
|
11
|
+
generateSlug
|
|
12
|
+
};
|
package/dist/server.d.ts
CHANGED
|
@@ -1,3 +1,8 @@
|
|
|
1
|
+
export { Content, useActiveHeading } from './src/client.js';
|
|
2
|
+
export { generateSlug } from './src/utils.js';
|
|
3
|
+
import 'react';
|
|
4
|
+
import 'mdx-bundler/client/index.js';
|
|
5
|
+
|
|
1
6
|
declare function setContentDirectory(newPath: string): void;
|
|
2
7
|
type BlogFrontmatter = {
|
|
3
8
|
title?: string;
|
|
@@ -20,7 +25,7 @@ type TOCItem = {
|
|
|
20
25
|
text: string;
|
|
21
26
|
slug: string;
|
|
22
27
|
};
|
|
23
|
-
|
|
28
|
+
|
|
24
29
|
declare function generateTOC(content: string): TOCItem[];
|
|
25
30
|
declare function Slugs(): string[];
|
|
26
31
|
declare function Post(slug: string): BlogPostSource | undefined;
|
|
@@ -32,4 +37,4 @@ declare function MDXPost(slug: string): Promise<{
|
|
|
32
37
|
raw: string;
|
|
33
38
|
} | undefined>;
|
|
34
39
|
|
|
35
|
-
export { type BlogFrontmatter, type BlogPostSource, MDXPost, Post, Slugs, allPosts,
|
|
40
|
+
export { type BlogFrontmatter, type BlogPostSource, MDXPost, Post, Slugs, allPosts, generateTOC, setContentDirectory };
|
package/dist/server.js
CHANGED
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Content,
|
|
3
|
+
useActiveHeading
|
|
4
|
+
} from "./chunk-4KA42OXK.js";
|
|
5
|
+
import {
|
|
6
|
+
generateSlug
|
|
7
|
+
} from "./chunk-6PC5ONQ5.js";
|
|
8
|
+
|
|
1
9
|
// src/server.ts
|
|
2
10
|
import "server-only";
|
|
3
11
|
import fs from "fs";
|
|
@@ -31,9 +39,6 @@ function getPostSourceBySlug(slug) {
|
|
|
31
39
|
mdx: fs.readFileSync(filePath, "utf8")
|
|
32
40
|
};
|
|
33
41
|
}
|
|
34
|
-
function generateSlug(text) {
|
|
35
|
-
return text.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
|
|
36
|
-
}
|
|
37
42
|
function generateTOC(content) {
|
|
38
43
|
const headingRegex = /^(#{1,6})\s+(.+)$/gm;
|
|
39
44
|
return [...content.matchAll(headingRegex)].map((match) => {
|
|
@@ -42,7 +47,7 @@ function generateTOC(content) {
|
|
|
42
47
|
return {
|
|
43
48
|
level,
|
|
44
49
|
text,
|
|
45
|
-
slug: text
|
|
50
|
+
slug: generateSlug(text)
|
|
46
51
|
};
|
|
47
52
|
});
|
|
48
53
|
}
|
|
@@ -81,11 +86,13 @@ async function MDXPost(slug) {
|
|
|
81
86
|
};
|
|
82
87
|
}
|
|
83
88
|
export {
|
|
89
|
+
Content,
|
|
84
90
|
MDXPost,
|
|
85
91
|
Post,
|
|
86
92
|
Slugs,
|
|
87
93
|
allPosts,
|
|
88
94
|
generateSlug,
|
|
89
95
|
generateTOC,
|
|
90
|
-
setContentDirectory
|
|
96
|
+
setContentDirectory,
|
|
97
|
+
useActiveHeading
|
|
91
98
|
};
|
package/dist/src/client.d.ts
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { getMDXComponent } from 'mdx-bundler/client/index.js';
|
|
3
|
+
export { generateSlug } from './utils.js';
|
|
2
4
|
|
|
3
|
-
declare function generateSlug(text: string | ReactNode | undefined): string;
|
|
4
5
|
declare function useActiveHeading(): string;
|
|
6
|
+
declare function Content({ code, components, }: {
|
|
7
|
+
code: string;
|
|
8
|
+
components?: React.ComponentProps<ReturnType<typeof getMDXComponent>>["components"];
|
|
9
|
+
}): React.JSX.Element;
|
|
5
10
|
|
|
6
|
-
export {
|
|
11
|
+
export { Content, useActiveHeading };
|
package/dist/src/client.js
CHANGED
|
@@ -1,42 +1,13 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
const textString = typeof text === "string" ? text : String(text);
|
|
10
|
-
return textString.toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-");
|
|
11
|
-
}
|
|
12
|
-
function useActiveHeading() {
|
|
13
|
-
const [activeId, setActiveId] = useState("");
|
|
14
|
-
useEffect(() => {
|
|
15
|
-
const headings = document.querySelectorAll(
|
|
16
|
-
"h1[id], h2[id], h3[id], h4[id]"
|
|
17
|
-
);
|
|
18
|
-
const observer = new IntersectionObserver(
|
|
19
|
-
(entries) => {
|
|
20
|
-
const visible = entries.filter((entry) => entry.isIntersecting).sort(
|
|
21
|
-
(a, b) => a.boundingClientRect.top - b.boundingClientRect.top
|
|
22
|
-
);
|
|
23
|
-
if (visible.length > 0) {
|
|
24
|
-
setActiveId(
|
|
25
|
-
visible[0].target.getAttribute("id") || ""
|
|
26
|
-
);
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
rootMargin: "0px 0px -70% 0px",
|
|
31
|
-
threshold: 0
|
|
32
|
-
}
|
|
33
|
-
);
|
|
34
|
-
headings.forEach((heading) => observer.observe(heading));
|
|
35
|
-
return () => observer.disconnect();
|
|
36
|
-
}, []);
|
|
37
|
-
return activeId;
|
|
38
|
-
}
|
|
2
|
+
import {
|
|
3
|
+
Content,
|
|
4
|
+
useActiveHeading
|
|
5
|
+
} from "../chunk-4KA42OXK.js";
|
|
6
|
+
import {
|
|
7
|
+
generateSlug
|
|
8
|
+
} from "../chunk-6PC5ONQ5.js";
|
|
39
9
|
export {
|
|
10
|
+
Content,
|
|
40
11
|
generateSlug,
|
|
41
12
|
useActiveHeading
|
|
42
13
|
};
|
package/package.json
CHANGED
|
@@ -1,21 +1,35 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "postfolio",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.6",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/server.js",
|
|
6
6
|
"types": "./dist/server.d.ts",
|
|
7
7
|
"exports": {
|
|
8
|
+
".": {
|
|
9
|
+
"react-server": {
|
|
10
|
+
"types": "./dist/server.d.ts",
|
|
11
|
+
"import": "./dist/server.js"
|
|
12
|
+
},
|
|
13
|
+
"default": {
|
|
14
|
+
"types": "./dist/src/client.d.ts",
|
|
15
|
+
"import": "./dist/src/client.js"
|
|
16
|
+
}
|
|
17
|
+
},
|
|
8
18
|
"./server": {
|
|
9
19
|
"types": "./dist/server.d.ts",
|
|
10
20
|
"import": "./dist/server.js"
|
|
11
21
|
},
|
|
12
22
|
"./renderer": {
|
|
13
|
-
"types": "./dist/src/
|
|
14
|
-
"import": "./dist/src/
|
|
23
|
+
"types": "./dist/src/client.d.ts",
|
|
24
|
+
"import": "./dist/src/client.js"
|
|
15
25
|
},
|
|
16
26
|
"./client": {
|
|
17
27
|
"types": "./dist/src/client.d.ts",
|
|
18
28
|
"import": "./dist/src/client.js"
|
|
29
|
+
},
|
|
30
|
+
"./utils": {
|
|
31
|
+
"types": "./dist/src/utils.d.ts",
|
|
32
|
+
"import": "./dist/src/utils.js"
|
|
19
33
|
}
|
|
20
34
|
},
|
|
21
35
|
"files": [
|
package/dist/src/renderer.d.ts
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { getMDXComponent } from 'mdx-bundler/client/index.js';
|
|
3
|
-
|
|
4
|
-
declare function Content({ code, components, }: {
|
|
5
|
-
code: string;
|
|
6
|
-
components?: React.ComponentProps<ReturnType<typeof getMDXComponent>>["components"];
|
|
7
|
-
}): React.JSX.Element;
|
|
8
|
-
|
|
9
|
-
export { Content };
|
package/dist/src/renderer.js
DELETED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
|
|
3
|
-
// src/renderer.tsx
|
|
4
|
-
import * as React from "react";
|
|
5
|
-
import { getMDXComponent } from "mdx-bundler/client/index.js";
|
|
6
|
-
import { jsx } from "react/jsx-runtime";
|
|
7
|
-
function Content({
|
|
8
|
-
code,
|
|
9
|
-
components
|
|
10
|
-
}) {
|
|
11
|
-
const Render = React.useMemo(() => getMDXComponent(code), [code]);
|
|
12
|
-
return /* @__PURE__ */ jsx(Render, { components });
|
|
13
|
-
}
|
|
14
|
-
export {
|
|
15
|
-
Content
|
|
16
|
-
};
|