@claspo/document-connector 14.5.0-theme.13

package/BaseDocumentConnector.d.ts

@@ -0,0 +1,15 @@
+export default class BaseDocumentConnector {
+    constructor(params: any);
+    params: any;
+    entryModule: any;
+    controllers: any[];
+    container: any;
+    disconnect(): void;
+    propsRequestListener: (event: any) => void;
+    addPropsRequestEventListener(container: any): void;
+    setEntryModule(entryModule: any): void;
+    navigate(viewIndex: any): void;
+    performAction(type: any, payload: any): any;
+    setEnvironment(payload: any): void;
+    getComponentManifests(): any;
+}

package/BaseDocumentConnector.js

@@ -0,0 +1 @@
+import ThemeCssVars from"@claspo/common/element/ThemeCssVars";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import DefaultEventEmitter from"@claspo/common/DefaultEventEmitter";import DocumentUtils from"@claspo/common/document/DocumentUtils";export default class BaseDocumentConnector extends DefaultEventEmitter{constructor(e){super(),this.propsRequestListener=e=>{e.stopPropagation();let t=e.detail.id,o=e.detail.widgetId;if(o&&this.params.config.formVariantId&&this.params.config.formVariantId!==o)return;let r=DocumentUtils.getNodeById(this.entryModule.compositionRoot.services.documentModel.getViews(),t);r&&(e.detail.props=this.entryModule.componentFactory.constructProps(r,this.entryModule.viewRenderer.viewResourceManager))},this.params=e,this.entryModule=null,this.controllers=[],this.container=null}disconnect(){var e;null===(e=this.container)||void 0===e||e.removeEventListener("cl-props-request",this.propsRequestListener)}addPropsRequestEventListener(e){this.container=e,e.addEventListener("cl-props-request",this.propsRequestListener)}setEntryModule(e){this.entryModule=e}navigate(e){this.entryModule&&this.entryModule.viewRouter&&this.entryModule.viewRouter.navigate(e)}performAction(e,t){const o=this.entryModule.performAction(e,t);return this.controllers.forEach(o=>{if(e===DocumentModelUpdateType.THEME_UPDATE)ThemeCssVars.override(t.schema,o.getConnectedElement())}),o}setEnvironment(e){this.entryModule.performAction(DocumentModelUpdateType.ENVIRONMENT_UPDATE,e)}getComponentManifests(){return this.componentResolver.getComponentManifests()}}

package/DocumentConnectorEventType.d.ts

@@ -0,0 +1,10 @@
+export default DocumentConnectorEventType;
+declare namespace DocumentConnectorEventType {
+    const CONTACT_ID_WAS_RECEIVED: string;
+    const CLOSE_WIDGET: string;
+    const SHOW_WIDGET: string;
+    const CLOSE_ICON_CLICKED: string;
+    const BRANDING_ELEMENT_CLICKED: string;
+    const CONTACT_DATA_SUBMIT: string;
+    const WIDGET_CONTENT_CLICKED: string;
+}

package/DocumentConnectorEventType.js

@@ -0,0 +1 @@
+const DocumentConnectorEventType={CONTACT_ID_WAS_RECEIVED:"CONTACT_ID_WAS_RECEIVED",CLOSE_WIDGET:"CLOSE_WIDGET",SHOW_WIDGET:"SHOW_WIDGET",CLOSE_ICON_CLICKED:"CLOSE_ICON_CLICKED",BRANDING_ELEMENT_CLICKED:"BRANDING_ELEMENT_CLICKED",CONTACT_DATA_SUBMIT:"CONTACT_DATA_SUBMIT",WIDGET_CONTENT_CLICKED:"WIDGET_CONTENT_CLICKED"};export default DocumentConnectorEventType;

package/InAppDocumentConnectorParams.d.ts

@@ -0,0 +1,34 @@
+export default function getInAppDocumentConnectorParams(layoutType: any, bundledComponentClasses: any, documentModel: any, config?: {}): {
+    bundledComponentClasses: any;
+    disableGlobalScroll: boolean;
+    disableScrollbarCalculation: boolean;
+    layoutFactoryClass: typeof InAppLayoutFactory;
+    layoutType: any;
+    widgetType: any;
+    config: {
+        actionFactoryClass: any;
+        branded: boolean;
+        staticResourcesUrl: string;
+    };
+    documentModel: any;
+} | {
+    bundledComponentClasses: any;
+    disableGlobalScroll: boolean;
+    disableScrollbarCalculation: boolean;
+    layoutFactoryClass: typeof InAppLayoutFactory;
+    layoutType: any;
+    widgetType: any;
+    documentModel: any;
+    config: {
+        optionalDocumentStyles: {
+            width: string;
+            height: string;
+            overflow: string;
+        };
+        actionFactoryClass: any;
+        branded: boolean;
+        staticResourcesUrl: string;
+    };
+    displayPosition: string;
+};
+import InAppLayoutFactory from "./layouts/InAppLayoutFactory";

package/InAppDocumentConnectorParams.js

@@ -0,0 +1 @@
+import InAppLayoutFactory from"./layouts/InAppLayoutFactory";import InAppLayoutType from"@claspo/common/form/common/InAppLayoutType";import InAppActionFactory from"@claspo/renderer/action/InAppActionFactory";import WidgetType from"@claspo/common/form/common/WidgetType";export default function getInAppDocumentConnectorParams(o,t,e,a={}){const p=Object.assign({actionFactoryClass:InAppActionFactory,branded:!1,staticResourcesUrl:"https://statics.esstage.com/bundled-components"},a),n={bundledComponentClasses:t,disableGlobalScroll:!0,disableScrollbarCalculation:!0,layoutFactoryClass:InAppLayoutFactory},c=WidgetType.INFORMER;switch(o){case InAppLayoutType.BOTTOM_BAR:case InAppLayoutType.SLIDE_UP:return Object.assign({layoutType:o,widgetType:c,config:p,documentModel:e},n);case InAppLayoutType.POP_UP:case InAppLayoutType.FULL:return Object.assign({layoutType:o,widgetType:c,documentModel:e,config:Object.assign(Object.assign({},p),{optionalDocumentStyles:{width:"100%",height:"100%",overflow:"auto"}}),displayPosition:"fixed"},n);default:throw new Error(`Unsupported layout type: ${o}`)}}

package/PreviewBackgroundStyles.d.ts

@@ -0,0 +1,6 @@
+export default class PreviewBackgroundStyles {
+    static blockBackground: string;
+    static getFullScreen(): string;
+    static getBuiltInTopSection(): HTMLDivElement;
+    static getBuiltInBottomSection(): HTMLDivElement;
+}

package/PreviewBackgroundStyles.js

@@ -0,0 +1 @@
+export default class PreviewBackgroundStyles{static getFullScreen(){return`\n\n  <style>\n\n  .holder {\n    height: 100%;\n    overflow: hidden;\n    max-width: 100%;\n    border-radius: 4px;\n    box-sizing: border-box;\n  }\n\n  .cover-wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: 5px;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n    box-sizing: border-box;\n  }\n\n  .cover-row-small {\n    height: 10%;\n    border-radius: 4px;\n    background: ${PreviewBackgroundStyles.blockBackground};\n  }\n\n  .cover-row {\n    width: 100%;\n    height: 37%;\n    border-radius: 4px;\n    background: ${PreviewBackgroundStyles.blockBackground};\n  }\n\n\n  .d-flex {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n  \n  .d-flex--height {\n    gap: 5px;\n    height: 37%;\n  }\n\n  .cover-col {\n    height: 100%;\n    background: ${PreviewBackgroundStyles.blockBackground};\n    width: 100%;\n    border-radius: 4px;\n  }\n\n  </style>\n\n  <div class="holder">\n    <div class="cover-wrapper">\n        <div class="cover-row-small"></div>\n        <div class="cover-row"></div>\n        <div class="cover-row-small"></div>\n        <div class="d-flex d-flex--height flex-row justify-content-between">\n            <div class="cover-col"></div>\n            <div class="cover-col"></div>\n            <div class="cover-col"></div>\n        </div>\n    </div>\n  </div>\n          `}static getBuiltInTopSection(){const e=document.createElement("div");return e.className="preview-placeholder-element",e.style.width="100%",e.style.height="100%",e.style.borderRadius="4px",e.style.background=PreviewBackgroundStyles.blockBackground,e}static getBuiltInBottomSection(){const e=document.createElement("div");e.className="preview-placeholder-element",e.style.display="flex",e.style.flexDirection="row",e.style.justifyContent="space-between",e.style.gap="15px",e.style.width="100%",e.style.height="100%",e.style.borderRadius="4px";for(let n=0;n<3;n++){const n=document.createElement("div");n.style.background=PreviewBackgroundStyles.blockBackground,n.style.width="100%",n.style.height="100%",e.appendChild(n)}return e}}PreviewBackgroundStyles.blockBackground="#EDEDED";

package/StaticDocumentConnector.d.ts

@@ -0,0 +1,10 @@
+export default class StaticDocumentConnector extends BaseDocumentConnector {
+    componentRegister: any;
+    componentResolver: any;
+    connect(containerElement: any): Promise<any>;
+    googleFontsLoader: GoogleFontsLoader | undefined;
+    destroy(): void;
+    _initializeRenderer(containerElement: any, htmlDocumentObject: any): Promise<any>;
+}
+import BaseDocumentConnector from "./BaseDocumentConnector";
+import GoogleFontsLoader from "./layouts/GoogleFontsLoader";

package/StaticDocumentConnector.js

@@ -0,0 +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 ComponentLifeCycleContainerType from"@claspo/renderer/sdk/ComponentLifeCycleContainerType";import{WcRegister}from"@claspo/renderer/wc-renderer/WcRegister";import GoogleFontsLoader from"./layouts/GoogleFontsLoader";export default class StaticDocumentConnector extends BaseDocumentConnector{constructor(e){super(e);const{documentModel:t,config:o={},translations:n,trackingService:s,layoutType:r,bundledComponentClasses:i}=e;this.componentRegister=new WcRegister(i),this.componentResolver=new WcResolver(ComponentLifeCycleContainerType.STATIC,this.componentRegister);const a=new StaticEntryModule(t,this.componentResolver,this.componentRegister,Object.assign(Object.assign({},o),{layoutType:this.params.layoutType,widgetType:this.params.widgetType}),n,s,r);this.setEntryModule(a)}async connect(e){this.googleFontsLoader=new GoogleFontsLoader;const t=e.getRootNode();return this.params.disableGoogleFonts||await this.googleFontsLoader.load(this.params.documentModel.shared.googleFonts,t),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()}async _initializeRenderer(e,t){var o,n,s;await this.componentResolver.loadComponentsIfNecessary(this.params.documentModel,this.params.config.staticResourcesUrl);const r=this.entryModule.init(t);r.style.display="flex";const{layoutFactoryClass:i=LayoutFactory,layoutType:a,documentModel:c}=this.params,l=Object.assign(Object.assign({},this.params),{zIndex:null!==(n=null===(o=null==c?void 0:c.shared)||void 0===o?void 0:o.zIndex)&&void 0!==n?n:getZIndexByLayoutType(a)});return this.controllers.push(i.create(Object.assign(Object.assign({},l),{layoutType:this.params.layoutType,widgetType:this.params.widgetType,viewIndex:0,entryModuleType:this.entryModule.entryModuleType}),this,this.entryModule.viewRouter,this.entryModule.compositionRoot.services.documentModel,this.entryModule.compositionRoot.services.resizeListener)),super.addPropsRequestEventListener(r),this.params.config.formVariantId?r.classList.add("cl-widget-"+this.params.config.formVariantId):r.classList.add("cl-widget"),this.entryModule.listenAction("*",(e,t)=>{this.emit(t,e),t===DocumentConnectorEventType.CLOSE_WIDGET&&e&&"function"==typeof e&&e()}),null===(s=this.controllers[0])||void 0===s?void 0:s.connect(r,e,this.entryModule)}}

package/UpdatingDocumentConnector.d.ts

@@ -0,0 +1,12 @@
+export class UpdatingDocumentConnector extends BaseDocumentConnector {
+    componentRegister: any;
+    componentResolver: any;
+    connect(containerElement: any, createViewport: any): Promise<void>;
+    viewComponents: any;
+    destroy(): void;
+    getDragEventListener(): any;
+    getHostElementById(id: any): any;
+    getHostElementByPath(path: any): any;
+    getContextRecordsMap(): any;
+}
+import BaseDocumentConnector from "./BaseDocumentConnector";

package/UpdatingDocumentConnector.js

@@ -0,0 +1 @@
+import UpdatingEntryModule from"@claspo/renderer/UpdatingEntryModule";import LayoutFactory from"./layouts/LayoutFactory";import BaseDocumentConnector from"./BaseDocumentConnector";import LayoutType from"@claspo/common/form/common/LayoutType";import WcResolver from"@claspo/renderer/wc-renderer/WcResolver";import ComponentLifeCycleContainerType from"@claspo/renderer/sdk/ComponentLifeCycleContainerType";import{WcRegister}from"@claspo/renderer/wc-renderer/WcRegister";export class UpdatingDocumentConnector extends BaseDocumentConnector{constructor(e){super(e);const{documentModel:t,config:o,layoutType:n,mouseInteractionStyles:s,componentRegister:r,bundledComponentClasses:i}=this.params;this.componentRegister=new WcRegister(i),this.componentResolver=new WcResolver(ComponentLifeCycleContainerType.UPDATING,this.componentRegister);const a=new UpdatingEntryModule(t,this.componentResolver,this.componentRegister,s,Object.assign(Object.assign({},o),{layoutType:this.params.layoutType,widgetType:this.params.widgetType}),n,r);this.setEntryModule(a)}async connect(e,t){let o;await this.componentResolver.loadComponents(this.params.componentNamesToLoad,this.params.config.staticResourcesUrl),this.viewComponents=this.entryModule.init(e),super.addPropsRequestEventListener(document.body),this.params.layoutType!==LayoutType.DETACHED&&this.params.layoutType!==LayoutType.BUILT_IN&&(o={width:"100%",height:"100%"});const{layoutFactoryClass:n=LayoutFactory}=this.params;this.viewComponents.map((s,r)=>{const i=n.create(Object.assign(Object.assign({},this.params),{config:Object.assign(Object.assign({},this.params.config),{optionalDocumentStyles:o}),displayPosition:"absolute",zIndex:1,disableSmartPosition:!0,disableScrollbarCalculation:!0,disableLayoutAnimations:!0,viewIndex:r,entryModuleType:this.entryModule.entryModuleType}),this,this.entryModule.viewRouter,this.entryModule.compositionRoot.services.documentModel,this.entryModule.compositionRoot.services.resizeListener);s.classList.add("cl-widget");const a=t({viewComponent:s,viewModel:this.params.documentModel.views[r],index:r});e.appendChild(a.viewportElement),i.connect(s,a.viewContainerElement,this.entryModule),this.controllers.push(i)}),this.entryModule.listenAction("*",(e,t)=>{this.emit(t,e)}),this.entryModule.listenContextAction("*",(e,t)=>{this.emit(t,e)})}disconnect(){super.disconnect(),this.entryModule.destroy(),this.controllers.forEach(e=>e.disconnect()),this.controllers=[]}destroy(){this.disconnect()}getDragEventListener(){return this.entryModule.dragEventListener}getHostElementById(e){return this.entryModule.getHostElementById(e)}getHostElementByPath(e){return this.entryModule.getHostElementByPath(e)}getContextRecordsMap(){return this.entryModule.getContextRecordsMap()}}

