@automattic/social-previews 3.0.7 → 3.0.8
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/CHANGELOG.md +8 -0
- package/dist/index.css +9 -9
- package/dist/index.css.map +1 -1
- package/dist/index.js +50 -38
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +86 -74
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -3
package/dist/index.mjs
CHANGED
|
@@ -1165,6 +1165,10 @@ var MastodonPostActions = () => /* @__PURE__ */ jsxs24("div", { className: "mast
|
|
|
1165
1165
|
] });
|
|
1166
1166
|
var actions_default3 = MastodonPostActions;
|
|
1167
1167
|
|
|
1168
|
+
// src/mastodon-preview/post/card/index.tsx
|
|
1169
|
+
import { __ as __15 } from "@wordpress/i18n";
|
|
1170
|
+
import clsx3 from "clsx";
|
|
1171
|
+
|
|
1168
1172
|
// src/mastodon-preview/constants.ts
|
|
1169
1173
|
var DEFAULT_MASTODON_INSTANCE = "mastodon.social";
|
|
1170
1174
|
|
|
@@ -1194,44 +1198,8 @@ var getMastodonAddressDetails = (address) => {
|
|
|
1194
1198
|
};
|
|
1195
1199
|
};
|
|
1196
1200
|
|
|
1197
|
-
// src/mastodon-preview/post/body/index.tsx
|
|
1198
|
-
import { Fragment as Fragment3, jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
1199
|
-
var MastonPostBody = (props) => {
|
|
1200
|
-
const { title, description, customText, url, user, children } = props;
|
|
1201
|
-
const instance = user?.address ? getMastodonAddressDetails(user.address).instance : "";
|
|
1202
|
-
const options = {
|
|
1203
|
-
instance,
|
|
1204
|
-
offset: 0
|
|
1205
|
-
};
|
|
1206
|
-
let bodyTxt;
|
|
1207
|
-
if (customText) {
|
|
1208
|
-
bodyTxt = /* @__PURE__ */ jsx33("p", { children: mastodonBody(customText, options) });
|
|
1209
|
-
} else if (description) {
|
|
1210
|
-
if (title) {
|
|
1211
|
-
const renderedTitle = stripHtmlTags(title);
|
|
1212
|
-
options.offset = renderedTitle.length;
|
|
1213
|
-
bodyTxt = /* @__PURE__ */ jsxs25(Fragment3, { children: [
|
|
1214
|
-
/* @__PURE__ */ jsx33("p", { children: renderedTitle }),
|
|
1215
|
-
/* @__PURE__ */ jsx33("p", { children: mastodonBody(description, options) })
|
|
1216
|
-
] });
|
|
1217
|
-
} else {
|
|
1218
|
-
bodyTxt = /* @__PURE__ */ jsx33("p", { children: mastodonBody(description, options) });
|
|
1219
|
-
}
|
|
1220
|
-
} else {
|
|
1221
|
-
bodyTxt = /* @__PURE__ */ jsx33("p", { children: mastodonBody(title, options) });
|
|
1222
|
-
}
|
|
1223
|
-
return /* @__PURE__ */ jsxs25("div", { className: "mastodon-preview__body", children: [
|
|
1224
|
-
bodyTxt,
|
|
1225
|
-
/* @__PURE__ */ jsx33("a", { href: url, target: "_blank", rel: "noreferrer noopener", children: mastodonUrl(url.replace(/^https?:\/\//, "")) }),
|
|
1226
|
-
children
|
|
1227
|
-
] });
|
|
1228
|
-
};
|
|
1229
|
-
var body_default = MastonPostBody;
|
|
1230
|
-
|
|
1231
1201
|
// src/mastodon-preview/post/card/index.tsx
|
|
1232
|
-
import {
|
|
1233
|
-
import clsx3 from "clsx";
|
|
1234
|
-
import { jsx as jsx34, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
1202
|
+
import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
1235
1203
|
var MastodonPostCard = ({
|
|
1236
1204
|
siteName,
|
|
1237
1205
|
title,
|
|
@@ -1240,14 +1208,14 @@ var MastodonPostCard = ({
|
|
|
1240
1208
|
image,
|
|
1241
1209
|
customImage
|
|
1242
1210
|
}) => {
|
|
1243
|
-
return /* @__PURE__ */
|
|
1244
|
-
/* @__PURE__ */
|
|
1211
|
+
return /* @__PURE__ */ jsxs25("div", { className: clsx3("mastodon-preview__card", { "has-image": image }), children: [
|
|
1212
|
+
/* @__PURE__ */ jsx33("div", { className: "mastodon-preview__card-img", children: image || customImage ? /* @__PURE__ */ jsx33(
|
|
1245
1213
|
"img",
|
|
1246
1214
|
{
|
|
1247
1215
|
src: image || customImage,
|
|
1248
1216
|
alt: __15("Mastodon preview thumbnail", "social-previews")
|
|
1249
1217
|
}
|
|
1250
|
-
) : /* @__PURE__ */
|
|
1218
|
+
) : /* @__PURE__ */ jsx33("div", { className: "mastodon-preview__card-img--fallback", children: /* @__PURE__ */ jsx33(
|
|
1251
1219
|
"svg",
|
|
1252
1220
|
{
|
|
1253
1221
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1255,13 +1223,13 @@ var MastodonPostCard = ({
|
|
|
1255
1223
|
viewBox: "0 -960 960 960",
|
|
1256
1224
|
width: "24",
|
|
1257
1225
|
"aria-hidden": "true",
|
|
1258
|
-
children: /* @__PURE__ */
|
|
1226
|
+
children: /* @__PURE__ */ jsx33("path", { d: "M320-240h320v-80H320v80Zm0-160h320v-80H320v80ZM240-80q-33 0-56.5-23.5T160-160v-640q0-33 23.5-56.5T240-880h320l240 240v480q0 33-23.5 56.5T720-80H240Zm280-520h200L520-800v200Z" })
|
|
1259
1227
|
}
|
|
1260
1228
|
) }) }),
|
|
1261
|
-
/* @__PURE__ */
|
|
1262
|
-
/* @__PURE__ */
|
|
1263
|
-
/* @__PURE__ */
|
|
1264
|
-
/* @__PURE__ */
|
|
1229
|
+
/* @__PURE__ */ jsxs25("div", { className: "mastodon-preview__card-text", children: [
|
|
1230
|
+
/* @__PURE__ */ jsx33("span", { className: "mastodon-preview__card-site", children: siteName || baseDomain(url) }),
|
|
1231
|
+
/* @__PURE__ */ jsx33("span", { className: "mastodon-preview__card-title", children: mastodonTitle(title) || getTitleFromDescription(description) }),
|
|
1232
|
+
/* @__PURE__ */ jsx33("span", { className: "mastodon-preview__card-description", children: stripHtmlTags(description) })
|
|
1265
1233
|
] })
|
|
1266
1234
|
] });
|
|
1267
1235
|
};
|
|
@@ -1271,9 +1239,9 @@ var card_default = MastodonPostCard;
|
|
|
1271
1239
|
import { __ as __16 } from "@wordpress/i18n";
|
|
1272
1240
|
|
|
1273
1241
|
// src/mastodon-preview/post/icons/index.tsx
|
|
1274
|
-
import { jsx as
|
|
1242
|
+
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
1275
1243
|
function GlobeIcon() {
|
|
1276
|
-
return /* @__PURE__ */
|
|
1244
|
+
return /* @__PURE__ */ jsx34(
|
|
1277
1245
|
"svg",
|
|
1278
1246
|
{
|
|
1279
1247
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1281,26 +1249,26 @@ function GlobeIcon() {
|
|
|
1281
1249
|
viewBox: "0 -960 960 960",
|
|
1282
1250
|
width: "15",
|
|
1283
1251
|
role: "img",
|
|
1284
|
-
children: /* @__PURE__ */
|
|
1252
|
+
children: /* @__PURE__ */ jsx34("path", { d: "M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-40-82v-78q-33 0-56.5-23.5T360-320v-40L168-552q-3 18-5.5 36t-2.5 36q0 121 79.5 212T440-162Zm276-102q20-22 36-47.5t26.5-53q10.5-27.5 16-56.5t5.5-59q0-98-54.5-179T600-776v16q0 33-23.5 56.5T520-680h-80v80q0 17-11.5 28.5T400-560h-80v80h240q17 0 28.5 11.5T600-440v120h40q26 0 47 15.5t29 40.5Z" })
|
|
1285
1253
|
}
|
|
1286
1254
|
);
|
|
1287
1255
|
}
|
|
1288
1256
|
|
|
1289
1257
|
// src/mastodon-preview/post/header/index.tsx
|
|
1290
|
-
import { jsx as
|
|
1258
|
+
import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
1291
1259
|
var MastodonPostHeader = ({ user }) => {
|
|
1292
1260
|
const { displayName, address, avatarUrl } = user || {};
|
|
1293
|
-
return /* @__PURE__ */
|
|
1294
|
-
/* @__PURE__ */
|
|
1295
|
-
/* @__PURE__ */
|
|
1296
|
-
/* @__PURE__ */
|
|
1297
|
-
/* @__PURE__ */
|
|
1261
|
+
return /* @__PURE__ */ jsxs26("div", { className: "mastodon-preview__post-header", children: [
|
|
1262
|
+
/* @__PURE__ */ jsxs26("div", { className: "mastodon-preview__post-header-user", children: [
|
|
1263
|
+
/* @__PURE__ */ jsx35(AvatarWithFallback, { className: "mastodon-preview__post-avatar", src: avatarUrl }),
|
|
1264
|
+
/* @__PURE__ */ jsxs26("div", { children: [
|
|
1265
|
+
/* @__PURE__ */ jsx35("div", { className: "mastodon-preview__post-header-displayname", children: displayName || // translators: username of a fictional Mastodon User
|
|
1298
1266
|
__16("anonymous-user", "social-previews") }),
|
|
1299
|
-
/* @__PURE__ */
|
|
1267
|
+
/* @__PURE__ */ jsx35("div", { className: "mastodon-preview__post-header-username", children: address?.replace(`@${DEFAULT_MASTODON_INSTANCE}`, "") || "@username" })
|
|
1300
1268
|
] })
|
|
1301
1269
|
] }),
|
|
1302
|
-
/* @__PURE__ */
|
|
1303
|
-
/* @__PURE__ */
|
|
1270
|
+
/* @__PURE__ */ jsxs26("div", { className: "mastodon-preview__post-header-audience", children: [
|
|
1271
|
+
/* @__PURE__ */ jsx35(GlobeIcon, {}),
|
|
1304
1272
|
formatMastodonDate(/* @__PURE__ */ new Date())
|
|
1305
1273
|
] })
|
|
1306
1274
|
] });
|
|
@@ -1308,19 +1276,54 @@ var MastodonPostHeader = ({ user }) => {
|
|
|
1308
1276
|
var header_default3 = MastodonPostHeader;
|
|
1309
1277
|
|
|
1310
1278
|
// src/mastodon-preview/link-preview.tsx
|
|
1311
|
-
import { jsx as
|
|
1279
|
+
import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
1312
1280
|
var MastodonLinkPreview = (props) => {
|
|
1313
1281
|
const { user } = props;
|
|
1314
|
-
return /* @__PURE__ */
|
|
1315
|
-
/* @__PURE__ */
|
|
1316
|
-
/* @__PURE__ */
|
|
1317
|
-
/* @__PURE__ */
|
|
1318
|
-
/* @__PURE__ */ jsx37(actions_default3, {})
|
|
1282
|
+
return /* @__PURE__ */ jsxs27("div", { className: "mastodon-preview__post", children: [
|
|
1283
|
+
/* @__PURE__ */ jsx36(header_default3, { user }),
|
|
1284
|
+
/* @__PURE__ */ jsx36(card_default, { ...props, customImage: "" }),
|
|
1285
|
+
/* @__PURE__ */ jsx36(actions_default3, {})
|
|
1319
1286
|
] });
|
|
1320
1287
|
};
|
|
1321
1288
|
|
|
1322
1289
|
// src/mastodon-preview/post-preview.tsx
|
|
1323
1290
|
import clsx4 from "clsx";
|
|
1291
|
+
|
|
1292
|
+
// src/mastodon-preview/post/body/index.tsx
|
|
1293
|
+
import { Fragment as Fragment3, jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
1294
|
+
var MastonPostBody = (props) => {
|
|
1295
|
+
const { title, description, customText, url, user, children } = props;
|
|
1296
|
+
const instance = user?.address ? getMastodonAddressDetails(user.address).instance : "";
|
|
1297
|
+
const options = {
|
|
1298
|
+
instance,
|
|
1299
|
+
offset: 0
|
|
1300
|
+
};
|
|
1301
|
+
let bodyTxt;
|
|
1302
|
+
if (customText) {
|
|
1303
|
+
bodyTxt = /* @__PURE__ */ jsx37("p", { children: mastodonBody(customText, options) });
|
|
1304
|
+
} else if (description) {
|
|
1305
|
+
if (title) {
|
|
1306
|
+
const renderedTitle = stripHtmlTags(title);
|
|
1307
|
+
options.offset = renderedTitle.length;
|
|
1308
|
+
bodyTxt = /* @__PURE__ */ jsxs28(Fragment3, { children: [
|
|
1309
|
+
/* @__PURE__ */ jsx37("p", { children: renderedTitle }),
|
|
1310
|
+
/* @__PURE__ */ jsx37("p", { children: mastodonBody(description, options) })
|
|
1311
|
+
] });
|
|
1312
|
+
} else {
|
|
1313
|
+
bodyTxt = /* @__PURE__ */ jsx37("p", { children: mastodonBody(description, options) });
|
|
1314
|
+
}
|
|
1315
|
+
} else {
|
|
1316
|
+
bodyTxt = /* @__PURE__ */ jsx37("p", { children: mastodonBody(title, options) });
|
|
1317
|
+
}
|
|
1318
|
+
return /* @__PURE__ */ jsxs28("div", { className: "mastodon-preview__body", children: [
|
|
1319
|
+
bodyTxt,
|
|
1320
|
+
/* @__PURE__ */ jsx37("a", { href: url, target: "_blank", rel: "noreferrer noopener", children: mastodonUrl(url.replace(/^https?:\/\//, "")) }),
|
|
1321
|
+
children
|
|
1322
|
+
] });
|
|
1323
|
+
};
|
|
1324
|
+
var body_default = MastonPostBody;
|
|
1325
|
+
|
|
1326
|
+
// src/mastodon-preview/post-preview.tsx
|
|
1324
1327
|
import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
1325
1328
|
var MastodonPostPreview = (props) => {
|
|
1326
1329
|
const { user, media } = props;
|
|
@@ -1850,6 +1853,9 @@ var BlueskyPreviews = ({
|
|
|
1850
1853
|
] });
|
|
1851
1854
|
};
|
|
1852
1855
|
|
|
1856
|
+
// src/threads-preview/link-preview.tsx
|
|
1857
|
+
import { __ as __25 } from "@wordpress/i18n";
|
|
1858
|
+
|
|
1853
1859
|
// src/threads-preview/card.tsx
|
|
1854
1860
|
import clsx7 from "clsx";
|
|
1855
1861
|
|
|
@@ -2012,6 +2018,12 @@ var ThreadsPostPreview = ({
|
|
|
2012
2018
|
// src/threads-preview/link-preview.tsx
|
|
2013
2019
|
import { jsx as jsx64 } from "react/jsx-runtime";
|
|
2014
2020
|
var ThreadsLinkPreview = (props) => {
|
|
2021
|
+
if (!props.image) {
|
|
2022
|
+
return /* @__PURE__ */ jsx64("p", { className: "social-preview__section-desc", children: __25(
|
|
2023
|
+
"Threads link preview requires an image to be set for the post. Please add an image to see the preview.",
|
|
2024
|
+
"social-previews"
|
|
2025
|
+
) });
|
|
2026
|
+
}
|
|
2015
2027
|
return /* @__PURE__ */ jsx64(
|
|
2016
2028
|
ThreadsPostPreview,
|
|
2017
2029
|
{
|
|
@@ -2023,7 +2035,7 @@ var ThreadsLinkPreview = (props) => {
|
|
|
2023
2035
|
};
|
|
2024
2036
|
|
|
2025
2037
|
// src/threads-preview/previews.tsx
|
|
2026
|
-
import { __ as
|
|
2038
|
+
import { __ as __26 } from "@wordpress/i18n";
|
|
2027
2039
|
import { Fragment as Fragment7, jsx as jsx65, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
2028
2040
|
var ThreadsPreviews = ({
|
|
2029
2041
|
headingLevel,
|
|
@@ -2039,9 +2051,9 @@ var ThreadsPreviews = ({
|
|
|
2039
2051
|
/* @__PURE__ */ jsx65(section_heading_default, {
|
|
2040
2052
|
level: headingLevel,
|
|
2041
2053
|
// translators: refers to a social post on Threads
|
|
2042
|
-
children:
|
|
2054
|
+
children: __26("Your post", "social-previews")
|
|
2043
2055
|
}),
|
|
2044
|
-
/* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children:
|
|
2056
|
+
/* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children: __26("This is what your social post will look like on Threads:", "social-previews") }),
|
|
2045
2057
|
posts.map((post, index) => {
|
|
2046
2058
|
const isLast = index + 1 === posts.length;
|
|
2047
2059
|
return /* @__PURE__ */ jsx65(
|
|
@@ -2058,15 +2070,15 @@ var ThreadsPreviews = ({
|
|
|
2058
2070
|
/* @__PURE__ */ jsx65(section_heading_default, {
|
|
2059
2071
|
level: headingLevel,
|
|
2060
2072
|
// translators: refers to a link to a Threads post
|
|
2061
|
-
children:
|
|
2073
|
+
children: __26("Link preview", "social-previews")
|
|
2062
2074
|
}),
|
|
2063
2075
|
posts[0].image ? /* @__PURE__ */ jsxs46(Fragment7, { children: [
|
|
2064
|
-
/* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children:
|
|
2076
|
+
/* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children: __26(
|
|
2065
2077
|
"This is what it will look like when someone shares the link to your WordPress post on Threads.",
|
|
2066
2078
|
"social-previews"
|
|
2067
2079
|
) }),
|
|
2068
2080
|
/* @__PURE__ */ jsx65(ThreadsLinkPreview, { ...posts[0], name: "", profileImage: "" })
|
|
2069
|
-
] }) : /* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children:
|
|
2081
|
+
] }) : /* @__PURE__ */ jsx65("p", { className: "social-preview__section-desc", children: __26(
|
|
2070
2082
|
"Threads link preview requires an image to be set for the post. Please add an image to see the preview.",
|
|
2071
2083
|
"social-previews"
|
|
2072
2084
|
) })
|
|
@@ -2075,7 +2087,7 @@ var ThreadsPreviews = ({
|
|
|
2075
2087
|
};
|
|
2076
2088
|
|
|
2077
2089
|
// src/instagram-preview/post-preview.tsx
|
|
2078
|
-
import { __ as
|
|
2090
|
+
import { __ as __27 } from "@wordpress/i18n";
|
|
2079
2091
|
|
|
2080
2092
|
// src/instagram-preview/constants.tsx
|
|
2081
2093
|
var FEED_TEXT_MAX_LENGTH3 = 520;
|
|
@@ -2270,13 +2282,13 @@ function InstagramPostPreview({
|
|
|
2270
2282
|
] })
|
|
2271
2283
|
] }) : null
|
|
2272
2284
|
] }),
|
|
2273
|
-
/* @__PURE__ */ jsx71("div", { className: "instagram-preview__content--footer", children: /* @__PURE__ */ jsx71("span", { children:
|
|
2285
|
+
/* @__PURE__ */ jsx71("div", { className: "instagram-preview__content--footer", children: /* @__PURE__ */ jsx71("span", { children: __27("View one comment", "social-previews") }) })
|
|
2274
2286
|
] })
|
|
2275
2287
|
] }) });
|
|
2276
2288
|
}
|
|
2277
2289
|
|
|
2278
2290
|
// src/instagram-preview/previews.tsx
|
|
2279
|
-
import { __ as
|
|
2291
|
+
import { __ as __28 } from "@wordpress/i18n";
|
|
2280
2292
|
import { jsx as jsx72, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
2281
2293
|
var InstagramPreviews = ({
|
|
2282
2294
|
headingLevel,
|
|
@@ -2287,9 +2299,9 @@ var InstagramPreviews = ({
|
|
|
2287
2299
|
/* @__PURE__ */ jsx72(section_heading_default, {
|
|
2288
2300
|
level: headingLevel,
|
|
2289
2301
|
// translators: refers to a social post on Instagram
|
|
2290
|
-
children:
|
|
2302
|
+
children: __28("Your post", "social-previews")
|
|
2291
2303
|
}),
|
|
2292
|
-
/* @__PURE__ */ jsx72("p", { className: "social-preview__section-desc", children:
|
|
2304
|
+
/* @__PURE__ */ jsx72("p", { className: "social-preview__section-desc", children: __28(
|
|
2293
2305
|
"This is what your social post will look like on Instagram:",
|
|
2294
2306
|
"social-previews"
|
|
2295
2307
|
) }),
|