@xapp/chat-widget 1.36.6 → 1.37.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,7 @@
1
+ import { FC } from "react";
2
+ import "./CancelButton.scss";
3
+ export interface CancelButtonProps {
4
+ onClick(): void;
5
+ }
6
+ declare const CancelButton: FC<CancelButtonProps>;
7
+ export default CancelButton;
@@ -0,0 +1 @@
1
+ export { default as CancelButton } from "./CancelButton";
@@ -8,6 +8,7 @@ export interface WidgetEnvDeprecated {
8
8
  }
9
9
  export declare const Default: VFC;
10
10
  export declare const Direct: VFC;
11
+ export declare const DirectWithExternalMiddleware: VFC;
11
12
  export declare const Static: VFC;
12
13
  export declare const Docked: VFC;
13
14
  export declare const EmptyMenu: VFC;
@@ -19,3 +20,4 @@ export declare const InvalidServerUrl: VFC;
19
20
  export declare const WithCustomComponents: VFC;
20
21
  export declare const WithMiddlewareFromURL: VFC;
21
22
  export declare const WithToken: VFC;
23
+ export declare const WithOutActions: VFC;
@@ -2,6 +2,7 @@ import { FC } from "react";
2
2
  import "./MinimizeButton.scss";
3
3
  export interface MinimizeButtonProps {
4
4
  onClick(): void;
5
+ showInRight: boolean;
5
6
  }
6
7
  declare const MinimizeButton: FC<MinimizeButtonProps>;
7
8
  export default MinimizeButton;
@@ -5,9 +5,11 @@ import "./StatusContainer.scss";
5
5
  export interface Props {
6
6
  accountStatus: string;
7
7
  readonly canMinimize: boolean;
8
+ readonly canCancel: boolean;
8
9
  readonly agent: ChatUserInfo;
9
10
  readonly config?: WidgetHeaderConfig;
10
11
  minimizeOnClick: () => void;
12
+ cancelOnClick: () => void;
11
13
  }
12
14
  declare const StatusContainer: FC<React.PropsWithChildren<Props>>;
