@hyperbook/markdown 0.1.6 → 0.3.0
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/index.cjs.js +18 -1
- package/dist/index.cjs.js.map +2 -2
- package/dist/index.esm.mjs +19 -2
- package/dist/index.esm.mjs.map +2 -2
- package/package.json +7 -5
package/dist/index.cjs.js
CHANGED
|
@@ -58,6 +58,7 @@ var import_remark_unwrap_images = __toESM(require("remark-unwrap-images"));
|
|
|
58
58
|
var import_rehype_katex = __toESM(require("rehype-katex"));
|
|
59
59
|
var import_rehype_highlight = __toESM(require("rehype-highlight"));
|
|
60
60
|
var import_provider5 = require("@hyperbook/provider");
|
|
61
|
+
var import_unist_util_visit = require("unist-util-visit");
|
|
61
62
|
|
|
62
63
|
// src/Code.tsx
|
|
63
64
|
var import_provider = require("@hyperbook/provider");
|
|
@@ -193,6 +194,9 @@ var makeAnchor = (heading) => {
|
|
|
193
194
|
return anchor;
|
|
194
195
|
};
|
|
195
196
|
var Headings = ({ level, children }) => {
|
|
197
|
+
var _a;
|
|
198
|
+
const config = (0, import_provider3.useConfig)();
|
|
199
|
+
const bookmarksConfig = (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.bookmarks;
|
|
196
200
|
const heading = (children == null ? void 0 : children[0]) || "";
|
|
197
201
|
let anchor = typeof heading === "string" ? makeAnchor(heading) : "";
|
|
198
202
|
const label = typeof heading === "string" ? heading : anchor;
|
|
@@ -207,7 +211,7 @@ var Headings = ({ level, children }) => {
|
|
|
207
211
|
children: children2
|
|
208
212
|
})
|
|
209
213
|
}),
|
|
210
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("button", {
|
|
214
|
+
bookmarksConfig !== false && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("button", {
|
|
211
215
|
className: bookmark ? "bookmark active" : "bookmark",
|
|
212
216
|
onClick: () => toggleBookmark(),
|
|
213
217
|
title: "Bookmark",
|
|
@@ -264,6 +268,18 @@ var Image = ({ src, title, alt }) => {
|
|
|
264
268
|
|
|
265
269
|
// src/Markdown.tsx
|
|
266
270
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
271
|
+
var remarkRemoveComments = () => (tree) => {
|
|
272
|
+
const htmlCommentRegex = /<!--([\s\S]*?)-->/g;
|
|
273
|
+
const handler = (node, index, parent) => {
|
|
274
|
+
const isComment = node.value.match(htmlCommentRegex);
|
|
275
|
+
if (isComment) {
|
|
276
|
+
parent.children.splice(index, 1);
|
|
277
|
+
return [import_unist_util_visit.SKIP, index];
|
|
278
|
+
}
|
|
279
|
+
};
|
|
280
|
+
(0, import_unist_util_visit.visit)(tree, "html", handler);
|
|
281
|
+
(0, import_unist_util_visit.visit)(tree, "jsx", handler);
|
|
282
|
+
};
|
|
267
283
|
var Markdown = ({ children }) => {
|
|
268
284
|
const directives = (0, import_provider5.useDirectives)();
|
|
269
285
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_markdown.default, {
|
|
@@ -284,6 +300,7 @@ var Markdown = ({ children }) => {
|
|
|
284
300
|
img: Image
|
|
285
301
|
}),
|
|
286
302
|
remarkPlugins: [
|
|
303
|
+
remarkRemoveComments,
|
|
287
304
|
import_remark_directive.default,
|
|
288
305
|
import_remark_directive_rehype.default,
|
|
289
306
|
import_remark_gfm.default,
|
package/dist/index.cjs.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts", "../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx"],
|
|
4
|
-
"sourcesContent": ["export * from \"./Markdown\";\n", "import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\n\nexport type MarkdownProps = {\n children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n const directives = useDirectives();\n\n return (\n <ReactMarkdown\n className=\"hyperbook-markdown\"\n components={{\n ...directives,\n a: Link,\n code: Code,\n td: Td,\n th: Th,\n table: Table,\n tr: Tr,\n h1: Headings,\n h2: Headings,\n h3: Headings,\n h4: Headings,\n h5: Headings,\n h6: Headings,\n img: Image,\n }}\n remarkPlugins={[\n remarkDirective,\n remarkDirectiveRehype,\n remarkGfm,\n remarkMath,\n remarkGemoji,\n remarkUnwrapImages,\n ]}\n rehypePlugins={[\n rehypeKatex,\n [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n ]}\n skipHtml={false}\n >\n {children}\n </ReactMarkdown>\n );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n </svg>\n );\n};\n\nconst MdDone = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n </svg>\n );\n};\n\nexport const Code: Components[\"code\"] = ({ children, className }) => {\n const directives = useDirectives();\n if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n const Mermaid = directives[\"mermaid\"];\n return <Mermaid children={children} />;\n }\n\n const ref = useRef<HTMLElement>(null);\n const [copied, setCopied] = useState(false);\n const copyCode = () => {\n if (navigator.clipboard && ref.current) {\n const text = ref.current.innerText;\n navigator.clipboard.writeText(text);\n\n setCopied(true);\n\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <Fragment>\n <code ref={ref} className={className}>\n {children}\n </code>\n <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n {copied ? <MdDone /> : <MdContentCopy />}\n </button>\n </Fragment>\n );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n const L = useLink();\n return (\n <L href={href} title={title}>\n {children}\n </L>\n );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n tableHeaders = [];\n return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n tdIndex = 0;\n return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n return (\n <td data-label={tableHeaders[tdIndex++]} style={style}>\n {children}\n </td>\n );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n tableHeaders.push(children);\n return <th style={style}>{children}</th>;\n};\n", "import { useBookmark } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n // If we have a heading, make it lower case\n let anchor = heading.toLowerCase();\n\n // Clean anchor (replace special characters whitespaces).\n // Alternatively, use encodeURIComponent() if you don't care about\n // pretty anchor links\n anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n anchor = anchor.replace(/ /g, \"-\");\n\n return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children }) => {\n // Access actual (string) value of heading\n const heading = children?.[0] || \"\";\n\n // If we have a heading, make it lower case\n let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n const label = typeof heading === \"string\" ? heading : anchor;\n\n const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n // Utility\n const container = (children: React.ReactNode): JSX.Element => (\n <>\n <a className=\"heading\" id={anchor} href={`#${anchor}`}>\n <span>{children}</span>\n </a>\n <button\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,4BAA0B;AAC1B,8BAA4B;AAC5B,qCAAkC;AAClC,wBAAsB;AACtB,yBAAuB;AACvB,2BAAyB;AACzB,kCAA+B;AAC/B,0BAAwB;AACxB,8BAA4B;AAC5B,IAAAA,mBAA8B;;;
|
|
4
|
+
"sourcesContent": ["export * from \"./Markdown\";\n", "import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nconst remarkRemoveComments: () => Transformer = () => (tree) => {\n const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n const handler: BuildVisitor = (node, index, parent) => {\n const isComment = node.value.match(htmlCommentRegex);\n\n if (isComment) {\n // remove node\n parent.children.splice(index, 1);\n // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n return [SKIP, index];\n }\n };\n\n visit(tree, \"html\", handler);\n\n visit(tree, \"jsx\", handler);\n};\n\nexport type MarkdownProps = {\n children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n const directives = useDirectives();\n\n return (\n <ReactMarkdown\n className=\"hyperbook-markdown\"\n components={{\n ...directives,\n a: Link,\n code: Code,\n td: Td,\n th: Th,\n table: Table,\n tr: Tr,\n h1: Headings,\n h2: Headings,\n h3: Headings,\n h4: Headings,\n h5: Headings,\n h6: Headings,\n img: Image,\n }}\n remarkPlugins={[\n remarkRemoveComments,\n remarkDirective,\n remarkDirectiveRehype,\n remarkGfm,\n remarkMath,\n remarkGemoji,\n remarkUnwrapImages,\n ]}\n rehypePlugins={[\n rehypeKatex,\n [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n ]}\n skipHtml={false}\n >\n {children}\n </ReactMarkdown>\n );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n </svg>\n );\n};\n\nconst MdDone = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n </svg>\n );\n};\n\nexport const Code: Components[\"code\"] = ({ children, className }) => {\n const directives = useDirectives();\n if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n const Mermaid = directives[\"mermaid\"];\n return <Mermaid children={children} />;\n }\n\n const ref = useRef<HTMLElement>(null);\n const [copied, setCopied] = useState(false);\n const copyCode = () => {\n if (navigator.clipboard && ref.current) {\n const text = ref.current.innerText;\n navigator.clipboard.writeText(text);\n\n setCopied(true);\n\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <Fragment>\n <code ref={ref} className={className}>\n {children}\n </code>\n <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n {copied ? <MdDone /> : <MdContentCopy />}\n </button>\n </Fragment>\n );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n const L = useLink();\n return (\n <L href={href} title={title}>\n {children}\n </L>\n );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n tableHeaders = [];\n return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n tdIndex = 0;\n return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n return (\n <td data-label={tableHeaders[tdIndex++]} style={style}>\n {children}\n </td>\n );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n tableHeaders.push(children);\n return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n // If we have a heading, make it lower case\n let anchor = heading.toLowerCase();\n\n // Clean anchor (replace special characters whitespaces).\n // Alternatively, use encodeURIComponent() if you don't care about\n // pretty anchor links\n anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n anchor = anchor.replace(/ /g, \"-\");\n\n return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children }) => {\n const config = useConfig();\n const bookmarksConfig = config?.elements?.bookmarks;\n // Access actual (string) value of heading\n const heading = children?.[0] || \"\";\n\n // If we have a heading, make it lower case\n let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n const label = typeof heading === \"string\" ? heading : anchor;\n\n const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n // Utility\n const container = (children: React.ReactNode): JSX.Element => (\n <>\n <a className=\"heading\" id={anchor} href={`#${anchor}`}>\n <span>{children}</span>\n </a>\n {bookmarksConfig !== false && (\n <button\n className={bookmark ? \"bookmark active\" : \"bookmark\"}\n onClick={() => toggleBookmark()}\n title=\"Bookmark\"\n >\n \uD83D\uDD16\n </button>\n )}\n </>\n );\n\n switch (level) {\n case 1:\n return <h1>{container(children)}</h1>;\n case 2:\n return <h2>{container(children)}</h2>;\n case 3:\n return <h3>{container(children)}</h3>;\n case 4:\n return <h4>{container(children)}</h4>;\n case 5:\n return <h5>{container(children)}</h5>;\n\n default:\n return <h6>{container(children)}</h6>;\n }\n};\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Image: Components[\"img\"] = ({ src, title, alt }) => {\n const makeUrl = useMakeUrl();\n src = makeUrl(src, \"public\");\n\n return (\n <figure>\n <img src={src} alt={alt} />\n {title && <figcaption>{title}</figcaption>}\n </figure>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_provider", "import_provider", "import_jsx_runtime", "import_jsx_runtime", "import_provider", "import_jsx_runtime", "children", "import_provider", "import_jsx_runtime", "import_jsx_runtime", "ReactMarkdown", "remarkDirective", "remarkDirectiveRehype", "remarkGfm", "remarkMath", "remarkGemoji", "remarkUnwrapImages", "rehypeKatex", "rehypeHighlight"]
|
|
7
7
|
}
|
package/dist/index.esm.mjs
CHANGED
|
@@ -29,6 +29,7 @@ import remarkUnwrapImages from "remark-unwrap-images";
|
|
|
29
29
|
import rehypeKatex from "rehype-katex";
|
|
30
30
|
import rehypeHighlight from "rehype-highlight";
|
|
31
31
|
import { useDirectives as useDirectives2 } from "@hyperbook/provider";
|
|
32
|
+
import { visit, SKIP } from "unist-util-visit";
|
|
32
33
|
|
|
33
34
|
// src/Code.tsx
|
|
34
35
|
import { useDirectives } from "@hyperbook/provider";
|
|
@@ -155,7 +156,7 @@ var Th = ({ children, style }) => {
|
|
|
155
156
|
};
|
|
156
157
|
|
|
157
158
|
// src/Headings.tsx
|
|
158
|
-
import { useBookmark } from "@hyperbook/provider";
|
|
159
|
+
import { useBookmark, useConfig } from "@hyperbook/provider";
|
|
159
160
|
import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
160
161
|
var makeAnchor = (heading) => {
|
|
161
162
|
let anchor = heading.toLowerCase();
|
|
@@ -164,6 +165,9 @@ var makeAnchor = (heading) => {
|
|
|
164
165
|
return anchor;
|
|
165
166
|
};
|
|
166
167
|
var Headings = ({ level, children }) => {
|
|
168
|
+
var _a;
|
|
169
|
+
const config = useConfig();
|
|
170
|
+
const bookmarksConfig = (_a = config == null ? void 0 : config.elements) == null ? void 0 : _a.bookmarks;
|
|
167
171
|
const heading = (children == null ? void 0 : children[0]) || "";
|
|
168
172
|
let anchor = typeof heading === "string" ? makeAnchor(heading) : "";
|
|
169
173
|
const label = typeof heading === "string" ? heading : anchor;
|
|
@@ -178,7 +182,7 @@ var Headings = ({ level, children }) => {
|
|
|
178
182
|
children: children2
|
|
179
183
|
})
|
|
180
184
|
}),
|
|
181
|
-
/* @__PURE__ */ jsx4("button", {
|
|
185
|
+
bookmarksConfig !== false && /* @__PURE__ */ jsx4("button", {
|
|
182
186
|
className: bookmark ? "bookmark active" : "bookmark",
|
|
183
187
|
onClick: () => toggleBookmark(),
|
|
184
188
|
title: "Bookmark",
|
|
@@ -235,6 +239,18 @@ var Image = ({ src, title, alt }) => {
|
|
|
235
239
|
|
|
236
240
|
// src/Markdown.tsx
|
|
237
241
|
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
242
|
+
var remarkRemoveComments = () => (tree) => {
|
|
243
|
+
const htmlCommentRegex = /<!--([\s\S]*?)-->/g;
|
|
244
|
+
const handler = (node, index, parent) => {
|
|
245
|
+
const isComment = node.value.match(htmlCommentRegex);
|
|
246
|
+
if (isComment) {
|
|
247
|
+
parent.children.splice(index, 1);
|
|
248
|
+
return [SKIP, index];
|
|
249
|
+
}
|
|
250
|
+
};
|
|
251
|
+
visit(tree, "html", handler);
|
|
252
|
+
visit(tree, "jsx", handler);
|
|
253
|
+
};
|
|
238
254
|
var Markdown = ({ children }) => {
|
|
239
255
|
const directives = useDirectives2();
|
|
240
256
|
return /* @__PURE__ */ jsx6(ReactMarkdown, {
|
|
@@ -255,6 +271,7 @@ var Markdown = ({ children }) => {
|
|
|
255
271
|
img: Image
|
|
256
272
|
}),
|
|
257
273
|
remarkPlugins: [
|
|
274
|
+
remarkRemoveComments,
|
|
258
275
|
remarkDirective,
|
|
259
276
|
remarkDirectiveRehype,
|
|
260
277
|
remarkGfm,
|
package/dist/index.esm.mjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/Markdown.tsx", "../src/Code.tsx", "../src/Link.tsx", "../src/Table.tsx", "../src/Headings.tsx", "../src/Image.tsx"],
|
|
4
|
-
"sourcesContent": ["import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\n\nexport type MarkdownProps = {\n children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n const directives = useDirectives();\n\n return (\n <ReactMarkdown\n className=\"hyperbook-markdown\"\n components={{\n ...directives,\n a: Link,\n code: Code,\n td: Td,\n th: Th,\n table: Table,\n tr: Tr,\n h1: Headings,\n h2: Headings,\n h3: Headings,\n h4: Headings,\n h5: Headings,\n h6: Headings,\n img: Image,\n }}\n remarkPlugins={[\n remarkDirective,\n remarkDirectiveRehype,\n remarkGfm,\n remarkMath,\n remarkGemoji,\n remarkUnwrapImages,\n ]}\n rehypePlugins={[\n rehypeKatex,\n [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n ]}\n skipHtml={false}\n >\n {children}\n </ReactMarkdown>\n );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n </svg>\n );\n};\n\nconst MdDone = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n </svg>\n );\n};\n\nexport const Code: Components[\"code\"] = ({ children, className }) => {\n const directives = useDirectives();\n if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n const Mermaid = directives[\"mermaid\"];\n return <Mermaid children={children} />;\n }\n\n const ref = useRef<HTMLElement>(null);\n const [copied, setCopied] = useState(false);\n const copyCode = () => {\n if (navigator.clipboard && ref.current) {\n const text = ref.current.innerText;\n navigator.clipboard.writeText(text);\n\n setCopied(true);\n\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <Fragment>\n <code ref={ref} className={className}>\n {children}\n </code>\n <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n {copied ? <MdDone /> : <MdContentCopy />}\n </button>\n </Fragment>\n );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n const L = useLink();\n return (\n <L href={href} title={title}>\n {children}\n </L>\n );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n tableHeaders = [];\n return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n tdIndex = 0;\n return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n return (\n <td data-label={tableHeaders[tdIndex++]} style={style}>\n {children}\n </td>\n );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n tableHeaders.push(children);\n return <th style={style}>{children}</th>;\n};\n", "import { useBookmark } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n // If we have a heading, make it lower case\n let anchor = heading.toLowerCase();\n\n // Clean anchor (replace special characters whitespaces).\n // Alternatively, use encodeURIComponent() if you don't care about\n // pretty anchor links\n anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n anchor = anchor.replace(/ /g, \"-\");\n\n return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children }) => {\n // Access actual (string) value of heading\n const heading = children?.[0] || \"\";\n\n // If we have a heading, make it lower case\n let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n const label = typeof heading === \"string\" ? heading : anchor;\n\n const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n // Utility\n const container = (children: React.ReactNode): JSX.Element => (\n <>\n <a className=\"heading\" id={anchor} href={`#${anchor}`}>\n <span>{children}</span>\n </a>\n <button\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,mBAAmB;AAC1B,OAAO,qBAAqB;AAC5B,OAAO,2BAA2B;AAClC,OAAO,eAAe;AACtB,OAAO,gBAAgB;AACvB,OAAO,kBAAkB;AACzB,OAAO,wBAAwB;AAC/B,OAAO,iBAAiB;AACxB,OAAO,qBAAqB;AAC5B,SAAS,iBAAAA,sBAAqB;;;
|
|
4
|
+
"sourcesContent": ["import ReactMarkdown from \"react-markdown\";\nimport remarkDirective from \"remark-directive\";\nimport remarkDirectiveRehype from \"remark-directive-rehype\";\nimport remarkGfm from \"remark-gfm\";\nimport remarkMath from \"remark-math\";\nimport remarkGemoji from \"remark-gemoji\";\nimport remarkUnwrapImages from \"remark-unwrap-images\";\nimport rehypeKatex from \"rehype-katex\";\nimport rehypeHighlight from \"rehype-highlight\";\nimport { useDirectives } from \"@hyperbook/provider\";\nimport { visit, SKIP } from \"unist-util-visit\";\nimport { Code } from \"./Code\";\nimport { Link } from \"./Link\";\nimport { Table, Td, Th, Tr } from \"./Table\";\nimport { Headings } from \"./Headings\";\nimport { Image } from \"./Image\";\n\nimport \"./index.css\";\nimport { Transformer } from \"unified\";\nimport { BuildVisitor } from \"unist-util-visit/complex-types\";\n\nconst remarkRemoveComments: () => Transformer = () => (tree) => {\n const htmlCommentRegex = /<!--([\\s\\S]*?)-->/g;\n\n const handler: BuildVisitor = (node, index, parent) => {\n const isComment = node.value.match(htmlCommentRegex);\n\n if (isComment) {\n // remove node\n parent.children.splice(index, 1);\n // Do not traverse `node`, continue at the node *now* at `index`. http://unifiedjs.com/learn/recipe/remove-node/\n return [SKIP, index];\n }\n };\n\n visit(tree, \"html\", handler);\n\n visit(tree, \"jsx\", handler);\n};\n\nexport type MarkdownProps = {\n children: string;\n};\n\nexport const Markdown = ({ children }: MarkdownProps) => {\n const directives = useDirectives();\n\n return (\n <ReactMarkdown\n className=\"hyperbook-markdown\"\n components={{\n ...directives,\n a: Link,\n code: Code,\n td: Td,\n th: Th,\n table: Table,\n tr: Tr,\n h1: Headings,\n h2: Headings,\n h3: Headings,\n h4: Headings,\n h5: Headings,\n h6: Headings,\n img: Image,\n }}\n remarkPlugins={[\n remarkRemoveComments,\n remarkDirective,\n remarkDirectiveRehype,\n remarkGfm,\n remarkMath,\n remarkGemoji,\n remarkUnwrapImages,\n ]}\n rehypePlugins={[\n rehypeKatex,\n [rehypeHighlight, { ignoreMissing: true, plainText: [\"mermaid\"] }],\n ]}\n skipHtml={false}\n >\n {children}\n </ReactMarkdown>\n );\n};\n", "import { useDirectives } from \"@hyperbook/provider\";\nimport { Fragment, useRef, useState } from \"react\";\nimport { Components } from \"react-markdown\";\n\nconst MdContentCopy = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z\" />\n </svg>\n );\n};\n\nconst MdDone = () => {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n stroke=\"currentColor\"\n fill=\"currentColor\"\n strokeWidth=\"0\"\n height=\"1em\"\n width=\"1em\"\n viewBox=\"0 0 24 24\"\n >\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\" />\n </svg>\n );\n};\n\nexport const Code: Components[\"code\"] = ({ children, className }) => {\n const directives = useDirectives();\n if (className === \"language-mermaid\" && directives[\"mermaid\"]) {\n const Mermaid = directives[\"mermaid\"];\n return <Mermaid children={children} />;\n }\n\n const ref = useRef<HTMLElement>(null);\n const [copied, setCopied] = useState(false);\n const copyCode = () => {\n if (navigator.clipboard && ref.current) {\n const text = ref.current.innerText;\n navigator.clipboard.writeText(text);\n\n setCopied(true);\n\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <Fragment>\n <code ref={ref} className={className}>\n {children}\n </code>\n <button className=\"copy\" onClick={copyCode} aria-label=\"Copy Code\">\n {copied ? <MdDone /> : <MdContentCopy />}\n </button>\n </Fragment>\n );\n};\n", "import { useLink } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Link: Components[\"a\"] = ({ href, title, children }) => {\n const L = useLink();\n return (\n <L href={href} title={title}>\n {children}\n </L>\n );\n};\n", "import { ReactNode } from \"react\";\nimport { Components } from \"react-markdown\";\n\nlet tableHeaders: ReactNode[][] = [];\nlet tdIndex = 0;\n\nexport const Table: Components[\"table\"] = ({ children, style }) => {\n tableHeaders = [];\n return <table style={style}>{children}</table>;\n};\n\nexport const Tr: Components[\"tr\"] = ({ children, style }) => {\n tdIndex = 0;\n return <tr style={style}>{children}</tr>;\n};\n\nexport const Td: Components[\"td\"] = ({ children, style }) => {\n return (\n <td data-label={tableHeaders[tdIndex++]} style={style}>\n {children}\n </td>\n );\n};\n\nexport const Th: Components[\"th\"] = ({ children, style }) => {\n tableHeaders.push(children);\n return <th style={style}>{children}</th>;\n};\n", "import { useBookmark, useConfig } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const makeAnchor = (heading: string) => {\n // If we have a heading, make it lower case\n let anchor = heading.toLowerCase();\n\n // Clean anchor (replace special characters whitespaces).\n // Alternatively, use encodeURIComponent() if you don't care about\n // pretty anchor links\n anchor = anchor.replace(/[^a-zA-Z0-9 ]/g, \"\");\n anchor = anchor.replace(/ /g, \"-\");\n\n return anchor;\n};\n\nexport const Headings: Components[\"h1\"] = ({ level, children }) => {\n const config = useConfig();\n const bookmarksConfig = config?.elements?.bookmarks;\n // Access actual (string) value of heading\n const heading = children?.[0] || \"\";\n\n // If we have a heading, make it lower case\n let anchor = typeof heading === \"string\" ? makeAnchor(heading) : \"\";\n\n const label = typeof heading === \"string\" ? heading : anchor;\n\n const [bookmark, toggleBookmark] = useBookmark(anchor, label);\n\n // Utility\n const container = (children: React.ReactNode): JSX.Element => (\n <>\n <a className=\"heading\" id={anchor} href={`#${anchor}`}>\n <span>{children}</span>\n </a>\n {bookmarksConfig !== false && (\n <button\n className={bookmark ? \"bookmark active\" : \"bookmark\"}\n onClick={() => toggleBookmark()}\n title=\"Bookmark\"\n >\n \uD83D\uDD16\n </button>\n )}\n </>\n );\n\n switch (level) {\n case 1:\n return <h1>{container(children)}</h1>;\n case 2:\n return <h2>{container(children)}</h2>;\n case 3:\n return <h3>{container(children)}</h3>;\n case 4:\n return <h4>{container(children)}</h4>;\n case 5:\n return <h5>{container(children)}</h5>;\n\n default:\n return <h6>{container(children)}</h6>;\n }\n};\n", "import { useMakeUrl } from \"@hyperbook/provider\";\nimport { Components } from \"react-markdown\";\n\nexport const Image: Components[\"img\"] = ({ src, title, alt }) => {\n const makeUrl = useMakeUrl();\n src = makeUrl(src, \"public\");\n\n return (\n <figure>\n <img src={src} alt={alt} />\n {title && <figcaption>{title}</figcaption>}\n </figure>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["useDirectives", "jsx", "jsx", "Fragment", "jsx", "jsxs", "children", "jsx", "jsxs", "jsx", "useDirectives"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hyperbook/markdown",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"author": "Mike Barkmin",
|
|
5
5
|
"homepage": "https://github.com/openpatch/hyperbook#readme",
|
|
6
6
|
"license": "MIT",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"url": "https://github.com/openpatch/hyperbook/issues"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@hyperbook/provider": "0.1.
|
|
35
|
+
"@hyperbook/provider": "0.1.5",
|
|
36
36
|
"react-markdown": "8.0.3",
|
|
37
37
|
"rehype-highlight": "5.0.2",
|
|
38
38
|
"rehype-katex": "6.0.2",
|
|
@@ -41,17 +41,19 @@
|
|
|
41
41
|
"remark-gemoji": "7.0.1",
|
|
42
42
|
"remark-gfm": "3.0.1",
|
|
43
43
|
"remark-math": "5.1.1",
|
|
44
|
-
"remark-unwrap-images": "3.0.1"
|
|
44
|
+
"remark-unwrap-images": "3.0.1",
|
|
45
|
+
"unified": "^10.1.2",
|
|
46
|
+
"unist-util-visit": "^4.1.1"
|
|
45
47
|
},
|
|
46
48
|
"peerDependencies": {
|
|
47
49
|
"react": "18.x",
|
|
48
50
|
"react-dom": "18.x"
|
|
49
51
|
},
|
|
50
52
|
"devDependencies": {
|
|
51
|
-
"@types/hast": "
|
|
53
|
+
"@types/hast": "2.3.4",
|
|
52
54
|
"@types/react": "18.0.15",
|
|
53
55
|
"@types/react-dom": "18.0.6",
|
|
54
|
-
"@types/unist": "
|
|
56
|
+
"@types/unist": "2.0.6",
|
|
55
57
|
"react": "18.2.0",
|
|
56
58
|
"react-dom": "18.2.0"
|
|
57
59
|
},
|