package/layouts/BaseLayout.d.ts

@@ -0,0 +1,29 @@
+export default class BaseLayout {
+    constructor(params: any, eventEmitter: any, viewRouter: any, documentModel: any, resizeListener: any);
+    params: any;
+    eventEmitter: any;
+    viewRouter: any;
+    documentModel: any;
+    resizeListener: any;
+    connectedElement: any;
+    createSvgElement(boxWidth: any, boxHeight: any, html: any): SVGSVGElement;
+    getHideIcon(): SVGSVGElement;
+    getClaspoIcon(): SVGSVGElement;
+    addBrandingUTMParametersToURL(url: any, siteId: any): string;
+    createBrandingElement(): void;
+    brandingElement: HTMLDivElement | undefined;
+    addBrandingElementListeners(): void;
+    isMobileEnv(): any;
+    setConnectedElement(element: any): void;
+    getConnectedElement(): any;
+    getDisabledWidgetStyles(containerClass: any): string;
+    getBrandingStyles(): string;
+    getViewportWidth(documentObject: any, windowObject: any): number;
+    getContainerElementHeight(): any;
+    getCurrentViewIndex(): any;
+    getActualSizeByEnv(isMobileEnv: any): any;
+    getViewContentContainer(): any;
+    changeViewAlignToTop(): void;
+    addWidgetContentClickEventListener(widgetContentElement: any): void;
+    getDocumentModel(): any;
+}

package/layouts/BaseLayout.js

@@ -0,0 +1 @@
+import DocumentConnectorEventType from"../DocumentConnectorEventType";import ComponentLifeCycleContainerType from"@claspo/renderer/sdk/ComponentLifeCycleContainerType";export default class BaseLayout{constructor(e,n,t,i,r){this.params=e,this.eventEmitter=n,this.viewRouter=t,this.documentModel=i,this.resizeListener=r,this.connectedElement=null}createSvgElement(e,n,t){const i=document.createElementNS("http://www.w3.org/2000/svg","svg");return i.setAttributeNS(null,"viewBox","0 0 "+e+" "+n),i.setAttributeNS(null,"width",e),i.setAttributeNS(null,"height",n),i.innerHTML=t,i}getHideIcon(){return this.createSvgElement(21,21,'<path fill-rule="evenodd" clip-rule="evenodd" d="M13.5582 11.167C13.6018 10.9519 13.6247 10.7293 13.6247 10.5013C13.6247 8.66035 12.1323 7.16797 10.2913 7.16797C10.0634 7.16797 9.84072 7.19086 9.6256 7.23446L10.3945 8.00339C11.6932 8.05612 12.7365 9.09947 12.7892 10.3981L13.5582 11.167ZM8.1189 9.2633C7.91046 9.62829 7.79134 10.0509 7.79134 10.5013C7.79134 11.882 8.91063 13.0013 10.2913 13.0013C10.7418 13.0013 11.1644 12.8822 11.5293 12.6737L12.1346 13.279C11.6067 13.6301 10.9729 13.8346 10.2913 13.8346C8.45039 13.8346 6.95801 12.3423 6.95801 10.5013C6.95801 9.81975 7.16256 9.18597 7.51361 8.65801L8.1189 9.2633Z" fill="#2C2C2C"/>\n        <path fill-rule="evenodd" clip-rule="evenodd" d="M15.7837 13.3901C16.4728 12.7662 17.0357 12.1378 17.4361 11.6517L17.4851 11.5924C17.7606 11.2595 18.0164 10.9504 18.0164 10.4987C18.0164 10.047 17.7606 9.73786 17.4851 9.40501L17.4361 9.3457C16.832 8.61222 15.8577 7.55476 14.6386 6.67763C13.4227 5.80287 11.9277 5.08203 10.2911 5.08203C9.46902 5.08203 8.68264 5.26393 7.94942 5.55587L8.59862 6.20507C9.14557 6.02176 9.71248 5.91536 10.2911 5.91536C11.6843 5.91536 13.0094 6.53209 14.1519 7.35408C15.2911 8.17371 16.2136 9.1722 16.7929 9.8755C17.1465 10.3049 17.183 10.3791 17.183 10.4987C17.183 10.6183 17.1465 10.6925 16.7929 11.1219C16.4027 11.5957 15.8567 12.2034 15.1937 12.8001L15.7837 13.3901ZM6.30424 7.44623C5.22306 8.24755 4.34715 9.19835 3.78941 9.8755C3.43577 10.3049 3.39925 10.3791 3.39925 10.4987C3.39925 10.6183 3.43577 10.6925 3.78941 11.1219C4.36868 11.8252 5.29119 12.8237 6.43042 13.6433C7.57294 14.4653 8.89795 15.082 10.2911 15.082C11.2901 15.082 12.2539 14.765 13.1406 14.2826L13.7526 14.8946C12.7242 15.4892 11.5495 15.9154 10.2911 15.9154C8.65456 15.9154 7.1596 15.1945 5.94374 14.3198C4.72459 13.4426 3.7503 12.3852 3.14617 11.6517L3.09716 11.5924C2.82173 11.2595 2.56592 10.9504 2.56592 10.4987C2.56592 10.047 2.82172 9.73786 3.09716 9.40501L3.14617 9.3457C3.711 8.65993 4.5994 7.69096 5.70897 6.85095L6.30424 7.44623Z" fill="#2C2C2C"/>\n        <path d="M4.45752 2.16602L17.7909 15.4993" stroke="#2C2C2C" stroke-width="0.833333"/>')}getClaspoIcon(){return this.createSvgElement(17,10,'<path d="M13.8946 6.59451C13.337 7.15222 12.5956 7.45921 11.807 7.45921H3.68778C3.09624 7.45921 2.54034 7.22894 2.12199 6.81068C1.70373 6.39243 1.52894 5.83644 1.52894 5.24489C1.52894 4.65345 1.70373 4.09746 2.12199 3.67911C2.54034 3.26095 3.09624 3.03058 3.68778 3.03058C4.23793 3.03058 4.75748 3.23004 5.16396 3.59453V5.36522L10.1517 2.06086L10.1518 2.06116C10.6365 1.73171 11.2081 1.5544 11.807 1.5544C12.5956 1.5544 13.337 1.8614 13.8946 2.4191C14.4524 2.97671 14.7436 3.71827 14.7436 4.50686C14.7436 5.29544 14.4524 6.0369 13.8946 6.59451ZM11.807 0.078125C10.8924 0.078125 10.0424 0.355518 9.33667 0.830762L9.33636 0.830259L5.16396 3.59443V1.8617C4.71187 1.66425 4.21276 1.5544 3.68778 1.5544C1.64956 1.5544 0 3.20678 0 5.24489C0 7.28311 1.64956 8.93549 3.68778 8.93549H11.807C14.2529 8.93549 16.2911 6.95275 16.2911 4.50686C16.2911 2.06086 14.2529 0.078125 11.807 0.078125Z" fill="#F3492C"/>')}addBrandingUTMParametersToURL(e,n){const t={utm_campaign:"Powered_by_promo",utm_medium:"referral",utm_source:n},i=new URL(e);return i.search?i.search+=`&${new URLSearchParams(t).toString()}`:i.search=`?${new URLSearchParams(t).toString()}`,i.toString()}createBrandingElement(){const e=this.getClaspoIcon(),n=this.getHideIcon();this.brandingElement=document.createElement("div"),this.brandingElement.classList.add("cl-branding");const t=document.createElement("a");t.classList.add("cl-link"),t.setAttribute("href",this.addBrandingUTMParametersToURL("https://claspo.io/",this.params.config.siteId)),t.setAttribute("rel","noopener noreferrer nofollow"),t.setAttribute("target","_blank");const i=document.createElement("span");i.classList.add("cl-branding-text"),i.innerText="Powered by ",t.append(i),t.append(e);const r=document.createElement("span");if(r.classList.add("cl-branding-brand"),r.innerText="Claspo",t.append(r),this.brandingElement.append(t),this.params.config.upgradePlanButton){const e=document.createElement("div");e.classList.add("cl-branding-upgrade-overlay");const t=document.createElement("div");t.classList.add("cl-branding-upgrade"),t.appendChild(n),this.brandingElement.append(t),this.brandingElement.append(e)}}addBrandingElementListeners(){this.brandingElement.addEventListener("click",()=>{this.eventEmitter.emit(DocumentConnectorEventType.BRANDING_ELEMENT_CLICKED,this.params.layoutType)})}isMobileEnv(){return this.resizeListener.isMobile()}setConnectedElement(e){this.connectedElement=e}getConnectedElement(){return this.connectedElement}getDisabledWidgetStyles(e){return`${e}:after {\n      content: '';\n      height: 100%;\n      width: 100%;\n      position: absolute;\n      left: 0;\n      top: 0;\n      z-index: 1;\n    }`}getBrandingStyles(){return".cl-branding {\n          display: flex;\n          flex-direction: row;\n          align-items: center;\n          border-radius: 20px;\n          background: #FFFFFF;\n          height: 21px;\n          line-height: 21px !important;\n          font-family: Arial, sans-serif !important;\n          letter-spacing: 0.3px !important;\n          font-size: 10px !important;\n          font-weight: 400 !important;\n          padding: 0 10px !important;\n          gap: 8px;\n          position: absolute;\n          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n          z-index: 1;\n        }\n        \n        .cl-link {\n          display: flex;\n          align-items: center;\n          gap: 5px;\n          text-decoration: none;\n          cursor: pointer;\n        }\n\n      .cl-branding-text {\n        color: #121221;\n        flex: none;\n        order: 0;\n        flex-grow: 0;\n        font-size: 10px !important;\n        font-family: Arial, sans-serif !important;\n        font-weight: 400 !important;\n        font-style: normal !important;\n      }\n\n      .cl-branding-brand{\n        display: flex;\n        align-items: center;\n        gap: 2px;\n        color: #F3492C;\n        flex: none;\n        order: 1;\n        flex-grow: 0;\n        font-size: 10px !important;\n        font-family: Arial, sans-serif !important;\n        font-weight: 400;\n        font-style: normal !important;\n      }\n\n      .cl-branding-link-overlay,\n      .cl-branding-upgrade-overlay {\n        width: 100%;\n        height: 100%;\n        position: absolute;\n        cursor: pointer;\n      }\n\n      .cl-branding-upgrade {\n        display: flex;\n        align-items: center;\n        order: 2;\n        flex-grow: 0;\n      }\n\n      .cl-branding:hover {\n        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.07);\n      }"}getViewportWidth(e,n){return Math.max((e||document).documentElement.clientWidth,(n||window).innerWidth||0)}getContainerElementHeight(){return"BODY"===this.containerElement.tagName?Math.max(document.documentElement.clientHeight,window.innerHeight||0):this.containerElement.getBoundingClientRect().height}getCurrentViewIndex(){return this.params.entryModuleType===ComponentLifeCycleContainerType.STATIC?this.viewRouter.getCurrentViewIndex():this.params.viewIndex}getActualSizeByEnv(e){var n,t,i;const r=this.getDocumentModel();if(!r.shared.actualSize)return null;const o=e?"mobile":"desktop";return Array.isArray(r.shared.actualSize)?null===(t=null===(n=r.shared.actualSize)||void 0===n?void 0:n[this.getCurrentViewIndex()])||void 0===t?void 0:t[o]:null===(i=r.shared.actualSize)||void 0===i?void 0:i[o]}getViewContentContainer(){var e;return null===(e=this.documentElement.querySelector('[cl-type="VIEW"]'))||void 0===e?void 0:e.shadowRoot.querySelector("[cl-content-container]")}changeViewAlignToTop(){const e=this.documentElement.querySelector('[cl-type="VIEW"]');"row"===getComputedStyle(e).flexDirection?e.style.alignItems="flex-start":e.style.justifyContent="flex-start"}addWidgetContentClickEventListener(e){e.addEventListener("click",()=>{this.eventEmitter.emit(DocumentConnectorEventType.WIDGET_CONTENT_CLICKED,e)})}getDocumentModel(){return this.documentModel.getModel()}}

package/layouts/GoogleFontsLoader.d.ts

@@ -0,0 +1,17 @@
+export default class GoogleFontsLoader {
+    loadedGoogleFonts: any[];
+    testStrings: {
+        latin: string;
+        cyrillic: string;
+    };
+    load(fonts: any, htmlDocumentObject: any): Promise<void>;
+    cleanup(): void;
+    _getDynamicUrlPart(fonts: any, htmlDocumentObject: any): any[];
+    _combineUrlDynamicPart(fonts: any, fontsInDocumentSet: any): any[];
+    _makeFontOptions(): number[];
+    _addFontsLinkToDocument(fontUrlParts: any, htmlDocumentObject: any): Promise<void> | Promise<PromiseSettledResult<any>[]>;
+    _generateFontVariations(fontFamilies: any): any[];
+    _createFontTester(variations: any, htmlDocumentObject: any): any;
+    _waitForAllFontsToLoad(variations: any, htmlDocumentObject: any): Promise<void>;
+    _waitForFontBatchLoad(batch: any, htmlDocumentObject: any): Promise<any[]>;
+}

package/layouts/GoogleFontsLoader.js

