@claspo/renderer 18.0.0 → 18.0.2-perf.0

package/StaticEntryModule.js

@@ -1 +1 @@
-import CompositionRoot from"./CompositionRoot";import ViewRouter from"./ViewRouter";import TranslateUtils from"./i18n/TranslateUtils";import{DocumentModelUpdateType}from"./document-model/DocumentModelService";import CssVarsOperations from"@claspo/common/element/CssVarsOperations";import ThemeCssVars from"@claspo/common/element/ThemeCssVars";import wcStaticDecorator from"./wc-renderer/decorators/wcStaticDecorator";import{RenderMode}from"@claspo/common/RenderMode";export default class StaticEntryModule{constructor(e,o,t,s,i,r,n){this.renderMode=RenderMode.STATIC,this.componentResolver=o,this.componentRegister=t,this.config=Object.assign(Object.assign({},s),{renderMode:this.renderMode}),this.documentJson=e,this.translations=i,this.compositionRoot=null,this.viewRenderer=null,this.viewRouter=null,this.trackingService=r||{send:()=>{},trackClick:()=>{},trackTargetAction:()=>{}},this.layoutType=n,this.componentFactory=null,t.register(wcStaticDecorator,this.renderMode)}init(e){var o;const t=e||document;this.documentJson=TranslateUtils.applyTranslationObjectToComponentsIfNeeded(JSON.parse(JSON.stringify(this.documentJson)),this.componentResolver.getComponentManifests(),this.translations);const s=new CompositionRoot(this.documentJson,this.config,this.trackingService,null,"",this.layoutType,this.renderMode,this.componentRegister,t),i=new ViewRouter(s.services.eventEmitter,s.services.documentModel,s.services.viewRenderer,this.config&&this.config.optionalDocumentStyles,s.services);s.services.viewRouter=i,this.compositionRoot=s,this.viewRenderer=s.services.viewRenderer,this.componentFactory=s.services.componentFactory,this.viewRouter=i;const r=this.compositionRoot.services.documentModel.getShared(),n=r.cssVars,c=null===(o=r.theme)||void 0===o?void 0:o.schema;return Promise.resolve().then(()=>{const e=this.viewRouter.getDocumentContainer();CssVarsOperations.override(n,e),ThemeCssVars.override(c,e)}),i.start(this.config.viewIndex)}destroy(){var e,o;null===(e=this.viewRouter)||void 0===e||e.destroy(),null===(o=this.compositionRoot)||void 0===o||o.destroy()}performAction(e,o){var t;const s=this.compositionRoot.services.documentService.handleModelUpdate(e,o);switch(e){case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:{const e=this.compositionRoot.services.documentModel.getShared().cssVars;CssVarsOperations.override(e,this.viewRouter.getDocumentContainer());break}case DocumentModelUpdateType.THEME_UPDATE:{const e=null===(t=this.compositionRoot.services.documentModel.getShared().theme)||void 0===t?void 0:t.schema;ThemeCssVars.override(e,this.viewRouter.getDocumentContainer());break}}return s}listenAction(e,o){this.compositionRoot.services.eventEmitter.on(e,(e,t)=>{o(e,t)})}}
+import CompositionRoot from"./CompositionRoot";import ViewRouter from"./ViewRouter";import TranslateUtils from"./i18n/TranslateUtils";import{DocumentModelUpdateType}from"./document-model/DocumentModelService";import CssVarsOperations from"@claspo/common/element/CssVarsOperations";import wcStaticDecorator from"./wc-renderer/decorators/wcStaticDecorator";import{RenderMode}from"@claspo/common/RenderMode";export default class StaticEntryModule{constructor(e,t,o,i,s,r,n){this.renderMode=RenderMode.STATIC,this.componentResolver=t,this.componentRegister=o,this.config=Object.assign(Object.assign({},i),{renderMode:this.renderMode}),this.documentJson=e,this.translations=s,this.compositionRoot=null,this.viewRenderer=null,this.viewRouter=null,this.trackingService=r||{send:()=>{},trackClick:()=>{},trackTargetAction:()=>{}},this.layoutType=n,this.componentFactory=null,o.register(wcStaticDecorator,this.renderMode)}init(e){const t=e||document;this.documentJson=TranslateUtils.applyTranslationObjectToComponentsIfNeeded(JSON.parse(JSON.stringify(this.documentJson)),this.componentResolver.getComponentManifests(),this.translations);const o=new CompositionRoot(this.documentJson,this.config,this.trackingService,null,"",this.layoutType,this.renderMode,this.componentRegister,t),i=new ViewRouter(o.services.eventEmitter,o.services.documentModel,o.services.viewRenderer,this.config&&this.config.optionalDocumentStyles,o.services);return o.services.viewRouter=i,this.compositionRoot=o,this.viewRenderer=o.services.viewRenderer,this.componentFactory=o.services.componentFactory,this.viewRouter=i,i.start(this.config.viewIndex)}destroy(){var e,t;null===(e=this.viewRouter)||void 0===e||e.destroy(),null===(t=this.compositionRoot)||void 0===t||t.destroy()}performAction(e,t){const o=this.compositionRoot.services.documentService.handleModelUpdate(e,t);switch(e){case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:{const e=this.compositionRoot.services.documentModel.getShared().cssVars;CssVarsOperations.override(e,this.viewRouter.getDocumentContainer());break}}return o}listenAction(e,t){this.compositionRoot.services.eventEmitter.on(e,(e,o)=>{t(e,o)})}}

