@ada-support/embed2 1.0.15 → 1.0.16

package/dist/npm-entry/index.js

@@ -9144,7 +9144,7 @@ function getEmbedURL(_ref) {
     polyfillVersionString = "legacy";
   }
 
-  return "".concat(host, "/embed/").concat(polyfillVersionString, "/").concat(frameName, "/").concat("fa2520f", "/index.html");
+  return "".concat(host, "/embed/").concat(polyfillVersionString, "/").concat(frameName, "/").concat("dcb5407", "/index.html");
 }
 /**
  * Generate the Chat / API URL
@@ -11203,7 +11203,8 @@ var ChatFrame = /*#__PURE__*/function (_Component) {
     (0,defineProperty/* default */.Z)((0,assertThisInitialized/* default */.Z)(_this), "channel", void 0);
 
     (0,defineProperty/* default */.Z)((0,assertThisInitialized/* default */.Z)(_this), "state", {
-      isMounted: false
+      isMounted: false,
+      closeTransitionTime: 200
     });
 
     return _this;
@@ -11311,7 +11312,9 @@ var ChatFrame = /*#__PURE__*/function (_Component) {
         return "";
       }
 
-      var isMounted = this.state.isMounted;
+      var _this$state = this.state,
+          isMounted = _this$state.isMounted,
+          closeTransitionTime = _this$state.closeTransitionTime;
       var isShown = isDrawerOpen && isMounted;
       var backgroundColor = this.darkMode ? "#121212" : "#fff";
       var borderRadius = (client === null || client === void 0 ? void 0 : (_client$ui_settings2 = client.ui_settings) === null || _client$ui_settings2 === void 0 ? void 0 : _client$ui_settings2.chat.style) === "rectangular" ? "8px" : "16px";
@@ -11321,7 +11324,7 @@ var ChatFrame = /*#__PURE__*/function (_Component) {
       var totalWindowHeight = isTestBot ? "".concat(WINDOW_HEIGHT + TEST_BOT_NAV_HEIGHT, "px") : "".concat(WINDOW_HEIGHT, "px");
 
       if (client.features.chat_ui_v2) {
-        return "\n        position: fixed;\n\n        ".concat(isMobile ? "\n          right: 0;\n          bottom: 0;\n          height: 100%;\n        " : "\n          height: 90%;\n          right: 24px;\n          bottom: 24px;\n          max-width: 375px;\n          max-height: ".concat(totalWindowHeight, ";\n          border-radius: ").concat(borderRadius, ";\n        "), "\n\n        width: 100%;\n        pointer-events: none; \n        opacity: 0;\n        transform: translate(0, 100px);\n        transition: transform 200ms ease, opacity 200ms ease, visibility 0ms linear 200ms;\n        box-shadow: 0px 12px 48px 4px rgba(0, 0, 0, 0.12);\n        background-color: ").concat(backgroundColor, ";\n        visibility: hidden;\n        z-index: 10010;\n\n        ").concat(isShown && "\n          pointer-events: auto; \n          opacity: 1;\n          transform: translate(0, 0);\n          transition: transform 300ms ease, opacity 300ms ease;\n          visibility: visible;\n        ", "\n      ");
+        return "\n        position: fixed;\n\n        ".concat(isMobile ? "\n          right: 0;\n          bottom: 0;\n          height: 100%;\n        " : "\n          height: 90%;\n          right: 24px;\n          bottom: 24px;\n          max-width: 375px;\n          max-height: ".concat(totalWindowHeight, ";\n          border-radius: ").concat(borderRadius, ";\n        "), "\n\n        width: 100%;\n        pointer-events: none; \n        opacity: 0;\n        transform: translate(0, 100px);\n        transition: transform ").concat(closeTransitionTime, "ms ease, opacity ").concat(closeTransitionTime, "ms ease, visibility 0ms linear ").concat(closeTransitionTime, "ms;\n        box-shadow: 0px 12px 48px 4px rgba(0, 0, 0, 0.12);\n        background-color: ").concat(backgroundColor, ";\n        visibility: hidden;\n        z-index: 10010;\n\n        ").concat(isShown && "\n          pointer-events: auto; \n          opacity: 1;\n          transform: translate(0, 0);\n          transition: transform 300ms ease, opacity 300ms ease;\n          visibility: visible;\n        ", "\n      ");
       }
 
       return "\n      position: fixed;\n      right: 0;\n      bottom: 0;\n      transform: translate(".concat(isDrawerOpen && isMounted ? "0" : "375px", ", 0);\n      opacity: ").concat(isDrawerOpen && isMounted ? "1" : "0", ";\n      transition: transform 200ms ease, opacity 200ms ease;\n      z-index: 9999;\n      box-shadow: -1px 0 0 rgba(0, 0, 0, .1), -3px 0 9px rgba(0, 0, 0, .15);\n      background-color: #ffffff;\n      width: 100%;\n      max-width: ").concat(isMobile ? "none" : "375px", ";\n      height: ").concat(isMobile ? "100%" : "100vh", ";\n      min-height: ").concat(isMobile ? "100%" : "initial", ";\n      max-height: -webkit-fill-available;\n      max-height: -moz-available;\n      max-height: stretch;\n    ");
@@ -11377,6 +11380,7 @@ var ChatFrame = /*#__PURE__*/function (_Component) {
       var _this3 = this;
 
       var isDrawerOpen = this.props.isDrawerOpen;
+      var closeTransitionTime = this.state.closeTransitionTime;
 
       if (!isMobile) {
         return;
@@ -11390,7 +11394,18 @@ var ChatFrame = /*#__PURE__*/function (_Component) {
         };
       } else {
         this.unlockDocumentBodyFromScrolling();
-        this.iframeRef.current.ontransitionend = null;
+
+        this.iframeRef.current.ontransitionend = function () {
+          /**
+           * After the frame is done animating to close - hide the frame so it doesn't
+           * overlap the parent sites content (especially important for iOS as it breaks)
+           * scrolling
+           */
+          setTimeout(function () {
+            _this3.iframeRef.current.style.width = 0;
+            _this3.iframeRef.current.style.height = 0;
+          }, closeTransitionTime);
+        };
       }
     }
     /**
@@ -13562,7 +13577,7 @@ window.__AdaEmbedConstructor = Embed;
 
 var isModern = new RegExp("((CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS)[ +]+(14|(1[5-9]|[2-9]\\d|\\d{3,}))[_.]\\d+(?:[_.]\\d+)?)|((Chromium|Chrome)\\/(92|(9[3-9]|\\d{3,}))\\.\\d+(?:\\.\\d+)?)|(Version\\/(14|(1[5-9]|[2-9]\\d|\\d{3,}))\\.\\d+(?:\\.\\d+)? Safari\\/)|(Firefox\\/(91|(9[2-9]|\\d{3,}))\\.\\d+\\.\\d+)|(Firefox\\/(91|(9[2-9]|\\d{3,}))\\.\\d+(pre|[ab]\\d+[a-z]*)?)").test(navigator.userAgent);
 var isProduction = "production" === "production";
-var embed2Version = "fa2520f";
+var embed2Version = "dcb5407";
 
 /***/ }),
 
@@ -21171,7 +21186,7 @@ function _loadEmbed() {
                 polyfillVersionString = "legacy";
               }
 
-              embedScriptSource = "".concat(host, "/embed/").concat(polyfillVersionString, "/client/").concat("fa2520f", "/index.js");
+              embedScriptSource = "".concat(host, "/embed/").concat(polyfillVersionString, "/client/").concat("dcb5407", "/index.js");
             }
 
             clientScriptExists = Boolean( true || // The client script is bundled with npm module
@@ -21298,10 +21313,10 @@ function createEmbedObject() {
                   handle: adaSettings.handle,
                   embedVersion: 2,
                   embedSettings: adaSettings,
-                  version: "1.0.15",
+                  version: "1.0.16",
                   isNpm: true,
                   hostPage: window.location.href,
-                  commitHash: "fa2520f"
+                  commitHash: "dcb5407"
                 }, {
                   sampleRate: 0.01 // 1% of logs will go through
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ada-support/embed2",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "",
   "main": "dist/npm-entry",
   "typings": "dist/npm-entry/index.d.ts",