@@ -0,0 +1 @@
+export default class GoogleFontsLoader{constructor(){this.loadedGoogleFonts=[],this.testStrings={latin:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",cyrillic:"АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюя"}}async load(t,e){try{if(e=e||document,!(t||[]).length)return;const o=this._getDynamicUrlPart(t,e);if(!o||0===o.length)return;await this._addFontsLinkToDocument(o,e);const n=this._generateFontVariations(t),s=this._createFontTester(n,e);e.body.appendChild(s);const r=this._waitForAllFontsToLoad(n,e),a=new Promise((t,e)=>setTimeout(()=>e(new Error("Timeout")),2e3));await Promise.race([r,a]),s.remove()}catch(t){console.error("Error while loading fonts",t)}}cleanup(){this.loadedGoogleFonts.forEach(t=>t.remove()),this.loadedGoogleFonts=[]}_getDynamicUrlPart(t,e){let o=[];(e.fonts||[]).forEach(t=>o.push(`${t.family} ${t.weight} ${t.style}`));const n=new Set(o);return this._combineUrlDynamicPart(t,n)}_combineUrlDynamicPart(t,e){const o=[];let n=this._makeFontOptions();return t.forEach(t=>{let s="",r="";n.forEach(o=>{if(!e.has(`${t} ${o} normal`)){const t=`1,${o}`;r+=r?`;${t}`:t}if(!e.has(`${t} ${o} italic`)){const t=`0,${o}`;s+=s?`;${t}`:t}}),(s||r)&&o.push({fontFamily:t,urlPart:`&family=${t.replace(/ /g,"+")}:ital,wght@${s};${r}`})}),o}_makeFontOptions(){const t=[];for(let e=0;e<9;e++){const o=100*(e+1);t.push(o)}return t}_addFontsLinkToDocument(t,e){if(!e.head)return Promise.resolve();const o=t.map(({fontFamily:t,urlPart:o})=>new Promise((n,s)=>{const r=document.createElement("link");r.rel="stylesheet",r.href="https://fonts.googleapis.com/css2?display=swap"+o,r.onload=()=>n({fontFamily:t,success:!0}),r.onerror=()=>{console.error(`Failed to load font: ${t}`),s(new Error(`Failed to load font: ${t}`))},e.head.appendChild(r),this.loadedGoogleFonts.push(r)}));return Promise.allSettled(o)}_generateFontVariations(t){const e=[100,200,300,400,500,600,700,800,900],o=["normal","italic"],n=[];return t.forEach(t=>{e.forEach(e=>{o.forEach(o=>{n.push({family:t,weight:e,style:o,descriptor:`${o} ${e} 1em "${t}"`})})})}),n}_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 r=e.createElement("span");r.textContent=s,r.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        `,r.dataset.font=`${t.family}-${t.weight}-${t.style}`,r.dataset.subset=n,o.appendChild(r)})}),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)}}

package/layouts/InAppLayoutFactory.d.ts

@@ -0,0 +1,3 @@
+export default class InAppLayoutFactory extends LayoutFactory {
+}
+import LayoutFactory from "./LayoutFactory";

package/layouts/InAppLayoutFactory.js

@@ -0,0 +1 @@
+import ContentLockerLayout from"./content-locker/ContentLockerLayout";import InAppSlideUpLayout from"./in-app-slide-up/InAppSlideUpLayout";import LayoutFactory from"./LayoutFactory";import InAppLayoutType from"@claspo/common/form/common/InAppLayoutType";import InAppPopUpLayout from"./in-app-pop-up/InAppPopUpLayout";export default class InAppLayoutFactory extends LayoutFactory{static create(p,o,t,a,e){const{layoutType:n}=p;switch(n){case InAppLayoutType.FULL:return new ContentLockerLayout(p,o,t,a,e);case InAppLayoutType.BOTTOM_BAR:case InAppLayoutType.SLIDE_UP:return new InAppSlideUpLayout(p,o,t,a,e);case InAppLayoutType.POP_UP:return new InAppPopUpLayout(p,o,t,a,e);default:return LayoutFactory.create(p,o,t,a,e)}}}

package/layouts/LayoutFactory.d.ts

@@ -0,0 +1,9 @@
+export default class LayoutFactory {
+    static create(params: any, eventEmitter: any, viewRouter: any, documentModel: any, resizeListener: any): ContentLockerLayout | FloatingBarLayout | FloatingBoxLayout | LauncherLayout | DialogLayout | BuiltInLayout;
+}
+import ContentLockerLayout from "./content-locker/ContentLockerLayout";
+import FloatingBarLayout from "./floating-bar/FloatingBarLayout";
+import FloatingBoxLayout from "./floating-box/FloatingBoxLayout";
+import LauncherLayout from "./launcher/LauncherLayout";
+import DialogLayout from "./detached/DialogLayout";
+import BuiltInLayout from "./built-in/BuiltInLayout";

package/layouts/LayoutFactory.js

@@ -0,0 +1 @@
+import LayoutType from"@claspo/common/form/common/LayoutType";import FloatingBoxLayout from"./floating-box/FloatingBoxLayout";import ContentLockerLayout from"./content-locker/ContentLockerLayout";import FloatingBarLayout from"./floating-bar/FloatingBarLayout";import LauncherLayout from"./launcher/LauncherLayout";import DialogLayout from"./detached/DialogLayout";import BuiltInLayout from"./built-in/BuiltInLayout";export default class LayoutFactory{static create(o,t,a,e,r){const{layoutType:u}=o;switch(u){case LayoutType.FLOATING_BOX:return new FloatingBoxLayout(o,t,a,e,r);case LayoutType.FLOATING_BAR:return new FloatingBarLayout(o,t,a,e,r);case LayoutType.DETACHED:return new DialogLayout(o,t,a,e,r);case LayoutType.CONTENT_LOCKER:return new ContentLockerLayout(o,t,a,e,r);case LayoutType.LAUNCHER:return new LauncherLayout(o,t,a,e,r);case LayoutType.BUILT_IN:return new BuiltInLayout(o,t,a,e,r);default:throw new Error(`LayoutFactory: unknown layout type ${u}`)}}}

package/layouts/LayoutWithCloseIcon.d.ts

@@ -0,0 +1,29 @@
+export default class LayoutWithCloseIcon extends BaseLayout {
+    disconnect(beforeDestroyCallback: any): void;
+    getDefaultCloseIconParams(): {
+        desktop: {
+            verticalOffset: string;
+            horizontalOffset: string;
+            width: string;
+            height: string;
+            content: string;
+            defaultIcon: boolean;
+            color: string;
+        };
+        mobile: {
+            verticalOffset: string;
+            horizontalOffset: string;
+            width: string;
+            height: string;
+            content: string;
+            defaultIcon: boolean;
+            color: string;
+        };
+    };
+    applyCloseIconParams(element: any, params: any, isMobileEnv: any): void;
+    closeIconNavigationEndListener: any;
+    setCloseIconVisibility(element: any, params: any, currentViewIndex: any): void;
+    getInlineSvg(index: any): "" | "\n          <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.7071 9.70662L9.70711 15.7066L8.29289 14.2924L14.2929 8.2924L15.7071 9.70662Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.29289 9.70711L14.2929 15.7071L15.7071 14.2929L9.70711 8.29289L8.29289 9.70711Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.9916 5.34171C19.4472 5.79732 19.4472 6.53602 18.9916 6.99163L6.99163 18.9916C6.53602 19.4472 5.79732 19.4472 5.34171 18.9916C4.8861 18.536 4.8861 17.7973 5.34171 17.3417L17.3417 5.34171C17.7973 4.8861 18.536 4.8861 18.9916 5.34171Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.34171 5.34171C4.8861 5.79732 4.8861 6.53602 5.34171 6.99163L17.3417 18.9916C17.7973 19.4472 18.536 19.4472 18.9916 18.9916C19.4472 18.536 19.4472 17.7973 18.9916 17.3417L6.99163 5.34171C6.53602 4.8861 5.79732 4.8861 5.34171 5.34171Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M11.5 3C6.80558 3 3 6.80558 3 11.5C3 16.1944 6.80558 20 11.5 20C16.1944 20 20 16.1944 20 11.5C20 6.80558 16.1944 3 11.5 3ZM2 11.5C2 6.25329 6.25329 2 11.5 2C16.7467 2 21 6.25329 21 11.5C21 16.7467 16.7467 21 11.5 21C6.25329 21 2 16.7467 2 11.5Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M14.8536 8.85319L8.85355 14.8532L8.14645 14.1461L14.1464 8.14608L14.8536 8.85319Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.14645 8.85355L14.1464 14.8536L14.8536 14.1464L8.85355 8.14645L8.14645 8.85355Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M17.8648 6.13518C18.0451 6.31542 18.0451 6.60765 17.8648 6.7879L6.78792 17.8648C6.60768 18.0451 6.31545 18.0451 6.13521 17.8648C5.95496 17.6846 5.95496 17.3923 6.13521 17.2121L17.2121 6.13518C17.3923 5.95494 17.6846 5.95494 17.8648 6.13518Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M6.13518 6.13518C5.95494 6.31542 5.95494 6.60765 6.13518 6.7879L17.2121 17.8648C17.3923 18.0451 17.6846 18.0451 17.8648 17.8648C18.045 17.6846 18.045 17.3923 17.8648 17.2121L6.78789 6.13518C6.60765 5.95494 6.31542 5.95494 6.13518 6.13518Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12ZM7.29289 16.7071C6.90237 16.3166 6.90237 15.6834 7.29289 15.2929L10.5858 12L7.29289 8.70711C6.90237 8.31658 6.90237 7.68342 7.29289 7.29289C7.68342 6.90237 8.31658 6.90237 8.70711 7.29289L12 10.5858L15.2929 7.29289C15.6834 6.90237 16.3166 6.90237 16.7071 7.29289C17.0976 7.68342 17.0976 8.31658 16.7071 8.70711L13.4142 12L16.7071 15.2929C17.0976 15.6834 17.0976 16.3166 16.7071 16.7071C16.3166 17.0976 15.6834 17.0976 15.2929 16.7071L12 13.4142L8.70711 16.7071C8.31658 17.0976 7.68342 17.0976 7.29289 16.7071Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"12\" cy=\"12\" r=\"10\" fill=\"black\" fill-opacity=\"0.1\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.7071 9.70662L9.70711 15.7066L8.29289 14.2924L14.2929 8.2924L15.7071 9.70662Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.29289 9.70711L14.2929 15.7071L15.7071 14.2929L9.70711 8.29289L8.29289 9.70711Z\" fill=\"currentColor\"/>\n</svg>\n" | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"12\" cy=\"12\" r=\"9\" fill=\"black\" fill-opacity=\"0.1\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM2.5 12C2.5 6.75329 6.75329 2.5 12 2.5C17.2467 2.5 21.5 6.75329 21.5 12C21.5 17.2467 17.2467 21.5 12 21.5C6.75329 21.5 2.5 17.2467 2.5 12Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.3536 9.35306L9.35355 15.3531L8.64645 14.646L14.6464 8.64596L15.3536 9.35306Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.64645 9.35355L14.6464 15.3536L15.3536 14.6464L9.35355 8.64645L8.64645 9.35355Z\" fill=\"currentColor\"/>\n</svg>\n        " | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"12\" cy=\"12\" r=\"9\" fill=\"black\" fill-opacity=\"0.1\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12ZM7.29289 16.7071C6.90237 16.3166 6.90237 15.6834 7.29289 15.2929L10.5858 12L7.29289 8.70711C6.90237 8.31658 6.90237 7.68342 7.29289 7.29289C7.68342 6.90237 8.31658 6.90237 8.70711 7.29289L12 10.5858L15.2929 7.29289C15.6834 6.90237 16.3166 6.90237 16.7071 7.29289C17.0976 7.68342 17.0976 8.31658 16.7071 8.70711L13.4142 12L16.7071 15.2929C17.0976 15.6834 17.0976 16.3166 16.7071 16.7071C16.3166 17.0976 15.6834 17.0976 15.2929 16.7071L12 13.4142L8.70711 16.7071C8.31658 17.0976 7.68342 17.0976 7.29289 16.7071Z\" fill=\"currentColor\"/>\n</svg>\n        " | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"12\" cy=\"12\" r=\"9\" fill=\"black\" fill-opacity=\"0.1\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.9138 8.08736C16.1416 8.31516 16.1416 8.68451 15.9138 8.91232L8.9138 15.9123C8.68599 16.1401 8.31664 16.1401 8.08884 15.9123C7.86103 15.6845 7.86103 15.3152 8.08884 15.0874L15.0889 8.08736C15.3167 7.85955 15.686 7.85955 15.9138 8.08736Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.08882 8.08736C7.86102 8.31516 7.86102 8.68451 8.08882 8.91232L15.0888 15.9123C15.3166 16.1401 15.686 16.1401 15.9138 15.9123C16.1416 15.6845 16.1416 15.3152 15.9138 15.0874L8.91378 8.08736C8.68598 7.85955 8.31663 7.85955 8.08882 8.08736Z\" fill=\"currentColor\"/>\n</svg>\n        " | "\n<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"12\" cy=\"12\" r=\"9\" fill=\"black\" fill-opacity=\"0.1\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15.705 8.29392C15.8189 8.40783 15.8189 8.5925 15.705 8.7064L8.70495 15.7064C8.59105 15.8203 8.40638 15.8203 8.29247 15.7064C8.17857 15.5925 8.17857 15.4078 8.29247 15.2939L15.2925 8.29392C15.4064 8.18002 15.5911 8.18002 15.705 8.29392Z\" fill=\"currentColor\"/>\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M8.29246 8.29392C8.17856 8.40783 8.17856 8.5925 8.29246 8.7064L15.2925 15.7064C15.4064 15.8203 15.5911 15.8203 15.705 15.7064C15.8189 15.5925 15.8189 15.4078 15.705 15.2939L8.70494 8.29392C8.59104 8.18002 8.40636 8.18002 8.29246 8.29392Z\" fill=\"currentColor\"/>\n</svg>\n        ";
+    addCloseIconEventListener(): void;
+}
+import BaseLayout from "./BaseLayout";

package/layouts/LayoutWithCloseIcon.js

@@ -0,0 +1 @@
+import BaseLayout from"./BaseLayout";import DocumentConnectorEventType from"../DocumentConnectorEventType";import ComponentLifeCycleContainerType from"@claspo/renderer/sdk/ComponentLifeCycleContainerType";import SysRouterEvent from"@claspo/renderer/RouterEvent";import{WidgetHorizontalPosition}from"./PositionConstants";import insertHtmlIntoElement from"@claspo/common/dom/insertHtmlIntoElement";export default class LayoutWithCloseIcon extends BaseLayout{disconnect(e){var l;null===(l=this.closeIconNavigationEndListener)||void 0===l||l.off()}getDefaultCloseIconParams(){const e={verticalOffset:"-42px",horizontalOffset:"-42px",width:"34px",height:"34px",content:"0",defaultIcon:!0,color:"rgb(255, 255, 255)"};return{desktop:e,mobile:Object.assign(Object.assign({},e),{verticalOffset:"-37px",horizontalOffset:"0px"})}}applyCloseIconParams(e,l,n){if(e&&!l)return void(e.style.display="none");if(!e||!l)return;const t=this.params.entryModuleType===ComponentLifeCycleContainerType.STATIC;this.setCloseIconVisibility(e,l,this.getCurrentViewIndex()),t&&(this.closeIconNavigationEndListener=this.eventEmitter.on(SysRouterEvent.NAVIGATION_END,()=>{this.setCloseIconVisibility(e,l,this.getCurrentViewIndex())}));const o=n?l.mobile:l.desktop;if(e.style.width=o.width,e.style.height=o.height,e.style.top=o.verticalOffset,o.horizontalPosition&&o.horizontalPosition!==WidgetHorizontalPosition.RIGHT?(e.style.left=o.horizontalOffset,e.style.right=""):(e.style.right=o.horizontalOffset,e.style.left=""),o.inlineSvg||o.defaultIcon){e.style.color=o.color,insertHtmlIntoElement({element:e,html:this.getInlineSvg(o.content)});const l=e.firstElementChild;l.style.width="100%",l.style.height="100%"}else{e.style.color="",insertHtmlIntoElement({element:e,html:""});const l=document.createElement("img");l.src=o.content,l.style.width="100%",e.appendChild(l)}}setCloseIconVisibility(e,l,n){var t;const o="block",i="none";if("boolean"==typeof l.enabled&&!l.enabled)return void(e.style.display=i);if(!l.showOnViews)return void(e.style.display=o);const r=null===(t=this.getDocumentModel().views[n])||void 0===t?void 0:t.id;e.style.display=r?l.showOnViews.includes(r)?o:i:o}getInlineSvg(e){const l=Number.parseInt(e,10);if(Number.isNaN(l))return"";switch(l){case 0:return'\n          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.7071 9.70662L9.70711 15.7066L8.29289 14.2924L14.2929 8.2924L15.7071 9.70662Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.29289 9.70711L14.2929 15.7071L15.7071 14.2929L9.70711 8.29289L8.29289 9.70711Z" fill="currentColor"/>\n</svg>\n';case 1:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M18.9916 5.34171C19.4472 5.79732 19.4472 6.53602 18.9916 6.99163L6.99163 18.9916C6.53602 19.4472 5.79732 19.4472 5.34171 18.9916C4.8861 18.536 4.8861 17.7973 5.34171 17.3417L17.3417 5.34171C17.7973 4.8861 18.536 4.8861 18.9916 5.34171Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M5.34171 5.34171C4.8861 5.79732 4.8861 6.53602 5.34171 6.99163L17.3417 18.9916C17.7973 19.4472 18.536 19.4472 18.9916 18.9916C19.4472 18.536 19.4472 17.7973 18.9916 17.3417L6.99163 5.34171C6.53602 4.8861 5.79732 4.8861 5.34171 5.34171Z" fill="currentColor"/>\n</svg>\n';case 2:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5 3C6.80558 3 3 6.80558 3 11.5C3 16.1944 6.80558 20 11.5 20C16.1944 20 20 16.1944 20 11.5C20 6.80558 16.1944 3 11.5 3ZM2 11.5C2 6.25329 6.25329 2 11.5 2C16.7467 2 21 6.25329 21 11.5C21 16.7467 16.7467 21 11.5 21C6.25329 21 2 16.7467 2 11.5Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M14.8536 8.85319L8.85355 14.8532L8.14645 14.1461L14.1464 8.14608L14.8536 8.85319Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.14645 8.85355L14.1464 14.8536L14.8536 14.1464L8.85355 8.14645L8.14645 8.85355Z" fill="currentColor"/>\n</svg>\n';case 3:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M17.8648 6.13518C18.0451 6.31542 18.0451 6.60765 17.8648 6.7879L6.78792 17.8648C6.60768 18.0451 6.31545 18.0451 6.13521 17.8648C5.95496 17.6846 5.95496 17.3923 6.13521 17.2121L17.2121 6.13518C17.3923 5.95494 17.6846 5.95494 17.8648 6.13518Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M6.13518 6.13518C5.95494 6.31542 5.95494 6.60765 6.13518 6.7879L17.2121 17.8648C17.3923 18.0451 17.6846 18.0451 17.8648 17.8648C18.045 17.6846 18.045 17.3923 17.8648 17.2121L6.78789 6.13518C6.60765 5.95494 6.31542 5.95494 6.13518 6.13518Z" fill="currentColor"/>\n</svg>\n';case 4:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12ZM7.29289 16.7071C6.90237 16.3166 6.90237 15.6834 7.29289 15.2929L10.5858 12L7.29289 8.70711C6.90237 8.31658 6.90237 7.68342 7.29289 7.29289C7.68342 6.90237 8.31658 6.90237 8.70711 7.29289L12 10.5858L15.2929 7.29289C15.6834 6.90237 16.3166 6.90237 16.7071 7.29289C17.0976 7.68342 17.0976 8.31658 16.7071 8.70711L13.4142 12L16.7071 15.2929C17.0976 15.6834 17.0976 16.3166 16.7071 16.7071C16.3166 17.0976 15.6834 17.0976 15.2929 16.7071L12 13.4142L8.70711 16.7071C8.31658 17.0976 7.68342 17.0976 7.29289 16.7071Z" fill="currentColor"/>\n</svg>\n';case 5:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="12" cy="12" r="10" fill="black" fill-opacity="0.1"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.7071 9.70662L9.70711 15.7066L8.29289 14.2924L14.2929 8.2924L15.7071 9.70662Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.29289 9.70711L14.2929 15.7071L15.7071 14.2929L9.70711 8.29289L8.29289 9.70711Z" fill="currentColor"/>\n</svg>\n';case 6:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="12" cy="12" r="9" fill="black" fill-opacity="0.1"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM2.5 12C2.5 6.75329 6.75329 2.5 12 2.5C17.2467 2.5 21.5 6.75329 21.5 12C21.5 17.2467 17.2467 21.5 12 21.5C6.75329 21.5 2.5 17.2467 2.5 12Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.3536 9.35306L9.35355 15.3531L8.64645 14.646L14.6464 8.64596L15.3536 9.35306Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.64645 9.35355L14.6464 15.3536L15.3536 14.6464L9.35355 8.64645L8.64645 9.35355Z" fill="currentColor"/>\n</svg>\n        ';case 7:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="12" cy="12" r="9" fill="black" fill-opacity="0.1"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12ZM7.29289 16.7071C6.90237 16.3166 6.90237 15.6834 7.29289 15.2929L10.5858 12L7.29289 8.70711C6.90237 8.31658 6.90237 7.68342 7.29289 7.29289C7.68342 6.90237 8.31658 6.90237 8.70711 7.29289L12 10.5858L15.2929 7.29289C15.6834 6.90237 16.3166 6.90237 16.7071 7.29289C17.0976 7.68342 17.0976 8.31658 16.7071 8.70711L13.4142 12L16.7071 15.2929C17.0976 15.6834 17.0976 16.3166 16.7071 16.7071C16.3166 17.0976 15.6834 17.0976 15.2929 16.7071L12 13.4142L8.70711 16.7071C8.31658 17.0976 7.68342 17.0976 7.29289 16.7071Z" fill="currentColor"/>\n</svg>\n        ';case 8:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="12" cy="12" r="9" fill="black" fill-opacity="0.1"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.9138 8.08736C16.1416 8.31516 16.1416 8.68451 15.9138 8.91232L8.9138 15.9123C8.68599 16.1401 8.31664 16.1401 8.08884 15.9123C7.86103 15.6845 7.86103 15.3152 8.08884 15.0874L15.0889 8.08736C15.3167 7.85955 15.686 7.85955 15.9138 8.08736Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.08882 8.08736C7.86102 8.31516 7.86102 8.68451 8.08882 8.91232L15.0888 15.9123C15.3166 16.1401 15.686 16.1401 15.9138 15.9123C16.1416 15.6845 16.1416 15.3152 15.9138 15.0874L8.91378 8.08736C8.68598 7.85955 8.31663 7.85955 8.08882 8.08736Z" fill="currentColor"/>\n</svg>\n        ';case 9:return'\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="12" cy="12" r="9" fill="black" fill-opacity="0.1"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.705 8.29392C15.8189 8.40783 15.8189 8.5925 15.705 8.7064L8.70495 15.7064C8.59105 15.8203 8.40638 15.8203 8.29247 15.7064C8.17857 15.5925 8.17857 15.4078 8.29247 15.2939L15.2925 8.29392C15.4064 8.18002 15.5911 8.18002 15.705 8.29392Z" fill="currentColor"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.29246 8.29392C8.17856 8.40783 8.17856 8.5925 8.29246 8.7064L15.2925 15.7064C15.4064 15.8203 15.5911 15.8203 15.705 15.7064C15.8189 15.5925 15.8189 15.4078 15.705 15.2939L8.70494 8.29392C8.59104 8.18002 8.40636 8.18002 8.29246 8.29392Z" fill="currentColor"/>\n</svg>\n        ';default:return""}}addCloseIconEventListener(){this.closeIconElement.addEventListener("click",()=>{this.eventEmitter.emit(DocumentConnectorEventType.CLOSE_ICON_CLICKED,this.closeIconElement)})}}

package/layouts/PositionConstants.d.ts

@@ -0,0 +1,11 @@
+export namespace WidgetVerticalPosition {
+    const TOP: string;
+    const CENTER: string;
+    const BOTTOM: string;
+}
+export namespace WidgetHorizontalPosition {
+    export const LEFT: string;
+    const CENTER_1: string;
+    export { CENTER_1 as CENTER };
+    export const RIGHT: string;
+}

package/layouts/PositionConstants.js

@@ -0,0 +1 @@
+export const WidgetVerticalPosition={TOP:"TOP",CENTER:"CENTER",BOTTOM:"BOTTOM"};export const WidgetHorizontalPosition={LEFT:"LEFT",CENTER:"CENTER",RIGHT:"RIGHT"};

package/layouts/built-in/BuiltInLayout.d.ts

@@ -0,0 +1,7 @@
+export default class BuiltInLayout extends BaseLayout {
+    builtInElement: any;
+    connect(documentElement: any, containerElement: any, entryModule: any): any;
+    adjustBrandingPosition(): void;
+    disconnect(beforeDestroyCallback: any): void;
+}
+import BaseLayout from "../BaseLayout";

package/layouts/built-in/BuiltInLayout.js

@@ -0,0 +1 @@
+import BaseLayout from"../BaseLayout";import InsertType from"./InsertType";import InsertPositionMapper from"./InsertPositionMapper";import LayoutType from"@claspo/common/form/common/LayoutType";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import insertHtmlIntoElement from"@claspo/common/dom/insertHtmlIntoElement";export default class BuiltInLayout extends BaseLayout{constructor(e,t,n,i,s){super(e,t,n,i,s),this.builtInElement=null,this.params.config.branded&&this.createBrandingElement()}connect(e,t,n){let i;if(e.style.visibility="hidden",n.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{e.style.visibility="visible"}),this.params.placement?(i=(t=document.querySelector(this.params.placement.selector)).getRootNode(),e.setAttribute("cl-connector-root-element",LayoutType.BUILT_IN),this.params.config.formVariantId&&e.setAttribute("cl-widget-id",this.params.config.formVariantId),this.params.placement.insertType===InsertType.REPLACE?t.replaceWith(e):t.insertAdjacentElement(InsertPositionMapper.map(this.params.placement.insertType),e)):(i=t.getRootNode(),t.appendChild(e)),this.params.disabled){const t=document.createElement("style");insertHtmlIntoElement({element:t,html:this.getDisabledWidgetStyles('[class^="cl-widget"]')}),e.appendChild(t)}if(this.builtInElement=e,this.setConnectedElement(this.builtInElement),this.params.config.branded){const t=document.createElement("style");insertHtmlIntoElement({element:t,html:this.getBrandingStyles()}),this.adjustBrandingPosition(),e.appendChild(this.brandingElement),"VIEW"===e.getAttribute("cl-type")?(e.shadowRoot.appendChild(t),e.shadowRoot.appendChild(this.brandingElement)):(e.style.position="relative",e.appendChild(t),e.appendChild(this.brandingElement)),this.addBrandingElementListeners()}return this.addWidgetContentClickEventListener(i),this.builtInElement}adjustBrandingPosition(){this.brandingElement.style.position="absolute",this.brandingElement.style.bottom="10px",this.brandingElement.style.right="10px"}disconnect(e){null==e||e(),this.builtInElement&&this.builtInElement.remove()}}

package/layouts/built-in/InsertPositionMapper.d.ts

@@ -0,0 +1,3 @@
+export default class InsertPositionMapper {
+    static map(insertType: any): any;
+}

package/layouts/built-in/InsertPositionMapper.js

@@ -0,0 +1 @@
+import InsertType from"./InsertType";export default class InsertPositionMapper{static map(e){return InsertType.hasOwnProperty(e)?InsertType[e]:InsertType.AFTER_END}}

package/layouts/built-in/InsertType.d.ts

@@ -0,0 +1,8 @@
+export default InsertType;
+declare namespace InsertType {
+    const BEFORE_BEGIN: string;
+    const AFTER_BEGIN: string;
+    const BEFORE_END: string;
+    const AFTER_END: string;
+    const REPLACE: string;
+}

package/layouts/built-in/InsertType.js

@@ -0,0 +1 @@
+const InsertType={BEFORE_BEGIN:"beforebegin",AFTER_BEGIN:"afterbegin",BEFORE_END:"beforeend",AFTER_END:"afterend",REPLACE:"REPLACE"};export default InsertType;

package/layouts/content-locker/ContentLockerLayout.d.ts

@@ -0,0 +1,31 @@
+export default class ContentLockerLayout extends LayoutWithCloseIcon {
+    static contentLockerSelector: string;
+    static contentLockerContentSelector: string;
+    static contentLockerCloseIconSelector: string;
+    contentLockerRootElement: HTMLDivElement;
+    contentLockerElement: Element | null;
+    contentLockerContentElement: Element | null;
+    closeIconElement: HTMLDivElement | undefined;
+    adjustBrandingPosition(): void;
+    addBlurryBackdrop(container: any): () => void;
+    setCloseIconParams(isMobileEnv: any): void;
+    connect(documentElement: any, containerElement: any, entryModule: any): Element | null;
+    documentElement: any;
+    containerElement: any;
+    removeBlurryBackdrop: (() => void) | undefined;
+    sharedUpdateListener: any;
+    environmentUpdateListener: any;
+    navigationEndListener: any;
+    centerContentIfNeeded(viewIndex: any): void;
+    resetCustomContentSize(): void;
+    setCustomSizeForContent(viewHostStyles: any): void;
+    originalDocumentElementStyles: {
+        width: any;
+        minWidth: any;
+        height: any;
+        minHeight: any;
+    } | undefined;
+    updateScrollbar(isMobileEnv: any): void;
+    _getTemplate(params: any): string;
+}
+import LayoutWithCloseIcon from "../LayoutWithCloseIcon";

package/layouts/content-locker/ContentLockerLayout.js

@@ -0,0 +1 @@
+import LayoutType from"@claspo/common/form/common/LayoutType";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import LayoutWithCloseIcon from"../LayoutWithCloseIcon";import debounce from"@claspo/common/async/debounce";import SysRouterEvent from"@claspo/renderer/RouterEvent";import ComponentLifeCycleContainerType from"@claspo/renderer/sdk/ComponentLifeCycleContainerType";export default class ContentLockerLayout extends LayoutWithCloseIcon{constructor(e,t,n,o,i){var s,l;super(e,t,n,o,i),this.contentLockerRootElement=document.createElement("div"),this.contentLockerRootElement.insertAdjacentHTML("afterbegin",this._getTemplate(this.params)),this.contentLockerElement=this.contentLockerRootElement.querySelector(ContentLockerLayout.contentLockerSelector),this.contentLockerContentElement=this.contentLockerRootElement.querySelector(ContentLockerLayout.contentLockerContentSelector),this.contentLockerElement.setAttribute("cl-connector-root-element",LayoutType.CONTENT_LOCKER),this.params.config.formVariantId&&this.contentLockerElement.setAttribute("cl-widget-id",this.params.config.formVariantId),this.contentLockerElement.style.position=null!==(s=this.params.displayPosition)&&void 0!==s?s:"fixed",this.contentLockerElement.style.zIndex=String(null!==(l=this.params.zIndex)&&void 0!==l?l:Number.MAX_SAFE_INTEGER),this.getDocumentModel().shared.closeIcon&&(this.closeIconElement=document.createElement("div"),this.closeIconElement.classList.add("cl-content-locker-close-icon"),this.contentLockerContentElement.appendChild(this.closeIconElement),this.addCloseIconEventListener(),this.addWidgetContentClickEventListener(this.contentLockerElement.querySelector(ContentLockerLayout.contentLockerContentSelector)),this.setCloseIconParams(this.isMobileEnv())),this.params.config.branded&&(this.createBrandingElement(),this.adjustBrandingPosition(),this.contentLockerElement.appendChild(this.brandingElement),this.addBrandingElementListeners())}adjustBrandingPosition(){this.brandingElement.style.right="10px",this.brandingElement.style.bottom="10px"}addBlurryBackdrop(e){const t="backdropFilter",n="blur(20px)";e.style[t]=n;const o=new MutationObserver(o=>{o.forEach(o=>{var i;"attributes"===o.type&&"style"===o.attributeName&&((null===(i=e.style[t])||void 0===i?void 0:i.includes(n))||(e.style[t]=n))})});return o.observe(e,{attributes:!0,attributeFilter:["style"]}),()=>o.disconnect()}setCloseIconParams(e){const t=this.getDocumentModel().shared.closeIcon;this.applyCloseIconParams(this.closeIconElement,t,e)}connect(e,t,n){this.documentElement=e,this.containerElement=t,this.params.disableGlobalScroll&&document.body.classList.add("cl-noscroll"),this.removeBlurryBackdrop=this.addBlurryBackdrop(this.contentLockerElement),this.contentLockerContentElement.appendChild(e),t.appendChild(this.contentLockerElement),this.setConnectedElement(this.contentLockerElement),this.updateScrollbar(this.isMobileEnv()),this.contentLockerContentElement.style.visibility="hidden",n.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{this.contentLockerContentElement.style.visibility="visible"}),this.sharedUpdateListener=this.documentModel.on(DocumentModelUpdateType.SHARED_UPDATE_ALL,debounce(()=>{this.setCloseIconParams(this.isMobileEnv())},5)),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.ENVIRONMENT_UPDATE,debounce(e=>{this.setCloseIconParams(e.isMobileEnv),this.updateScrollbar(e.isMobileEnv),this.centerContentIfNeeded(this.getCurrentViewIndex())},5));const o=this.params.entryModuleType===ComponentLifeCycleContainerType.STATIC;return this.centerContentIfNeeded(this.getCurrentViewIndex()),o&&(this.navigationEndListener=this.eventEmitter.on(SysRouterEvent.NAVIGATION_END,()=>{this.centerContentIfNeeded(this.getCurrentViewIndex())})),this.contentLockerElement}disconnect(e){var t,n,o,i;super.disconnect(e),null==e||e(),this.params.disableGlobalScroll&&document.body.classList.remove("cl-noscroll"),null===(t=this.removeBlurryBackdrop)||void 0===t||t.call(this),this.contentLockerElement.remove(),null===(n=this.sharedUpdateListener)||void 0===n||n.off(),null===(o=this.environmentUpdateListener)||void 0===o||o.off(),null===(i=this.navigationEndListener)||void 0===i||i.off()}centerContentIfNeeded(e){const t=this.getDocumentModel().views[e],n=this.isMobileEnv()?t.props.adaptiveStyles.mobile[0].styleAttributes:t.props.adaptiveStyles.desktop[0].styleAttributes;"100%"===n.width&&"100%"===n.height?this.resetCustomContentSize():this.setCustomSizeForContent(n)}resetCustomContentSize(){this.originalDocumentElementStyles&&(this.documentElement.style.width=this.originalDocumentElementStyles.width,this.documentElement.style.minWidth=this.originalDocumentElementStyles.minWidth,this.documentElement.style.height=this.originalDocumentElementStyles.height,this.documentElement.style.minHeight=this.originalDocumentElementStyles.minHeight),this.contentLockerElement.style.display="",this.contentLockerElement.style.justifyContent="",this.contentLockerElement.style.alignItems="",this.contentLockerContentElement.style.width="100%",this.contentLockerContentElement.style.minWidth="",this.contentLockerContentElement.style.height="100%",this.contentLockerContentElement.style.minHeight=""}setCustomSizeForContent(e){this.originalDocumentElementStyles={width:this.documentElement.style.width,minWidth:this.documentElement.style.minWidth,height:this.documentElement.style.height,minHeight:this.documentElement.style.minHeight},this.documentElement.style.width=e.width,this.documentElement.style.minWidth=e.minWidth,this.documentElement.style.height=e.height,this.documentElement.style.minHeight=e.minHeight,this.contentLockerElement.style.display="flex",this.contentLockerElement.style.justifyContent="center",this.contentLockerElement.style.alignItems="center",this.contentLockerContentElement.style.width=e.width,this.contentLockerContentElement.style.minWidth=e.minWidth,this.contentLockerContentElement.style.height=e.height,this.contentLockerContentElement.style.minHeight=e.minHeight}updateScrollbar(e){if(this.params.disableScrollbarCalculation)return;const t=this.getViewContentContainer();if(!t||!this.getDocumentModel().shared.actualSize)return;const n=this.getActualSizeByEnv(e);if(!n)return;const o=this.getContainerElementHeight();o>parseFloat(n.height)||(t.style.overflowY="auto",t.style.overflowX="hidden",t.style.minHeight=`${o}px`,this.changeViewAlignToTop())}_getTemplate(e){return`\n      <div class="cl-content-locker">\n        <style>\n        .cl-content-locker {\n          display: block;\n          top: 0;\n          left: 0;\n          bottom: 0;\n          right: 0;\n          width: 100%;\n          height: 100%;\n        }\n\n        ${e.disabled?this.getDisabledWidgetStyles(ContentLockerLayout.contentLockerSelector):""}\n\n        .cl-content-locker-content {\n            width: 100%;\n            height: 100%;\n            min-height: fit-content;\n        }\n\n        .cl-noscroll {\n          overflow: hidden !important;\n        }\n\n        .cl-content-locker-close-icon {\n          z-index: 99;\n          position: absolute;\n          cursor: pointer;\n        }\n\n        ${this.getBrandingStyles()}\n\n        </style>\n\n          <div class="cl-content-locker-content"></div>\n      </div>`}}ContentLockerLayout.contentLockerSelector=".cl-content-locker",ContentLockerLayout.contentLockerContentSelector=".cl-content-locker-content",ContentLockerLayout.contentLockerCloseIconSelector=".cl-content-locker-close-icon";

package/layouts/detached/DialogLayout.d.ts

@@ -0,0 +1,33 @@
+export default class DialogLayout extends LayoutWithCloseIcon {
+    static dialogSelector: string;
+    static dialogContentWrapperSelector: string;
+    static dialogContentSelector: string;
+    static dialogCloseIconSelector: string;
+    entryAndDestroyAnimationDurationInSeconds: number;
+    widgetIsShown: boolean;
+    zIndex: any;
+    migratedDocumentModel: any;
+    dialogRootElement: HTMLDivElement;
+    dialogElement: Element | null;
+    closeIconElement: Element | null;
+    boundEscapeListener: (event: any) => void;
+    adjustBrandingPosition(): void;
+    migrateDocumentModel(documentModel: any): any;
+    migrateDialogParams(documentModel: any): any;
+    migrateCloseIconParams(documentModel: any): any;
+    addBackDropClickEventListener(): void;
+    setCloseIconParams(isMobileEnv: any): void;
+    connect(documentElement: any, containerElement: any, entryModule: any): Element | null;
+    documentElement: any;
+    containerElement: any;
+    sharedUpdateListener: any;
+    environmentUpdateListener: any;
+    updateScrollbar(isMobileEnv: any): void;
+    escapeListenerCallback(event: any): void;
+    showDialog(): void;
+    _extendContainerOuterSizeToFitInnerContentShadows(container: any): void;
+    getOtherStyles(): string;
+    _getTemplate(params: any): string;
+    getEntryAndDestroyAnimations(): string;
+}
+import LayoutWithCloseIcon from "../LayoutWithCloseIcon";

package/layouts/detached/DialogLayout.js

@@ -0,0 +1 @@
+import LayoutWithCloseIcon from"../LayoutWithCloseIcon";import DocumentConnectorEventType from"../../DocumentConnectorEventType";import LayoutType from"@claspo/common/form/common/LayoutType";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import debounce from"@claspo/common/async/debounce";export default class DialogLayout extends LayoutWithCloseIcon{constructor(e,t,n,o,i){var s;super(e,t,n,o,i),this.entryAndDestroyAnimationDurationInSeconds=.3,this.widgetIsShown=!1,this.zIndex=this.params.zIndex,this.migratedDocumentModel=this.migrateDocumentModel(super.getDocumentModel()),this.dialogRootElement=document.createElement("div"),this.dialogRootElement.insertAdjacentHTML("afterbegin",this._getTemplate(this.params)),this.dialogElement=this.dialogRootElement.querySelector(DialogLayout.dialogSelector),this.dialogElement.style.background=this.getDocumentModel().shared.dialog.background,this.dialogElement.style.zIndex=this.zIndex,this.dialogElement.setAttribute("cl-connector-root-element",LayoutType.DETACHED),this.params.config.formVariantId&&this.dialogElement.setAttribute("cl-widget-id",this.params.config.formVariantId),this.dialogElement.style.position=null!==(s=this.params.displayPosition)&&void 0!==s?s:"fixed",this.closeIconElement=this.dialogElement.querySelector(DialogLayout.dialogCloseIconSelector),this.addBackDropClickEventListener(),this.addCloseIconEventListener(),this.addWidgetContentClickEventListener(this.dialogRootElement.querySelector(DialogLayout.dialogContentSelector)),this.setCloseIconParams(this.isMobileEnv()),this.params.config.branded&&(this.createBrandingElement(),this.adjustBrandingPosition(),this.dialogElement.querySelector(DialogLayout.dialogContentWrapperSelector).appendChild(this.brandingElement),this.addBrandingElementListeners()),this.boundEscapeListener=this.escapeListenerCallback.bind(this),window.addEventListener("keyup",this.boundEscapeListener)}adjustBrandingPosition(){this.brandingElement.style.position="relative",this.brandingElement.style.marginTop="10px"}getDocumentModel(){return this.migratedDocumentModel||super.getDocumentModel()}migrateDocumentModel(e){return e=this.migrateDialogParams(e),e=this.migrateCloseIconParams(e)}migrateDialogParams(e){return e.shared.dialog?e:Object.assign(Object.assign({},e),{shared:Object.assign(Object.assign({},e.shared),{dialog:{background:"rgba(0, 0, 0, 0.7)"}})})}migrateCloseIconParams(e){if(e.shared.closeIcon)return e;const t=this.getDefaultCloseIconParams();return Object.assign(Object.assign({},e),{shared:Object.assign(Object.assign({},e.shared),{closeIcon:{desktop:t.desktop,mobile:t.mobile}})})}addBackDropClickEventListener(){this.dialogElement.addEventListener("click",e=>{const t="cl-widget-id";e.target!==this.dialogElement||document.activeElement&&document.activeElement.closest(`[${t}=${this.dialogElement.getAttribute(t)}]`)===this.dialogElement||this.eventEmitter.emit(DocumentConnectorEventType.CLOSE_WIDGET)})}setCloseIconParams(e){const t=this.getDocumentModel().shared.closeIcon;this.applyCloseIconParams(this.closeIconElement,t,e)}connect(e,t,n){this.dialogElement.style.visibility="hidden",n.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{this.showDialog()}),this.documentElement=e,this.containerElement=t,this.params.disableGlobalScroll&&document.body.classList.add("cl-noscroll");return this.dialogRootElement.querySelector(DialogLayout.dialogContentSelector).appendChild(e),t.appendChild(this.dialogElement),this.setConnectedElement(this.dialogElement),this.updateScrollbar(this.isMobileEnv()),this.sharedUpdateListener=this.documentModel.on(DocumentModelUpdateType.SHARED_UPDATE_ALL,debounce(()=>{this.migratedDocumentModel=this.migrateDocumentModel(super.getDocumentModel()),this.setCloseIconParams(this.isMobileEnv())},5)),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.ENVIRONMENT_UPDATE,debounce(e=>{this.setCloseIconParams(e.isMobileEnv),this.updateScrollbar(e.isMobileEnv)},5)),this.dialogElement}disconnect(e){super.disconnect(e),window.removeEventListener("keyup",this.boundEscapeListener);const t=()=>{var t,n;null==e||e(),this.dialogElement.remove(),null===(t=this.sharedUpdateListener)||void 0===t||t.off(),null===(n=this.environmentUpdateListener)||void 0===n||n.off()};if(this.params.disableLayoutAnimations)return void t();const n=this.dialogElement.querySelector(DialogLayout.dialogContentWrapperSelector);this.dialogElement.style.animation=`fadeInDialog ${this.entryAndDestroyAnimationDurationInSeconds}s ease-in-out reverse`,n.style.animation=`zoomInContent ${this.entryAndDestroyAnimationDurationInSeconds}s ease-in-out reverse`,setTimeout(()=>{this.params.disableGlobalScroll&&document.body.classList.remove("cl-noscroll"),t()},1e3*this.entryAndDestroyAnimationDurationInSeconds-50)}updateScrollbar(e){if(this.params.disableScrollbarCalculation)return;const t=this.getViewContentContainer();if(!t)return;const n=this.getActualSizeByEnv(e);if(!n)return;const o=.9*this.getContainerElementHeight();o>parseFloat(n.height)||(t.style.overflowY="auto",t.style.overflowX="hidden",this._extendContainerOuterSizeToFitInnerContentShadows(t),this.dialogElement.querySelector(DialogLayout.dialogContentWrapperSelector).style.maxHeight=`${o}px`,this.dialogElement.style.overflowY="auto",this.dialogElement.style.overflowX="hidden",this.changeViewAlignToTop())}escapeListenerCallback(e){"Escape"===e.key&&this.eventEmitter.emit(DocumentConnectorEventType.CLOSE_WIDGET)}showDialog(){if(this.widgetIsShown)return;this.widgetIsShown=!0;!this.params.disableEntryAnimation&&!this.params.disableLayoutAnimations?setTimeout(()=>{this.dialogElement.style.visibility="visible";const e=this.dialogElement.querySelector(DialogLayout.dialogContentWrapperSelector);this.dialogElement.style.animation=`fadeInDialog ${this.entryAndDestroyAnimationDurationInSeconds}s ease-in-out forwards`,e.style.animation=`zoomInContent ${this.entryAndDestroyAnimationDurationInSeconds}s ease-in-out forwards`,setTimeout(()=>{this.dialogElement.style.animation="",e.style.animation=""},1e3*this.entryAndDestroyAnimationDurationInSeconds)},50):this.dialogElement.style.visibility="visible"}_extendContainerOuterSizeToFitInnerContentShadows(e){e.style.width="calc(100% + 40px)",e.style.margin="-20px",e.style.padding="20px"}getOtherStyles(){return""}_getTemplate(e){return`\n<div class="cl-dialog">\n  <style>\n  .cl-dialog {\n    top: 0;\n    left: 0;\n    right: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    box-sizing: border-box;\n  }\n\n  ${e.disabled?this.getDisabledWidgetStyles(DialogLayout.dialogSelector):""}\n\n  .cl-dialog-inner-content-wrapper {\n     display: flex;\n     flex-direction: column;\n     align-items: end;\n  }\n  \n  .cl-dialog-inner-content {\n     position: relative;\n     max-width: 100vw;\n  }\n\n  .cl-dialog-close-icon {\n    z-index: 99;\n    position: absolute;\n    cursor: pointer;\n  }\n\n  ${this.getBrandingStyles()}\n\n  ${this.getOtherStyles()}\n  \n  ${this.getEntryAndDestroyAnimations()}\n  </style>\n\n  <div class="cl-dialog-inner-content-wrapper">\n    <div class="cl-dialog-inner-content">\n      <div class="cl-dialog-close-icon"></div>\n      <div class="cl-dialog-content"></div>\n    </div>\n  </div>\n</div>\n`}getEntryAndDestroyAnimations(){return"\n@keyframes fadeInDialog {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@keyframes zoomInContent {\n  0% {\n    transform: scale(0.5);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n    "}}DialogLayout.dialogSelector=".cl-dialog",DialogLayout.dialogContentWrapperSelector=".cl-dialog-inner-content-wrapper",DialogLayout.dialogContentSelector=".cl-dialog-content",DialogLayout.dialogCloseIconSelector=".cl-dialog-close-icon";

package/layouts/floating-bar/FloatingBarLayout.d.ts

@@ -0,0 +1,39 @@
+export default class FloatingBarLayout extends LayoutWithCloseIcon {
+    static floatingBarSelector: string;
+    static floatingBarContentSelector: string;
+    static floatingBarCloseIconSelector: string;
+    entryAndDestroyAnimationDurationInSeconds: number;
+    zIndex: any;
+    floatingBarRootElement: HTMLDivElement;
+    floatingBarElement: Element | null;
+    closeIconElement: Element | null;
+    getSharedParams(): any;
+    isBottomPosition(params: any): boolean;
+    adjustBrandingPosition(isMobileEnv: any): void;
+    clearPosition(): void;
+    restoreHtmlBodyStyles(): void;
+    setTopPosition(params: any): void;
+    setBottomPosition(params: any): void;
+    setPosition(isMobileEnv: any): {
+        isBottomPosition: true;
+    } | {
+        isBottomPosition: false;
+    };
+    getOtherStyles(): string;
+    _setTopPosition(isMobileEnv: any, params: any): void;
+    modifiedFloatingElement: any;
+    modifiedHtmlBodyElement: any;
+    originalModifiedFloatingElementTop: string | undefined;
+    originalHtmlBodyElementMarginTop: string | undefined;
+    _getElementAtTheTopOfTheViewport(htmlDocumentObject: any): any;
+    _findFloatingElement(topElement: any): any;
+    setCloseIconParams(isMobileEnv: any): void;
+    connect(documentElement: any, containerElement: any, entryModule: any): Element | null;
+    containerElement: any;
+    sharedUpdateListener: any;
+    environmentUpdateListener: any;
+    _getTemplate(params: any): string;
+    playEntryAnimation(isBottomPosition: any): void;
+    getEntryAndDestroyAnimations(): string;
+}
+import LayoutWithCloseIcon from "../LayoutWithCloseIcon";

package/layouts/floating-bar/FloatingBarLayout.js

@@ -0,0 +1 @@
+import LayoutWithCloseIcon from"../LayoutWithCloseIcon";import LayoutType from"@claspo/common/form/common/LayoutType";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import{WidgetVerticalPosition}from"../PositionConstants";import debounce from"@claspo/common/async/debounce";export default class FloatingBarLayout extends LayoutWithCloseIcon{constructor(t,e,n,i,o){super(t,e,n,i,o),this.entryAndDestroyAnimationDurationInSeconds=.3,this.zIndex=this.params.zIndex,this.floatingBarRootElement=document.createElement("div"),this.floatingBarRootElement.insertAdjacentHTML("afterbegin",this._getTemplate(this.params)),this.floatingBarElement=this.floatingBarRootElement.querySelector(FloatingBarLayout.floatingBarSelector),this.floatingBarElement.setAttribute("cl-connector-root-element",LayoutType.FLOATING_BAR),this.params.config.formVariantId&&this.floatingBarElement.setAttribute("cl-widget-id",this.params.config.formVariantId);const s=this.isMobileEnv();this.closeIconElement=this.floatingBarElement.querySelector(FloatingBarLayout.floatingBarCloseIconSelector),this.addCloseIconEventListener(),this.addWidgetContentClickEventListener(this.floatingBarRootElement.querySelector(FloatingBarLayout.floatingBarContentSelector)),this.setCloseIconParams(s),this.params.config.branded&&(this.createBrandingElement(),this.adjustBrandingPosition(s),this.floatingBarElement.appendChild(this.brandingElement),this.addBrandingElementListeners())}getSharedParams(){return this.getDocumentModel().shared.floatingBar}isBottomPosition(t){return t.verticalPosition===WidgetVerticalPosition.BOTTOM}adjustBrandingPosition(t){const e=this.getSharedParams(),n=t?e.mobile:e.desktop;this.brandingElement.style.right="10px",this.brandingElement.style.zIndex="2",this.isBottomPosition(n)?this.brandingElement.style.top="-30px":this.brandingElement.style.bottom="-30px"}clearPosition(){var t;this.floatingBarElement.removeAttribute("style"),this.floatingBarElement.style.zIndex=this.zIndex,this.floatingBarElement.style.position=null!==(t=this.params.displayPosition)&&void 0!==t?t:"fixed",this.modifiedFloatingElement&&(this.modifiedFloatingElement.style.top=this.originalModifiedFloatingElementTop)}restoreHtmlBodyStyles(){this.modifiedHtmlBodyElement&&this.originalHtmlBodyElementMarginTop&&(this.modifiedHtmlBodyElement.style.marginTop=this.originalHtmlBodyElementMarginTop)}setTopPosition(t){this.floatingBarElement.style.left="0px",this.floatingBarElement.style.top="0px"}setBottomPosition(t){this.floatingBarElement.style.left="0px",this.floatingBarElement.style.bottom="0px"}setPosition(t){this.clearPosition(),this.restoreHtmlBodyStyles();const e=this.getSharedParams(),n=t?e.mobile:e.desktop,i=this.isBottomPosition(n);return i?(this.setBottomPosition(n),{isBottomPosition:i}):(this._setTopPosition(t,n),{isBottomPosition:i})}getOtherStyles(){return""}_setTopPosition(t,e){if(this.modifiedFloatingElement=null,this.modifiedHtmlBodyElement=null,"body"!==this.containerElement.tagName.toLowerCase()||!this.getDocumentModel().shared.actualSize||this.params.disableSmartPosition)return void this.setTopPosition(e);const n=this.getActualSizeByEnv(t);if(!n)return void this.setTopPosition(e);const i=n.height,o=this.containerElement.getRootNode(),s=this._getElementAtTheTopOfTheViewport(o);if(s){const t=this._findFloatingElement(s);t&&(this.modifiedFloatingElement=t,this.originalModifiedFloatingElementTop=getComputedStyle(t).top,t.style.top=i)}this.modifiedHtmlBodyElement=o.body,this.originalHtmlBodyElementMarginTop=getComputedStyle(this.modifiedHtmlBodyElement).marginTop,this.modifiedHtmlBodyElement.style.marginTop=i,this.setTopPosition(e)}_getElementAtTheTopOfTheViewport(t){const e=this.getViewportWidth(t,t.defaultView||t.parentWindow)/2,n=t.elementFromPoint(e,0);return n!==t.body?n:t.elementFromPoint(e,50)}_findFloatingElement(t){let e=t,n=null;for(;e;){const t=getComputedStyle(e);if(!(e&&e.getAttribute("cl-connector-root-element"))&&"fixed"===t.position||"sticky"===t.position){n=e;break}e=e.parentElement}return n}setCloseIconParams(t){const e=this.getDocumentModel().shared.closeIcon;this.applyCloseIconParams(this.closeIconElement,e,t)}connect(t,e,n){this.containerElement=e,this.floatingBarRootElement.querySelector(FloatingBarLayout.floatingBarContentSelector).appendChild(t),e.appendChild(this.floatingBarElement),this.setConnectedElement(this.floatingBarElement);const{isBottomPosition:i}=this.setPosition(this.isMobileEnv());return this.floatingBarElement.style.visibility="hidden",n.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{this.floatingBarElement.style.visibility="visible",this.playEntryAnimation(i)}),this.sharedUpdateListener=this.documentModel.on(DocumentModelUpdateType.SHARED_UPDATE_ALL,debounce(()=>{const t=this.isMobileEnv();this.setPosition(t),this.setCloseIconParams(t)},5)),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.ENVIRONMENT_UPDATE,debounce(t=>{this.setPosition(t.isMobileEnv),this.setCloseIconParams(t.isMobileEnv)},5)),this.floatingBarElement}disconnect(t){super.disconnect(t);const e=()=>{var e,n;null==t||t(),this.clearPosition(),this.floatingBarElement.remove(),null===(e=this.sharedUpdateListener)||void 0===e||e.off(),null===(n=this.environmentUpdateListener)||void 0===n||n.off()};if(this.restoreHtmlBodyStyles(),this.params.disableLayoutAnimations)return void e();const n=this.getSharedParams(),i=this.isMobileEnv()?n.mobile:n.desktop,o=this.isBottomPosition(i)?"slideInBottom":"slideInTop";this.floatingBarElement.style.animation=`${o} ${this.entryAndDestroyAnimationDurationInSeconds}s ease-out reverse`,setTimeout(()=>{e()},1e3*this.entryAndDestroyAnimationDurationInSeconds-50)}_getTemplate(t){return`\n      <div class="cl-floating-bar">\n        <style>\n        .cl-floating-bar {\n          width: 100%;\n        }\n\n        ${t.disabled?this.getDisabledWidgetStyles(FloatingBarLayout.floatingBarSelector):""}\n\n        .cl-floating-bar-inner-content {\n           position: relative;\n           max-width: 100vw;\n           z-index: 1;\n        }\n\n        .cl-floating-bar-close-icon {\n          position: absolute;\n          cursor: pointer;\n          z-index: 99;\n        }\n\n      ${this.getOtherStyles()}\n\n       ${this.getBrandingStyles()}\n       \n       ${this.getEntryAndDestroyAnimations()}\n        </style>\n\n        <div class="cl-floating-bar-inner-content">\n          <div class="cl-floating-bar-close-icon"></div>\n          <div class="cl-floating-bar-content"></div>\n        </div>\n      </div>\n    `}playEntryAnimation(t){if(!this.params.disableEntryAnimation&&!this.params.disableLayoutAnimations){const e=t?"slideInBottom":"slideInTop";this.floatingBarElement.style.animation=`${e} ${this.entryAndDestroyAnimationDurationInSeconds}s ease-out forwards`,setTimeout(()=>{this.floatingBarElement.style.animation=""},1e3*this.entryAndDestroyAnimationDurationInSeconds)}}getEntryAndDestroyAnimations(){return"\n@keyframes slideInTop {\n  0% {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n    \n@keyframes slideInBottom {\n  0% {\n    opacity: 0;\n    transform: translateY(100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n    "}}FloatingBarLayout.floatingBarSelector=".cl-floating-bar",FloatingBarLayout.floatingBarContentSelector=".cl-floating-bar-content",FloatingBarLayout.floatingBarCloseIconSelector=".cl-floating-bar-close-icon";

