on master help sign in
Markdown: open external links in new tab
commitd418f608b0f9aee3407f6e0f9463a1c09e37cc26 authorMatilde Park <matilde.park@urbit.org> dateMon 6 Jun 2022, 16:03 (4 years ago) parent20a2135
2 files changed+37−34
components/Markdown.js+2−34 components/schema/link.markdoc.js+35
components/Markdown.js+2−34
@@ -3,6 +3,7 @@ import Markdoc, { Ast, Node, Tag } from "@markdoc/markdoc";
33import { heading } from "./schema/Heading.markdoc";
44import { footnoteRef } from "./schema/footnoteRef.markdoc";
55import { footnoteItem } from "./schema/footnoteItem.markdoc";
6+import { link } from "./schema/link.markdoc";
67import Tabs from "../components/Tabs";
78import Tab from "../components/Tab";
89import Button from "../components/Button";
@@ -32,40 +33,6 @@ require("prismjs/components/prism-hoon");
3233// };
3334// }
3435
35−// function a(h, node) {
36−// const url = node.url;
37−
38−// if (
39−// url.includes("https://urbit.org") ||
40−// url.startsWith("/") ||
41−// url.startsWith("#")
42−// ) {
43−// return {
44−// type: "element",
45−// tagName: "a",
46−// properties: {
47−// href: url,
48−// },
49−// children: all(h, node),
50−// };
51−// } else {
52−// return {
53−// type: "element",
54−// tagName: "a",
55−// properties: {
56−// target: "_blank",
57−// rel: "noopener",
58−// href: url,
59−// },
60−// children: all(h, node),
61−// };
62−// }
63−// }
64−
65−// const handlers = defaultHandlers;
66−// handlers.link = a;
67−// handlers.image = img;
68−
6936export function Fence({ children, language }) {
7037 return (
7138 <Highlight
@@ -161,6 +128,7 @@ export default function Markdown({ post }) {
161128 nodes: {
162129 fence,
163130 heading,
131+ link,
164132 footnoteItem,
165133 footnoteRef,
166134 },
components/schema/link.markdoc.jsnew file+35
@@ -0,0 +1,35 @@
1+import { Tag } from "@markdoc/markdoc";
2+
3+function checkIfExternal(attributes) {
4+ const href = attributes.href;
5+ if (
6+ href.includes(
7+ "https://urbit.org" ||
8+ href.startsWith("/") ||
9+ href.startsWith("#") ||
10+ href.startsWith("?")
11+ )
12+ ) {
13+ return "_self";
14+ } else {
15+ return "_blank";
16+ }
17+}
18+
19+export const link = {
20+ render: "a",
21+ children: ["strong", "em", "s", "code", "text", "tag"],
22+ attributes: {
23+ href: { type: String, required: true },
24+ title: { type: String },
25+ target: { type: String },
26+ },
27+ transform(node, config) {
28+ const attributes = node.transformAttributes(config);
29+ const children = node.transformChildren(config);
30+
31+ const target = checkIfExternal(attributes);
32+
33+ return new Tag(`a`, { ...attributes, target }, children);
34+ },
35+};