rehype-og-card 0.1.1 → 0.2.1
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/README.md +15 -13
- package/dist/index.js +6 -6
- package/dist/util.js +33 -30
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -58,24 +58,26 @@ https://blog.google/products/android/world-emoji-day-2024/
|
|
|
58
58
|
main();
|
|
59
59
|
```
|
|
60
60
|
|
|
61
|
-
Output:
|
|
61
|
+
Output (formatted for readability):
|
|
62
62
|
|
|
63
63
|
```html
|
|
64
64
|
<p>this is a link: https://blog.google/products/android/world-emoji-day-2024/</p>
|
|
65
65
|
<p><code>https://blog.google/products/android/world-emoji-day-2024/</code></p>
|
|
66
|
-
<p><
|
|
67
|
-
<
|
|
68
|
-
<div class="
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
<
|
|
72
|
-
|
|
66
|
+
<p><div class="og-card-container">
|
|
67
|
+
<a href="https://blog.google/products/android/world-emoji-day-2024/">
|
|
68
|
+
<div class="og-card-info">
|
|
69
|
+
<div class="og-card-title">10 fun facts about emoji for World Emoji Day</div>
|
|
70
|
+
<div class="og-card-description">Celebrate World Emoji Day with Google, and check out what’s new for Emoji Kitchen.</div>
|
|
71
|
+
<div class="og-card-url-container">
|
|
72
|
+
<img class="og-card-favicon" alt="favicon" decoding="async" height="16" loading="lazy" src="https://www.google.com/s2/favicons?domain=blog.google" width="16">
|
|
73
|
+
<span class="og-card-url">blog.google</span>
|
|
74
|
+
</div>
|
|
73
75
|
</div>
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
</
|
|
78
|
-
</
|
|
76
|
+
<div class="og-card-image-container">
|
|
77
|
+
<img class="og-card-image" alt="https://storage.googleapis.com/gweb-uniblog-publish-prod/images/world_emoji_day_v2_1.width-1300.png" decoding="async" loading="lazy" src="https://storage.googleapis.com/gweb-uniblog-publish-prod/images/world_emoji_day_v2_1.width-1300.png">
|
|
78
|
+
</div>
|
|
79
|
+
</a>
|
|
80
|
+
</div></p>
|
|
79
81
|
<p><a href="https://blog.google/products/android/world-emoji-day-2024/">https://blog.google/products/android/world-emoji-day-2024/</a></p>
|
|
80
82
|
<p><a href="https://blog.google/products/android/world-emoji-day-2024/">Google blog</a></p>
|
|
81
83
|
```
|
package/dist/index.js
CHANGED
|
@@ -43,18 +43,18 @@ const rehypeOGCard = (options) => {
|
|
|
43
43
|
visitParents(tree, ["element", "text"], (node, ancestors) => {
|
|
44
44
|
var _a;
|
|
45
45
|
let anchorNode = null;
|
|
46
|
-
|
|
46
|
+
const isBareLink = node.type === "text" && isValidURL(node.value.trim());
|
|
47
|
+
const isValidAnchor = isAnchorElement(node) && isValidURL(node.properties.href);
|
|
48
|
+
if (isBareLink) {
|
|
47
49
|
anchorNode = convertTextToAnchorElement(node);
|
|
48
50
|
}
|
|
49
|
-
else if (mergedOptions.enableSameTextURLConversion &&
|
|
50
|
-
|
|
51
|
-
isValidURL(node.properties.href)) {
|
|
52
|
-
const isBareLink =
|
|
51
|
+
else if (mergedOptions.enableSameTextURLConversion && isValidAnchor) {
|
|
52
|
+
const isSameTextURL =
|
|
53
53
|
// eslint-disable-next-line no-magic-numbers
|
|
54
54
|
node.children.length === 1 &&
|
|
55
55
|
isTextNode(node.children[0]) &&
|
|
56
56
|
node.children[0].value === node.properties.href;
|
|
57
|
-
if (!
|
|
57
|
+
if (!isSameTextURL)
|
|
58
58
|
return;
|
|
59
59
|
anchorNode = node;
|
|
60
60
|
}
|
package/dist/util.js
CHANGED
|
@@ -31,9 +31,10 @@ const isAnchorElement = (node) => Boolean(node) && isElement(node, "a") && "href
|
|
|
31
31
|
* @returns `true` if the URL is valid, `false` otherwise.
|
|
32
32
|
*/
|
|
33
33
|
const isValidURL = (url) => {
|
|
34
|
+
const ALLOWED_PROTOCOLS = ["http:", "https:"];
|
|
34
35
|
try {
|
|
35
|
-
new URL(url);
|
|
36
|
-
return
|
|
36
|
+
const { protocol } = new URL(url);
|
|
37
|
+
return ALLOWED_PROTOCOLS.includes(protocol.toLowerCase());
|
|
37
38
|
}
|
|
38
39
|
catch (_a) {
|
|
39
40
|
return false;
|
|
@@ -85,34 +86,36 @@ const getOGData = (url, userAgent) => __awaiter(void 0, void 0, void 0, function
|
|
|
85
86
|
* @returns OG card element.
|
|
86
87
|
*/
|
|
87
88
|
const createOGCard = (data, options) => {
|
|
88
|
-
const card = h("
|
|
89
|
-
h("
|
|
90
|
-
h("div.
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
h("
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
h("
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
89
|
+
const card = h("div.og-card-container", [
|
|
90
|
+
h("a", { href: data.url }, [
|
|
91
|
+
h("div.og-card-info", [
|
|
92
|
+
h("div.og-card-title", data.title),
|
|
93
|
+
data.description ? h("div.og-card-description", data.description) : null,
|
|
94
|
+
h("div.og-card-url-container", [
|
|
95
|
+
h("img.og-card-favicon", {
|
|
96
|
+
alt: "favicon",
|
|
97
|
+
decoding: options.decoding,
|
|
98
|
+
height: 16,
|
|
99
|
+
loading: options.loading,
|
|
100
|
+
src: data.faviconURL,
|
|
101
|
+
width: 16
|
|
102
|
+
}),
|
|
103
|
+
h("span.og-card-url", data.displayURL)
|
|
104
|
+
])
|
|
105
|
+
]),
|
|
106
|
+
data.OGImageURL
|
|
107
|
+
? h("div.og-card-image-container", [
|
|
108
|
+
h("img.og-card-image", {
|
|
109
|
+
alt: data.OGImageAlt || data.OGImageURL,
|
|
110
|
+
decoding: options.decoding,
|
|
111
|
+
height: data.OGImageHeight,
|
|
112
|
+
loading: options.loading,
|
|
113
|
+
src: data.OGImageURL,
|
|
114
|
+
width: data.OGImageWidth
|
|
115
|
+
})
|
|
116
|
+
])
|
|
117
|
+
: null
|
|
118
|
+
])
|
|
116
119
|
]);
|
|
117
120
|
return card;
|
|
118
121
|
};
|