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/tldraw.cjs
CHANGED
|
@@ -55,7 +55,7 @@ var LINK_PLUGIN_KEY = "canvuLink";
|
|
|
55
55
|
var DEFAULT_LINK_CARD_WIDTH = 320;
|
|
56
56
|
var DEFAULT_LINK_CARD_HEIGHT = 70;
|
|
57
57
|
var LINK_CARD_MIN_SCALE = 0.6;
|
|
58
|
-
var LINK_CARD_MAX_SCALE =
|
|
58
|
+
var LINK_CARD_MAX_SCALE = 6;
|
|
59
59
|
var LINK_CARD_BORDER = "oklch(0.918 0.008 255)";
|
|
60
60
|
var LINK_CARD_BORDER_STRONG = "oklch(0.86 0.012 255)";
|
|
61
61
|
var LINK_CARD_ACCENT = "oklch(0.55 0.19 264)";
|
|
@@ -67,7 +67,6 @@ var formatNumber = (value) => {
|
|
|
67
67
|
const rounded = Math.round(value * 100) / 100;
|
|
68
68
|
return Object.is(rounded, -0) ? "0" : String(rounded);
|
|
69
69
|
};
|
|
70
|
-
var escapeXmlAttribute = (value) => value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">").replaceAll('"', """).replaceAll("'", "'");
|
|
71
70
|
var escapeHtmlText = (value) => value.replaceAll("&", "&").replaceAll("<", "<").replaceAll(">", ">");
|
|
72
71
|
var getLinkHostname = (href) => {
|
|
73
72
|
try {
|
|
@@ -92,7 +91,6 @@ var getLinkInitial = (hostname) => {
|
|
|
92
91
|
const first = hostname.trim().charAt(0).toUpperCase();
|
|
93
92
|
return first || "L";
|
|
94
93
|
};
|
|
95
|
-
var buildGoogleFaviconUrl = (hostname) => hostname ? `https://www.google.com/s2/favicons?domain=${encodeURIComponent(hostname)}&sz=64` : null;
|
|
96
94
|
var getStableLinkIdSuffix = (value) => {
|
|
97
95
|
let hash = 0;
|
|
98
96
|
for (const char of value) {
|
|
@@ -115,16 +113,13 @@ function buildLinkCardSvg(width, _height, link) {
|
|
|
115
113
|
const title = link.title?.trim() || hostname || "Link";
|
|
116
114
|
const protocol = getLinkProtocol(link.href);
|
|
117
115
|
const subtitle = hostname || link.href;
|
|
118
|
-
const favicon = link.favicon?.trim() || buildGoogleFaviconUrl(hostname);
|
|
119
116
|
const idSuffix = getStableLinkIdSuffix(`${hostname}:${link.href}`);
|
|
120
|
-
const clipId = `canvu-link-favicon-${idSuffix}`;
|
|
121
117
|
const gradientId = `canvu-link-favicon-gradient-${idSuffix}`;
|
|
122
118
|
const buttonX = contentWidth - padding - buttonSize;
|
|
123
119
|
const buttonY = (contentHeight - buttonSize) / 2;
|
|
124
120
|
const isSecure = protocol === "https:";
|
|
125
121
|
const subtitleX = isSecure ? textX + 13 : textX;
|
|
126
122
|
const subtitleWidth = isSecure ? textWidth - 13 : textWidth;
|
|
127
|
-
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})" />` : "";
|
|
128
123
|
return `
|
|
129
124
|
<style>
|
|
130
125
|
.canvu-link-card-root .canvu-link-card { transition: transform .18s ease, filter .18s ease, stroke .18s ease; }
|
|
@@ -139,13 +134,9 @@ function buildLinkCardSvg(width, _height, link) {
|
|
|
139
134
|
<stop stop-color="${LINK_CARD_ACCENT}" />
|
|
140
135
|
<stop offset="1" stop-color="${LINK_CARD_ACCENT_DEEP}" />
|
|
141
136
|
</linearGradient>
|
|
142
|
-
<clipPath id="${clipId}">
|
|
143
|
-
<rect x="${formatNumber(padding)}" y="${formatNumber(padding)}" width="${formatNumber(badgeSize)}" height="${formatNumber(badgeSize)}" rx="11" />
|
|
144
|
-
</clipPath>
|
|
145
137
|
</defs>
|
|
146
138
|
<rect x="${formatNumber(padding)}" y="${formatNumber(padding)}" width="${formatNumber(badgeSize)}" height="${formatNumber(badgeSize)}" rx="11" fill="url(#${gradientId})" />
|
|
147
139
|
<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>
|
|
148
|
-
${faviconImage}
|
|
149
140
|
${buildLinkTextBand({ x: textX, y: 16, width: textWidth, height: 19, text: title, fontSize: 14.5, color: LINK_CARD_TITLE_COLOR, fontWeight: 700 })}
|
|
150
141
|
${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>` : ""}
|
|
151
142
|
${buildLinkTextBand({ x: subtitleX, y: 36, width: subtitleWidth, height: 17, text: subtitle, fontSize: 12.5, color: LINK_CARD_TEXT_COLOR })}
|