package/UpdatingEntryModule.js

@@ -1 +1 @@
-import CompositionRoot from"./CompositionRoot";import{DocumentModelUpdateType}from"./document-model/DocumentModelService";import DocumentUtils from"@claspo/common/document/DocumentUtils";import DragEventListener from"./renderer/DragEventListener";import{RenderMode}from"@claspo/common/RenderMode";import{asyncActionEmitter}from"./action/asyncAction";import ThemeCssVars from"@claspo/common/element/ThemeCssVars";import CssVarsOperations from"@claspo/common/element/CssVarsOperations";export default class UpdatingEntryModule{constructor(e,o,t,s,i={},n){this.renderMode=RenderMode.UPDATING,this.documentJson=JSON.parse(JSON.stringify(e)),this.componentResolver=o,this.componentRegister=t,this.componentCommonStyles=s,this.config=Object.assign(Object.assign({},i),{renderMode:this.renderMode}),this.compositionRoot=null,this.viewRenderer=null,this.viewComponents=[],this.layoutType=n}init(e){const o=new CompositionRoot(this.documentJson,this.config,{send:()=>{}},e,this.componentCommonStyles,this.layoutType,this.renderMode,this.componentRegister,document);return this.compositionRoot=o,this.viewRenderer=o.services.viewRenderer,this.componentFactory=o.services.componentFactory,this.containerElement=e,this.dragEventListener=new DragEventListener(this.compositionRoot.services.eventEmitter,this.compositionRoot.services.documentModel),this.viewComponents=this.compositionRoot.services.documentModel.getViews().map((e,o)=>this.viewRenderer.render(e,o,this.config.renderMode)),this.viewComponents.forEach(e=>{var o;const t=this.compositionRoot.services.documentModel.getShared(),s=t.cssVars,i=null===(o=t.theme)||void 0===o?void 0:o.schema;CssVarsOperations.override(s,e),ThemeCssVars.override(i,e)}),this.viewComponents}destroy(){var e,o;this.viewComponents.forEach(e=>e.remove()),null===(e=this.dragEventListener)||void 0===e||e.destroy(),null===(o=this.compositionRoot)||void 0===o||o.destroy()}performAction(e,o){var t;switch(e){case DocumentModelUpdateType.COMPONENT_REMOVE:case DocumentModelUpdateType.COMPONENT_MOVE:case DocumentModelUpdateType.COMPONENT_INSERT:case DocumentModelUpdateType.COMPONENT_PROPS_UPDATE:case DocumentModelUpdateType.COMPONENT_UPDATE:case DocumentModelUpdateType.MOBILE_BREAKPOINT_UPDATE:case DocumentModelUpdateType.ENVIRONMENT_UPDATE:case DocumentModelUpdateType.TEXT_CLASS_ADDED:case DocumentModelUpdateType.TEXT_CLASS_UPDATED:case DocumentModelUpdateType.TEXT_CLASS_REMOVED:case DocumentModelUpdateType.HEADER_FONT_FAMILY_UPDATE:case DocumentModelUpdateType.TEXT_FONT_FAMILY_UPDATE:case DocumentModelUpdateType.SHARED_UPDATE:return asyncActionEmitter(this.compositionRoot.services.eventEmitter.emit.bind(this.compositionRoot.services.eventEmitter))(this.compositionRoot.services.documentService.handleModelUpdate.bind(this.compositionRoot.services.documentService),e)(e,o);case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:{const e=this.compositionRoot.services.documentModel.getShared().cssVars;this.viewComponents.forEach(o=>{CssVarsOperations.override(e,o)})}case DocumentModelUpdateType.THEME_UPDATE:{const s=o.schema||(null===(t=this.compositionRoot.services.documentModel.getShared().theme)||void 0===t?void 0:t.schema);return this.viewComponents.forEach(e=>{ThemeCssVars.override(s,e)}),asyncActionEmitter(this.compositionRoot.services.eventEmitter.emit.bind(this.compositionRoot.services.eventEmitter))(this.compositionRoot.services.documentService.handleModelUpdate.bind(this.compositionRoot.services.documentService),e)(e,o)}default:this.compositionRoot.services.eventEmitter.emit(e,o)}}listenAction(e,o){this.compositionRoot.services.eventEmitter.on(e,(e,t)=>{o(e,t)})}getHostElementById(e){const o=DocumentUtils.getNodeById(this.viewComponents.map(e=>e.getModel()),e);return o&&o.componentRef}getHostElementByPath(e){const o=DocumentUtils.getNodeByPath(this.viewComponents.map(e=>e.getModel()),e);return o&&o.componentRef}getContextRecordsMap(){var e;return(null===(e=this.compositionRoot)||void 0===e?void 0:e.services.context.getRecordsMap())||{}}listenContextAction(e,o){this.compositionRoot.services.context.on(e,(e,t)=>{o(e,t)})}}
+import CompositionRoot from"./CompositionRoot";import{DocumentModelUpdateType}from"./document-model/DocumentModelService";import DocumentUtils from"@claspo/common/document/DocumentUtils";import DragEventListener from"./renderer/DragEventListener";import{RenderMode}from"@claspo/common/RenderMode";import{asyncActionEmitter}from"./action/asyncAction";import CssVarsOperations from"@claspo/common/element/CssVarsOperations";export default class UpdatingEntryModule{constructor(e,o,t,i,s={},n){this.renderMode=RenderMode.UPDATING,this.documentJson=JSON.parse(JSON.stringify(e)),this.componentResolver=o,this.componentRegister=t,this.componentCommonStyles=i,this.config=Object.assign(Object.assign({},s),{renderMode:this.renderMode}),this.compositionRoot=null,this.viewRenderer=null,this.viewComponents=[],this.layoutType=n}init(e){const o=new CompositionRoot(this.documentJson,this.config,{send:()=>{}},e,this.componentCommonStyles,this.layoutType,this.renderMode,this.componentRegister,document);return this.compositionRoot=o,this.viewRenderer=o.services.viewRenderer,this.componentFactory=o.services.componentFactory,this.containerElement=e,this.dragEventListener=new DragEventListener(this.compositionRoot.services.eventEmitter,this.compositionRoot.services.documentModel),this.viewComponents=this.compositionRoot.services.documentModel.getViews().map((e,o)=>this.viewRenderer.render(e,o,this.config.renderMode)),this.viewComponents}destroy(){var e,o;this.viewComponents.forEach(e=>e.remove()),null===(e=this.dragEventListener)||void 0===e||e.destroy(),null===(o=this.compositionRoot)||void 0===o||o.destroy()}performAction(e,o){switch(e){case DocumentModelUpdateType.COMPONENT_REMOVE:case DocumentModelUpdateType.COMPONENT_MOVE:case DocumentModelUpdateType.COMPONENT_INSERT:case DocumentModelUpdateType.COMPONENT_PROPS_UPDATE:case DocumentModelUpdateType.COMPONENT_UPDATE:case DocumentModelUpdateType.MOBILE_BREAKPOINT_UPDATE:case DocumentModelUpdateType.ENVIRONMENT_UPDATE:case DocumentModelUpdateType.TEXT_CLASS_ADDED:case DocumentModelUpdateType.TEXT_CLASS_UPDATED:case DocumentModelUpdateType.TEXT_CLASS_REMOVED:case DocumentModelUpdateType.HEADER_FONT_FAMILY_UPDATE:case DocumentModelUpdateType.TEXT_FONT_FAMILY_UPDATE:case DocumentModelUpdateType.SHARED_UPDATE:return asyncActionEmitter(this.compositionRoot.services.eventEmitter.emit.bind(this.compositionRoot.services.eventEmitter))(this.compositionRoot.services.documentService.handleModelUpdate.bind(this.compositionRoot.services.documentService),e)(e,o);case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:{const e=this.compositionRoot.services.documentModel.getShared().cssVars;this.viewComponents.forEach(o=>{CssVarsOperations.override(e,o)});break}case DocumentModelUpdateType.THEME_UPDATE:return asyncActionEmitter(this.compositionRoot.services.eventEmitter.emit.bind(this.compositionRoot.services.eventEmitter))(this.compositionRoot.services.documentService.handleModelUpdate.bind(this.compositionRoot.services.documentService),e)(e,o);default:this.compositionRoot.services.eventEmitter.emit(e,o)}}listenAction(e,o){this.compositionRoot.services.eventEmitter.on(e,(e,t)=>{o(e,t)})}getHostElementById(e){const o=DocumentUtils.getNodeById(this.viewComponents.map(e=>e.getModel()),e);return o&&o.componentRef}getHostElementByPath(e){const o=DocumentUtils.getNodeByPath(this.viewComponents.map(e=>e.getModel()),e);return o&&o.componentRef}getContextRecordsMap(){var e;return(null===(e=this.compositionRoot)||void 0===e?void 0:e.services.context.getRecordsMap())||{}}listenContextAction(e,o){this.compositionRoot.services.context.on(e,(e,t)=>{o(e,t)})}}

