@claspo/document-connector 16.6.2 → 16.6.3
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.
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export default class GoogleFontsLoader {
|
|
2
2
|
static getUsedGoogleFonts(documentModel: any): any;
|
|
3
3
|
static _getEnabledStyleEntries(node: any): any[];
|
|
4
|
+
static _normalizeFontWeight(fontWeight: any): number;
|
|
5
|
+
static _normalizeFontFamilyName(fontFamily: any): string;
|
|
4
6
|
loadedGoogleFonts: any[];
|
|
5
7
|
testStrings: {
|
|
6
8
|
latin: string;
|
|
@@ -9,10 +11,30 @@ export default class GoogleFontsLoader {
|
|
|
9
11
|
load(fonts: any, htmlDocumentObject: any): Promise<void>;
|
|
10
12
|
cleanup(): void;
|
|
11
13
|
_getDynamicUrlPart(fonts: any, htmlDocumentObject: any): any[];
|
|
12
|
-
_combineUrlDynamicPart(fonts: any
|
|
14
|
+
_combineUrlDynamicPart(fonts: any): any[];
|
|
13
15
|
_makeFontOptions(): any[];
|
|
14
|
-
|
|
15
|
-
|
|
16
|
+
_loadResolvedFontVariations(fonts: any, htmlDocumentObject: any): Promise<any[]>;
|
|
17
|
+
_fetchFontsMetadata(fontUrlParts: any): Promise<string>;
|
|
18
|
+
_makeGoogleFontsUrl(fontUrlParts: any): string;
|
|
19
|
+
_addFontsLinkToDocument(fontUrlParts: any, htmlDocumentObject: any): Promise<void> | Promise<PromiseSettledResult<unknown>[]>;
|
|
20
|
+
_addFontsStyleToDocument(fontFaceCss: any, htmlDocumentObject: any): void;
|
|
21
|
+
_parseFontFaces(cssText: any): any[];
|
|
22
|
+
_getFontFaceProperty(css: any, property: any): any;
|
|
23
|
+
_parseFontFaceWeight(fontWeight: any): {
|
|
24
|
+
minWeight: number;
|
|
25
|
+
maxWeight: number;
|
|
26
|
+
};
|
|
27
|
+
_resolveFontVariations(fonts: any, fontFaces: any): any[];
|
|
28
|
+
_findNearestFontFaces(fontFaces: any, family: any, style: any, weight: any): any;
|
|
29
|
+
_warnAboutUnresolvedReturnedFontFamilies(fonts: any, fontFaces: any, variations: any): void;
|
|
30
|
+
_warnAboutItalicOnlyReturnedFontFamilies(fonts: any, fontFaces: any): void;
|
|
31
|
+
_getFontFaceDistance(fontFace: any, weight: any): number;
|
|
32
|
+
_resolveWeightForFontFace(fontFace: any, weight: any): any;
|
|
33
|
+
_getFontFaceCss(variations: any): string;
|
|
34
|
+
_generateFontVariations(fonts: any): any[];
|
|
35
|
+
_getFontFamily(font: any): any;
|
|
36
|
+
_getRequestedWeights(font: any): number[];
|
|
37
|
+
_encodeFontFamily(fontFamily: any): string;
|
|
16
38
|
_createFontTester(variations: any, htmlDocumentObject: any): any;
|
|
17
39
|
_waitForAllFontsToLoad(variations: any, htmlDocumentObject: any): Promise<void>;
|
|
18
40
|
_waitForFontBatchLoad(batch: any, htmlDocumentObject: any): Promise<any[]>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import DocumentUtils from"@claspo/common/document/DocumentUtils";export default class GoogleFontsLoader{constructor(){this.loadedGoogleFonts=[],this.testStrings={latin:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",cyrillic:"АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюя"}}static getUsedGoogleFonts(t){const e=t.shared.googleFonts;if(!e||0===e.length)return[];const o=new Set,s=new Set;for(const e of t.views||[])DocumentUtils.iterateDepthFirst(e,t=>{const e=GoogleFontsLoader._getEnabledStyleEntries(t);for(const t of e)if(t.classes)for(const e of t.classes.split(" "))e&&e.startsWith("cl-")&&
|
|
1
|
+
import DocumentUtils from"@claspo/common/document/DocumentUtils";export default class GoogleFontsLoader{constructor(){this.loadedGoogleFonts=[],this.testStrings={latin:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",cyrillic:"АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюя"}}static getUsedGoogleFonts(t){const e=t.shared.googleFonts;if(!e||0===e.length)return[];const o=new Map,n=new Set,s=(t,e=400)=>{t&&(o.has(t)||o.set(t,new Set),o.get(t).add(GoogleFontsLoader._normalizeFontWeight(e)))};for(const e of t.views||[])DocumentUtils.iterateDepthFirst(e,t=>{const e=GoogleFontsLoader._getEnabledStyleEntries(t);for(const t of e)if(t.classes)for(const e of t.classes.split(" "))e&&e.startsWith("cl-")&&n.add(e);for(const t of e)t.styleAttributes&&t.styleAttributes.fontFamily&&s(t.styleAttributes.fontFamily,t.styleAttributes.fontWeight)});const a=t.shared;for(const t of n){const e=a.textClasses&&a.textClasses[t];e&&(e.styleAttributes&&e.styleAttributes.fontFamily?s(e.styleAttributes.fontFamily,e.styleAttributes.fontWeight):(e.isHeader&&a.headerFontFamily&&s(a.headerFontFamily,e.styleAttributes&&e.styleAttributes.fontWeight),!e.isHeader&&a.textFontFamily&&s(a.textFontFamily,e.styleAttributes&&e.styleAttributes.fontWeight)))}return a.textFontFamily&&s(a.textFontFamily),e.filter(t=>o.has(t)).map(t=>({fontFamily:t,weights:Array.from(o.get(t)).sort((t,e)=>t-e)}))}static _getEnabledStyleEntries(t){const e=[];t.props&&t.props.adaptiveStyles&&(e.push(...t.props.adaptiveStyles.desktop||[]),e.push(...t.props.adaptiveStyles.mobile||[])),t.props&&t.props.styles&&e.push(...t.props.styles||[]);const o=new Set(e.filter(t=>t.params&&!1===t.params.enabled).map(t=>t.element));return e.filter(t=>!o.has(t.element))}static _normalizeFontWeight(t){if("normal"===t)return 400;if("bold"===t)return 700;const e=parseInt(t,10);return Number.isFinite(e)&&e>0?e:400}static _normalizeFontFamilyName(t){return`${t||""}`.trim().replace(/\s+/g," ").toLowerCase()}async load(t,e){try{if(e=e||document,!(t||[]).length)return;const o=await this._loadResolvedFontVariations(t,e);if(!o.length)return;const n=this._createFontTester(o,e);e.body.appendChild(n);const s=this._waitForAllFontsToLoad(o,e),a=new Promise((t,e)=>setTimeout(()=>e(new Error("Timeout")),2e3));await Promise.race([s,a]),n.remove()}catch(t){console.error("Error while loading fonts",t)}}cleanup(){this.loadedGoogleFonts.forEach(t=>t.remove()),this.loadedGoogleFonts=[]}_getDynamicUrlPart(t,e){return this._combineUrlDynamicPart(t)}_combineUrlDynamicPart(t){const e=[],o=this._makeFontOptions(),n=[{name:"normal",value:0},{name:"italic",value:1}];return t.forEach(t=>{const s=this._getFontFamily(t),a=this._getRequestedWeights(t);if(!s||!a.length)return;const r=[];n.forEach(t=>{o.forEach(e=>{r.push(`${t.value},${e}`)})});const i=r.join(";");e.push({fontFamily:s,weights:a,urlPart:`&family=${this._encodeFontFamily(s)}:ital,wght@${i}`})}),e}_makeFontOptions(){const t=[];for(let e=0;e<9;e++){const o=100*(e+1);t.push(o)}return t}async _loadResolvedFontVariations(t,e){const o=this._getDynamicUrlPart(t,e);if(!o||0===o.length)return[];try{const n=await this._fetchFontsMetadata(o),s=this._parseFontFaces(n);if(!s.length)throw new Error("Google Fonts metadata did not contain font-face rules");const a=this._resolveFontVariations(t,s);this._warnAboutUnresolvedReturnedFontFamilies(t,s,a),this._warnAboutItalicOnlyReturnedFontFamilies(t,s);const r=this._getFontFaceCss(a);if(!r)throw new Error("Google Fonts metadata did not contain matching font faces");return this._addFontsStyleToDocument(r,e),a}catch(n){return console.error("Failed to load optimized Google Fonts CSS. Falling back to stylesheet link.",n),await this._addFontsLinkToDocument(o,e),this._generateFontVariations(t)}}async _fetchFontsMetadata(t){const e=await fetch(this._makeGoogleFontsUrl(t));if(!e.ok)throw new Error(`Google Fonts metadata request failed with status ${e.status}`);return e.text()}_makeGoogleFontsUrl(t){return"https://fonts.googleapis.com/css2?display=swap"+t.map(({urlPart:t})=>t).join("")}_addFontsLinkToDocument(t,e){if(!e.head)return Promise.resolve();const o=[{fontFamily:t.map(({fontFamily:t})=>t).join(", "),urlPart:t.map(({urlPart:t})=>t).join("")}].map(({fontFamily:t,urlPart:o})=>new Promise((n,s)=>{const a=e.createElement("link");a.rel="stylesheet",a.href="https://fonts.googleapis.com/css2?display=swap"+o,a.onload=()=>n({fontFamily:t,success:!0}),a.onerror=()=>{console.error(`Failed to load font: ${t}`),s(new Error(`Failed to load font: ${t}`))},e.head.appendChild(a),this.loadedGoogleFonts.push(a)}));return Promise.allSettled(o)}_addFontsStyleToDocument(t,e){if(!e.head)return;const o=e.createElement("style");o.setAttribute("data-cl-google-fonts","true"),o.textContent=t,e.head.appendChild(o),this.loadedGoogleFonts.push(o)}_parseFontFaces(t){const e=[],o=/@font-face\s*{[^}]*}/gi;let n;for(;null!==(n=o.exec(t||""));){const t=n[0],o=this._getFontFaceProperty(t,"font-family"),s=this._getFontFaceProperty(t,"font-style")||"normal",a=this._parseFontFaceWeight(this._getFontFaceProperty(t,"font-weight"));o&&a&&e.push({family:o,style:s,minWeight:a.minWeight,maxWeight:a.maxWeight,css:t})}return e}_getFontFaceProperty(t,e){const o=new RegExp(`${e}\\s*:\\s*([^;]+);`,"i"),n=t.match(o);return n?n[1].trim().replace(/^['"]|['"]$/g,""):""}_parseFontFaceWeight(t){const e=`${t||""}`.match(/\d+(\.\d+)?/g);if(!e||!e.length)return null;const o=Number(e[0]),n=Number(e[e.length-1]);return{minWeight:Math.min(o,n),maxWeight:Math.max(o,n)}}_resolveFontVariations(t,e){const o=["normal","italic"],n=[],s=new Set;return t.forEach(t=>{const a=this._getFontFamily(t);this._getRequestedWeights(t).forEach(t=>{o.forEach(o=>{const r=this._findNearestFontFaces(e,a,o,t);if(!r.length)return;const i=this._resolveWeightForFontFace(r[0],t),l=`${a}|${o}|${i}`;s.has(l)||(s.add(l),n.push({family:a,weight:i,style:o,descriptor:`${o} ${i} 1em "${a}"`,cssBlocks:r.map(t=>t.css)}))})})}),n}_findNearestFontFaces(t,e,o,n){const s=GoogleFontsLoader._normalizeFontFamilyName(e),a=t.filter(t=>GoogleFontsLoader._normalizeFontFamilyName(t.family)===s&&t.style===o);if(!a.length)return[];const r=a.reduce((t,e)=>{if(!t)return e;const o=this._getFontFaceDistance(e,n),s=this._getFontFaceDistance(t,n);if(o<s)return e;if(o>s)return t;const a=this._resolveWeightForFontFace(e,n),r=this._resolveWeightForFontFace(t,n);return n<=500?a<r?e:t:a>r?e:t},null),i=this._resolveWeightForFontFace(r,n);return a.filter(t=>this._resolveWeightForFontFace(t,n)===i)}_warnAboutUnresolvedReturnedFontFamilies(t,e,o){const n=new Set(e.map(t=>GoogleFontsLoader._normalizeFontFamilyName(t.family))),s=new Set(o.map(t=>GoogleFontsLoader._normalizeFontFamilyName(t.family))),a=[];t.forEach(t=>{const e=this._getFontFamily(t),o=GoogleFontsLoader._normalizeFontFamilyName(e);o&&n.has(o)&&!s.has(o)&&a.push(e)}),a.length&&console.error(`Google Fonts metadata returned font faces that were not resolved: ${a.join(", ")}`)}_warnAboutItalicOnlyReturnedFontFamilies(t,e){const o=[];t.forEach(t=>{const n=this._getFontFamily(t),s=GoogleFontsLoader._normalizeFontFamilyName(n);if(!s)return;const a=e.filter(t=>GoogleFontsLoader._normalizeFontFamilyName(t.family)===s);if(!a.length)return;const r=a.some(t=>"normal"===t.style),i=a.some(t=>"italic"===t.style);!r&&i&&o.push(n)}),o.length&&console.error(`Google Fonts metadata returned only italic font faces for: ${o.join(", ")}. Normal text may fall back to a different font.`)}_getFontFaceDistance(t,e){return e>=t.minWeight&&e<=t.maxWeight?0:Math.min(Math.abs(e-t.minWeight),Math.abs(e-t.maxWeight))}_resolveWeightForFontFace(t,e){return e<t.minWeight?t.minWeight:e>t.maxWeight?t.maxWeight:e}_getFontFaceCss(t){const e=[],o=new Set;return t.forEach(t=>{(t.cssBlocks||[]).forEach(t=>{t&&!o.has(t)&&(o.add(t),e.push(t))})}),e.join("\n")}_generateFontVariations(t){const e=[];return t.forEach(t=>{const o=this._getFontFamily(t);this._getRequestedWeights(t).forEach(t=>{["normal","italic"].forEach(n=>{e.push({family:o,weight:t,style:n,descriptor:`${n} ${t} 1em "${o}"`})})})}),e}_getFontFamily(t){return"string"==typeof t?t:t&&t.fontFamily}_getRequestedWeights(t){if("string"==typeof t)return[400];const e=t&&t.weights;if(!e||!e.length)return[400];const o=e.map(t=>GoogleFontsLoader._normalizeFontWeight(t));return Array.from(new Set(o)).sort((t,e)=>t-e)}_encodeFontFamily(t){return encodeURIComponent(t).replace(/%20/g,"+")}_createFontTester(t,e){const o=e.createElement("div");return o.setAttribute("aria-hidden","true"),o.style.cssText="\n position: fixed;\n top: -9999px;\n left: -9999px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n visibility: hidden;\n pointer-events: none;\n user-select: none;\n z-index: -1;\n ",t.forEach(t=>{Object.entries(this.testStrings).forEach(([n,s])=>{const a=e.createElement("span");a.textContent=s,a.style.cssText=`\n font-family: "${t.family}", sans-serif;\n font-weight: ${t.weight};\n font-style: ${t.style};\n font-size: 20px;\n display: inline-block;\n white-space: nowrap;\n `,a.dataset.font=`${t.family}-${t.weight}-${t.style}`,a.dataset.subset=n,o.appendChild(a)})}),o}async _waitForAllFontsToLoad(t,e){const o=[];for(let e=0;e<t.length;e+=10)o.push(t.slice(e,e+10));for(const t of o)await this._waitForFontBatchLoad(t,e)}async _waitForFontBatchLoad(t,e){const o=t.map(async t=>{try{e.fonts.check(t.descriptor)||await e.fonts.load(t.descriptor)}catch(e){console.error(`Failed to load: ${t.descriptor}`,e)}});return Promise.all(o)}}
|