@xapp/chat-widget 1.57.5 → 1.58.0
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.
- package/dist/components/ChatWidget/ChatWidget.stories.d.ts +2 -0
- package/dist/index.css +1 -1
- package/dist/index.es.js +65 -36
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +65 -36
- package/dist/index.js.map +1 -1
- package/dist/xapp-chat-widget.css +1 -1
- package/dist/xapp-chat-widget.js +1 -1
- package/dist/xapp-chat-widget.js.map +1 -1
- package/package.json +3 -3
|
@@ -25,6 +25,8 @@ export declare const EmptyMenu: VFC;
|
|
|
25
25
|
export declare const Styled: VFC;
|
|
26
26
|
export declare const StyledTheme1: VFC;
|
|
27
27
|
export declare const Reset: VFC;
|
|
28
|
+
export declare const WithAllHeaderButtons: VFC;
|
|
29
|
+
export declare const WithShowResetConfirmationHeaderButtons: VFC;
|
|
28
30
|
export declare const Disabled: VFC;
|
|
29
31
|
export declare const InvalidServerUrl: VFC;
|
|
30
32
|
export declare const WithCustomComponents: VFC;
|
package/dist/index.css
CHANGED
|
@@ -4,4 +4,4 @@
|
|
|
4
4
|
);height:min(
|
|
5
5
|
var(--xapp-widget-height, 500px),
|
|
6
6
|
100vh - var(--xapp-widget-margin-top, 10px) - var(--xapp-widget-margin-bottom, 10px)
|
|
7
|
-
)}.widget-container--docked{width:100%;height:100%;border-radius:0}.widget-container:not(.visible){animation:widget-hide .5s backwards;width:64px;height:64px}.widget-container.visible{animation:widget-show .5s forwards}.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}.ts-msg-container{text-align:center;margin-bottom:16px}.ts-msg{font-size:12px;color:#bfbfbf}.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}}.xa-spinner-container{z-index:var(--xapp-widget-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 !important;left:0 !important}.xa-spinner-container.visible{visibility:visible;opacity:1}.xa-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}.xa-chevron{width:100%;height:100%;background:unset;border:unset;padding:unset}@-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}}@media screen and (max-width: 640px){.xa-chevron{height:44px;height:44px}}.restartModal{display:none;position:fixed;z-index:100;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4);-webkit-animation-name:fadeIn;-webkit-animation-duration:.4s;animation-name:fadeIn;animation-duration:.4s}.modalContent{border-radius:20px;box-shadow:rgba(100,100,111,.2) 0px 7px 29px 0px;position:fixed;bottom:-10px;z-index:200;padding:20px;background-color:#fff;width:100%;-webkit-animation-name:slideIn;-webkit-animation-duration:.4s;animation-name:slideIn;animation-duration:.4s}.modalBody h2{color:#027db6;text-align:center;font-weight:700}.modalBody p{color:rgba(98,98,98,.6666666667)}.modalActions{margin:25px 0;justify-content:center;display:flex;gap:1em}.modalActions button{padding:10px 20px;border-radius:10px;transition:all .5s;cursor:pointer}.modalActions button:hover{opacity:.7}.modalActions .cancelBtn{color:#027db6;border:solid 1px #027db6;background:rgba(0,0,0,0)}.modalActions .restartBtn{background:#027db6;color:#fff;border:none}@-webkit-keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:-10px;opacity:1}}@keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:-10px;opacity:1}}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.chat-footer{position:relative;background-color:var(--xapp-footer-background, var(--xapp-primary-color, #616161)) !important}.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;display:flex;justify-content:center}.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}.background-footer .chat-footer{background-color:#616161 !important}.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}.xappw-admin-input-container{flex-shrink:0;z-index:999;padding-left:20px;padding-right:20px;padding-bottom:0;padding-top:10px}.xappw-admin-input-container:not(.visible){display:none}.xappw-admin-input-container.drag-drop-zone{outline:3px dashed gray;outline-offset:-3px}.xappw-admin-input-form{display:flex;align-items:center;overflow:hidden;line-height:48px;position:relative}.xappw-admin-input-form__buttons{display:flex;align-items:center;right:10px;z-index:2;margin-right:10px}.xappw-admin-input-form__btn{width:56px}.xappw-admin-input{width:calc(100% - 60px);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;border:var(--xapp-input-border-width, #fff) solid var(--xapp-input-border-color, #fff);border-radius:var(--xapp-input-border-radius, 20px);background:var(--xapp-input-background, #fff);margin:auto}.xappw-admin-input input:focus::placeholder{color:rgba(0,0,0,0)}.xappw-admin-input input::-webkit-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input:-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input::-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input:-ms-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input::placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input__input{border:none;outline:none;font-size:inherit;line-height:inherit}.xappw-admin-input{z-index:1}@media screen and (max-width: 640px){.xappw-admin-input-form{height:44px}}.chat-footer__branding{text-align:end;padding-right:20px;padding-bottom:12px;font-family:var(--xapp-footer-branding-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-footer-branding-font-weight, normal);font-size:var(--xapp-footer-branding-font-size, 14px);font-style:var(--xapp-footer-branding-font-style, normal);color:var(--xapp-footer-branding-text-color, rgba(255, 255, 255, 0.87))}.xapp-search-icon-button{border:none;background:none;cursor:pointer;padding:0;display:flex;align-items:center}.xapp-search-icon-button svg{display:block;margin:auto;height:100%}.xapp-search-icon-button__content{display:flex;width:100%}.xapp-search-icon-button:focus-visible{outline:none;filter:invert(100%)}@media screen and (max-width: 640px){.xapp-search-icon-button{box-sizing:border-box;padding:12px;min-height:44px;min-width:44px}}.xappw-message-bubble{border-radius:10px;padding:10px;background:var(--xapp-bubble-background, #fff)}.xappw-rich-input__input{display:block !important;width:calc(100% - 50px) !important;height:37px;border:none !important;outline:none !important;box-sizing:border-box !important;margin:0 !important;font-size:inherit !important;line-height:inherit;color:inherit !important;background-color:inherit !important}.xappw-rich-input__input:focus{color:inherit !important}@media screen and (max-width: 640px){.xappw-rich-input__input{width:calc(100% - 90px)}}.xapp-search-rich-text{display:inline-block;max-width:100%;overflow:hidden;white-space:pre-wrap}.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 rgba(0,0,0,0);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}.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-suggestions__use svg{display:block;margin:auto;height:100%}.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;align-items:center;position:absolute;right:10px;z-index:2}.xappw-input-form__btn{min-width:20px;width:20px;height:16px}.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:rgba(0,0,0,0)}.xappw-input input:focus::placeholder{color:rgba(0,0,0,0)}.xappw-input input::-webkit-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input:-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input::-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input:-ms-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input::placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input{z-index:1}@media screen and (max-width: 640px){.xappw-input-form{height:44px}}.xappw-send-button{color:var(--xapp-send-button-color, #505050);margin:0}.xappw-custom-send-button{display:inline-flex;cursor:pointer;user-select:none;width:var(--xapp-send-button-width, 20px);border:unset;background:unset;padding:unset}.xappw-custom-send-button>img{width:100%;height:auto}@media screen and (max-width: 640px){.xappw-send-button{box-sizing:border-box !important;padding:12px !important;min-height:44px;min-width:44px;margin:0}.xappw-custom-send-button{box-sizing:border-box !important;padding:12px !important;min-height:44px;min-width:44px;margin:0}}
|
|
7
|
+
)}.widget-container--docked{width:100%;height:100%;border-radius:0}.widget-container:not(.visible){animation:widget-hide .5s backwards;width:64px;height:64px}.widget-container.visible{animation:widget-show .5s forwards}.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}.ts-msg-container{text-align:center;margin-bottom:16px}.ts-msg{font-size:12px;color:#bfbfbf}.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}}.xa-spinner-container{z-index:var(--xapp-widget-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 !important;left:0 !important}.xa-spinner-container.visible{visibility:visible;opacity:1}.xa-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}.xa-chevron{width:100%;height:100%;background:unset;border:unset;padding:unset}@-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}}@media screen and (max-width: 640px){.xa-chevron{height:44px;height:44px}}.restartModal{display:none;position:fixed;z-index:100;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.4);-webkit-animation-name:fadeIn;-webkit-animation-duration:.4s;animation-name:fadeIn;animation-duration:.4s}.modalContent{border-radius:20px;box-shadow:rgba(100,100,111,.2) 0px 7px 29px 0px;position:fixed;bottom:-10px;z-index:200;padding:20px;background-color:#fff;width:100%;-webkit-animation-name:slideIn;-webkit-animation-duration:.4s;animation-name:slideIn;animation-duration:.4s}.modalBody h2{color:#027db6;text-align:center;font-weight:700}.modalBody p{color:rgba(98,98,98,.6666666667)}.modalActions{margin:25px 0;justify-content:center;display:flex;gap:1em}.modalActions button{padding:10px 20px;border-radius:10px;transition:all .5s;cursor:pointer}.modalActions button:hover{opacity:.7}.modalActions .cancelBtn{color:#027db6;border:solid 1px #027db6;background:rgba(0,0,0,0)}.modalActions .restartBtn{background:#027db6;color:#fff;border:none}@-webkit-keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:-10px;opacity:1}}@keyframes slideIn{from{bottom:-300px;opacity:0}to{bottom:-10px;opacity:1}}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.chat-footer{position:relative;background-color:var(--xapp-footer-background, var(--xapp-primary-color, #616161)) !important}.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;display:flex;justify-content:center}.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}.background-footer .chat-footer{background-color:#616161 !important}.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}.xappw-admin-input-container{flex-shrink:0;z-index:999;padding-left:20px;padding-right:20px;padding-bottom:0;padding-top:10px}.xappw-admin-input-container:not(.visible){display:none}.xappw-admin-input-container.drag-drop-zone{outline:3px dashed gray;outline-offset:-3px}.xappw-admin-input-form{display:flex;align-items:center;overflow:hidden;line-height:48px;position:relative}.xappw-admin-input-form__buttons{display:flex;align-items:center;right:10px;z-index:2;margin-right:10px}.xappw-admin-input-form__btn{width:56px}.xappw-admin-input{width:calc(100% - 60px);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;border:var(--xapp-input-border-width, #fff) solid var(--xapp-input-border-color, #fff);border-radius:var(--xapp-input-border-radius, 20px);background:var(--xapp-input-background, #fff);margin:auto}.xappw-admin-input input:focus::placeholder{color:rgba(0,0,0,0)}.xappw-admin-input input::-webkit-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input:-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input::-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input:-ms-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input input::placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-admin-input__input{border:none;outline:none;font-size:inherit;line-height:inherit}.xappw-admin-input{z-index:1}@media screen and (max-width: 640px){.xappw-admin-input-form{height:44px}}.chat-footer__branding{text-align:end;padding-right:20px;padding-bottom:12px;font-family:var(--xapp-footer-branding-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-footer-branding-font-weight, normal);font-size:var(--xapp-footer-branding-font-size, 14px);font-style:var(--xapp-footer-branding-font-style, normal);color:var(--xapp-footer-branding-text-color, rgba(255, 255, 255, 0.87))}.xapp-search-icon-button{border:none;background:none;cursor:pointer;padding:0;display:flex;align-items:center}.xapp-search-icon-button svg{display:block;margin:auto;height:100%}.xapp-search-icon-button__content{display:flex;width:100%}.xapp-search-icon-button:focus-visible{outline:none;filter:invert(100%)}@media screen and (max-width: 640px){.xapp-search-icon-button{box-sizing:border-box;padding:12px;min-height:44px;min-width:44px}}.xappw-message-bubble{border-radius:10px;padding:10px;background:var(--xapp-bubble-background, #fff)}.xappw-rich-input__input{display:block !important;width:calc(100% - 50px) !important;height:37px;border:none !important;outline:none !important;box-sizing:border-box !important;margin:0 !important;font-size:inherit !important;line-height:inherit;color:inherit !important;background-color:inherit !important}.xappw-rich-input__input:focus{color:inherit !important}@media screen and (max-width: 640px){.xappw-rich-input__input{width:calc(100% - 90px)}}.xapp-search-rich-text{display:inline-block;max-width:100%;overflow:hidden;white-space:pre-wrap}.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-group__items{display:flex;flex-direction:column;padding:2px 0}.xappw-suggestions-group__heading{margin:0 16px}.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 rgba(0,0,0,0);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}.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-suggestions__use svg{display:block;margin:auto;height:100%}.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;align-items:center;position:absolute;right:10px;z-index:2}.xappw-input-form__btn{min-width:20px;width:20px;height:16px}.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:rgba(0,0,0,0)}.xappw-input input:focus::placeholder{color:rgba(0,0,0,0)}.xappw-input input::-webkit-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input:-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input::-moz-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input:-ms-input-placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input input::placeholder{font-family:var(--xapp-input-placeholder-font-family, "RobotoRegular", "serif");font-weight:var(--xapp-input-placeholder-font-weight, normal);font-size:var(--xapp-input-placeholder-font-size, 14px);font-style:var(--xapp-input-placeholder-font-style, normal);color:var(--xapp-input-placeholder-text-color, #e1e2e1)}.xappw-input{z-index:1}@media screen and (max-width: 640px){.xappw-input-form{height:44px}}.xappw-send-button{color:var(--xapp-send-button-color, #505050);margin:0}.xappw-custom-send-button{display:inline-flex;cursor:pointer;user-select:none;width:var(--xapp-send-button-width, 20px);border:unset;background:unset;padding:unset}.xappw-custom-send-button>img{width:100%;height:auto}@media screen and (max-width: 640px){.xappw-send-button{box-sizing:border-box !important;padding:12px !important;min-height:44px;min-width:44px;margin:0}.xappw-custom-send-button{box-sizing:border-box !important;padding:12px !important;min-height:44px;min-width:44px;margin:0}}
|
package/dist/index.es.js
CHANGED
|
@@ -6686,7 +6686,7 @@ var ChatChipsContainer = function (_) {
|
|
|
6686
6686
|
};
|
|
6687
6687
|
|
|
6688
6688
|
var CancelButton = function (props) {
|
|
6689
|
-
return (React$1.createElement("button", { id: "xapp-widget-close", "aria-label": "close widget", "aria-hidden":
|
|
6689
|
+
return (React$1.createElement("button", { id: "xapp-widget-close", "aria-label": "close widget", "aria-hidden": false, tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, className: "cancel-button", onClick: props.onClick }));
|
|
6690
6690
|
};
|
|
6691
6691
|
|
|
6692
6692
|
var lib = {};
|
|
@@ -6822,15 +6822,15 @@ var DrawerBars = function (props) {
|
|
|
6822
6822
|
}
|
|
6823
6823
|
return barElements;
|
|
6824
6824
|
}
|
|
6825
|
-
return (React$1.createElement("button", { className: "drawer-bars", tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, "aria-label": "open menu", "aria-hidden":
|
|
6825
|
+
return (React$1.createElement("button", { className: "drawer-bars", tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, "aria-label": "open menu", "aria-hidden": false, onClick: props.onToggle }, getBars()));
|
|
6826
6826
|
};
|
|
6827
6827
|
|
|
6828
6828
|
var MinimizeButton = function (props) {
|
|
6829
|
-
return (React$1.createElement("button", { id: "xapp-widget-minimize", "aria-label": "minimize widget", "aria-hidden":
|
|
6829
|
+
return (React$1.createElement("button", { id: "xapp-widget-minimize", "aria-label": "minimize widget", "aria-hidden": false, tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, className: "minimize-button ".concat(props.showInRight ? "positionRight" : ""), onClick: props.onClick }));
|
|
6830
6830
|
};
|
|
6831
6831
|
|
|
6832
6832
|
var RefreshButton = function (props) {
|
|
6833
|
-
return (React$1.createElement("button", { id: "xapp-widget-refresh", "aria-label": "refresh chat", "aria-hidden":
|
|
6833
|
+
return (React$1.createElement("button", { id: "xapp-widget-refresh", "aria-label": "refresh chat", "aria-hidden": false, tabIndex: props.tabIndex ? Number(props.tabIndex) : 0, className: "refresh-button ".concat(props.showInRight ? "positionRight" : props.showInLeft ? "positionLeft" : ""), onClick: props.onClick }));
|
|
6834
6834
|
};
|
|
6835
6835
|
|
|
6836
6836
|
var DEFAULT_STATUS_CONFIG = {
|
|
@@ -6877,8 +6877,19 @@ var ChatHeader = function (props) {
|
|
|
6877
6877
|
setDrawerState(false);
|
|
6878
6878
|
onSubmit(label);
|
|
6879
6879
|
}
|
|
6880
|
+
var ariaLabel = "";
|
|
6881
|
+
var canRefresh = props.canRefresh, canMinimize = props.canMinimize, canCancel = props.canCancel;
|
|
6882
|
+
if (canRefresh) {
|
|
6883
|
+
ariaLabel = refreshButtonAriaLabel;
|
|
6884
|
+
}
|
|
6885
|
+
if (canMinimize) {
|
|
6886
|
+
ariaLabel = "".concat(ariaLabel).concat(minimizeButtonAriaLabel);
|
|
6887
|
+
}
|
|
6888
|
+
if (canCancel) {
|
|
6889
|
+
ariaLabel = "".concat(ariaLabel).concat(closeButtonAriaLabel);
|
|
6890
|
+
}
|
|
6880
6891
|
return (React$1.createElement(React$1.Fragment, null,
|
|
6881
|
-
React$1.createElement("div", { className: "status-container background-header", "aria-label":
|
|
6892
|
+
React$1.createElement("div", { className: "status-container background-header", "aria-label": ariaLabel, "aria-hidden": false },
|
|
6882
6893
|
showMenu && menuItems.length ? (React$1.createElement(React$1.Fragment, null,
|
|
6883
6894
|
React$1.createElement("div", { className: "chat-footer__menu-icon" },
|
|
6884
6895
|
React$1.createElement(DrawerBars, { bars: 3, tabIndex: menuButtonTabIndex, onToggle: toggleDrawer })))) : React$1.createElement(React$1.Fragment, null),
|
|
@@ -7815,10 +7826,10 @@ var Input = function (props) {
|
|
|
7815
7826
|
}, [suggestion, onChange, onSuggestionCommand]);
|
|
7816
7827
|
return (React$1.createElement("div", { className: "xappw-input-container ".concat(props.addClass, " ").concat(dragover ? "drag-drop-zone" : ""), "aria-label": "To start typing click on rounded rectangle at the bottom of widget. To send your message click icon on right side of rounded rectangle at the bottom of widget" +
|
|
7817
7828
|
value.text
|
|
7818
|
-
? "To clear
|
|
7819
|
-
: "", "aria-hidden":
|
|
7829
|
+
? "To clear input field click on clear icon on the left of send button"
|
|
7830
|
+
: "", "aria-hidden": false, onDrop: onDrop, onDragOver: onDragOver, onDragLeave: onDragLeave },
|
|
7820
7831
|
React$1.createElement("form", { className: "xappw-input-form", onSubmit: handleOnSubmit },
|
|
7821
|
-
React$1.createElement(RichInput_1, { key: "input", id: "chatWidgetInput", className: "xappw-input", placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "
|
|
7832
|
+
React$1.createElement(RichInput_1, { key: "input", id: "chatWidgetInput", className: "xappw-input", placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "type your question here", tabIndex: inputConfig === null || inputConfig === void 0 ? void 0 : inputConfig.tabIndex, onInput: onChange, onChange: onChange, onKeyDown: handleKeyDown,
|
|
7822
7833
|
// onFocus={onFocus}
|
|
7823
7834
|
value: value, spellCheck: true }),
|
|
7824
7835
|
React$1.createElement("div", { className: "xappw-input-form__buttons" },
|
|
@@ -7929,7 +7940,7 @@ var ChatFooter = function (props) {
|
|
|
7929
7940
|
setInput(data);
|
|
7930
7941
|
setSuggestionSearch(data.text);
|
|
7931
7942
|
}, []);
|
|
7932
|
-
return (React$1.createElement("div", { className: "chat-footer background-footer", "aria-label": menuItems.length ? "to open menu click a button above the rounded rectangle at the bottom of widget" : "", "aria-hidden":
|
|
7943
|
+
return (React$1.createElement("div", { className: "chat-footer background-footer", "aria-label": menuItems.length ? "to open menu click a button above the rounded rectangle at the bottom of widget" : "", "aria-hidden": false },
|
|
7933
7944
|
showMenu && menuItems.length ?
|
|
7934
7945
|
React$1.createElement(React$1.Fragment, null,
|
|
7935
7946
|
drawerOpen ? React$1.createElement(ChatMenu, { opened: drawerOpen, tabIndex: menuItemsTabIndex, onItemClick: handleMenuItem, items: menuItems }) : React$1.createElement(React$1.Fragment, null),
|
|
@@ -30824,28 +30835,25 @@ var ChatWidgetWrapper = function (props) {
|
|
|
30824
30835
|
React$1.createElement(ChatWidget, __assign({}, props)))));
|
|
30825
30836
|
};
|
|
30826
30837
|
var ChatWidget = function (props) {
|
|
30827
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
|
|
30838
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2;
|
|
30828
30839
|
var innerDispatch = useChatDispatch();
|
|
30829
30840
|
var dispatch = useChatServerDispatch();
|
|
30830
30841
|
// From Redux
|
|
30831
30842
|
var chatState = useSelector(function (state) { return state; });
|
|
30843
|
+
// Refresh modalReference
|
|
30832
30844
|
var modalRef = useRef({});
|
|
30833
|
-
function openModal() {
|
|
30834
|
-
modalRef.current.style.display = "block";
|
|
30835
|
-
}
|
|
30836
|
-
function closeModal() {
|
|
30837
|
-
modalRef.current.style.display = "none";
|
|
30838
|
-
}
|
|
30839
30845
|
var mode = (_a = props.mode) !== null && _a !== void 0 ? _a : "normal";
|
|
30840
30846
|
var dockedMode = mode === "docked";
|
|
30841
30847
|
var staticMode = mode === "static";
|
|
30842
30848
|
var modeClass = "widget-container--".concat(mode);
|
|
30843
30849
|
var canRefresh = (_c = (_b = props.config.header) === null || _b === void 0 ? void 0 : _b.actions) === null || _c === void 0 ? void 0 : _c.refresh;
|
|
30850
|
+
// can't minimize in docked mode or static mode.
|
|
30844
30851
|
var canMinimize = !dockedMode && !staticMode && ((_e = (_d = props.config.header) === null || _d === void 0 ? void 0 : _d.actions) === null || _e === void 0 ? void 0 : _e.minimize);
|
|
30852
|
+
console.log("".concat(dockedMode, " ").concat(staticMode, " ").concat((_g = (_f = props.config.header) === null || _f === void 0 ? void 0 : _f.actions) === null || _g === void 0 ? void 0 : _g.minimize));
|
|
30845
30853
|
var canCancel;
|
|
30846
30854
|
// To preserve legacy behavior, cancel needs a little more checks
|
|
30847
|
-
if (typeof ((
|
|
30848
|
-
canCancel = !dockedMode && !staticMode && ((
|
|
30855
|
+
if (typeof ((_j = (_h = props.config.header) === null || _h === void 0 ? void 0 : _h.actions) === null || _j === void 0 ? void 0 : _j.cancel) === "boolean") {
|
|
30856
|
+
canCancel = !dockedMode && !staticMode && ((_l = (_k = props.config.header) === null || _k === void 0 ? void 0 : _k.actions) === null || _l === void 0 ? void 0 : _l.cancel);
|
|
30849
30857
|
}
|
|
30850
30858
|
else {
|
|
30851
30859
|
canCancel = !dockedMode && !staticMode;
|
|
@@ -30855,18 +30863,18 @@ var ChatWidget = function (props) {
|
|
|
30855
30863
|
chatState.visuals = {};
|
|
30856
30864
|
}
|
|
30857
30865
|
// Our state - pull from storage
|
|
30858
|
-
var
|
|
30866
|
+
var _3 = useState((!canMinimize && !canCancel) ||
|
|
30859
30867
|
// !!get("visible") ||
|
|
30860
30868
|
chatState.visuals.visible ||
|
|
30861
|
-
(((
|
|
30862
|
-
window.matchMedia("(min-width: ".concat((
|
|
30863
|
-
var
|
|
30869
|
+
(((_m = props.config) === null || _m === void 0 ? void 0 : _m.autoOpenOnWidth) &&
|
|
30870
|
+
window.matchMedia("(min-width: ".concat((_o = props.config) === null || _o === void 0 ? void 0 : _o.autoOpenOnWidth, ")")).matches)), visible = _3[0], setVisibleState = _3[1];
|
|
30871
|
+
var _4 = useState(false), typing = _4[0], setTypingState = _4[1]; // false initially
|
|
30864
30872
|
var chatServer = useContext(ChatServerContext);
|
|
30865
|
-
var patternsConfig = (
|
|
30873
|
+
var patternsConfig = (_q = (_p = props.config) === null || _p === void 0 ? void 0 : _p.autoOpenOnPattern) === null || _q === void 0 ? void 0 : _q.patterns;
|
|
30866
30874
|
var currentUrl = window.location.href;
|
|
30867
30875
|
var patternExist = patternsConfig && patternsConfig.length > 0;
|
|
30868
30876
|
var patternMatches = patternsConfig === null || patternsConfig === void 0 ? void 0 : patternsConfig.some(function (pattern) { return currentUrl.includes(pattern); });
|
|
30869
|
-
var configWidth = (
|
|
30877
|
+
var configWidth = (_s = (_r = props.config) === null || _r === void 0 ? void 0 : _r.autoOpenOnPattern) === null || _s === void 0 ? void 0 : _s.minimumWidth;
|
|
30870
30878
|
// eslint-disable-next-line no-restricted-globals
|
|
30871
30879
|
var currentWidth = screen.width;
|
|
30872
30880
|
var setVisible = useCallback(function (newVisible) {
|
|
@@ -30953,17 +30961,38 @@ var ChatWidget = function (props) {
|
|
|
30953
30961
|
function getVisibilityClass() {
|
|
30954
30962
|
return visible ? "visible" : "";
|
|
30955
30963
|
}
|
|
30956
|
-
function
|
|
30957
|
-
|
|
30964
|
+
function openRestartConfirmationModal() {
|
|
30965
|
+
// Interesting, this call the modalRef of the restart modal
|
|
30966
|
+
modalRef.current.style.display = "block";
|
|
30967
|
+
}
|
|
30968
|
+
function closeRestartConfirmationModal() {
|
|
30969
|
+
modalRef.current.style.display = "none";
|
|
30970
|
+
}
|
|
30971
|
+
function handleReset() {
|
|
30958
30972
|
innerDispatch(reset());
|
|
30959
30973
|
}
|
|
30960
|
-
function
|
|
30974
|
+
function handleRestartClick() {
|
|
30975
|
+
if (config.header.actions.refreshShowConfirmation) {
|
|
30976
|
+
// show the modal
|
|
30977
|
+
openRestartConfirmationModal();
|
|
30978
|
+
// we will close when
|
|
30979
|
+
}
|
|
30980
|
+
else {
|
|
30981
|
+
handleReset();
|
|
30982
|
+
}
|
|
30983
|
+
}
|
|
30984
|
+
function handleRestartModalCloseClick() {
|
|
30985
|
+
closeRestartConfirmationModal();
|
|
30986
|
+
}
|
|
30987
|
+
/** Called when minimize button is clicked */
|
|
30988
|
+
function handleMinimizeClick() {
|
|
30961
30989
|
innerDispatch(setVisualStatus({
|
|
30962
30990
|
opened: false
|
|
30963
30991
|
}));
|
|
30964
30992
|
setVisible(false);
|
|
30965
30993
|
}
|
|
30966
|
-
|
|
30994
|
+
/** Called when cancel is clicked */
|
|
30995
|
+
function handleCancelClick() {
|
|
30967
30996
|
//set("opened", false);
|
|
30968
30997
|
innerDispatch(setVisualStatus({
|
|
30969
30998
|
opened: false
|
|
@@ -31022,22 +31051,22 @@ var ChatWidget = function (props) {
|
|
|
31022
31051
|
onConnectionStatusChange(connectionStatus);
|
|
31023
31052
|
}
|
|
31024
31053
|
}, [connectionStatus, onConnectionStatusChange]);
|
|
31025
|
-
useExternalScript((
|
|
31054
|
+
useExternalScript((_t = props.config) === null || _t === void 0 ? void 0 : _t.middlewareUrl);
|
|
31026
31055
|
// This is a pseudo agent. It represent's the widget (shown in the header avatar for instance)
|
|
31027
|
-
var widgetAgent = ((
|
|
31056
|
+
var widgetAgent = ((_u = chatState.agents["agent:robot"]) === null || _u === void 0 ? void 0 : _u.user) || (config === null || config === void 0 ? void 0 : config.agent)
|
|
31028
31057
|
|| { nick: "agent:robot", avatarPath: config.avatarUrl, display_name: "Agent" };
|
|
31029
31058
|
return (React$1.createElement(React$1.Fragment, null,
|
|
31030
31059
|
React$1.createElement("div", { className: "widget-container ".concat(modeClass, " ").concat(getVisibilityClass()) },
|
|
31031
31060
|
React$1.createElement(WidgetStylesheet, { theme: config === null || config === void 0 ? void 0 : config.theme }),
|
|
31032
|
-
React$1.createElement(ChatHeader, { accountStatus: chatState.accountStatus, refreshOnClick:
|
|
31033
|
-
React$1.createElement(MessageList, { visible: visible, queuePosition: chatState.queuePosition, isChatting: chatState.isChatting, isOffline: isOffline, messages: messages, agents: chatState.agents, agent: config === null || config === void 0 ? void 0 : config.agent, lastRatingRequestTimestamp: chatState.lastRatingRequestTimestamp, hasRating: chatState.hasRating, visitorId: chatState.visitorId, messageMiddleware: props.messageMiddleware, textTypingStatusEnabled: (
|
|
31061
|
+
React$1.createElement(ChatHeader, { accountStatus: chatState.accountStatus, refreshOnClick: handleRestartClick, minimizeOnClick: handleMinimizeClick, cancelOnClick: handleCancelClick, agent: widgetAgent, canRefresh: canRefresh, canMinimize: canMinimize, canCancel: canCancel, config: config === null || config === void 0 ? void 0 : config.header, menuConfig: config.menu, onSubmit: handleOnSubmit }),
|
|
31062
|
+
React$1.createElement(MessageList, { visible: visible, queuePosition: chatState.queuePosition, isChatting: chatState.isChatting, isOffline: isOffline, messages: messages, agents: chatState.agents, agent: config === null || config === void 0 ? void 0 : config.agent, lastRatingRequestTimestamp: chatState.lastRatingRequestTimestamp, hasRating: chatState.hasRating, visitorId: chatState.visitorId, messageMiddleware: props.messageMiddleware, textTypingStatusEnabled: (_w = (_v = props.config) === null || _v === void 0 ? void 0 : _v.typingStatus) === null || _w === void 0 ? void 0 : _w.textTypingStatusEnabled, onSend: handleSendMessage, onWrite: handleWriteMessage, onOpenUrl: handleOpenUrl }),
|
|
31034
31063
|
React$1.createElement("div", { className: "xa-spinner-container ".concat(visible && connectionStatus === "pending" ? "visible" : "") },
|
|
31035
31064
|
React$1.createElement("div", { className: "xa-spinner" })),
|
|
31036
31065
|
connectionStatus === "offline" && React$1.createElement(ServerOffline, null),
|
|
31037
|
-
React$1.createElement(ChatFooter, { isAdmin: config === null || config === void 0 ? void 0 : config.isAdmin, isChatting: chatState.isChatting, placeholder: (
|
|
31038
|
-
React$1.createElement("div", { className: "restartModal", ref: modalRef, onClick:
|
|
31039
|
-
React$1.createElement(ModalContent, { onClose:
|
|
31040
|
-
React$1.createElement(ChatButton, { addClass: getVisibilityClass(), onClick: chatButtonOnClick, config: (
|
|
31066
|
+
React$1.createElement(ChatFooter, { isAdmin: config === null || config === void 0 ? void 0 : config.isAdmin, isChatting: chatState.isChatting, placeholder: (_x = config === null || config === void 0 ? void 0 : config.input) === null || _x === void 0 ? void 0 : _x.placeholder, sendButtonIcon: (_z = (_y = config === null || config === void 0 ? void 0 : config.footer) === null || _y === void 0 ? void 0 : _y.sendButton) === null || _z === void 0 ? void 0 : _z.icon, visible: visible, menuConfig: props.config.menu, footerConfig: (_0 = props.config) === null || _0 === void 0 ? void 0 : _0.footer, inputConfig: (_1 = props.config) === null || _1 === void 0 ? void 0 : _1.input, onChange: handleOnChange, onSubmit: handleOnSubmit, onFileUpload: handleFileUpload }),
|
|
31067
|
+
React$1.createElement("div", { className: "restartModal", ref: modalRef, onClick: handleRestartModalCloseClick },
|
|
31068
|
+
React$1.createElement(ModalContent, { onClose: handleRestartModalCloseClick, onReset: handleReset }))),
|
|
31069
|
+
React$1.createElement(ChatButton, { addClass: getVisibilityClass(), onClick: chatButtonOnClick, config: (_2 = props.config) === null || _2 === void 0 ? void 0 : _2.cta, visible: visible })));
|
|
31041
31070
|
};
|
|
31042
31071
|
|
|
31043
31072
|
function tryParseJson(str) {
|