13
15
  export default StatusContainer;
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:OpenSansSemibold;font-style:normal;font-weight:600;font-display:swap;src:local("Open Sans SemiBold"),local("OpenSans-SemiBold"),url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UNirkOUuhpKKSTjw.woff2) format("woff2")}@font-face{font-family:RobotoRegular;font-style:normal;font-weight:400;font-display:swap;src:local("Roboto"),local("Roboto-Regular"),url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format("woff2")}@font-face{font-family:RobotoMedium;font-style:oblique;font-weight:500;font-display:swap;src:local("Roboto Medium"),local("Roboto-Medium"),url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) format("woff2")}::-webkit-input-placeholder{font-style:italic;color:#e1e2e1}:-moz-placeholder{font-style:italic}::-moz-placeholder{font-style:italic}:-ms-input-placeholder{font-style:italic}.widget-container{background:#fff;display:flex;flex-flow:column nowrap;width:100%;height:100%;visibility:hidden;font-family:RobotoRegular,serif;box-shadow:0 5px 40px rgba(0,0,0,.16);overflow:hidden;border-radius:var(--xapp-widget-border-radius, 10px);border:var(--xapp-widget-border-width, 0px) solid var(--xapp-widget-border-color, var(--xapp-primary-color, #616161));box-sizing:border-box}.widget-container *,.widget-container *:before,.widget-container *:after{box-sizing:border-box}.widget-container--normal,.widget-container--static{position:fixed;z-index:1000;right:var(--xapp-widget-margin-right, 10px);bottom:var(--xapp-widget-margin-bottom, 10px)}.widget-container--normal.visible,.widget-container--static.visible{width:min(var(--xapp-widget-width, 400px), 100vw - var(--xapp-widget-margin-left, 10px) - var(--xapp-widget-margin-right, 10px));height:min(var(--xapp-widget-height, 500px), 100vh - var(--xapp-widget-margin-top, 10px) - var(--xapp-widget-margin-bottom, 10px))}.widget-container--docked{width:100%;height:100%}.widget-container:not(.visible){animation:widget-hide .5s backwards;width:64px;height:64px}.widget-container.visible{animation:widget-show .5s forwards}svg{display:block;margin:auto;height:100%}.message-svg path{fill:var(--xapp-primary-color, #616161)}.chat-msg{line-height:20px;font-size:14px;margin-left:48px;max-width:var(--xapp-messages-max-width, 240px)}.chat-msg--expand{max-width:calc(100% - 48px);width:calc(100% - 48px)}.chat-msg__fullwidth{max-width:100%;width:100%}.chat-msg--no-ava{margin-left:0}.chat-typing-progress .chat-msg{color:#30375b}.visitor .chat-text-container{padding-right:20px}.chat-media-container{border-radius:8px;border:1px solid #ddd;overflow:hidden}.chat-img{min-width:180px;min-height:120px;background-position:center;background-size:cover}.system-msg-container{text-align:center;margin-bottom:16px}.system-msg{font-size:14px;color:#bfbfbf}.chat-rating-card{padding-bottom:16px;text-align:center}.buttons-container{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;width:100%}.buttons-container .button{flex-grow:1}.buttons-container .button:not(:last-child){margin-right:8px}.buttons-container .button-card{flex-grow:0}.buttons-container .button-card:not(:last-child){margin-right:8px}@keyframes widget-show{0%{visibility:hidden;opacity:0}1%{visibility:visible;opacity:0;transform:translateY(50%)}100%{visibility:visible;opacity:1;transform:translateY(0)}}@keyframes widget-hide{0%{transform:translateY(0)}99%{opacity:0;transform:translateY(50%)}100%{visibility:hidden;opacity:0}}@keyframes widget-show-grow{0%{visibility:hidden;opacity:0}1%{visibility:visible;opacity:0;transform:scale(0.5)}100%{visibility:visible;opacity:1;transform:scale(1)}}@keyframes widget-hide-shrink{0%{visibility:visible;opacity:1;transform:scale(1)}99%{visibility:visible;opacity:0;transform:scale(0.5)}100%{visibility:hidden;opacity:0}}.spinner-container{z-index:1000;position:absolute;width:100%;height:100%;display:flex;align-items:center;background:#fff;transition:visibility 500ms,opacity 500ms;visibility:hidden;opacity:0;top:0;left:0}.spinner-container.visible{visibility:visible;opacity:1}.spinner{width:40px;height:40px;margin:100px auto;background-color:var(--xapp-primary-color, #616161);border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}.chevron{width:100%;height:100%}@-webkit-keyframes sk-scaleout{0%{transform:scale(0)}100%{transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{transform:scale(0)}100%{transform:scale(1);opacity:0}}.action-button{border:1px solid #ddd;border-radius:4px;text-align:center;opacity:1;outline:none;font-size:14px;padding:8px;text-align:center}.action-button:hover{opacity:.8;cursor:pointer}.xappw-carousel{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.xappw-carousel__prev,.xappw-carousel__next{flex:0 0 48px;height:30px;cursor:pointer}.xappw-carousel-items{display:flex;position:relative;height:auto;align-items:stretch;white-space:nowrap;overflow-x:hidden;overflow-y:hidden;scroll-behavior:smooth;-ms-overflow-style:none;-moz-overflow-style:none;-webkit-overflow-scrolling:touch}@media(hover: none)and (pointer: coarse){.xappw-carousel-items{overflow-x:auto}}.xappw-carousel-items__item{display:inline-flex;flex-direction:column;padding-right:10px;flex-shrink:0}.xappw-carousel-items__item:last-child{padding-right:0}@media(max-width: 640px){.xappw-carousel-items__item{min-width:100%}}.avatar{border-radius:16px;color:#fff;background-position:center;background-size:cover;background-repeat:no-repeat;width:100%;height:100%}.avatar--agent{background-color:#fff}.avatar--visitor{background-color:var(--xapp-primary-color, #616161)}.avatar--empty{background-color:transparent}.chat-card-container{border-radius:10px;position:relative;overflow:hidden;color:#fff;background:#f6f6f6}.chat-card-container .chat-card-img{border-radius:0}.chat-card-container__img{min-width:220px;height:120px}.chat-card-container .chat-card-title{padding:2px 10px;color:#2e375a;font-family:RobotoMedium,serif;font-size:12px;line-height:14px;font-weight:bold}.chat-card-container .chat-card-title span{display:inline-block;white-space:pre-wrap}.chat-card-container .chat-card-sub-title{padding:2px 10px;color:#2e375a;font-family:RobotoRegular,serif;font-size:10px;line-height:14px}.chat-card-container .chat-card-sub-title span{display:inline-block;white-space:pre-wrap}.chat-card-container .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-primary-color, #616161);color:#d5d9e7;cursor:pointer}.chat-button{position:fixed;bottom:0;right:0;cursor:pointer;margin-top:var(--xapp-chat-button-margin-top, var(--xapp-widget-margin-top, 16px));margin-right:var(--xapp-chat-button-margin-right, var(--xapp-widget-margin-right, 16px));margin-bottom:var(--xapp-chat-button-margin-bottom, var(--xapp-widget-margin-bottom, 16px));margin-left:var(--xapp-chat-button-margin-left, var(--xapp-widget-margin-left, 16px));display:block;opacity:1;animation:widget-show-grow .5s backwards;width:80px;height:80px}.chat-button.visible{animation:widget-hide-shrink .5s forwards}.chat-button__btn{position:absolute;width:48px;height:48px;border-radius:24px;background-color:var(--xapp-chat-button-background, var(--xapp-primary-color, #616161));box-shadow:0 0 8px 0 rgba(0,0,0,.3);bottom:0;right:0}.chat-button__cta{position:absolute;bottom:56px;right:24px;white-space:nowrap;font-size:16px;font-family:RobotoRegular,serif}.chat-chips{width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;box-sizing:border-box;margin:0 auto;padding:10px;scroll-behavior:smooth;-ms-overflow-style:none;-moz-overflow-style:none;-webkit-overflow-scrolling:touch}.chat-chips::-webkit-scrollbar{background-color:#fff;height:10px}.chat-chips::-webkit-scrollbar-track{background-color:#fff}.chat-chips::-webkit-scrollbar-button{display:none}.chat-chips::-webkit-scrollbar-thumb{background-color:#babac0;border-radius:10px;border:2.5px solid #fff}.chat-chip{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;color:#2f385a;line-height:25px;border-radius:25px;border:thin solid #aeb3be;cursor:pointer;user-select:none}.chat-chip-link{text-decoration:underline}.chat-list-item{display:flex;flex-direction:column;align-items:flex-start;min-width:220px;min-height:120px;flex:1 1 auto;border:solid 1px #ccc;border-radius:12px}.chat-list-item-container{display:flex;flex-direction:column;flex:1 1 auto}.chat-list-item__img{border-radius:12px 12px 0 0;width:100%;height:120px;overflow:hidden}.chat-list-item__title{text-align:left;font-family:var(--xapp-carousel-title-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-title-font-weight, bold);font-size:var(--xapp-carousel-title-font-size, 14px);font-style:var(--xapp-carousel-title-font-style, normal);color:var(--xapp-carousel-title-text-color, #000);line-height:1.3;padding:2px}.chat-list-item__title span{display:inline-block;white-space:pre-wrap}.chat-list-item__subtitle{text-align:left;font-family:var(--xapp-carousel-subtitle-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-subtitle-font-weight, normal);font-size:var(--xapp-carousel-subtitle-font-size, 12px);font-style:var(--xapp-carousel-subtitle-font-style, normal);color:var(--xapp-carousel-subtitle-text-color, #979797);line-height:1.3;max-width:200px;padding:2px}.chat-list-item__subtitle span{display:inline-block;white-space:pre-wrap}.chat-list-item__actions{margin-top:auto}.chat-list-item .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-carousel-action-button-color, var(--xapp-primary-color, #616161));color:#d5d9e7;cursor:pointer}.chat-msg-container-wrapper{display:flex;margin-bottom:16px}.chat-msg-container-wrapper.visitor{justify-content:flex-end}.chat-msg-container-wrapper.agent{justify-content:flex-start}.chat-msg-container-wrapper.sibling{margin-bottom:8px}.chat-msg-container-wrapper.sibling .avatar{display:none}.chat-msg-container{display:flex;flex-flow:column nowrap;flex:0 0 auto;justify-content:flex-start;max-width:100%;position:relative}.chat-msg-container.visitor{align-items:flex-end}.chat-msg-container.visitor .xappw-chat-msg-part__avatar{right:0;display:none}.chat-msg-container.agent{align-items:stretch}.chat-msg-container.agent .xappw-chat-msg-part__avatar{width:40px;height:40px;left:0}.chat-text-container p{margin:0 0 8px 0;padding:0}.chat-text-bubble{border-radius:10px;padding:10px;position:relative;overflow:visible}.chat-text-bubble--mine{font-family:var(--xapp-messages-mine-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-messages-mine-font-weight, normal);font-size:var(--xapp-messages-mine-font-size, 14px);font-style:var(--xapp-messages-mine-font-style, normal);color:var(--xapp-messages-mine-text-color, #ffffff);background:var(--xapp-messages-mine-bubble-color, #20df20);border-bottom-right-radius:0}.chat-text-bubble--mine .chat-text-bubble__tail{right:-8px;color:var(--xapp-messages-mine-bubble-color, #20df20)}.chat-text-bubble--others{font-family:var(--xapp-messages-others-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-messages-others-font-weight, normal);font-size:var(--xapp-messages-others-font-size, 14px);font-style:var(--xapp-messages-others-font-style, normal);color:var(--xapp-messages-others-text-color, #262726);background:var(--xapp-messages-others-bubble-color, #e1e2e1);border-bottom-left-radius:0}.chat-text-bubble--others .chat-text-bubble__tail{left:-8px;color:var(--xapp-messages-others-bubble-color, #e1e2e1)}.chat-text-bubble span{white-space:pre-wrap}.chat-typing-progress .chat-text-bubble{padding:8px 10px;margin-top:4px}.chat-text-bubble__tail{position:absolute;width:8px;height:24px;bottom:0}.xappw-chat-msg-part{display:inline-block;position:relative;word-wrap:break-word}.xappw-chat-msg-part+.xappw-chat-msg-part{margin-top:4px}.xappw-chat-msg-part+.xappw-chat-msg-part .chat-card-img{border-radius:12px 12px 12px 0}.xappw-chat-msg-part__avatar{position:absolute;bottom:0;z-index:10}.xappw-chat-msg-part ul{list-style-position:inside;padding:0;margin:0 0 8px 0}.xappw-chat-msg-part li{padding:0;margin:0}.cta-bubble{position:relative;border-radius:50%;background:var(--xapp-cta-background, #e1e2e1);display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;text-align:center;max-width:192px}.cta-bubble__tail{position:absolute;left:-16px;right:-16px;top:-16px;bottom:-16px;z-index:1;color:var(--xapp-cta-background, #e1e2e1)}.cta-bubble__tail svg{width:100%;height:100%;margin:0;padding:0}.cta-bubble__content{font-family:var(--xapp-cta-font-family, 14px);font-size:var(--xapp-cta-font-size, 14px);color:var(--xapp-cta-text-color, var(--xapp-primary-color, #616161));z-index:2}.message-list-container{flex-grow:1;flex-shrink:1;overflow-y:scroll;display:flex;flex-direction:column;background:var(--xapp-content-background, #fff)}.message-list-container__msgs{padding-top:var(--xapp-messages-padding-top, 16px);padding-right:var(--xapp-messages-padding-right, 16px);padding-bottom:var(--xapp-messages-padding-bottom, 0);padding-left:var(--xapp-messages-padding-left, 20px)}.message-list-container__chips{flex:0 0 auto;border-top:solid 1px #ccc;margin-top:auto}.message-list-container__chips--empty{flex-basis:0;border:none;overflow:hidden}.xappw-vlist-item{display:flex;flex-direction:row;flex:0 0 auto;min-width:100%;min-height:56px;padding:8px;box-sizing:border-box;cursor:pointer}.xappw-vlist-item--normal{align-items:flex-start}.xappw-vlist-item--titles{align-items:center}.xappw-vlist-item:hover{background-color:#eee}.xappw-vlist-item__description{display:flex;flex-direction:column;flex:1 1 auto;overflow:hidden}.xappw-vlist-item__side{flex:0 0 auto;display:flex;flex-direction:column}.xappw-vlist-item__img{border-radius:12px;width:40px;height:40px;overflow:hidden}.xappw-vlist-item__external-link{width:20px;margin:0 4px 4px auto;display:inline-block}.xappw-vlist-item__title{text-align:left;font-family:var(--xapp-carousel-title-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-title-font-weight, bold);font-size:var(--xapp-carousel-title-font-size, 14px);font-style:var(--xapp-carousel-title-font-style, normal);color:var(--xapp-carousel-title-text-color, #000);line-height:1.3}.xappw-vlist-item__title span{display:inline-block;white-space:pre-wrap}.xappw-vlist-item__link{font-family:var(--xapp-carousel-link-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-link-font-weight, normal);font-size:var(--xapp-carousel-link-font-size, 12px);font-style:var(--xapp-carousel-link-font-style, normal);color:var(--xapp-carousel-link-text-color, #666);line-height:1.3;overflow:hidden;text-overflow:ellipsis;max-width:100%}.xappw-vlist-item__subtitle{text-align:left;font-family:var(--xapp-carousel-subtitle-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-subtitle-font-weight, normal);font-size:var(--xapp-carousel-subtitle-font-size, 12px);font-style:var(--xapp-carousel-subtitle-font-style, normal);color:var(--xapp-carousel-subtitle-text-color, #979797);line-height:1.3}.xappw-vlist-item__subtitle span{display:inline-block;white-space:pre-wrap}.xappw-vlist-item .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-carousel-action-button-color, var(--xapp-primary-color, #616161));color:#d5d9e7;cursor:pointer}.chat-menu{display:flex;flex-flow:column;flex-shrink:0;z-index:999;overflow-y:hidden;-webkit-transition:max-height .8s ease-in-out;-moz-transition:max-height .8s ease-in-out;-o-transition:max-height .8s ease-in-out;transition:max-height .8s ease-in-out}.chat-menu--closed{max-height:0}.chat-menu--opened{max-height:calc(4 * var(--xapp-menu-item-height, 24px))}.xappw-vlist{display:flex;flex-flow:column nowrap}.xappw-vlist__header{padding:16px 8px;font-family:"RobotoRegular","serif";font-weight:bold;font-size:16px}.xappw-vlist-container{display:flex;flex-flow:column nowrap;flex:0 0 auto;justify-content:flex-start;max-width:100%;position:relative;white-space:nowrap;border:solid 1px #ccc;border-radius:12px;overflow:hidden}.xappw-vlist-container .xappw-vlist-container__item{display:inline-block;border-top:solid 1px #ccc}.xappw-vlist-container .xappw-vlist-container__item:first-child{border-top:none}.chat-menu-item{border:1px solid #ddd;border-radius:0;opacity:1;outline:none;background:var(--xapp-menu-item-background, #efefef);font-family:var(--xapp-menu-item-font-family, 14px);font-weight:var(--xapp-menu-item-font-weight, normal);font-size:var(--xapp-menu-item-font-size, 14px);font-style:var(--xapp-menu-item-font-style, normal);color:var(--xapp-menu-item-text-color, var(--xapp-primary-color, #616161));height:var(--xapp-menu-item-height, 24px);box-sizing:border-box;padding:4px 4px 4px 30px;text-align:left}.chat-menu-item:hover{opacity:.8;cursor:pointer}.xappw-chat-action-item{text-decoration:none}.xappw-chat-action-item--action{cursor:pointer}.chat-footer{position:relative;background-color:var(--xapp-footer-background, var(--xapp-primary-color, #616161))}.chat-footer__menu-icon{border-top:solid var(--xapp-footer-border-width, 0px) var(--xapp-footer-border-color, var(--xapp-primary-color, #616161));z-index:999;padding:6px 0;flex-shrink:0}.chat-footer__menu-icon+.chat-footer__input{margin-top:-6px}.chat-footer__input{margin-top:6px;margin-bottom:6px}.xappw-chat-footer__suggestions{position:absolute;bottom:100%;left:0;right:0;overflow:hidden;z-index:100}.server-offline{position:absolute;top:0;right:0;left:0;bottom:0;z-index:5000;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.status-container{display:flex;flex-flow:row nowrap;justify-content:space-between;padding-left:10px;z-index:999;line-height:40px;height:40px;flex-shrink:0;color:#fff;position:relative;width:100%;background-color:var(--xapp-header-background, var(--xapp-primary-color, #616161));border-bottom:solid var(--xapp-header-border-width, 0px) var(--xapp-header-border-color, var(--xapp-primary-color, #616161));align-items:center}.status-container__avatar{width:30px;height:30px}.status-container__avatar .avatar:not(.avatar--empty){background-color:#a4a7b6}.status-text{display:inline-block;position:absolute;left:48px;font-family:var(--xapp-header-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-header-font-weight, normal);font-size:var(--xapp-header-font-size, 16px);font-style:var(--xapp-header-font-style, normal);color:var(--xapp-header-text-color, rgba(255, 255, 255, 0.87))}.chat-card-img{display:block;width:100%;height:100%}.chat-card-img__content{background-position:center;background-size:cover;width:100%;height:100%}.xappw-suggestions{display:flex;flex-direction:column;font-family:RobotoRegular,serif}.xappw-suggestions__answer{background-color:#d9d9d9;padding:8px 11px;border-radius:12px}.xappw-suggestions__groups{background-color:#f3f3f3;padding:8px 0}.xappw-suggestions__use{width:28px;padding:4px;color:inherit}.xappw-multiselect{list-style:none;padding:0;margin:0}.xappw-multiselect li{padding:0;margin:0}.xapp-search-rich-text{display:inline-block;max-width:100%;overflow:hidden;white-space:pre-wrap}.xapp-search-icon-button{border:none;background:none;cursor:pointer;padding:0;display:flex;align-items:center}.xapp-search-icon-button__content{display:flex;width:100%}.xappw-message-bubble{border-radius:10px;padding:10px;background:var(--xapp-bubble-background, green)}.xappw-rich-input__input{display:block;width:100%;border:none;outline:none;box-sizing:border-box;margin:0;font-size:inherit;line-height:inherit;color:inherit}.xappw-suggestions-group__items{display:flex;flex-direction:column;padding:2px 0}.xappw-suggestions-group__heading{margin:0 16px}.xappw-suggestions-group-heading{display:flex;align-items:center;font-size:12px;padding:2px 0;color:#061739}.xappw-suggestions-group-heading:after{content:"";border-top:solid 1px #d4d4d4;flex:1 1 auto;margin-left:8px}.xappw-suggestions-item{padding:0 0 0 24px;box-sizing:border-box;width:100%;white-space:nowrap;display:flex;align-items:center;overflow:hidden;font-size:15px;cursor:pointer;border-bottom:solid 1px transparent;color:#061739}.xappw-suggestions-item--current,.xappw-suggestions-item:hover{background-color:#3395d2;color:#fff;text-decoration:underline}@media(hover: hover){.xappw-suggestions-item--current .xappw-suggestions-item__actions,.xappw-suggestions-item:hover .xappw-suggestions-item__actions{visibility:visible;color:#fff}}.xappw-suggestions-item__texts{padding:3px 0;flex:1 1 auto;overflow:hidden}.xappw-suggestions-item__actions{flex:0 0 auto;display:flex;margin-left:8px}@media(hover: hover){.xappw-suggestions-item__actions{visibility:hidden}}.xappw-suggestions-list{display:flex;flex-direction:column}.xapp-search-rich-text-span{flex:0 1 auto;display:inline-block;max-width:100%}.xapp-search-rich-text-span:last-child{overflow:hidden;white-space:pre;text-overflow:ellipsis}.xapp-search-rich-text-bold-span{font-weight:bold}.xapp-search-rich-text-input-span{text-decoration:none;font-size:inherit;height:calc(1.5em - 2px);line-height:1em;width:8em;color:inherit}.xapp-search-rich-text-input-span--readonly{border:dashed 1px green;color:green;height:calc(1em - 2px)}.xapp-search-rich-text-normal-span{font-weight:normal}.message-form .section{margin-bottom:16px}.message-form .label{display:block;margin-bottom:4px;color:var(--xapp-primary-color, #616161)}.message-form input,.message-form textarea{border:1px solid #ddd;border-radius:4px;outline-width:0;width:100%;font-size:14px;box-sizing:border-box}.message-form input{height:32px;padding:0 10px}.message-form textarea{padding:8px 10px;min-height:100px;resize:none;overflow-y:auto}.message-form__submit{width:100%;background-color:var(--xapp-primary-color, #616161);color:#fff}.message-form--shrink-enter{opacity:.01;position:relative;top:100px}.message-form--shrink-enter-active{position:relative;top:0;opacity:1;transition:opacity 500ms,top 500ms;transition-delay:500ms}.message-form--shrink-exit{opacity:.5;position:relative;top:0}.message-form--shrink-exit-active{top:-200px;opacity:.01;transition:top 500ms,opacity 500ms}.message-form--grow-enter{opacity:.5;position:relative;top:-200px}.message-form--grow-enter-active{position:relative;top:0;opacity:1;transition:opacity 500ms,top 500ms}.message-form--grow-exit{opacity:.5;position:relative;top:0;height:50px}.message-form--grow-exit-active{top:-100px;height:0;opacity:.01;transition:top 500ms,opacity 500ms,height 500ms}.message-form--sent .button-resend{width:100%;margin-top:16px;background-color:var(--xapp-primary-color, #616161);color:#fff}.drawer-bars{display:flex;flex-direction:column;align-items:center;padding:6px 0;cursor:pointer}.drawer-bar{flex:0 0 5px;border-radius:5px;background:var(--xapp-menu-button-color, #fff);width:25px;margin:2.5px}.drawer-bar:first-child{margin-top:0}.drawer-bar:last-child{margin-bottom:0}.xappw-input-container{flex-shrink:0;z-index:999;padding:6px 20px}.xappw-input-container:not(.visible){display:none}.xappw-input-container.drag-drop-zone{outline:3px dashed gray;outline-offset:-3px}.xappw-input-form{display:flex;align-items:center;overflow:hidden;line-height:48px;position:relative;border-radius:var(--xapp-input-border-radius, 20px);background:var(--xapp-input-background, #fff)}.xappw-input-form__buttons{display:flex;position:absolute;right:10px;z-index:2;height:16px}.xappw-input-form__btn{width:20px}.xappw-input{min-height:32px;padding:7px 10px;line-height:normal;display:inline-block;box-sizing:border-box;font-family:var(--xapp-input-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-font-weight, normal);font-size:var(--xapp-input-font-size, 14px);font-style:var(--xapp-input-font-style, normal);color:var(--xapp-input-text-color, #000);outline-width:0;flex-grow:1;border:var(--xapp-input-border-width, #fff) solid var(--xapp-input-border-color, #fff);background:transparent}.xappw-input:focus::placeholder{color:transparent}.xappw-input::placeholder{color:#7d7d7d}.xappw-input{z-index:1}.minimize-button{position:absolute;width:48px;top:0;right:0;height:100%;display:flex;justify-content:center;cursor:pointer;font-size:20px;color:var(--xapp-minimize-button-color, #a3a6b4)}.minimize-button:after{content:"⨉"}.card-container{padding-top:16px;position:relative}.card-container__content{color:#555;border-radius:8px;border:1px solid #ddd;padding:24px 16px 16px 16px;font-size:14px}.card-container__title{text-align:center;color:var(--xapp-primary-color, #616161);margin-bottom:8px}.card-container__icon{width:32px;height:32px;position:relative;background-color:#fff;border:1px solid #e0e0e0;border-radius:50%;box-shadow:0 2px 4px 0 rgba(0,0,0,.1);margin:-16px auto;z-index:999}@keyframes typing-animation{0%{transform:translateY(0px)}28%{transform:translateY(-5px)}44%{transform:translateY(0px)}}.typing-indicator{height:20px;display:inline-flex;align-items:center}.typing-indicator-part:nth-child(1){animation-delay:200ms}.typing-indicator-part:nth-child(2){animation-delay:300ms}.typing-indicator-part:nth-child(3){animation-delay:400ms}.typing-indicator-part{display:inline-block;animation:typing-animation 1.5s infinite ease-in-out;border-radius:50%;width:7px;height:7px;margin:0 3px;background-color:#7a7a7a}.xappw-send-button{color:var(--xapp-send-button-color, #505050)}
1
+ @font-face{font-family:OpenSansSemibold;font-style:normal;font-weight:600;font-display:swap;src:local("Open Sans SemiBold"),local("OpenSans-SemiBold"),url(https://fonts.gstatic.com/s/opensans/v17/mem5YaGs126MiZpBA-UNirkOUuhpKKSTjw.woff2) format("woff2")}@font-face{font-family:RobotoRegular;font-style:normal;font-weight:400;font-display:swap;src:local("Roboto"),local("Roboto-Regular"),url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format("woff2")}@font-face{font-family:RobotoMedium;font-style:oblique;font-weight:500;font-display:swap;src:local("Roboto Medium"),local("Roboto-Medium"),url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc4AMP6lQ.woff2) format("woff2")}::-webkit-input-placeholder{font-style:italic;color:#e1e2e1}:-moz-placeholder{font-style:italic}::-moz-placeholder{font-style:italic}:-ms-input-placeholder{font-style:italic}.widget-container{background:#fff;display:flex;flex-flow:column nowrap;width:100%;height:100%;visibility:hidden;font-family:RobotoRegular,serif;box-shadow:0 5px 40px rgba(0,0,0,.16);overflow:hidden;border-radius:var(--xapp-widget-border-radius, 10px);border:var(--xapp-widget-border-width, 0px) solid var(--xapp-widget-border-color, var(--xapp-primary-color, #616161));box-sizing:border-box}.widget-container *,.widget-container *:before,.widget-container *:after{box-sizing:border-box}.widget-container--normal,.widget-container--static{position:fixed;z-index:1000;right:var(--xapp-widget-margin-right, 10px);bottom:var(--xapp-widget-margin-bottom, 10px)}.widget-container--normal.visible,.widget-container--static.visible{width:min(var(--xapp-widget-width, 400px), 100vw - var(--xapp-widget-margin-left, 10px) - var(--xapp-widget-margin-right, 10px));height:min(var(--xapp-widget-height, 500px), 100vh - var(--xapp-widget-margin-top, 10px) - var(--xapp-widget-margin-bottom, 10px))}.widget-container--docked{width:100%;height:100%}.widget-container:not(.visible){animation:widget-hide .5s backwards;width:64px;height:64px}.widget-container.visible{animation:widget-show .5s forwards}svg{display:block;margin:auto;height:100%}.message-svg path{fill:var(--xapp-primary-color, #616161)}.chat-msg{line-height:20px;font-size:14px;margin-left:48px;max-width:var(--xapp-messages-max-width, 240px)}.chat-msg--expand{max-width:calc(100% - 48px);width:calc(100% - 48px)}.chat-msg__fullwidth{max-width:100%;width:100%}.chat-msg--no-ava{margin-left:0}.chat-typing-progress .chat-msg{color:#30375b}.visitor .chat-text-container{padding-right:20px}.chat-media-container{border-radius:8px;border:1px solid #ddd;overflow:hidden}.chat-img{min-width:180px;min-height:120px;background-position:center;background-size:cover}.system-msg-container{text-align:center;margin-bottom:16px}.system-msg{font-size:14px;color:#bfbfbf}.chat-rating-card{padding-bottom:16px;text-align:center}.buttons-container{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;width:100%}.buttons-container .button{flex-grow:1}.buttons-container .button:not(:last-child){margin-right:8px}.buttons-container .button-card{flex-grow:0}.buttons-container .button-card:not(:last-child){margin-right:8px}@keyframes widget-show{0%{visibility:hidden;opacity:0}1%{visibility:visible;opacity:0;transform:translateY(50%)}100%{visibility:visible;opacity:1;transform:translateY(0)}}@keyframes widget-hide{0%{transform:translateY(0)}99%{opacity:0;transform:translateY(50%)}100%{visibility:hidden;opacity:0}}@keyframes widget-show-grow{0%{visibility:hidden;opacity:0}1%{visibility:visible;opacity:0;transform:scale(0.5)}100%{visibility:visible;opacity:1;transform:scale(1)}}@keyframes widget-hide-shrink{0%{visibility:visible;opacity:1;transform:scale(1)}99%{visibility:visible;opacity:0;transform:scale(0.5)}100%{visibility:hidden;opacity:0}}.spinner-container{z-index:1000;position:absolute;width:100%;height:100%;display:flex;align-items:center;background:#fff;transition:visibility 500ms,opacity 500ms;visibility:hidden;opacity:0;top:0;left:0}.spinner-container.visible{visibility:visible;opacity:1}.spinner{width:40px;height:40px;margin:100px auto;background-color:var(--xapp-primary-color, #616161);border-radius:100%;-webkit-animation:sk-scaleout 1s infinite ease-in-out;animation:sk-scaleout 1s infinite ease-in-out}.chevron{width:100%;height:100%}@-webkit-keyframes sk-scaleout{0%{transform:scale(0)}100%{transform:scale(1);opacity:0}}@keyframes sk-scaleout{0%{transform:scale(0)}100%{transform:scale(1);opacity:0}}.action-button{border:1px solid #ddd;border-radius:4px;text-align:center;opacity:1;outline:none;font-size:14px;padding:8px;text-align:center}.action-button:hover{opacity:.8;cursor:pointer}.avatar{border-radius:16px;color:#fff;background-position:center;background-size:cover;background-repeat:no-repeat;width:100%;height:100%}.avatar--agent{background-color:#fff}.avatar--visitor{background-color:var(--xapp-primary-color, #616161)}.avatar--empty{background-color:transparent}.chat-button{position:fixed;bottom:0;right:0;cursor:pointer;margin-top:var(--xapp-chat-button-margin-top, var(--xapp-widget-margin-top, 16px));margin-right:var(--xapp-chat-button-margin-right, var(--xapp-widget-margin-right, 16px));margin-bottom:var(--xapp-chat-button-margin-bottom, var(--xapp-widget-margin-bottom, 16px));margin-left:var(--xapp-chat-button-margin-left, var(--xapp-widget-margin-left, 16px));display:block;opacity:1;animation:widget-show-grow .5s backwards;width:80px;height:80px}.chat-button.visible{animation:widget-hide-shrink .5s forwards}.chat-button__btn{position:absolute;width:48px;height:48px;border-radius:24px;background-color:var(--xapp-chat-button-background, var(--xapp-primary-color, #616161));box-shadow:0 0 8px 0 rgba(0,0,0,.3);bottom:0;right:0}.chat-button__cta{position:absolute;bottom:56px;right:24px;white-space:nowrap;font-size:16px;font-family:RobotoRegular,serif}.xappw-carousel{display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.xappw-carousel__prev,.xappw-carousel__next{flex:0 0 48px;height:30px;cursor:pointer}.xappw-carousel-items{display:flex;position:relative;height:auto;align-items:stretch;white-space:nowrap;overflow-x:hidden;overflow-y:hidden;scroll-behavior:smooth;-ms-overflow-style:none;-moz-overflow-style:none;-webkit-overflow-scrolling:touch}@media(hover: none)and (pointer: coarse){.xappw-carousel-items{overflow-x:auto}}.xappw-carousel-items__item{display:inline-flex;flex-direction:column;padding-right:10px;flex-shrink:0}.xappw-carousel-items__item:last-child{padding-right:0}@media(max-width: 640px){.xappw-carousel-items__item{min-width:100%}}.chat-chip{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;color:#2f385a;line-height:25px;border-radius:25px;border:thin solid #aeb3be;cursor:pointer;user-select:none}.chat-chip-link{text-decoration:underline}.chat-card-container{border-radius:10px;position:relative;overflow:hidden;color:#fff;background:#f6f6f6}.chat-card-container .chat-card-img{border-radius:0}.chat-card-container__img{min-width:220px;height:120px}.chat-card-container .chat-card-title{padding:2px 10px;color:#2e375a;font-family:RobotoMedium,serif;font-size:12px;line-height:14px;font-weight:bold}.chat-card-container .chat-card-title span{display:inline-block;white-space:pre-wrap}.chat-card-container .chat-card-sub-title{padding:2px 10px;color:#2e375a;font-family:RobotoRegular,serif;font-size:10px;line-height:14px}.chat-card-container .chat-card-sub-title span{display:inline-block;white-space:pre-wrap}.chat-card-container .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-primary-color, #616161);color:#d5d9e7;cursor:pointer}.chat-chips{width:100%;overflow-x:auto;overflow-y:hidden;white-space:nowrap;box-sizing:border-box;margin:0 auto;padding:10px;scroll-behavior:smooth;-ms-overflow-style:none;-moz-overflow-style:none;-webkit-overflow-scrolling:touch}.chat-chips::-webkit-scrollbar{background-color:#fff;height:10px}.chat-chips::-webkit-scrollbar-track{background-color:#fff}.chat-chips::-webkit-scrollbar-button{display:none}.chat-chips::-webkit-scrollbar-thumb{background-color:#babac0;border-radius:10px;border:2.5px solid #fff}.chat-menu{display:flex;flex-flow:column;flex-shrink:0;z-index:999;overflow-y:hidden;-webkit-transition:max-height .8s ease-in-out;-moz-transition:max-height .8s ease-in-out;-o-transition:max-height .8s ease-in-out;transition:max-height .8s ease-in-out}.chat-menu--closed{max-height:0}.chat-menu--opened{max-height:calc(4 * var(--xapp-menu-item-height, 24px))}.chat-msg-container-wrapper{display:flex;margin-bottom:16px}.chat-msg-container-wrapper.visitor{justify-content:flex-end}.chat-msg-container-wrapper.agent{justify-content:flex-start}.chat-msg-container-wrapper.sibling{margin-bottom:8px}.chat-msg-container-wrapper.sibling .avatar{display:none}.chat-msg-container{display:flex;flex-flow:column nowrap;flex:0 0 auto;justify-content:flex-start;max-width:100%;position:relative}.chat-msg-container.visitor{align-items:flex-end}.chat-msg-container.visitor .xappw-chat-msg-part__avatar{right:0;display:none}.chat-msg-container.agent{align-items:stretch}.chat-msg-container.agent .xappw-chat-msg-part__avatar{width:40px;height:40px;left:0}.chat-text-container p{margin:0 0 8px 0;padding:0}.cta-bubble{position:relative;border-radius:50%;background:var(--xapp-cta-background, #e1e2e1);display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;text-align:center;max-width:192px}.cta-bubble__tail{position:absolute;left:-16px;right:-16px;top:-16px;bottom:-16px;z-index:1;color:var(--xapp-cta-background, #e1e2e1)}.cta-bubble__tail svg{width:100%;height:100%;margin:0;padding:0}.cta-bubble__content{font-family:var(--xapp-cta-font-family, 14px);font-size:var(--xapp-cta-font-size, 14px);color:var(--xapp-cta-text-color, var(--xapp-primary-color, #616161));z-index:2}.chat-text-bubble{border-radius:10px;padding:10px;position:relative;overflow:visible}.chat-text-bubble--mine{font-family:var(--xapp-messages-mine-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-messages-mine-font-weight, normal);font-size:var(--xapp-messages-mine-font-size, 14px);font-style:var(--xapp-messages-mine-font-style, normal);color:var(--xapp-messages-mine-text-color, #ffffff);background:var(--xapp-messages-mine-bubble-color, #20df20);border-bottom-right-radius:0}.chat-text-bubble--mine .chat-text-bubble__tail{right:-8px;color:var(--xapp-messages-mine-bubble-color, #20df20)}.chat-text-bubble--others{font-family:var(--xapp-messages-others-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-messages-others-font-weight, normal);font-size:var(--xapp-messages-others-font-size, 14px);font-style:var(--xapp-messages-others-font-style, normal);color:var(--xapp-messages-others-text-color, #262726);background:var(--xapp-messages-others-bubble-color, #e1e2e1);border-bottom-left-radius:0}.chat-text-bubble--others .chat-text-bubble__tail{left:-8px;color:var(--xapp-messages-others-bubble-color, #e1e2e1)}.chat-text-bubble span{white-space:pre-wrap}.chat-typing-progress .chat-text-bubble{padding:8px 10px;margin-top:4px}.chat-text-bubble__tail{position:absolute;width:8px;height:24px;bottom:0}.xappw-vlist{display:flex;flex-flow:column nowrap}.xappw-vlist__header{padding:16px 8px;font-family:"RobotoRegular","serif";font-weight:bold;font-size:16px}.xappw-vlist-container{display:flex;flex-flow:column nowrap;flex:0 0 auto;justify-content:flex-start;max-width:100%;position:relative;white-space:nowrap;border:solid 1px #ccc;border-radius:12px;overflow:hidden}.xappw-vlist-container .xappw-vlist-container__item{display:inline-block;border-top:solid 1px #ccc}.xappw-vlist-container .xappw-vlist-container__item:first-child{border-top:none}.xappw-vlist-item{display:flex;flex-direction:row;flex:0 0 auto;min-width:100%;min-height:56px;padding:8px;box-sizing:border-box;cursor:pointer}.xappw-vlist-item--normal{align-items:flex-start}.xappw-vlist-item--titles{align-items:center}.xappw-vlist-item:hover{background-color:#eee}.xappw-vlist-item__description{display:flex;flex-direction:column;flex:1 1 auto;overflow:hidden}.xappw-vlist-item__side{flex:0 0 auto;display:flex;flex-direction:column}.xappw-vlist-item__img{border-radius:12px;width:40px;height:40px;overflow:hidden}.xappw-vlist-item__external-link{width:20px;margin:0 4px 4px auto;display:inline-block}.xappw-vlist-item__title{text-align:left;font-family:var(--xapp-carousel-title-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-title-font-weight, bold);font-size:var(--xapp-carousel-title-font-size, 14px);font-style:var(--xapp-carousel-title-font-style, normal);color:var(--xapp-carousel-title-text-color, #000);line-height:1.3}.xappw-vlist-item__title span{display:inline-block;white-space:pre-wrap}.xappw-vlist-item__link{font-family:var(--xapp-carousel-link-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-link-font-weight, normal);font-size:var(--xapp-carousel-link-font-size, 12px);font-style:var(--xapp-carousel-link-font-style, normal);color:var(--xapp-carousel-link-text-color, #666);line-height:1.3;overflow:hidden;text-overflow:ellipsis;max-width:100%}.xappw-vlist-item__subtitle{text-align:left;font-family:var(--xapp-carousel-subtitle-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-subtitle-font-weight, normal);font-size:var(--xapp-carousel-subtitle-font-size, 12px);font-style:var(--xapp-carousel-subtitle-font-style, normal);color:var(--xapp-carousel-subtitle-text-color, #979797);line-height:1.3}.xappw-vlist-item__subtitle span{display:inline-block;white-space:pre-wrap}.xappw-vlist-item .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-carousel-action-button-color, var(--xapp-primary-color, #616161));color:#d5d9e7;cursor:pointer}.message-list-container{flex-grow:1;flex-shrink:1;overflow-y:scroll;display:flex;flex-direction:column;background:var(--xapp-content-background, #fff)}.message-list-container__msgs{padding-top:var(--xapp-messages-padding-top, 16px);padding-right:var(--xapp-messages-padding-right, 16px);padding-bottom:var(--xapp-messages-padding-bottom, 0);padding-left:var(--xapp-messages-padding-left, 20px)}.message-list-container__chips{flex:0 0 auto;border-top:solid 1px #ccc;margin-top:auto}.message-list-container__chips--empty{flex-basis:0;border:none;overflow:hidden}.chat-list-item{display:flex;flex-direction:column;align-items:flex-start;min-width:220px;min-height:120px;flex:1 1 auto;border:solid 1px #ccc;border-radius:12px}.chat-list-item-container{display:flex;flex-direction:column;flex:1 1 auto}.chat-list-item__img{border-radius:12px 12px 0 0;width:100%;height:120px;overflow:hidden}.chat-list-item__title{text-align:left;font-family:var(--xapp-carousel-title-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-title-font-weight, bold);font-size:var(--xapp-carousel-title-font-size, 14px);font-style:var(--xapp-carousel-title-font-style, normal);color:var(--xapp-carousel-title-text-color, #000);line-height:1.3;padding:2px}.chat-list-item__title span{display:inline-block;white-space:pre-wrap}.chat-list-item__subtitle{text-align:left;font-family:var(--xapp-carousel-subtitle-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-carousel-subtitle-font-weight, normal);font-size:var(--xapp-carousel-subtitle-font-size, 12px);font-style:var(--xapp-carousel-subtitle-font-style, normal);color:var(--xapp-carousel-subtitle-text-color, #979797);line-height:1.3;max-width:200px;padding:2px}.chat-list-item__subtitle span{display:inline-block;white-space:pre-wrap}.chat-list-item__actions{margin-top:auto}.chat-list-item .action-button{display:inline-block;padding:0 10px;margin:3px;height:25px;font-size:12px;line-height:25px;border-radius:25px;background-color:var(--xapp-carousel-action-button-color, var(--xapp-primary-color, #616161));color:#d5d9e7;cursor:pointer}.xappw-chat-msg-part{display:inline-block;position:relative;word-wrap:break-word}.xappw-chat-msg-part+.xappw-chat-msg-part{margin-top:4px}.xappw-chat-msg-part+.xappw-chat-msg-part .chat-card-img{border-radius:12px 12px 12px 0}.xappw-chat-msg-part__avatar{position:absolute;bottom:0;z-index:10}.xappw-chat-msg-part ul{list-style-position:inside;padding:0;margin:0 0 8px 0}.xappw-chat-msg-part li{padding:0;margin:0}.chat-menu-item{border:1px solid #ddd;border-radius:0;opacity:1;outline:none;background:var(--xapp-menu-item-background, #efefef);font-family:var(--xapp-menu-item-font-family, 14px);font-weight:var(--xapp-menu-item-font-weight, normal);font-size:var(--xapp-menu-item-font-size, 14px);font-style:var(--xapp-menu-item-font-style, normal);color:var(--xapp-menu-item-text-color, var(--xapp-primary-color, #616161));height:var(--xapp-menu-item-height, 24px);box-sizing:border-box;padding:4px 4px 4px 30px;text-align:left}.chat-menu-item:hover{opacity:.8;cursor:pointer}.xappw-chat-action-item{text-decoration:none}.xappw-chat-action-item--action{cursor:pointer}.chat-footer{position:relative;background-color:var(--xapp-footer-background, var(--xapp-primary-color, #616161))}.chat-footer__menu-icon{border-top:solid var(--xapp-footer-border-width, 0px) var(--xapp-footer-border-color, var(--xapp-primary-color, #616161));z-index:999;padding:6px 0;flex-shrink:0}.chat-footer__menu-icon+.chat-footer__input{margin-top:-6px}.chat-footer__input{margin-top:6px;margin-bottom:6px}.xappw-chat-footer__suggestions{position:absolute;bottom:100%;left:0;right:0;overflow:hidden;z-index:100}.server-offline{position:absolute;top:0;right:0;left:0;bottom:0;z-index:5000;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.status-container{display:flex;flex-flow:row nowrap;justify-content:space-between;padding-left:10px;z-index:999;line-height:40px;height:40px;flex-shrink:0;color:#fff;position:relative;width:100%;background-color:var(--xapp-header-background, var(--xapp-primary-color, #616161));border-bottom:solid var(--xapp-header-border-width, 0px) var(--xapp-header-border-color, var(--xapp-primary-color, #616161));align-items:center}.status-container__avatar{width:30px;height:30px}.status-container__avatar .avatar:not(.avatar--empty){background-color:#a4a7b6}.status-text{display:inline-block;position:absolute;left:48px;font-family:var(--xapp-header-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-header-font-weight, normal);font-size:var(--xapp-header-font-size, 16px);font-style:var(--xapp-header-font-style, normal);color:var(--xapp-header-text-color, rgba(255, 255, 255, 0.87))}.chat-card-img{display:block;width:100%;height:100%}.chat-card-img__content{background-position:center;background-size:cover;width:100%;height:100%}.xappw-suggestions{display:flex;flex-direction:column;font-family:RobotoRegular,serif}.xappw-suggestions__answer{background-color:#d9d9d9;padding:8px 11px;border-radius:12px}.xappw-suggestions__groups{background-color:#f3f3f3;padding:8px 0}.xappw-suggestions__use{width:28px;padding:4px;color:inherit}.xappw-multiselect{list-style:none;padding:0;margin:0}.xappw-multiselect li{padding:0;margin:0}.xapp-search-rich-text{display:inline-block;max-width:100%;overflow:hidden;white-space:pre-wrap}.xapp-search-icon-button{border:none;background:none;cursor:pointer;padding:0;display:flex;align-items:center}.xapp-search-icon-button__content{display:flex;width:100%}.xappw-rich-input__input{display:block;width:100%;border:none;outline:none;box-sizing:border-box;margin:0;font-size:inherit;line-height:inherit;color:inherit}.xappw-message-bubble{border-radius:10px;padding:10px;background:var(--xapp-bubble-background, green)}.xappw-suggestions-group__items{display:flex;flex-direction:column;padding:2px 0}.xappw-suggestions-group__heading{margin:0 16px}.xappw-suggestions-list{display:flex;flex-direction:column}.xappw-suggestions-item{padding:0 0 0 24px;box-sizing:border-box;width:100%;white-space:nowrap;display:flex;align-items:center;overflow:hidden;font-size:15px;cursor:pointer;border-bottom:solid 1px transparent;color:#061739}.xappw-suggestions-item--current,.xappw-suggestions-item:hover{background-color:#3395d2;color:#fff;text-decoration:underline}@media(hover: hover){.xappw-suggestions-item--current .xappw-suggestions-item__actions,.xappw-suggestions-item:hover .xappw-suggestions-item__actions{visibility:visible;color:#fff}}.xappw-suggestions-item__texts{padding:3px 0;flex:1 1 auto;overflow:hidden}.xappw-suggestions-item__actions{flex:0 0 auto;display:flex;margin-left:8px}@media(hover: hover){.xappw-suggestions-item__actions{visibility:hidden}}.xappw-suggestions-group-heading{display:flex;align-items:center;font-size:12px;padding:2px 0;color:#061739}.xappw-suggestions-group-heading:after{content:"";border-top:solid 1px #d4d4d4;flex:1 1 auto;margin-left:8px}.xapp-search-rich-text-span{flex:0 1 auto;display:inline-block;max-width:100%}.xapp-search-rich-text-span:last-child{overflow:hidden;white-space:pre;text-overflow:ellipsis}.xapp-search-rich-text-input-span{text-decoration:none;font-size:inherit;height:calc(1.5em - 2px);line-height:1em;width:8em;color:inherit}.xapp-search-rich-text-input-span--readonly{border:dashed 1px green;color:green;height:calc(1em - 2px)}.xapp-search-rich-text-bold-span{font-weight:bold}.xapp-search-rich-text-normal-span{font-weight:normal}.message-form .section{margin-bottom:16px}.message-form .label{display:block;margin-bottom:4px;color:var(--xapp-primary-color, #616161)}.message-form input,.message-form textarea{border:1px solid #ddd;border-radius:4px;outline-width:0;width:100%;font-size:14px;box-sizing:border-box}.message-form input{height:32px;padding:0 10px}.message-form textarea{padding:8px 10px;min-height:100px;resize:none;overflow-y:auto}.message-form__submit{width:100%;background-color:var(--xapp-primary-color, #616161);color:#fff}.message-form--shrink-enter{opacity:.01;position:relative;top:100px}.message-form--shrink-enter-active{position:relative;top:0;opacity:1;transition:opacity 500ms,top 500ms;transition-delay:500ms}.message-form--shrink-exit{opacity:.5;position:relative;top:0}.message-form--shrink-exit-active{top:-200px;opacity:.01;transition:top 500ms,opacity 500ms}.message-form--grow-enter{opacity:.5;position:relative;top:-200px}.message-form--grow-enter-active{position:relative;top:0;opacity:1;transition:opacity 500ms,top 500ms}.message-form--grow-exit{opacity:.5;position:relative;top:0;height:50px}.message-form--grow-exit-active{top:-100px;height:0;opacity:.01;transition:top 500ms,opacity 500ms,height 500ms}.message-form--sent .button-resend{width:100%;margin-top:16px;background-color:var(--xapp-primary-color, #616161);color:#fff}.drawer-bars{display:flex;flex-direction:column;align-items:center;padding:6px 0;cursor:pointer}.drawer-bar{flex:0 0 5px;border-radius:5px;background:var(--xapp-menu-button-color, #fff);width:25px;margin:2.5px}.drawer-bar:first-child{margin-top:0}.drawer-bar:last-child{margin-bottom:0}.xappw-input-container{flex-shrink:0;z-index:999;padding:6px 20px}.xappw-input-container:not(.visible){display:none}.xappw-input-container.drag-drop-zone{outline:3px dashed gray;outline-offset:-3px}.xappw-input-form{display:flex;align-items:center;overflow:hidden;line-height:48px;position:relative;border-radius:var(--xapp-input-border-radius, 20px);background:var(--xapp-input-background, #fff)}.xappw-input-form__buttons{display:flex;position:absolute;right:10px;z-index:2;height:16px}.xappw-input-form__btn{width:20px}.xappw-input{min-height:32px;padding:7px 10px;line-height:normal;display:inline-block;box-sizing:border-box;font-family:var(--xapp-input-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-font-weight, normal);font-size:var(--xapp-input-font-size, 14px);font-style:var(--xapp-input-font-style, normal);color:var(--xapp-input-text-color, #000);outline-width:0;flex-grow:1;border:var(--xapp-input-border-width, #fff) solid var(--xapp-input-border-color, #fff);background:transparent}.xappw-input:focus::placeholder{color:transparent}.xappw-input::placeholder{color:#7d7d7d}.xappw-input{z-index:1}.minimize-button{position:absolute;width:48px;top:0;right:48px;height:100%;display:flex;justify-content:center;cursor:pointer;font-size:20px;color:var(--xapp-minimize-button-color, #a3a6b4)}.minimize-button:after{content:"─"}.minimize-button.positionRight{right:0}.cancel-button{position:absolute;width:48px;top:0;right:0;height:100%;display:flex;justify-content:center;cursor:pointer;font-size:20px;color:var(--xapp-cancel-button-color, #a3a6b4)}.cancel-button:after{content:"⨉"}.card-container{padding-top:16px;position:relative}.card-container__content{color:#555;border-radius:8px;border:1px solid #ddd;padding:24px 16px 16px 16px;font-size:14px}.card-container__title{text-align:center;color:var(--xapp-primary-color, #616161);margin-bottom:8px}.card-container__icon{width:32px;height:32px;position:relative;background-color:#fff;border:1px solid #e0e0e0;border-radius:50%;box-shadow:0 2px 4px 0 rgba(0,0,0,.1);margin:-16px auto;z-index:999}@keyframes typing-animation{0%{transform:translateY(0px)}28%{transform:translateY(-5px)}44%{transform:translateY(0px)}}.typing-indicator{height:20px;display:inline-flex;align-items:center}.typing-indicator-part:nth-child(1){animation-delay:200ms}.typing-indicator-part:nth-child(2){animation-delay:300ms}.typing-indicator-part:nth-child(3){animation-delay:400ms}.typing-indicator-part{display:inline-block;animation:typing-animation 1.5s infinite ease-in-out;border-radius:50%;width:7px;height:7px;margin:0 3px;background-color:#7a7a7a}.xappw-send-button{color:var(--xapp-send-button-color, #505050)}
package/dist/index.es.js CHANGED
@@ -1890,6 +1890,9 @@ function throwBadKind$1(x) {
1890
1890
 
1891
1891
  function execute(url, behavior) {
1892
1892
  var type = behavior.type;
1893
+ if (get("opened")) {
1894
+ set("opened", false);
1895
+ }
1893
1896
  switch (type) {
1894
1897
  case "newWindow":
1895
1898
  window.open(url, "callout-option", "toolbar=0,status=0,width=".concat(behavior.width || 1000, ",height=").concat(behavior.height || 700));
@@ -1898,6 +1901,10 @@ function execute(url, behavior) {
1898
1901
  window.open(url, "_blank");
1899
1902
  break;
1900
1903
  case "sameWindow":
1904
+ // For reopen widget after move on same window
1905
+ if (get("visible")) {
1906
+ set("opened", true);
1907
+ }
1901
1908
  window.open(url, "_self");
1902
1909
  break;
1903
1910
  default:
@@ -1926,7 +1933,8 @@ function writeMessage(msg, user) {
1926
1933
 
1927
1934
  function executeAction(text, token) {
1928
1935
  return function (chatServer) { return function (dispatch, getState) {
1929
- chatServer.sendChatMsg({ text: text, token: token }, function (err) {
1936
+ var attributes = getState().attributes;
1937
+ chatServer.sendChatMsg({ text: text, token: token, attributes: attributes }, function (err) {
1930
1938
  if (err) {
1931
1939
  log("Error sending message", err);
1932
1940
  return;
@@ -2062,6 +2070,12 @@ function setConnectionStatus(status) {
2062
2070
  };
2063
2071
  }
2064
2072
 
2073
+ function reset() {
2074
+ return {
2075
+ type: "reset"
2076
+ };
2077
+ }
2078
+
2065
2079
  function useChatDispatch() {
2066
2080
  return useDispatch();
2067
2081
  }
@@ -2963,6 +2977,7 @@ var StentorDirectChat = /** @class */ (function () {
2963
2977
  this._userId = "";
2964
2978
  this._sessionId = "";
2965
2979
  this._accessToken = "";
2980
+ this._attributes = {};
2966
2981
  this.config = config;
2967
2982
  this.options = options;
2968
2983
  this.isNewSession = false;
@@ -3109,8 +3124,10 @@ var StentorDirectChat = /** @class */ (function () {
3109
3124
  };
3110
3125
  StentorDirectChat.prototype.setVisitorInfo = function (visitorInfo, cb) {
3111
3126
  this.visitorInfo = visitorInfo;
3127
+ this._attributes = this.visitorInfo.attributes;
3112
3128
  this._accessToken = this.visitorInfo.accessToken;
3113
3129
  this.startSession();
3130
+ // This is for the bot
3114
3131
  this.userJoined({
3115
3132
  user: this.getBot(undefined),
3116
3133
  token: ""
@@ -3131,23 +3148,27 @@ var StentorDirectChat = /** @class */ (function () {
3131
3148
  StentorDirectChat.prototype.postMessage = function (message) {
3132
3149
  var _a, _b, _c, _d;
3133
3150
  return __awaiter$1(this, void 0, void 0, function () {
3134
- var request, accessToken, now, permissionRequest, expired, text, granted, userProfile, isEmail, botResponse, responseMessage;
3151
+ var request, userId, sessionId, accessToken, attributes, now, permissionRequest, expired, text, granted, userProfile, isEmail, botResponse, responseMessage;
3135
3152
  return __generator$1(this, function (_e) {
3136
3153
  switch (_e.label) {
3137
3154
  case 0:
3155
+ userId = this._userId;
3156
+ sessionId = this._sessionId;
3138
3157
  accessToken = this._accessToken;
3158
+ attributes = this._attributes || {};
3139
3159
  now = new Date().getTime();
3140
3160
  if (this.isNewSession && !((_a = message === null || message === void 0 ? void 0 : message.msg) === null || _a === void 0 ? void 0 : _a.text)) {
3141
3161
  request = {
3142
3162
  type: "LAUNCH_REQUEST",
3143
3163
  rawQuery: (_b = message === null || message === void 0 ? void 0 : message.msg) === null || _b === void 0 ? void 0 : _b.text,
3144
- sessionId: this._sessionId,
3145
- userId: this._userId,
3164
+ sessionId: sessionId,
3165
+ userId: userId,
3146
3166
  isNewSession: true,
3147
3167
  intentId: "LaunchRequest",
3148
3168
  platform: "stentor-platform",
3149
3169
  channel: "widget",
3150
- accessToken: accessToken
3170
+ accessToken: accessToken,
3171
+ attributes: attributes
3151
3172
  };
3152
3173
  }
3153
3174
  else {
@@ -3157,7 +3178,7 @@ var StentorDirectChat = /** @class */ (function () {
3157
3178
  expired = now - permissionRequest.time > PERMISSION_QUESTION_EXPIRATION_MS;
3158
3179
  text = (_d = message.msg.text) === null || _d === void 0 ? void 0 : _d.toLowerCase();
3159
3180
  granted = !expired;
3160
- userProfile = {};
3181
+ userProfile = { id: this._userId };
3161
3182
  if (!expired) {
3162
3183
  if (permissionRequest.type === "EMAIL") {
3163
3184
  isEmail = looksLikeEmail(text);
@@ -3187,7 +3208,8 @@ var StentorDirectChat = /** @class */ (function () {
3187
3208
  intentId: "PermissionGrant",
3188
3209
  platform: "stentor-platform",
3189
3210
  channel: "widget",
3190
- accessToken: accessToken
3211
+ accessToken: accessToken,
3212
+ attributes: attributes
3191
3213
  };
3192
3214
  }
3193
3215
  else if (message.type === "custom") {
@@ -3195,7 +3217,7 @@ var StentorDirectChat = /** @class */ (function () {
3195
3217
  // token: message.msg.token,
3196
3218
  sessionId: this._sessionId, userId: this._userId, isNewSession: false,
3197
3219
  // intentId: "OptionSelect",
3198
- platform: "stentor-platform", channel: "widget", accessToken: accessToken });
3220
+ platform: "stentor-platform", channel: "widget", accessToken: accessToken, attributes: attributes });
3199
3221
  }
3200
3222
  else if (message.msg.token) {
3201
3223
  request = {
@@ -3207,7 +3229,8 @@ var StentorDirectChat = /** @class */ (function () {
3207
3229
  intentId: "OptionSelect",
3208
3230
  platform: "stentor-platform",
3209
3231
  channel: "widget",
3210
- accessToken: accessToken
3232
+ accessToken: accessToken,
3233
+ attributes: attributes
3211
3234
  };
3212
3235
  }
3213
3236
  else {
@@ -3220,7 +3243,8 @@ var StentorDirectChat = /** @class */ (function () {
3220
3243
  intentId: "NLU_RESULT_PLACEHOLDER",
3221
3244
  platform: "stentor-platform",
3222
3245
  channel: "widget",
3223
- accessToken: accessToken
3246
+ accessToken: accessToken,
3247
+ attributes: attributes
3224
3248
  };
3225
3249
  }
3226
3250
  }
@@ -3261,7 +3285,7 @@ var StentorDirectChat = /** @class */ (function () {
3261
3285
  };
3262
3286
  StentorDirectChat.prototype.startSession = function () {
3263
3287
  if (this.visitorInfo.visitorId) {
3264
- this._userId = "stentor-widget-user-".concat(this.visitorInfo.visitorId);
3288
+ this._userId = "".concat(this.visitorInfo.visitorId);
3265
3289
  }
3266
3290
  else if (this.visitorInfo.email) {
3267
3291
  this._userId = "stentor-widget-user-".concat(this.visitorInfo.email);
@@ -3270,6 +3294,7 @@ var StentorDirectChat = /** @class */ (function () {
3270
3294
  this._userId = "stentor-widget-user-".concat(uuid_1());
3271
3295
  }
3272
3296
  this._sessionId = "stentor-widget-session-".concat(uuid_1());
3297
+ // This is a flag that is cleared after the first message is sent
3273
3298
  this.isNewSession = true;
3274
3299
  };
3275
3300
  Object.defineProperty(StentorDirectChat.prototype, "userId", {
@@ -7463,11 +7488,12 @@ function useExternalScript(url) {
7463
7488
  return;
7464
7489
  }
7465
7490
  var id = getSrcId(url);
7466
- var exisiting = document.getElementById(id);
7467
- if (!exisiting) {
7491
+ var existing = document.getElementById(id);
7492
+ if (!existing) {
7468
7493
  var script = document.createElement("script");
7469
7494
  script.id = id;
7470
7495
  script.src = url;
7496
+ script.crossOrigin = 'anonymous';
7471
7497
  document.head.appendChild(script);
7472
7498
  }
7473
7499
  }, [url]);
@@ -7498,11 +7524,14 @@ function useChatServerVisitorId() {
7498
7524
  return state.visitorId || state.userId;
7499
7525
  });
7500
7526
  var visitorAccessToken = useSelector(function (state) { return state.accessToken; });
7527
+ var attributes = useSelector(function (state) { return state.attributes; });
7501
7528
  return useMemo(function () { return ({
7502
7529
  dispatch: dispatch,
7503
7530
  visitorId: clientVisitorId,
7504
- accessToken: visitorAccessToken
7505
- }); }, [dispatch, clientVisitorId, visitorAccessToken]);
7531
+ accessToken: visitorAccessToken,
7532
+ userId: clientVisitorId,
7533
+ attributes: attributes
7534
+ }); }, [dispatch, clientVisitorId, visitorAccessToken, attributes]);
7506
7535
  }
7507
7536
  //send whenever server settings or visitor id changes
7508
7537
  function useGreeting(active) {
@@ -7516,7 +7545,9 @@ function useGreeting(active) {
7516
7545
  curr.dispatch(sendVisitorInfo({
7517
7546
  name: "Visitor",
7518
7547
  visitorId: curr.visitorId,
7519
- accessToken: curr.accessToken
7548
+ userId: curr.userId,
7549
+ accessToken: curr.accessToken,
7550
+ attributes: curr.attributes
7520
7551
  }));
7521
7552
  var timeoutId_1 = setTimeout(function () {
7522
7553
  var greetingAction = sendGreeting();
@@ -8050,7 +8081,7 @@ var MessageList = function (props) {
8050
8081
  var messagesEndRef = useRef(null);
8051
8082
  useEffect(function () {
8052
8083
  messagesEndRef.current.scrollIntoView({ behavior: "smooth" });
8053
- }, [props.messages]);
8084
+ }, [props.messages, props.agents]);
8054
8085
  var handleSend = useCallback(function (msg) {
8055
8086
  onSend(msg);
8056
8087
  messagesEndRef.current.scrollIntoView({ behavior: "smooth" });
@@ -8127,8 +8158,12 @@ var ServerOffline = function () {
8127
8158
  React$1.createElement("h3", null, "Server is offline"));
8128
8159
  };
8129
8160
 
8161
+ var CancelButton = function (props) {
8162
+ return React$1.createElement("div", { className: "cancel-button", onClick: props.onClick });
8163
+ };
8164
+
8130
8165
  var MinimizeButton = function (props) {
8131
- return React$1.createElement("div", { className: "minimize-button", onClick: props.onClick });
8166
+ return (React$1.createElement("div", { className: "minimize-button ".concat(props.showInRight ? "positionRight" : ""), onClick: props.onClick }));
8132
8167
  };
8133
8168
 
8134
8169
  var DEFAULT_STATUS_CONFIG = {
@@ -8154,12 +8189,14 @@ var StatusContainer = function (props) {
8154
8189
  React$1.createElement("div", { className: "status-text" },
8155
8190
  React$1.createElement("span", null, getStatusText(props.accountStatus, (_a = props.config) === null || _a === void 0 ? void 0 : _a.status))),
8156
8191
  props.canMinimize &&
8157
- React$1.createElement(MinimizeButton, { onClick: props.minimizeOnClick })));
8192
+ React$1.createElement(MinimizeButton, { onClick: props.minimizeOnClick, showInRight: !props.canCancel }),
8193
+ props.canCancel &&
8194
+ React$1.createElement(CancelButton, { onClick: props.cancelOnClick })));
8158
8195
  };
8159
8196
 
8160
8197
  function buildStyleContent(theme) {
8161
8198
  var _a, _b, _c, _d;
8162
- return "\n:root {\n".concat(buildVariables(withPrefix("\t--xapp-", union(single("primary-color", theme === null || theme === void 0 ? void 0 : theme.primaryColor), withPrefix("widget-", union(getSize(theme === null || theme === void 0 ? void 0 : theme.size), getMargins(theme === null || theme === void 0 ? void 0 : theme.margin), getBorderStyle(theme === null || theme === void 0 ? void 0 : theme.border))), getChatButtonStyle(theme === null || theme === void 0 ? void 0 : theme.chatButton), withPrefix("header-", getHeaderStyle(theme === null || theme === void 0 ? void 0 : theme.header)), withPrefix("footer-", getFooterStyle(theme === null || theme === void 0 ? void 0 : theme.footer)), withPrefix("content-", union(getBackgroundStyle((_a = theme === null || theme === void 0 ? void 0 : theme.content) === null || _a === void 0 ? void 0 : _a.background))), withPrefix("messages-", getMessagesStyle(theme === null || theme === void 0 ? void 0 : theme.messages)), withPrefix("send-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.sendButton)), withPrefix("menu-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.menuButton)), withPrefix("menu-", getMenuStyle(theme === null || theme === void 0 ? void 0 : theme.menu)), withPrefix("minimize-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.minimizeButton)), withPrefix("carousel-", union(withPrefix("title-", getTextStyle((_b = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _b === void 0 ? void 0 : _b.title)), withPrefix("subtitle-", getTextStyle((_c = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _c === void 0 ? void 0 : _c.subtitle)), withPrefix("action-", getButtonStyle((_d = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _d === void 0 ? void 0 : _d.button)))), withPrefix("input-", getInputStyle(theme === null || theme === void 0 ? void 0 : theme.input)), withPrefix("cta-", getCtaStyle(theme === null || theme === void 0 ? void 0 : theme.cta))))), "\n}");
8199
+ return "\n:root {\n".concat(buildVariables(withPrefix("\t--xapp-", union(single("primary-color", theme === null || theme === void 0 ? void 0 : theme.primaryColor), withPrefix("widget-", union(getSize(theme === null || theme === void 0 ? void 0 : theme.size), getMargins(theme === null || theme === void 0 ? void 0 : theme.margin), getBorderStyle(theme === null || theme === void 0 ? void 0 : theme.border))), getChatButtonStyle(theme === null || theme === void 0 ? void 0 : theme.chatButton), withPrefix("header-", getHeaderStyle(theme === null || theme === void 0 ? void 0 : theme.header)), withPrefix("footer-", getFooterStyle(theme === null || theme === void 0 ? void 0 : theme.footer)), withPrefix("content-", union(getBackgroundStyle((_a = theme === null || theme === void 0 ? void 0 : theme.content) === null || _a === void 0 ? void 0 : _a.background))), withPrefix("messages-", getMessagesStyle(theme === null || theme === void 0 ? void 0 : theme.messages)), withPrefix("send-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.sendButton)), withPrefix("menu-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.menuButton)), withPrefix("menu-", getMenuStyle(theme === null || theme === void 0 ? void 0 : theme.menu)), withPrefix("minimize-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.minimizeButton)), withPrefix("cancel-", getButtonStyle(theme === null || theme === void 0 ? void 0 : theme.cancelButton)), withPrefix("carousel-", union(withPrefix("title-", getTextStyle((_b = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _b === void 0 ? void 0 : _b.title)), withPrefix("subtitle-", getTextStyle((_c = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _c === void 0 ? void 0 : _c.subtitle)), withPrefix("action-", getButtonStyle((_d = theme === null || theme === void 0 ? void 0 : theme.carousel) === null || _d === void 0 ? void 0 : _d.button)))), withPrefix("input-", getInputStyle(theme === null || theme === void 0 ? void 0 : theme.input)), withPrefix("cta-", getCtaStyle(theme === null || theme === void 0 ? void 0 : theme.cta))))), "\n}");
8163
8200
  }
8164
8201
  function WidgetStylesheet(props) {
8165
8202
  var theme = props.theme;
@@ -8432,7 +8469,7 @@ var ChatWidgetWrapper = function (props) {
8432
8469
  React$1.createElement(ChatWidget, __assign({}, props)))));
8433
8470
  };
8434
8471
  var ChatWidget = function (props) {
8435
- var _a, _b, _c, _d, _e, _f;
8472
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
8436
8473
  var innerDispatch = useChatDispatch();
8437
8474
  var dispatch = useChatServerDispatch();
8438
8475
  // From Redux
@@ -8441,18 +8478,32 @@ var ChatWidget = function (props) {
8441
8478
  var dockedMode = mode === "docked";
8442
8479
  var staticMode = mode === "static";
8443
8480
  var modeClass = "widget-container--".concat(mode);
8444
- var canMinimize = !dockedMode && !staticMode;
8481
+ var canMinimize = !dockedMode && !staticMode && ((_c = (_b = props.config.header) === null || _b === void 0 ? void 0 : _b.actions) === null || _c === void 0 ? void 0 : _c.minimize);
8482
+ var canCancel;
8483
+ // To preserve legacy behavior, cancel needs a little more checks
8484
+ if (typeof ((_e = (_d = props.config.header) === null || _d === void 0 ? void 0 : _d.actions) === null || _e === void 0 ? void 0 : _e.cancel) === "boolean") {
8485
+ canCancel = !dockedMode && !staticMode && ((_g = (_f = props.config.header) === null || _f === void 0 ? void 0 : _f.actions) === null || _g === void 0 ? void 0 : _g.cancel);
8486
+ }
8487
+ else {
8488
+ canCancel = !dockedMode && !staticMode;
8489
+ }
8445
8490
  // Our state - pull from storage
8446
- var _g = useState(!canMinimize || !!get("visible)") || (((_b = props.config) === null || _b === void 0 ? void 0 : _b.autoOpenOnWidth) && window.matchMedia("(min-width: ".concat((_c = props.config) === null || _c === void 0 ? void 0 : _c.autoOpenOnWidth, ")")).matches)), visible = _g[0], setVisibleState = _g[1];
8447
- var _h = useState(false), typing = _h[0], setTypingState = _h[1]; // false initially
8491
+ var _o = useState(!canMinimize || !!get("visible)") || (((_h = props.config) === null || _h === void 0 ? void 0 : _h.autoOpenOnWidth) && window.matchMedia("(min-width: ".concat((_j = props.config) === null || _j === void 0 ? void 0 : _j.autoOpenOnWidth, ")")).matches)), visible = _o[0], setVisibleState = _o[1];
8492
+ var _p = useState(false), typing = _p[0], setTypingState = _p[1]; // false initially
8448
8493
  var chatServer = useContext(ChatServerContext);
8449
- function setVisible(newVisible) {
8494
+ var setVisible = useCallback(function (newVisible) {
8450
8495
  if (staticMode) {
8451
8496
  return;
8452
8497
  }
8453
8498
  setVisibleState(newVisible);
8454
8499
  set("visible", newVisible);
8455
- }
8500
+ }, [staticMode]);
8501
+ useEffect(function () {
8502
+ // For reopen widget after move on same window
8503
+ if (get("opened")) {
8504
+ setVisible(true);
8505
+ }
8506
+ }, [setVisible]);
8456
8507
  function handleOnChange() {
8457
8508
  if (!typing) {
8458
8509
  dispatch(sendTyping(true));
@@ -8501,6 +8552,10 @@ var ChatWidget = function (props) {
8501
8552
  function minimizeOnClick() {
8502
8553
  setVisible(false);
8503
8554
  }
8555
+ function cancelOnClick() {
8556
+ innerDispatch(reset());
8557
+ setVisible(false);
8558
+ }
8504
8559
  function chatButtonOnClick() {
8505
8560
  setVisible(true);
8506
8561
  }
@@ -8544,17 +8599,17 @@ var ChatWidget = function (props) {
8544
8599
  onConnectionStatusChange(connectionStatus);
8545
8600
  }
8546
8601
  }, [connectionStatus, onConnectionStatusChange]);
8547
- useExternalScript((_d = props.config) === null || _d === void 0 ? void 0 : _d.middlewareUrl);
8602
+ useExternalScript((_k = props.config) === null || _k === void 0 ? void 0 : _k.middlewareUrl);
8548
8603
  return (React$1.createElement(React$1.Fragment, null,
8549
8604
  React$1.createElement("div", { className: "widget-container ".concat(modeClass, " ").concat(getVisibilityClass()) },
8550
8605
  React$1.createElement(WidgetStylesheet, { theme: config === null || config === void 0 ? void 0 : config.theme }),
8551
- React$1.createElement(StatusContainer, { accountStatus: chatState.accountStatus, minimizeOnClick: minimizeOnClick, agent: (_e = chatState.agents["agent:robot"]) === null || _e === void 0 ? void 0 : _e.user, canMinimize: canMinimize, config: config === null || config === void 0 ? void 0 : config.header }),
8606
+ React$1.createElement(StatusContainer, { accountStatus: chatState.accountStatus, minimizeOnClick: minimizeOnClick, cancelOnClick: cancelOnClick, agent: (_l = chatState.agents["agent:robot"]) === null || _l === void 0 ? void 0 : _l.user, canMinimize: canMinimize, canCancel: canCancel, config: config === null || config === void 0 ? void 0 : config.header }),
8552
8607
  React$1.createElement(MessageList, { visible: visible, queuePosition: chatState.queuePosition, isChatting: chatState.isChatting, isOffline: isOffline, messages: messages, agents: chatState.agents, lastRatingRequestTimestamp: chatState.lastRatingRequestTimestamp, hasRating: chatState.hasRating, visitorId: chatState.visitorId, messageMiddleware: props.messageMiddleware, onSend: handleSendMessage, onWrite: handleWriteMessage, onOpenUrl: handleOpenUrl }),
8553
8608
  React$1.createElement("div", { className: "spinner-container ".concat(visible && connectionStatus === "pending" ? "visible" : "") },
8554
8609
  React$1.createElement("div", { className: "spinner" })),
8555
8610
  connectionStatus === "offline" && React$1.createElement(ServerOffline, null),
8556
8611
  React$1.createElement(ChatFooter, { isChatting: chatState.isChatting, onChange: handleOnChange, onSubmit: handleOnSubmit, onFileUpload: handleFileUpload })),
8557
- React$1.createElement(ChatButton, { addClass: getVisibilityClass(), onClick: chatButtonOnClick, config: (_f = props.config) === null || _f === void 0 ? void 0 : _f.cta, visible: visible })));
8612
+ React$1.createElement(ChatButton, { addClass: getVisibilityClass(), onClick: chatButtonOnClick, config: (_m = props.config) === null || _m === void 0 ? void 0 : _m.cta, visible: visible })));
8558
8613
  };
8559
8614
 
8560
8615
  function tryParseJson(str) {
@@ -8789,7 +8844,7 @@ function createChatStore(config, dataStorage) {
8789
8844
  if (dataStorage === void 0) { dataStorage = sessionStorage; }
8790
8845
  var connection = config.connection;
8791
8846
  var storage = new BrowserStateStorage(dataStorage, "xappchat.".concat(connection.serverUrl, ".").concat(connection.accountKey));
8792
- var defaultState = createDefaultState({ accessToken: config.accessToken, userId: config.userId });
8847
+ var defaultState = createDefaultState({ accessToken: config.accessToken, userId: config.userId, attributes: config.attributes });
8793
8848
  var chatReducer = persistStateReducer(storage, defaultState, storeHandler);
8794
8849
  var middlewares = [
8795
8850
  thunk
@@ -8799,18 +8854,19 @@ function createChatStore(config, dataStorage) {
8799
8854
  }
8800
8855
 
8801
8856
  var ChatWidgetContainer = function (props) {
8802
- var _a, _b, _c;
8857
+ var _a, _b, _c, _d;
8803
8858
  var messageMiddleware = useStandardMiddleware();
8804
8859
  var connection = useServerConfig(props.config);
8805
8860
  var chatStore = useMemo(function () {
8806
- var _a, _b;
8861
+ var _a, _b, _c;
8807
8862
  return createChatStore({
8808
8863
  connection: connection,
8809
8864
  userId: (_a = props.config) === null || _a === void 0 ? void 0 : _a.userId,
8810
- accessToken: (_b = props.config) === null || _b === void 0 ? void 0 : _b.accessToken
8865
+ accessToken: (_b = props.config) === null || _b === void 0 ? void 0 : _b.accessToken,
8866
+ attributes: (_c = props.config) === null || _c === void 0 ? void 0 : _c.attributes,
8811
8867
  });
8812
- }, [connection, (_a = props.config) === null || _a === void 0 ? void 0 : _a.userId, (_b = props.config) === null || _b === void 0 ? void 0 : _b.accessToken]);
8813
- if ((_c = props.config) === null || _c === void 0 ? void 0 : _c.disabled) {
8868
+ }, [connection, (_a = props.config) === null || _a === void 0 ? void 0 : _a.userId, (_b = props.config) === null || _b === void 0 ? void 0 : _b.accessToken, (_c = props.config) === null || _c === void 0 ? void 0 : _c.attributes]);
8869
+ if ((_d = props.config) === null || _d === void 0 ? void 0 : _d.disabled) {
8814
8870
  return React$1.createElement(React$1.Fragment, null);
8815
8871
  }
8816
8872
  var widgetProps = __assign(__assign({}, props), { messageMiddleware: messageMiddleware });