package/document-model/DocumentService.js

@@ -1 +1 @@
-import DocumentUtils from"@claspo/common/document/DocumentUtils";import{ComponentInsertType}from"@claspo/common/document/ComponentInsertType";import{DocumentModelUpdateType}from"./DocumentModelService";export default class DocumentService{constructor(e,t,o){this.documentModel=e,this.viewRenderer=t,this.renderMode=o}handleModelUpdate(e,t){switch(e){case DocumentModelUpdateType.COMPONENT_PROPS_UPDATE:{const{id:e,data:o}=t,d=DocumentUtils.getNodeById(this.documentModel.getViews(),e);if(!d)return void console.warn("Attempt to update unexisting component props");const n=d.path,i=n.reduce((e,t,o)=>0===o?this.documentModel.getViews()[t]:e.children[t],this.documentModel.getViews());return i?(i.props=Object.assign({},o),void this.documentModel.emit(`${DocumentModelUpdateType.COMPONENT_PROPS_UPDATE}_${e}`,o)):void console.error("Model not found by path ["+n+"]")}case DocumentModelUpdateType.COMPONENT_UPDATE:{const{id:e,data:o}=t,d=DocumentUtils.getNodeById(this.documentModel.getViews(),e);return d?(Object.assign(d,o),void this.documentModel.emit(`${DocumentModelUpdateType.COMPONENT_UPDATE}_${e}`,o)):void console.warn("Attempt to update unexisting component props")}case DocumentModelUpdateType.SHARED_UPDATE:{const e=this.documentModel.getShared();return Object.assign(e,t),void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL)}case DocumentModelUpdateType.MOBILE_BREAKPOINT_UPDATE:return void(this.documentModel.getShared().mobileBreakpointWidth=t.mobileBreakpointWidth);case DocumentModelUpdateType.ENVIRONMENT_UPDATE:return void this.documentModel.emit(DocumentModelUpdateType.ENVIRONMENT_UPDATE,t);case DocumentModelUpdateType.TEXT_CLASS_ADDED:return void(this.documentModel.getShared().textClasses[t.id]=t);case DocumentModelUpdateType.TEXT_CLASS_UPDATED:return this.documentModel.getShared().textClasses[t.id]=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.TEXT_CLASS_REMOVED:return void delete this.documentModel.getShared().textClasses[t];case DocumentModelUpdateType.HEADER_FONT_FAMILY_UPDATE:return this.documentModel.getShared().headerFontFamily=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.TEXT_FONT_FAMILY_UPDATE:return this.documentModel.getShared().textFontFamily=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:return this.documentModel.getShared().cssVars=t,void this.documentModel.emit(DocumentModelUpdateType.COLOR_SCHEMA_UPDATE,t);case DocumentModelUpdateType.THEME_UPDATE:return this.documentModel.getShared().theme=t,this.documentModel.emit(DocumentModelUpdateType.THEME_UPDATE,t),void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.COMPONENT_REMOVE:{const e=t.path;return void this.removeComponent(e)}case DocumentModelUpdateType.COMPONENT_INSERT:{let{insertPosition:e,targetPath:o,model:d}=t,n=DocumentUtils.getNodeByPath(this.documentModel.getViews(),o);if(!n&&e!==ComponentInsertType.INSIDE){const t=o.slice(0,-1),d=DocumentUtils.getNodeByPath(this.documentModel.getViews(),t);e=ComponentInsertType.INSIDE,n=d,o=t}return DocumentUtils.insertNode(d,o,this.documentModel.getViews(),e),void this.viewRenderer.renderComponent(n,d,this.renderMode,e)}case DocumentModelUpdateType.COMPONENT_MOVE:{const{fromPath:e,insertPosition:o,targetPath:d}=t,n=d[0],i=this.documentModel.getViews()[n],s=DocumentUtils.getNodeByPath(this.documentModel.getViews(),d);if(!s)return;const c=this.removeComponent(e),m=DocumentUtils.getNodeById([i],s.id).path;return DocumentUtils.insertNode(c,m,this.documentModel.getViews(),o),void this.viewRenderer.renderComponent(s,c,this.renderMode,o)}default:return}}removeComponent(e){const t=DocumentUtils.getNodeByPath(this.documentModel.getViews(),e);if(t)return t.componentRef.remove(),DocumentUtils.removeNode(this.documentModel.getViews(),e)}}
+import DocumentUtils from"@claspo/common/document/DocumentUtils";import{ComponentInsertType}from"@claspo/common/document/ComponentInsertType";import{DocumentModelUpdateType}from"./DocumentModelService";export default class DocumentService{constructor(e,t,o){this.documentModel=e,this.viewRenderer=t,this.renderMode=o}handleModelUpdate(e,t){switch(e){case DocumentModelUpdateType.COMPONENT_PROPS_UPDATE:{const{id:e,data:o}=t,d=DocumentUtils.getNodeById(this.documentModel.getViews(),e);if(!d)return void console.warn("Attempt to update unexisting component props");const n=d.path,i=n.reduce((e,t,o)=>0===o?this.documentModel.getViews()[t]:e.children[t],this.documentModel.getViews());return i?(i.props=Object.assign({},o),void this.documentModel.emit(`${DocumentModelUpdateType.COMPONENT_PROPS_UPDATE}_${e}`,o)):void console.error("Model not found by path ["+n+"]")}case DocumentModelUpdateType.COMPONENT_UPDATE:{const{id:e,data:o}=t,d=DocumentUtils.getNodeById(this.documentModel.getViews(),e);return d?(Object.assign(d,o),void this.documentModel.emit(`${DocumentModelUpdateType.COMPONENT_UPDATE}_${e}`,o)):void console.warn("Attempt to update unexisting component props")}case DocumentModelUpdateType.SHARED_UPDATE:{const e=this.documentModel.getShared();return Object.assign(e,t),void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL)}case DocumentModelUpdateType.MOBILE_BREAKPOINT_UPDATE:return void(this.documentModel.getShared().mobileBreakpointWidth=t.mobileBreakpointWidth);case DocumentModelUpdateType.ENVIRONMENT_UPDATE:return void this.documentModel.emit(DocumentModelUpdateType.ENVIRONMENT_UPDATE,t);case DocumentModelUpdateType.TEXT_CLASS_ADDED:return void(this.documentModel.getShared().textClasses[t.id]=t);case DocumentModelUpdateType.TEXT_CLASS_UPDATED:return this.documentModel.getShared().textClasses[t.id]=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.TEXT_CLASS_REMOVED:return void delete this.documentModel.getShared().textClasses[t];case DocumentModelUpdateType.HEADER_FONT_FAMILY_UPDATE:return this.documentModel.getShared().headerFontFamily=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.TEXT_FONT_FAMILY_UPDATE:return this.documentModel.getShared().textFontFamily=t,void this.documentModel.emit(DocumentModelUpdateType.SHARED_UPDATE_ALL);case DocumentModelUpdateType.COLOR_SCHEMA_UPDATE:return this.documentModel.getShared().cssVars=t,void this.documentModel.emit(DocumentModelUpdateType.COLOR_SCHEMA_UPDATE,t);case DocumentModelUpdateType.THEME_UPDATE:return this.documentModel.getShared().theme=t,void this.documentModel.emit(DocumentModelUpdateType.THEME_UPDATE,t);case DocumentModelUpdateType.COMPONENT_REMOVE:{const e=t.path;return void this.removeComponent(e)}case DocumentModelUpdateType.COMPONENT_INSERT:{let{insertPosition:e,targetPath:o,model:d}=t,n=DocumentUtils.getNodeByPath(this.documentModel.getViews(),o);if(!n&&e!==ComponentInsertType.INSIDE){const t=o.slice(0,-1),d=DocumentUtils.getNodeByPath(this.documentModel.getViews(),t);e=ComponentInsertType.INSIDE,n=d,o=t}return DocumentUtils.insertNode(d,o,this.documentModel.getViews(),e),void this.viewRenderer.renderComponent(n,d,this.renderMode,e)}case DocumentModelUpdateType.COMPONENT_MOVE:{const{fromPath:e,insertPosition:o,targetPath:d}=t,n=d[0],i=this.documentModel.getViews()[n],s=DocumentUtils.getNodeByPath(this.documentModel.getViews(),d);if(!s)return;const c=this.removeComponent(e),m=DocumentUtils.getNodeById([i],s.id).path;return DocumentUtils.insertNode(c,m,this.documentModel.getViews(),o),void this.viewRenderer.renderComponent(s,c,this.renderMode,o)}default:return}}removeComponent(e){const t=DocumentUtils.getNodeByPath(this.documentModel.getViews(),e);if(t)return t.componentRef.remove(),DocumentUtils.removeNode(this.documentModel.getViews(),e)}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@claspo/renderer",
-  "version": "18.0.0",
+  "version": "18.0.2-perf.0",
   "scripts": {
     "dev": " tsc --project tsconfig.json --watch",
     "build": "rm -rf out && tsc --project tsconfig.json && npm run minify",
@@ -15,7 +15,7 @@
     "node": ">=18.16.0"
   },
   "dependencies": {
-    "@claspo/common": "7.0.0",
+    "@claspo/common": "7.0.2",
     "@testing-library/dom": "^10.4.0"
   },
   "devDependencies": {

package/renderer/style/ColorSchemaListener.js

@@ -1 +1 @@
-import{DocumentModelUpdateType}from"../../document-model/DocumentModelService";import ErrorLogger from"../../error/ErrorLogger";import{formCssVarToSchemaToken,toCssVarToken}from"@claspo/common/theme/theme.utils";export default class ColorSchemaListener{constructor(e,t,o,s,n,r){this.hostElement=t,this.documentModel=e,this.getSharedCb=o,this.getPropsCb=s,this.getEnvCb=n,this.httpClient=r,this.schemaSubscription=null,this.themeSubscription=null,this.envUrlMaps={desktop:new Map,mobile:new Map}}parseBackground(e){const t=String(e||"");if(t.includes("url")){const[e,o]=t.split("(")[1].split(")");return{url:e.replace(/['"]+/g,""),positionOptions:o.replace(";","")}}return{url:null,positionOptions:null}}apply(e){const t=this.getPropsCb();return t.backgroundDynamicInlineSVGElements[e].forEach(o=>{var s,n,r,i,l;const a=null===(n=null===(s=t.adaptiveStyles)||void 0===s?void 0:s[e])||void 0===n?void 0:n.find(e=>e.element===o),c=(null===(r=t.styles)||void 0===r?void 0:r.find(e=>e.element===o))||{},m=(null===(i=null==c?void 0:c.styleAttributes)||void 0===i?void 0:i.background)||(null===(l=null==a?void 0:a.styleAttributes)||void 0===l?void 0:l.background),h=this.parseBackground(m);h.url&&this.envUrlMaps[e].set(o,{originalSVGResourceURL:h.url,inlineSvgString:null,positionOptions:h.positionOptions})}),Promise.all([...this.envUrlMaps[e].entries()].map(([t,o])=>this.httpClient.execute(o.originalSVGResourceURL).then(e=>e.text()).then(s=>{this.envUrlMaps[e].set(t,Object.assign(Object.assign({},o),{inlineSvgString:s}))}))).then(()=>{var t;const o=this.getSharedCb();return Object.keys((null===(t=o.theme)||void 0===t?void 0:t.schema)||{}).length>0?this._applyHostElementBackgroundFromTheme(this.envUrlMaps[e].get("host"),o.theme.schema):this._applyHostElementBackgroundFromCssVars(this.envUrlMaps[e].get("host"),o.cssVars)}).catch(e=>{console.error(e),ErrorLogger.log(`Failed to load/apply backgroundDynamicInlineSVGElements[${this.getPropsCb().backgroundDynamicInlineSVGElements}] ${e}`)})}on(){return this.schemaSubscription=this.documentModel.on(DocumentModelUpdateType.COLOR_SCHEMA_UPDATE,e=>{this._applyHostElementBackgroundFromCssVars(this.envUrlMaps[this.getEnvCb()].get("host"),e)}),this.themeSubscription=this.documentModel.on(DocumentModelUpdateType.THEME_UPDATE,e=>{this._applyHostElementBackgroundFromTheme(this.envUrlMaps[this.getEnvCb()].get("host"),e.schema)}),this}_applyHostElementBackgroundFromCssVars(e,t){e&&t&&(this.hostElement.style.background=this._buildBackgroundUrlFromCssVars(e,t))}_applyHostElementBackgroundFromTheme(e,t){e&&t&&(this.hostElement.style.background=this._buildBackgroundUrlFromTheme(e,t))}_buildBackgroundUrlFromCssVars(e,t){const o=e.inlineSvgString.trim().replace("var(--cl-schema-accent)",t["cl-schema-accent"]);return`url('data:image/svg+xml,${encodeURIComponent(o)}')${e.positionOptions}`}_buildBackgroundUrlFromTheme(e,t){const o=e.inlineSvgString.trim();let s=o;[...o.matchAll(/var\(--cl-schema-([^)]+)\)/g)].forEach(e=>{const o=formCssVarToSchemaToken(e[1]);s=s.replace(`var(--${toCssVarToken(o)})`,t[o])});return`url('data:image/svg+xml,${encodeURIComponent(s)}')${e.positionOptions}`}off(){var e,t;null===(e=this.schemaSubscription)||void 0===e||e.off(),null===(t=this.themeSubscription)||void 0===t||t.off()}}
+import{DocumentModelUpdateType}from"../../document-model/DocumentModelService";import ErrorLogger from"../../error/ErrorLogger";import{fromCssVarToSchemaToken,toCssVarToken}from"@claspo/common/theme/theme.utils";export default class ColorSchemaListener{constructor(e,t,o,s,n,r){this.hostElement=t,this.documentModel=e,this.getSharedCb=o,this.getPropsCb=s,this.getEnvCb=n,this.httpClient=r,this.schemaSubscription=null,this.themeSubscription=null,this.envUrlMaps={desktop:new Map,mobile:new Map}}parseBackground(e){const t=String(e||"");if(t.includes("url")){const[e,o]=t.split("(")[1].split(")");return{url:e.replace(/['"]+/g,""),positionOptions:o.replace(";","")}}return{url:null,positionOptions:null}}apply(e){const t=this.getPropsCb();return t.backgroundDynamicInlineSVGElements[e].forEach(o=>{var s,n,r,i,l;const a=null===(n=null===(s=t.adaptiveStyles)||void 0===s?void 0:s[e])||void 0===n?void 0:n.find(e=>e.element===o),c=(null===(r=t.styles)||void 0===r?void 0:r.find(e=>e.element===o))||{},m=(null===(i=null==c?void 0:c.styleAttributes)||void 0===i?void 0:i.background)||(null===(l=null==a?void 0:a.styleAttributes)||void 0===l?void 0:l.background),h=this.parseBackground(m);h.url&&this.envUrlMaps[e].set(o,{originalSVGResourceURL:h.url,inlineSvgString:null,positionOptions:h.positionOptions})}),Promise.all([...this.envUrlMaps[e].entries()].map(([t,o])=>this.httpClient.execute(o.originalSVGResourceURL).then(e=>e.text()).then(s=>{this.envUrlMaps[e].set(t,Object.assign(Object.assign({},o),{inlineSvgString:s}))}))).then(()=>{var t;const o=this.getSharedCb();return Object.keys((null===(t=o.theme)||void 0===t?void 0:t.schema)||{}).length>0?this._applyHostElementBackgroundFromTheme(this.envUrlMaps[e].get("host"),o.theme.schema):this._applyHostElementBackgroundFromCssVars(this.envUrlMaps[e].get("host"),o.cssVars)}).catch(e=>{console.error(e),ErrorLogger.log(`Failed to load/apply backgroundDynamicInlineSVGElements[${this.getPropsCb().backgroundDynamicInlineSVGElements}] ${e}`)})}on(){return this.schemaSubscription=this.documentModel.on(DocumentModelUpdateType.COLOR_SCHEMA_UPDATE,e=>{this._applyHostElementBackgroundFromCssVars(this.envUrlMaps[this.getEnvCb()].get("host"),e)}),this.themeSubscription=this.documentModel.on(DocumentModelUpdateType.THEME_UPDATE,e=>{this._applyHostElementBackgroundFromTheme(this.envUrlMaps[this.getEnvCb()].get("host"),e.schema)}),this}_applyHostElementBackgroundFromCssVars(e,t){e&&t&&(this.hostElement.style.background=this._buildBackgroundUrlFromCssVars(e,t))}_applyHostElementBackgroundFromTheme(e,t){e&&t&&(this.hostElement.style.background=this._buildBackgroundUrlFromTheme(e,t))}_buildBackgroundUrlFromCssVars(e,t){const o=e.inlineSvgString.trim().replace("var(--cl-schema-accent)",t["cl-schema-accent"]);return`url('data:image/svg+xml,${encodeURIComponent(o)}')${e.positionOptions}`}_buildBackgroundUrlFromTheme(e,t){const o=e.inlineSvgString.trim();let s=o;[...o.matchAll(/var\(--cl-schema-([^)]+)\)/g)].forEach(e=>{const o=fromCssVarToSchemaToken(e[1]);s=s.replace(`var(--${toCssVarToken(o)})`,t[o])});return`url('data:image/svg+xml,${encodeURIComponent(s)}')${e.positionOptions}`}off(){var e,t;null===(e=this.schemaSubscription)||void 0===e||e.off(),null===(t=this.themeSubscription)||void 0===t||t.off()}}