@claspo/document-connector 16.7.14 → 16.7.15-scf.1

package/StaticDocumentConnector.d.ts

@@ -3,12 +3,14 @@ import { WidgetInitConfigI } from "@claspo/common/WidgetInitConfig.interface";
 import WcResolver from '@claspo/renderer/wc-renderer/WcResolver';
 import { WcRegister } from '@claspo/renderer/wc-renderer/WcRegister';
 import GoogleFontsLoader from './layouts/GoogleFontsLoader';
+import CustomFontsLoader from './layouts/CustomFontsLoader';
 import { DocumentConnectorEventName } from './DocumentConnectorEvents.interface';
 export default class StaticDocumentConnector extends BaseDocumentConnector {
     componentRegister: WcRegister;
     componentResolver: WcResolver;
     googleFontsLoader: GoogleFontsLoader | null;
     closeSubmitPromise: Promise<boolean> | null;
+    customFontsLoader: CustomFontsLoader | null;
     constructor(params: WidgetInitConfigI);
     emit(eventName: string, value: any, params?: any): void;
     connect(containerElement: HTMLElement): Promise<any>;

package/StaticDocumentConnector.js

@@ -1 +1 @@
-import BaseDocumentConnector from"./BaseDocumentConnector";import DocumentConnectorEventType from"./DocumentConnectorEventType";import{getZIndexByLayoutType}from"./layouts/getZindex";import LayoutFactory from"./layouts/LayoutFactory";import StaticEntryModule from"@claspo/renderer/StaticEntryModule";import WcResolver from"@claspo/renderer/wc-renderer/WcResolver";import{RenderMode}from"@claspo/common/RenderMode";import{WcRegister}from"@claspo/renderer/wc-renderer/WcRegister";import GoogleFontsLoader from"./layouts/GoogleFontsLoader";import ThemeCssVars from"@claspo/common/element/ThemeCssVars";const DIRTY_SUBMIT_STATE="dirty",SUBMITTING_SUBMIT_STATE="submitting";export default class StaticDocumentConnector extends BaseDocumentConnector{constructor(e){super(e),this.componentResolver=null,this.googleFontsLoader=null,this.closeSubmitPromise=null;const{documentModel:t,translations:o,trackingService:s,layoutType:n,bundledComponentClasses:r}=e;this.componentRegister=new WcRegister(r,e.productKeyPrefix),this.componentResolver=new WcResolver(RenderMode.STATIC,this.componentRegister,e.productKeyPrefix);const i=new StaticEntryModule(t,this.componentResolver,this.componentRegister,e,o,s,n);this.setEntryModule(i)}emit(e,t,o=null){e!==DocumentConnectorEventType.CLOSE_WIDGET?super.emit(e,t,o):this.handleCloseWidget(t)}async connect(e){this.googleFontsLoader=new GoogleFontsLoader({widgetId:this.params.widgetId,siteId:this.params.siteId});const t=e.getRootNode();if(!this.params.disableGoogleFonts){const e=GoogleFontsLoader.getUsedGoogleFonts(this.params.documentModel);await this.googleFontsLoader.load(e,t)}return this._initializeRenderer(e,t)}disconnect(){var e;super.disconnect(),this.controllers[0]&&this.controllers[0].disconnect(()=>{this.entryModule&&this.entryModule.viewRouter&&this.entryModule.compositionRoot&&this.entryModule.destroy()}),this.controllers=[],null===(e=this.googleFontsLoader)||void 0===e||e.cleanup()}destroy(){this.disconnect()}on(e,t){return super.on(e,t)}async _initializeRenderer(e,t){var o,s,n,r;await this.componentResolver.loadComponentsIfNecessary(this.params.documentModel,this.params.staticResourcesUrl);const i=this.entryModule.init(t);i.style.display="flex";const{layoutFactoryClass:l=LayoutFactory,layoutType:a,documentModel:d}=this.params,c=Object.assign(Object.assign({},this.params),{zIndex:null!==(s=null===(o=null==d?void 0:d.shared)||void 0===o?void 0:o.zIndex)&&void 0!==s?s:getZIndexByLayoutType(a)}),m=l.create(Object.assign(Object.assign({},c),{layoutType:this.params.layoutType,widgetType:this.params.widgetType,viewIndex:0,renderMode:this.entryModule.renderMode}),this,this.entryModule.viewRouter,this.entryModule.compositionRoot.services.documentModel,this.entryModule.compositionRoot.services.resizeListener);return this.controllers.push(m),super.addPropsRequestEventListener(i),this.params.formVariantId?i.classList.add("cl-widget-"+this.params.formVariantId):i.classList.add("cl-widget"),this.entryModule.listenAction("*",(e,t)=>{this.emit(t,e)}),m.connect(i,e,this.entryModule),(null===(r=null===(n=d.shared)||void 0===n?void 0:n.theme)||void 0===r?void 0:r.schema)&&ThemeCssVars.override(d.shared.theme.schema,m.getConnectedElement()),m.getConnectedElement()}handleCloseWidget(e){this.trySubmitOnClose();try{super.emit(DocumentConnectorEventType.CLOSE_WIDGET,e)}finally{"function"==typeof e&&e()}}trySubmitOnClose(){const e=this.params.submitOnClose||{enabled:!1,skipValidation:!0},t=this.getSubmitState();e.enabled&&!this.closeSubmitPromise&&"submitting"!==t&&"dirty"===t&&this.hasDirtyFormData()&&(this.closeSubmitPromise=Promise.resolve(this.submitOnClose()).catch(e=>(console.error(e),!1)).finally(()=>{this.closeSubmitPromise=null}))}}
+import BaseDocumentConnector from"./BaseDocumentConnector";import DocumentConnectorEventType from"./DocumentConnectorEventType";import{getZIndexByLayoutType}from"./layouts/getZindex";import LayoutFactory from"./layouts/LayoutFactory";import StaticEntryModule from"@claspo/renderer/StaticEntryModule";import WcResolver from"@claspo/renderer/wc-renderer/WcResolver";import{RenderMode}from"@claspo/common/RenderMode";import{WcRegister}from"@claspo/renderer/wc-renderer/WcRegister";import GoogleFontsLoader from"./layouts/GoogleFontsLoader";import CustomFontsLoader from"./layouts/CustomFontsLoader";import ThemeCssVars from"@claspo/common/element/ThemeCssVars";const DIRTY_SUBMIT_STATE="dirty",SUBMITTING_SUBMIT_STATE="submitting";export default class StaticDocumentConnector extends BaseDocumentConnector{constructor(e){super(e),this.componentResolver=null,this.googleFontsLoader=null,this.closeSubmitPromise=null,this.customFontsLoader=null;const{documentModel:t,translations:o,trackingService:s,layoutType:n,bundledComponentClasses:r}=e;this.componentRegister=new WcRegister(r,e.productKeyPrefix),this.componentResolver=new WcResolver(RenderMode.STATIC,this.componentRegister,e.productKeyPrefix);const i=new StaticEntryModule(t,this.componentResolver,this.componentRegister,e,o,s,n);this.setEntryModule(i)}emit(e,t,o=null){e!==DocumentConnectorEventType.CLOSE_WIDGET?super.emit(e,t,o):this.handleCloseWidget(t)}async connect(e){this.googleFontsLoader=new GoogleFontsLoader({widgetId:this.params.widgetId,siteId:this.params.siteId}),this.customFontsLoader=new CustomFontsLoader;const t=e.getRootNode(),o=CustomFontsLoader.getUsedCustomFonts(this.params.documentModel),s=[this.customFontsLoader.load(o,t)];if(!this.params.disableGoogleFonts){const e=GoogleFontsLoader.getUsedGoogleFonts(this.params.documentModel);s.push(this.googleFontsLoader.load(e,t))}return await Promise.all(s),this._initializeRenderer(e,t)}disconnect(){var e,t;super.disconnect(),this.controllers[0]&&this.controllers[0].disconnect(()=>{this.entryModule&&this.entryModule.viewRouter&&this.entryModule.compositionRoot&&this.entryModule.destroy()}),this.controllers=[],null===(e=this.googleFontsLoader)||void 0===e||e.cleanup(),null===(t=this.customFontsLoader)||void 0===t||t.cleanup()}destroy(){this.disconnect()}on(e,t){return super.on(e,t)}async _initializeRenderer(e,t){var o,s,n,r;await this.componentResolver.loadComponentsIfNecessary(this.params.documentModel,this.params.staticResourcesUrl);const i=this.entryModule.init(t);i.style.display="flex";const{layoutFactoryClass:a=LayoutFactory,layoutType:l,documentModel:d}=this.params,c=Object.assign(Object.assign({},this.params),{zIndex:null!==(s=null===(o=null==d?void 0:d.shared)||void 0===o?void 0:o.zIndex)&&void 0!==s?s:getZIndexByLayoutType(l)}),m=a.create(Object.assign(Object.assign({},c),{layoutType:this.params.layoutType,widgetType:this.params.widgetType,viewIndex:0,renderMode:this.entryModule.renderMode}),this,this.entryModule.viewRouter,this.entryModule.compositionRoot.services.documentModel,this.entryModule.compositionRoot.services.resizeListener);return this.controllers.push(m),super.addPropsRequestEventListener(i),this.params.formVariantId?i.classList.add("cl-widget-"+this.params.formVariantId):i.classList.add("cl-widget"),this.entryModule.listenAction("*",(e,t)=>{this.emit(t,e)}),m.connect(i,e,this.entryModule),(null===(r=null===(n=d.shared)||void 0===n?void 0:n.theme)||void 0===r?void 0:r.schema)&&ThemeCssVars.override(d.shared.theme.schema,m.getConnectedElement()),m.getConnectedElement()}handleCloseWidget(e){this.trySubmitOnClose();try{super.emit(DocumentConnectorEventType.CLOSE_WIDGET,e)}finally{"function"==typeof e&&e()}}trySubmitOnClose(){const e=this.params.submitOnClose||{enabled:!1,skipValidation:!0},t=this.getSubmitState();e.enabled&&!this.closeSubmitPromise&&"submitting"!==t&&"dirty"===t&&this.hasDirtyFormData()&&(this.closeSubmitPromise=Promise.resolve(this.submitOnClose()).catch(e=>(console.error(e),!1)).finally(()=>{this.closeSubmitPromise=null}))}}

package/layouts/CustomFontsLoader.d.ts

@@ -0,0 +1,8 @@
+import { ClDocumentCustomFontResourceI } from '@claspo/common/document/Document.interface';
+export default class CustomFontsLoader {
+    loadedCustomFonts: any[];
+    static getUsedCustomFonts(documentModel: any): ClDocumentCustomFontResourceI[];
+    load(customFonts: ClDocumentCustomFontResourceI[], htmlDocumentObject: Document): Promise<void>;
+    cleanup(): void;
+    _addCustomFontsLinkToDocument(customFonts: any, htmlDocumentObject: any): Promise<void> | Promise<PromiseSettledResult<unknown>[]>;
+}

package/layouts/CustomFontsLoader.js

@@ -0,0 +1 @@
+import{getUsedFontFamilies}from"./UsedFontFamiliesResolver";export default class CustomFontsLoader{constructor(){this.loadedCustomFonts=[]}static getUsedCustomFonts(e){const t=e.shared.customFontResources||[];if(!t.length)return[];const o=getUsedFontFamilies(e);return t.filter(e=>(null==e?void 0:e.fontFamily)&&(null==e?void 0:e.url)&&o.has(e.fontFamily))}async load(e,t){try{if(t=t||document,!(e||[]).length)return;await this._addCustomFontsLinkToDocument(e,t)}catch(e){console.error("Error while loading custom fonts",e)}}cleanup(){this.loadedCustomFonts.forEach(e=>e.remove()),this.loadedCustomFonts=[]}_addCustomFontsLinkToDocument(e,t){if(!t.head)return Promise.resolve();const o=new Set(Array.from(t.querySelectorAll('link[rel="stylesheet"]')).map(e=>e.href)),s=Array.from(new Set(e.map(e=>e.url).filter(e=>!o.has(e)))).map(e=>{const o=document.createElement("link");o.rel="stylesheet",o.href=e;const s=new Promise((t,s)=>{o.onload=()=>t({url:e,success:!0}),o.onerror=()=>s(new Error(`Failed to load custom font stylesheet: ${e}`))}),r=new Promise((t,o)=>setTimeout(()=>o(new Error(`Timeout while loading custom font stylesheet: ${e}`)),2e3));return t.head.appendChild(o),this.loadedCustomFonts.push(o),Promise.race([s,r])});return Promise.allSettled(s)}}

package/layouts/UsedFontFamiliesResolver.d.ts

@@ -0,0 +1,2 @@
+export declare function getUsedFontFamilies(documentModel: any): Set<string>;
+export declare function getEnabledStyleEntries(node: any): any[];

package/layouts/UsedFontFamiliesResolver.js

@@ -0,0 +1 @@
+import DocumentUtils from"@claspo/common/document/DocumentUtils";export function getUsedFontFamilies(t){const e=new Set,s=new Set;for(const o of t.views||[])DocumentUtils.iterateDepthFirst(o,t=>{const o=getEnabledStyleEntries(t);for(const t of o)if(t.classes)for(const e of t.classes.split(" "))e&&e.startsWith("cl-")&&s.add(e);for(const t of o)t.styleAttributes&&t.styleAttributes.fontFamily&&e.add(t.styleAttributes.fontFamily)});const o=t.shared;for(const t of s){const s=o.textClasses&&o.textClasses[t];s&&(s.styleAttributes&&s.styleAttributes.fontFamily?e.add(s.styleAttributes.fontFamily):(s.isHeader&&o.headerFontFamily&&e.add(o.headerFontFamily),!s.isHeader&&o.textFontFamily&&e.add(o.textFontFamily)))}return o.textFontFamily&&e.add(o.textFontFamily),e}export function 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 s=new Set(e.filter(t=>t.params&&!1===t.params.enabled).map(t=>t.element));return e.filter(t=>!s.has(t.element))}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@claspo/document-connector",
-  "version": "16.7.14",
+  "version": "16.7.15-scf.1",
   "scripts": {
     "test": "jest --no-cache --coverage",
     "build": "rm -rf out && tsc --project tsconfig.json && npm run minify",
@@ -14,8 +14,8 @@
     "node": ">=18.16.0"
   },
   "dependencies": {
-    "@claspo/common": "7.3.0",
-    "@claspo/renderer": "18.7.5"
+    "@claspo/common": "7.3.0-scf.1",
+    "@claspo/renderer": "18.7.6"
   },
   "devDependencies": {
     "@babel/core": "^7.28.5",