package/layouts/floating-box/FloatingBoxLayout.d.ts

@@ -0,0 +1,40 @@
+export default class FloatingBoxLayout extends LayoutWithCloseIcon {
+    static floatingBoxSelector: string;
+    static floatingBoxContentSelector: string;
+    static floatingBoxCloseIconSelector: string;
+    static verticalCenterPositionRotationCss: string;
+    entryAndDestroyAnimationDurationInSeconds: number;
+    widgetIsShown: boolean;
+    zIndex: any;
+    migratedDocumentModel: any;
+    floatingBoxRootElement: HTMLDivElement;
+    floatingBoxElement: Element | null;
+    closeIconElement: Element | null;
+    adjustBrandingPosition(): void;
+    clearPosition(): void;
+    getMinVerticalOffset(): 0 | 32;
+    getVerticalOffset(isMobileEnv: any): any;
+    setPosition(isMobileEnv: any): void;
+    setTeaserPosition(params: any): void;
+    setRegularPosition(params: any): void;
+    setVerticalPositionFallback(): void;
+    setVerticalPositionNearScreenEdge(params: any): void;
+    getContainerHeight(): any;
+    setHorizontalPosition(params: any): void;
+    migrateDocumentModel(documentModel: any): any;
+    migrateMobilePosition(documentModel: any): any;
+    migrateCloseIconParams(documentModel: any): any;
+    setCloseIconParams(isMobileEnv: any): void;
+    connect(documentElement: any, containerElement: any, entryModule: any): Element | null;
+    documentElement: any;
+    containerElement: any;
+    sharedUpdateListener: any;
+    environmentUpdateListener: any;
+    _onZoomChange: () => void;
+    showFloatingBox(isMobileEnv: any): void;
+    getEntryAnimationName(isMobileEnv: any): "slideInBottom" | "slideInTop" | "slideInLeftTeaser" | "slideInLeftRegular" | "slideInRightTeaser" | "slideInRightRegular";
+    updateScrollbar(isMobileEnv: any): void;
+    _getTemplate(params: any): string;
+    getEntryAndDestroyAnimations(): string;
+}
+import LayoutWithCloseIcon from "../LayoutWithCloseIcon";

