canvu-react 0.4.32 → 0.4.33
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 +1 -10
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +1 -10
- package/dist/index.js.map +1 -1
- package/dist/native.cjs +1 -10
- package/dist/native.cjs.map +1 -1
- package/dist/native.js +1 -10
- package/dist/native.js.map +1 -1
- package/dist/react.cjs +2 -11
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +2 -11
- package/dist/react.js.map +1 -1
- package/dist/tldraw.cjs +1 -10
- package/dist/tldraw.cjs.map +1 -1
- package/dist/tldraw.js +1 -10
- package/dist/tldraw.js.map +1 -1
- package/package.json +1 -1
package/dist/native.cjs
CHANGED
|
@@ -40,7 +40,7 @@ var LINK_PLUGIN_KEY = "canvuLink";
|
|
|
40
40
|
var DEFAULT_LINK_CARD_WIDTH = 320;
|
|
41
41
|
var DEFAULT_LINK_CARD_HEIGHT = 70;
|
|
42
42
|
var LINK_CARD_MIN_SCALE = 0.6;
|
|
43
|
-
var LINK_CARD_MAX_SCALE =
|
|
43
|
+
var LINK_CARD_MAX_SCALE = 6;
|
|
44
44
|
var LINK_CARD_ASPECT = DEFAULT_LINK_CARD_WIDTH / DEFAULT_LINK_CARD_HEIGHT;
|
|
45
45
|
var LINK_CARD_BORDER = "oklch(0.918 0.008 255)";
|
|
46
46
|
var LINK_CARD_BORDER_STRONG = "oklch(0.86 0.012 255)";
|
|
@@ -53,7 +53,6 @@ var formatNumber = (value) => {
|
|
|
53
53
|
const rounded = Math.round(value * 100) / 100;
|
|
54
54
|
return Object.is(rounded, -0) ? "0" : String(rounded);
|
|
55
55
|
};
|
|
56
|
-
var escapeXmlAttribute = (value) => value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll('"', """).replaceAll("'", "'");
|
|
57
56
|
var escapeHtmlText = (value) => value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">");
|
|
58
57
|
var getLinkHostname = (href) => {
|
|
59
58
|
try {
|
|
@@ -78,7 +77,6 @@ var getLinkInitial = (hostname) => {
|
|
|
78
77
|
const first = hostname.trim().charAt(0).toUpperCase();
|
|
79
78
|
return first || "L";
|
|
80
79
|
};
|
|
81
|
-
var buildGoogleFaviconUrl = (hostname) => hostname ? `https://www.google.com/s2/favicons?domain=${encodeURIComponent(hostname)}&sz=64` : null;
|
|
82
80
|
var getStableLinkIdSuffix = (value) => {
|
|
83
81
|
let hash = 0;
|
|
84
82
|
for (const char of value) {
|
|
@@ -101,16 +99,13 @@ function buildLinkCardSvg(width, _height, link) {
|
|
|
101
99
|
const title = link.title?.trim() || hostname || "Link";
|
|
102
100
|
const protocol = getLinkProtocol(link.href);
|
|
103
101
|
const subtitle = hostname || link.href;
|
|
104
|
-
const favicon = link.favicon?.trim() || buildGoogleFaviconUrl(hostname);
|
|
105
102
|
const idSuffix = getStableLinkIdSuffix(`${hostname}:${link.href}`);
|
|
106
|
-
const clipId = `canvu-link-favicon-${idSuffix}`;
|
|
107
103
|
const gradientId = `canvu-link-favicon-gradient-${idSuffix}`;
|
|
108
104
|
const buttonX = contentWidth - padding - buttonSize;
|
|
109
105
|
const buttonY = (contentHeight - buttonSize) / 2;
|
|
110
106
|
const isSecure = protocol === "https:";
|
|
111
107
|
const subtitleX = isSecure ? textX + 13 : textX;
|
|
112
108
|
const subtitleWidth = isSecure ? textWidth - 13 : textWidth;
|
|
113
|
-
const faviconImage = favicon ? `<image class="canvu-link-favicon-img" href="${escapeXmlAttribute(favicon)}" x="${formatNumber(padding)}" y="${formatNumber(padding)}" width="${formatNumber(badgeSize)}" height="${formatNumber(badgeSize)}" preserveAspectRatio="xMidYMid slice" clip-path="url(#${clipId})" />` : "";
|
|
114
109
|
return `
|
|
115
110
|
<style>
|
|
116
111
|
.canvu-link-card-root .canvu-link-card { transition: transform .18s ease, filter .18s ease, stroke .18s ease; }
|
|
@@ -125,13 +120,9 @@ function buildLinkCardSvg(width, _height, link) {
|
|
|
125
120
|
<stop stop-color="${LINK_CARD_ACCENT}" />
|
|
126
121
|
<stop offset="1" stop-color="${LINK_CARD_ACCENT_DEEP}" />
|
|
127
122
|
</linearGradient>
|
|
128
|
-
<clipPath id="${clipId}">
|
|
129
|
-
<rect x="${formatNumber(padding)}" y="${formatNumber(padding)}" width="${formatNumber(badgeSize)}" height="${formatNumber(badgeSize)}" rx="11" />
|
|
130
|
-
</clipPath>
|
|
131
123
|
</defs>
|
|
132
124
|
<rect x="${formatNumber(padding)}" y="${formatNumber(padding)}" width="${formatNumber(badgeSize)}" height="${formatNumber(badgeSize)}" rx="11" fill="url(#${gradientId})" />
|
|
133
125
|
<text x="${formatNumber(padding + badgeSize / 2)}" y="${formatNumber(padding + badgeSize / 2 + 5)}" text-anchor="middle" font-family="system-ui,sans-serif" font-size="17" font-weight="700" fill="#ffffff">${escapeHtmlText(getLinkInitial(hostname))}</text>
|
|
134
|
-
${faviconImage}
|
|
135
126
|
${buildLinkTextBand({ x: textX, y: 16, width: textWidth, height: 19, text: title, fontSize: 14.5, color: LINK_CARD_TITLE_COLOR, fontWeight: 700 })}
|
|
136
127
|
${isSecure ? `<g transform="translate(${formatNumber(textX)},40)" stroke="${LINK_CARD_TEXT_COLOR}" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round" fill="none"><rect x="1.5" y="4.5" width="7" height="6" rx="1" /><path d="M3 4.5 V3 a2 2 0 0 1 4 0 v1.5" /></g>` : ""}
|
|
137
128
|
${buildLinkTextBand({ x: subtitleX, y: 36, width: subtitleWidth, height: 17, text: subtitle, fontSize: 12.5, color: LINK_CARD_TEXT_COLOR })}
|