package/layouts/floating-box/FloatingBoxLayout.js

@@ -0,0 +1 @@
+import LayoutWithCloseIcon from"../LayoutWithCloseIcon";import LayoutType from"@claspo/common/form/common/LayoutType";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import{WidgetHorizontalPosition,WidgetVerticalPosition}from"../PositionConstants";import debounce from"@claspo/common/async/debounce";import WidgetType from"@claspo/common/form/common/WidgetType";export default class FloatingBoxLayout extends LayoutWithCloseIcon{constructor(t,e,o,i,n){super(t,e,o,i,n),this.entryAndDestroyAnimationDurationInSeconds=.3,this.widgetIsShown=!1,this._onZoomChange=()=>{this.setPosition(this.isMobileEnv()),this.setCloseIconParams(this.isMobileEnv())},this.zIndex=this.params.zIndex,this.migratedDocumentModel=this.migrateDocumentModel(super.getDocumentModel()),this.floatingBoxRootElement=document.createElement("div"),this.floatingBoxRootElement.insertAdjacentHTML("afterbegin",this._getTemplate(this.params)),this.floatingBoxElement=this.floatingBoxRootElement.querySelector(FloatingBoxLayout.floatingBoxSelector),this.floatingBoxElement.setAttribute("cl-connector-root-element",LayoutType.FLOATING_BOX),this.params.config.formVariantId&&this.floatingBoxElement.setAttribute("cl-widget-id",this.params.config.formVariantId),this.closeIconElement=this.floatingBoxElement.querySelector(FloatingBoxLayout.floatingBoxCloseIconSelector),this.addCloseIconEventListener(),this.addWidgetContentClickEventListener(this.floatingBoxRootElement.querySelector(FloatingBoxLayout.floatingBoxContentSelector)),this.setCloseIconParams(this.isMobileEnv()),this.params.config.branded&&(this.createBrandingElement(),this.adjustBrandingPosition(),this.floatingBoxElement.appendChild(this.brandingElement),this.addBrandingElementListeners())}adjustBrandingPosition(){this.brandingElement.style.bottom="-30px",this.brandingElement.style.right="0"}clearPosition(){var t;this.floatingBoxElement.removeAttribute("style"),this.floatingBoxElement.style.zIndex=this.zIndex,this.floatingBoxElement.style.position=null!==(t=this.params.displayPosition)&&void 0!==t?t:"fixed"}getMinVerticalOffset(){return this.params.config.branded?32:0}getVerticalOffset(t){const e=this.getDocumentModel().shared.floatingBox,o=t?e.mobile.verticalOffset:e.verticalOffset,i=this.getMinVerticalOffset();return parseFloat(o)<i?`${i}px`:o}setPosition(t){this.clearPosition();const e=this.getDocumentModel().shared.floatingBox,o=this.getActualSizeByEnv(t);let i=t?e.mobile.horizontalOffset:e.horizontalOffset;const n=t?e.mobile.verticalPosition:e.verticalPosition,s={horizontalPosition:t?e.mobile.horizontalPosition:e.horizontalPosition,verticalPosition:n,horizontalOffset:i,verticalOffset:this.getVerticalOffset(t),actualSizeByEnv:o};this.params.widgetType===WidgetType.TEASER?(this.setTeaserPosition(s),this.floatingBoxElement.style.cursor="pointer"):this.setRegularPosition(s)}setTeaserPosition(t){const{horizontalPosition:e,verticalPosition:o,actualSizeByEnv:i}=t;let n=t.horizontalOffset;if(o===WidgetVerticalPosition.CENTER&&e===WidgetHorizontalPosition.RIGHT&&i&&(n=`${parseFloat(i.height)+parseFloat(n)}px`),this.setHorizontalPosition(Object.assign(Object.assign({},t),{horizontalOffset:n})),o===WidgetVerticalPosition.CENTER)if(i&&this.containerElement){const t=parseFloat(i.width),o=this.getContainerHeight(),n=e===WidgetHorizontalPosition.LEFT?t/2:-t/2;this.floatingBoxElement.style.top=`${o/2+n}px`,this.floatingBoxElement.style.transform=FloatingBoxLayout.verticalCenterPositionRotationCss,this.floatingBoxElement.style.transformOrigin=e===WidgetHorizontalPosition.LEFT?"left top":"right top"}else this.setVerticalPositionFallback();else this.setVerticalPositionNearScreenEdge(t)}setRegularPosition(t){const{verticalPosition:e,actualSizeByEnv:o}=t;if(this.setHorizontalPosition(t),e===WidgetVerticalPosition.CENTER)if(o&&this.containerElement){const t=parseFloat(o.height),e=this.getContainerHeight();this.floatingBoxElement.style.top=e/2-t/2+"px"}else this.setVerticalPositionFallback();else this.setVerticalPositionNearScreenEdge(t)}setVerticalPositionFallback(){this.floatingBoxElement.style.bottom="20px"}setVerticalPositionNearScreenEdge(t){const{verticalPosition:e,verticalOffset:o}=t;this.floatingBoxElement.style[e.toLowerCase()]=o}getContainerHeight(){return"BODY"===this.containerElement.tagName?(this.containerElement.ownerDocument.defaultView||this.containerElement.ownerDocument.parentWindow).innerHeight:this.containerElement.clientHeight}setHorizontalPosition(t){const{horizontalPosition:e,horizontalOffset:o,actualSizeByEnv:i}=t;if(e===WidgetHorizontalPosition.CENTER)if(i&&this.containerElement){const t=parseFloat(i.width),e=this.containerElement.getBoundingClientRect().width;this.floatingBoxElement.style.left=e/2-t/2+"px"}else this.floatingBoxElement.style.left="20px";else this.floatingBoxElement.style[e.toLowerCase()]=o}migrateDocumentModel(t){return t=this.migrateCloseIconParams(t),t=this.migrateMobilePosition(t)}migrateMobilePosition(t){var e;if(null===(e=t.shared.floatingBox)||void 0===e?void 0:e.mobile)return t;const o={verticalPosition:WidgetVerticalPosition.BOTTOM,horizontalPosition:WidgetHorizontalPosition.LEFT,verticalOffset:this.getMinVerticalOffset(),horizontalOffset:"0px"};return Object.assign(Object.assign({},t),{shared:Object.assign(Object.assign({},t.shared),{floatingBox:Object.assign(Object.assign({},t.shared.floatingBox),{mobile:Object.assign({},o)})})})}migrateCloseIconParams(t){if(t.shared.closeIcon)return t;const e=this.getDefaultCloseIconParams();return Object.assign(Object.assign({},t),{shared:Object.assign(Object.assign({},t.shared),{closeIcon:Object.assign(Object.assign({},e),{desktop:Object.assign(Object.assign({},e.desktop),{color:"rgb(0, 0, 0)"}),mobile:Object.assign(Object.assign({},e.mobile),{color:"rgb(0, 0, 0)"})})})})}setCloseIconParams(t){const e=this.getDocumentModel().shared.closeIcon;this.applyCloseIconParams(this.closeIconElement,e,t)}connect(t,e,o){return this.documentElement=t,this.containerElement=e,this.floatingBoxRootElement.querySelector(FloatingBoxLayout.floatingBoxContentSelector).appendChild(t),e.appendChild(this.floatingBoxElement),this.setConnectedElement(this.floatingBoxElement),this.floatingBoxElement.style.visibility="hidden",o.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{setTimeout(()=>{const t=this.isMobileEnv();this.setPosition(t),this.showFloatingBox(t)})}),this.updateScrollbar(this.isMobileEnv()),this.sharedUpdateListener=this.documentModel.on(DocumentModelUpdateType.SHARED_UPDATE_ALL,debounce(()=>{this.migratedDocumentModel=this.migrateDocumentModel(super.getDocumentModel());const t=this.isMobileEnv();this.setPosition(t),this.setCloseIconParams(t)},5)),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.ENVIRONMENT_UPDATE,debounce(t=>{this.setPosition(t.isMobileEnv),this.setCloseIconParams(t.isMobileEnv),this.updateScrollbar(t.isMobileEnv)},5)),window.addEventListener("resize",this._onZoomChange),this.floatingBoxElement}disconnect(t){super.disconnect(t);const e=()=>{var e,o;null==t||t(),this.floatingBoxElement.remove(),null===(e=this.sharedUpdateListener)||void 0===e||e.off(),null===(o=this.environmentUpdateListener)||void 0===o||o.off(),window.removeEventListener("resize",this._onZoomChange)};if(this.params.disableLayoutAnimations)return void e();const o=this.getEntryAnimationName(this.isMobileEnv());this.floatingBoxElement.style.animation=`${o} ${this.entryAndDestroyAnimationDurationInSeconds}s ease-out reverse`,setTimeout(()=>{e()},1e3*this.entryAndDestroyAnimationDurationInSeconds-50)}getDocumentModel(){return this.migratedDocumentModel||super.getDocumentModel()}showFloatingBox(t){if(!this.widgetIsShown&&(this.widgetIsShown=!0,this.floatingBoxElement.style.visibility="visible",!this.params.disableEntryAnimation&&!this.params.disableLayoutAnimations)){const e=this.getEntryAnimationName(t);this.floatingBoxElement.style.animation=`${e} ${this.entryAndDestroyAnimationDurationInSeconds}s ease-out forwards`,setTimeout(()=>{this.floatingBoxElement.style.animation=""},1e3*this.entryAndDestroyAnimationDurationInSeconds)}}getEntryAnimationName(t){const e=this.getDocumentModel().shared.floatingBox,o=t?e.mobile.verticalPosition:e.verticalPosition,i=t?e.mobile.horizontalPosition:e.horizontalPosition,n=this.getActualSizeByEnv(t);return o===WidgetVerticalPosition.CENTER&&n&&this.containerElement?i===WidgetHorizontalPosition.LEFT?this.params.widgetType===WidgetType.TEASER?"slideInLeftTeaser":"slideInLeftRegular":this.params.widgetType===WidgetType.TEASER?"slideInRightTeaser":"slideInRightRegular":o===WidgetVerticalPosition.TOP?"slideInTop":"slideInBottom"}updateScrollbar(t){if(this.params.disableScrollbarCalculation)return;const e=this.getViewContentContainer();if(!e)return;const o=this.getActualSizeByEnv(t);if(!o)return;const i=parseFloat(this.closeIconElement.style.top),n=this.getVerticalOffset(t),s=parseFloat(n),a=this.getContainerElementHeight()-(i>0?0:Math.abs(i))-s;a>parseFloat(o.height)||(e.style.overflowY="auto",e.style.overflowX="hidden",e.style.maxHeight=`${a}px`,this.changeViewAlignToTop())}_getTemplate(t){return`\n<div class="cl-floating-box">\n  <style>\n  ${t.disabled?this.getDisabledWidgetStyles(FloatingBoxLayout.floatingBoxSelector):""}\n\n  .cl-floating-box-inner-content {\n     position: relative;\n     max-width: 100vw;\n     z-index: 1;\n  }\n\n  .cl-floating-box-close-icon {\n    position: absolute;\n    cursor: pointer;\n    z-index: 99;\n  }\n\n  ${this.getBrandingStyles()}\n\n  ${this.getEntryAndDestroyAnimations()}\n  </style>\n\n  <div class="cl-floating-box-inner-content">\n    <div class="cl-floating-box-close-icon"></div>\n    <div class="cl-floating-box-content"></div>\n  </div>\n</div>\n`}getEntryAndDestroyAnimations(){return`\n@keyframes slideInTop {\n  0% {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}    \n    \n@keyframes slideInBottom {\n  0% {\n    opacity: 0;\n    transform: translateY(100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes slideInLeftTeaser {\n  0% {\n    opacity: 0;\n    transform: translateX(-100%) ${FloatingBoxLayout.verticalCenterPositionRotationCss};\n    transform-origin: left top;\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0) ${FloatingBoxLayout.verticalCenterPositionRotationCss};\n    transform-origin: left top;\n  }\n}\n\n@keyframes slideInRightTeaser {\n  0% {\n    opacity: 0;\n    transform: translateX(100%) ${FloatingBoxLayout.verticalCenterPositionRotationCss};\n    transform-origin: right top;\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0) ${FloatingBoxLayout.verticalCenterPositionRotationCss};\n    transform-origin: right top;\n  }\n}\n\n@keyframes slideInLeftRegular {\n  0% {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n@keyframes slideInRightRegular {\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n    `}}FloatingBoxLayout.floatingBoxSelector=".cl-floating-box",FloatingBoxLayout.floatingBoxContentSelector=".cl-floating-box-content",FloatingBoxLayout.floatingBoxCloseIconSelector=".cl-floating-box-close-icon",FloatingBoxLayout.verticalCenterPositionRotationCss="rotate(-90deg)";

package/layouts/getZindex.d.ts

@@ -0,0 +1,4 @@
+export function getZIndexPriorities(): {
+    [x: number]: number;
+};
+export function getZIndexByLayoutType(type: any): number;

package/layouts/getZindex.js

@@ -0,0 +1 @@
+import LayoutType from"@claspo/common/form/common/LayoutType";const getZindex=e=>Math.round(Number.MAX_SAFE_INTEGER/1e7-e);export function getZIndexPriorities(){return{[LayoutType.FLOATING_BAR]:2,[LayoutType.FLOATING_BOX]:2,[LayoutType.DETACHED]:1,[LayoutType.CONTENT_LOCKER]:0,[LayoutType.LAUNCHER]:3,[LayoutType.BUILT_IN]:0}}export function getZIndexByLayoutType(e){if(e===LayoutType.CONTENT_LOCKER)return Number.MAX_SAFE_INTEGER;const t=getZIndexPriorities();return e in t?getZindex(t[e]):Number.MAX_SAFE_INTEGER}

package/layouts/in-app-pop-up/InAppPopUpLayout.d.ts

@@ -0,0 +1,7 @@
+export default class InAppPopUpLayout extends DialogLayout {
+    handleBackdropClick(event: any): void;
+    handleCloseIconClick(): void;
+    hideDialog(): void;
+    getAnimationStyles(): string;
+}
+import DialogLayout from "../detached/DialogLayout";

package/layouts/in-app-pop-up/InAppPopUpLayout.js

@@ -0,0 +1 @@
+import DocumentConnectorEventType from"../../DocumentConnectorEventType";import DialogLayout from"../detached/DialogLayout";const IS_VISIBLE_CLASS="is-visible";export default class InAppPopUpLayout extends DialogLayout{addBackDropClickEventListener(){this.dialogElement.addEventListener("click",this.handleBackdropClick.bind(this))}handleBackdropClick(t){t.target===this.dialogElement&&(this.hideDialog(),this.eventEmitter.emit(DocumentConnectorEventType.CLOSE_WIDGET))}addCloseIconEventListener(){this.closeIconElement.addEventListener("click",this.handleCloseIconClick.bind(this))}handleCloseIconClick(){this.hideDialog(),this.eventEmitter.emit(DocumentConnectorEventType.CLOSE_ICON_CLICKED,this.closeIconElement)}hideDialog(){this.params.disableLayoutAnimations||this.dialogElement.classList.remove("is-visible")}showDialog(){this.dialogElement.style.visibility="visible",this.params.disableLayoutAnimations||this.dialogElement.classList.add("is-visible")}getAnimationStyles(){return`\n    ${InAppPopUpLayout.dialogSelector} {\n      opacity: 0;\n      transition: opacity 0.3s 0s, visibility 0s 0s;\n    }\n\n    ${InAppPopUpLayout.dialogSelector}.is-visible {\n      opacity: 1;\n    }\n\n    .cl-dialog-inner-content-wrapper {\n      transform: translateY(-40px);\n      transition: transform 0.3s ease;\n    }\n\n    .is-visible .cl-dialog-inner-content-wrapper {\n      transform: translateY(0);\n    }\n  `}getOtherStyles(){return this.params.disableLayoutAnimations?"":this.getAnimationStyles()}}

package/layouts/in-app-slide-up/InAppSlideUpLayout.d.ts

@@ -0,0 +1,4 @@
+export default class InAppSlideUpLayout extends FloatingBarLayout {
+    _setPosition(params: any): void;
+}
+import FloatingBarLayout from "../floating-bar/FloatingBarLayout";

package/layouts/in-app-slide-up/InAppSlideUpLayout.js

@@ -0,0 +1 @@
+import FloatingBarLayout from"../floating-bar/FloatingBarLayout";export default class InAppSlideUpLayout extends FloatingBarLayout{getSharedParams(){return this.getDocumentModel().shared.slideUp}isBottomPosition(t){return"BOTTOM"===t.position}setTopPosition(t){this.floatingBarElement.style.top=t.verticalOffset,this._setPosition(t)}setBottomPosition(t){this.floatingBarElement.style.bottom=t.verticalOffset,this._setPosition(t)}getOtherStyles(){return`\n      ${InAppSlideUpLayout.floatingBarSelector} {\n        box-sizing: border-box;\n      }\n\n      ${InAppSlideUpLayout.floatingBarContentSelector} {\n        display: flex;\n        justify-content: center;\n      }\n\n      ${InAppSlideUpLayout.floatingBarContentSelector} .cl-widget {\n        flex: 1;\n        justify-content: center;\n      }\n\n      .cl-floating-bar-inner-content {\n        max-width: 640px;\n        margin: 0 auto;\n      }\n    `}_setPosition(t){this.floatingBarElement.style.left="0px",this.floatingBarElement.style.paddingLeft=t.leftAndRightOffset,this.floatingBarElement.style.paddingRight=t.leftAndRightOffset}}

package/layouts/launcher/LauncherLayout.d.ts

@@ -0,0 +1,18 @@
+export default class LauncherLayout extends BaseLayout {
+    static launcherSelector: string;
+    static launcherContentSelector: string;
+    static launcherStylesSelector: string;
+    zIndex: any;
+    launcherRootElement: HTMLDivElement;
+    launcherElement: Element | null;
+    defaultStylesElement: Node;
+    connect(documentElement: any, containerElement: any, entryModule: any): Element | null;
+    environmentUpdateListener: any;
+    disconnect(beforeDestroyCallback: any): void;
+    setEntryAnimationAndPosition(isMobileEnv: any): void;
+    clearLoopAnimations(): void;
+    setLoopAnimation(animationParams: any): void;
+    _applyLoopAnimationParams(animationParams: any): void;
+    _getTemplate(params: any): string;
+}
+import BaseLayout from "../BaseLayout";

package/layouts/launcher/LauncherLayout.js

@@ -0,0 +1 @@
+import BaseLayout from"../BaseLayout";import{LoopAnimationStylesService}from"@claspo/renderer/renderer/style/LoopAnimationStylesService";import{ViewRendererActionType}from"@claspo/renderer/renderer/ViewRendererActionType";import{DocumentModelUpdateType}from"@claspo/renderer/document-model/DocumentModel";import LayoutType from"@claspo/common/form/common/LayoutType";import{WidgetHorizontalPosition,WidgetVerticalPosition}from"../PositionConstants";import debounce from"@claspo/common/async/debounce";import insertHtmlIntoElement from"@claspo/common/dom/insertHtmlIntoElement";export default class LauncherLayout extends BaseLayout{constructor(e,t,n,o,i){super(e,t,n,o,i),this.zIndex=this.params.zIndex,this.launcherRootElement=document.createElement("div"),this.launcherRootElement.insertAdjacentHTML("afterbegin",this._getTemplate(this.params)),this.launcherElement=this.launcherRootElement.querySelector(LauncherLayout.launcherSelector),this.launcherElement.setAttribute("cl-connector-root-element",LayoutType.LAUNCHER),this.params.config.formVariantId&&this.launcherElement.setAttribute("cl-widget-id",this.params.config.formVariantId),this.defaultStylesElement=this.launcherElement.querySelector(LauncherLayout.launcherStylesSelector).cloneNode(!0),this.addWidgetContentClickEventListener(this.launcherRootElement.querySelector(LauncherLayout.launcherContentSelector))}connect(e,t,n){return this.launcherRootElement.querySelector(LauncherLayout.launcherContentSelector).appendChild(e),t.appendChild(this.launcherElement),this.setEntryAnimationAndPosition(this.isMobileEnv()),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.SHARED_UPDATE_ALL,debounce(e=>{this.setEntryAnimationAndPosition(this.isMobileEnv())},5)),this.environmentUpdateListener=this.documentModel.on(DocumentModelUpdateType.ENVIRONMENT_UPDATE,debounce(e=>{this.setEntryAnimationAndPosition(e.isMobileEnv)},5)),this.setConnectedElement(this.launcherElement),this.launcherElement.style.visibility="hidden",n.compositionRoot.services.eventEmitter.on(ViewRendererActionType.VIEW_COMPONENT_RESOURCES_LOADED,()=>{this.launcherElement.style.visibility="visible"}),this.launcherElement}disconnect(e){var t;null==e||e(),this.launcherElement.remove(),null===(t=this.environmentUpdateListener)||void 0===t||t.off()}setEntryAnimationAndPosition(e){const t=this.getDocumentModel().shared.launcher;this.setLoopAnimation(t.loopAnimation);const n=e?t.mobile:t.desktop,o=n.verticalPosition.toLowerCase(),i=n.horizontalPosition.toLowerCase();if(this.params.disableLayoutAnimations||!["SLIDE_TO_TOP","SLIDE_TO_BOTTOM","SLIDE_TO_LEFT","SLIDE_TO_RIGHT"].includes(t.entryAnimation.type))return this.launcherElement.style[i]=n.horizontalOffset,this.launcherElement.style[o]=n.verticalOffset,void(this.launcherElement.style.opacity="1");let l,s,a,r,c;"SLIDE_TO_TOP"===t.entryAnimation.type||"SLIDE_TO_BOTTOM"===t.entryAnimation.type?(l=i,s=n.horizontalOffset,a=o,r=n.verticalOffset,c="SLIDE_TO_TOP"===t.entryAnimation.type?n.verticalPosition===WidgetVerticalPosition.TOP?20:-20:n.verticalPosition===WidgetVerticalPosition.TOP?-20:20):(l=o,s=n.verticalOffset,a=i,r=n.horizontalOffset,c="SLIDE_TO_LEFT"===t.entryAnimation.type?n.horizontalPosition===WidgetHorizontalPosition.LEFT?20:-20:n.horizontalPosition===WidgetHorizontalPosition.LEFT?-20:20),this.launcherElement.style[l]=s,this.launcherElement.style[a]=`${parseFloat(r)+c}px`,setTimeout(()=>{this.launcherElement.style[a]=r,this.launcherElement.style.opacity="1"},50)}clearLoopAnimations(){var e;const t=[];this.launcherElement.classList.forEach(e=>{e.startsWith(LoopAnimationStylesService.animationClassPrefix)&&t.push(e)}),this.launcherElement.classList.remove(...t);const n=this.launcherElement.querySelector(LauncherLayout.launcherStylesSelector);insertHtmlIntoElement({element:n,html:this.defaultStylesElement.innerHTML}),this.launcherElement.removeAttribute("style"),this.launcherElement.style.zIndex=this.zIndex,this.launcherElement.style.position=null!==(e=this.params.displayPosition)&&void 0!==e?e:"fixed"}setLoopAnimation(e){this.clearLoopAnimations(),this.params.disableLayoutAnimations||(this._applyLoopAnimationParams(e),this.launcherElement.classList.add(LoopAnimationStylesService.animationClassPrefix+e.type))}_applyLoopAnimationParams(e){e.params&&Object.keys(e.params).forEach(t=>{const n=e.params[t];this.launcherElement.style.setProperty(`--cl-${e.type}-${t}`,`${n||LoopAnimationStylesService.getDefaultParamValueByAnimationType(e.type,t)}`)})}_getTemplate(e){var t;const n=e.documentModel.shared.launcher;return`\n      <div class="cl-launcher">\n        <style class="cl-launcher-styles">\n\n        ${LoopAnimationStylesService.constructAnimationStylesByTypes([null===(t=n.loopAnimation)||void 0===t?void 0:t.type])}\n\n        .cl-launcher {\n          ${this.params.disableLayoutAnimations?"":"transition: 0.3s;"}\n          cursor: pointer;\n          opacity: 0;\n        }\n\n        ${e.disabled?this.getDisabledWidgetStyles(LauncherLayout.launcherSelector):""}\n\n        .cl-launcher-inner-content {\n           position: relative;\n        }\n        </style>\n\n        <div class="cl-launcher-inner-content">\n          <div class="cl-launcher-content"></div>\n        </div>\n      </div>\n`}}LauncherLayout.launcherSelector=".cl-launcher",LauncherLayout.launcherContentSelector=".cl-launcher-content",LauncherLayout.launcherStylesSelector=".cl-launcher-styles";

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@claspo/document-connector",
+  "version": "14.5.0-theme.13",
+  "scripts": {
+    "test": "jest --no-cache --coverage",
+    "build": "rm -rf out && tsc --project tsconfig.json && npm run minify",
+    "minify": "find out -name '*.js' ! -name '*.d.js' -exec terser {} --compress --mangle --output {} \\;",
+    "dev": "tsc --project tsconfig.json --watch",
+    "package": "npm i && npm run test && npm run build && cp package.json out && cd out && npm publish --access=public && cd .."
+  },
+  "engines": {
+    "node": ">=18.16.0"
+  },
+  "dependencies": {
+    "@claspo/common": "5.2.1-theme.13",
+    "@claspo/renderer": "16.5.0-theme.13"
+  },
+  "devDependencies": {
+    "@types/jest": "^27.5.1",
+    "jest": "^28.1.0",
+    "jest-environment-jsdom": "^28.1.0",
+    "terser": "^5.37.0",
+    "ts-jest": "^28.0.3",
+    "ts-node": "^10.8.0",
+    "typescript": "^4.6.4"
+  },
+  "author": "alex-chernysh",
+  "license": "",
+  "homepage": "https://claspo.io/"
+}