@talkjs/web-components 0.0.29 → 0.0.30
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/README.md +1 -1
- package/default.css +1 -1
- package/default.d.ts +159 -90
- package/default.js +1112 -1046
- package/default.standalone.js +94 -94
- package/globalConstants.js +32 -40
- package/package.json +1 -1
- package/theming.d.ts +49 -14
- package/theming.js +446 -436
package/README.md
CHANGED
|
@@ -35,7 +35,7 @@ Then add the `Chatbox` component:
|
|
|
35
35
|
|
|
36
36
|
Replace the `<APP_ID>` with your TalkJS app ID, which you can find in the **Settings** tab of the TalkJS dashboard.
|
|
37
37
|
|
|
38
|
-
For more details, see our framework-specific guides: [Vue](https://talkjs.com/docs/
|
|
38
|
+
For more details, see our framework-specific guides: [Vue](https://talkjs.com/docs/UI_Components/Vue/), [Angular](https://talkjs.com/docs/UI_Components/Angular/), [Svelte](https://talkjs.com/docs/UI_Components/Svelte/).
|
|
39
39
|
|
|
40
40
|
## Support
|
|
41
41
|
|
package/default.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@import"https://cdn.talkjs.com/fonts/Inter.css";.t-audio-player{width:100%;height:auto;display:flex;flex-direction:row;align-items:center;column-gap:10px;padding:1.5em 1em 0}.t-audio-player .t-waveform{flex-grow:1;z-index:0}.t-audio-player button{background:transparent;border:none;color:inherit;padding:0;cursor:pointer}.t-audio-player .t-playback-speed{width:4em}.t-audio-player .t-play-pause-icon{width:30px;height:30px}.t-audio-player .t-up-down-icon{width:1em;height:1em}.t-audio-player .t-up-down svg{margin-top:-2px}.t-audio-player .t-playback-heading{opacity:.5;padding:.5em 1em}.t-audio-player .t-playback-checkmark{display:inline-block;width:1em;margin-right:.5em}.t-audio-player .t-playback-speed-menu{display:flex;flex-direction:column;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.35em}.t-audio-player .t-playback-speed-menu .t-menu-item{padding:.45em .65em;cursor:pointer;background:none;border:none;border-radius:.5em;text-align:left}.t-audio-player .t-playback-speed-menu .t-menu-item:hover{background-color:#007df9;color:#fff}:is(.t-text-input .empty-node):before{position:absolute;color:currentColor;cursor:text;opacity:.6}:is(.t-text-input .empty-node):first-child:before{content:attr(data-placeholder)}.t-editor .ProseMirror{position:relative}.t-editor .ProseMirror{word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;font-feature-settings:"liga" 0}.t-editor .ProseMirror pre{white-space:pre-wrap}.t-editor .ProseMirror li{position:relative}.t-editor .ProseMirror-hideselection *::selection{background:transparent}.t-editor .ProseMirror-hideselection *::-moz-selection{background:transparent}.t-editor .ProseMirror-hideselection{caret-color:transparent}.t-editor .ProseMirror [draggable][contenteditable=false]{user-select:text}.t-editor .ProseMirror-selectednode{outline:2px solid #8cf}.t-editor li.ProseMirror-selectednode{outline:none}.t-editor li.ProseMirror-selectednode:after{content:"";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}.t-editor img.ProseMirror-separator{display:inline!important;border:none!important;margin:0!important}.t-emoji-picker{width:100%;height:100%;overflow:hidden;flex-shrink:1}.t-emoji-picker emoji-picker{width:100%;border:0;height:100%;--border-size: 0;--num-columns: 10;--emoji-size: 21px;--category-emoji-size: 14px;--indicator-height: 2px;--outline-color: rgba(30, 96, 225, .5);--input-padding: 7px 11.5px;--button-active-background: #d4d4d4;--input-border-color: #d4d4d4;--input-focused-border-color: #b0b0b0;--indicator-color: #007df9;--button-hover-background: #d4d4d488;--input-border-radius: 4px;--input-font-size: inherit;--emoji-font-family: "Twemoji Country Flags", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", "EmojiOne Color", "Android Emoji", "Twemoji Mozilla", sans-serif}.t-emoji-picker[t-loading]{display:flex;align-items:center;justify-content:center;background-color:#fff;color:#007df9}.t-emoji-picker[t-loading] .t-loading-icon,.t-loading-icon{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;display:block;margin:auto;width:4em;height:4em}.t-emoji-suggest-bar{will-change:transform;transform:translateY(100%);transition:transform .1s ease-out}.t-emoji-suggest-bar.slide-enter{transform:translateY(100%)}.t-emoji-suggest-bar.slide-enter-active,.t-emoji-suggest-bar.slide-enter-done,.t-emoji-suggest-bar.slide-exit{transform:translateY(0)}.t-emoji-suggest-bar.slide-exit-active,.t-emoji-suggest-bar.slide-exit-done{transform:translateY(100%)}.t-emoji-suggest-bar{scrollbar-color:rgba(0,0,0,.2) transparent;scrollbar-width:thin;overflow-y:hidden}.t-emoji-suggest-bar:hover{scrollbar-color:rgba(0,0,0,.4) transparent}.t-emoji-suggest-bar:active{scrollbar-color:rgba(0,0,0,.6) transparent}@media (prefers-reduced-motion: reduce){.t-emoji-suggest-bar{transition:none}}.t-message-list{width:100%;height:100%;display:flex;flex-direction:column-reverse;overflow-x:hidden;overflow-y:auto;padding:16px;scrollbar-color:rgba(0,0,0,.2) transparent}.t-message-list:hover{scrollbar-color:rgba(0,0,0,.4) transparent}.t-message-list:active{scrollbar-color:rgba(0,0,0,.6) transparent}.t-message-group{display:flex;flex-direction:column-reverse}:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-panel{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%;height:100%;text-align:center;padding:25px;-webkit-font-smoothing:subpixel-antialiased;overflow-x:hidden;font-size:.95em;font-family:Open Sans,Helvetica,sans-serif}:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-error-panel{background-color:#f7f7f7}:is(:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-error-panel) .t-heading{font-size:2em}.t-attach-overlay{z-index:2;width:100%;height:100%;padding:16px;background-color:#64646480;display:flex;justify-content:center;align-items:center}.t-upload-preview .t-preview{position:relative;background-color:#fff;border-radius:1rem;max-width:750px;width:100%;display:inline-block;overflow:auto;padding:.5rem}@media screen and (max-width: 500px){.t-upload-preview .t-preview{width:85%}}:is(.t-upload-preview .t-preview) .t-img-container{text-align:center;background-color:#0000001a}:is(.t-upload-preview .t-preview) img{display:block;max-width:100%;max-height:400px;margin-left:auto;margin-right:auto}:is(.t-upload-preview .t-preview) video{width:100%;height:100%;object-fit:fill}:is(.t-upload-preview .t-preview) .t-location-upload-preview{width:100%;background-color:#0000001a;padding-bottom:calc((400 / 600) * 100%);display:block}.t-upload-preview .t-cancel-row{text-align:right;position:sticky;top:8px;padding-right:8px;z-index:2;margin-bottom:-38px}.t-upload-preview .t-filename-row{white-space:pre-wrap;word-break:break-all;padding:.5rem 1rem 0}.t-is-file:is(.t-upload-preview .t-filename-row){display:flex;justify-content:center;align-items:center;min-height:250px;padding-top:32px;padding-bottom:32px;text-align:center;background-color:#0000001a;border-radius:1rem;margin-bottom:1rem}:is(.t-upload-preview .t-filename-row) .t-file-block{background-color:#fff;padding:16px 32px;border-radius:8px;display:inline-block}.t-upload-preview .t-error-row{border-width:.125rem;border-radius:1rem;padding:1rem;background-color:#fec8c866;border-color:transparent;color:#ef4444;white-space:normal}.t-upload-preview .t-send-row{position:sticky;bottom:0;padding:1rem;display:flex;justify-content:space-between}.t-upload-preview .t-cancel{border:0;border-radius:.5rem;padding:.75rem 1rem;cursor:pointer;color:currentColor}.t-upload-preview .t-confirm-send{margin-left:auto;border:0;border-radius:.5rem;padding:.75rem 1rem;cursor:pointer}.t-upload-preview .t-loading{height:80px;width:100%;display:flex;align-items:center;justify-content:center;color:#007df9}.t-upload-preview .t-preview,.t-upload-preview .t-send-row{background:#fff}.t-upload-preview .t-confirm-send{background-color:#007df9;color:#fff}.t-chatbox-content{flex-direction:column;margin:0;position:relative;width:100%;height:100%;display:flex;overflow-y:hidden}.t-chatbox-content>.t-attach-overlay{position:absolute;width:100%;height:100%;top:0;left:0}.t-chatbox-content>.t-drop-overlay{pointer-events:none}:is(.t-chatbox-content>.t-drop-overlay) .t-theme-icon{color:#1e1e1e80;width:300px;height:300px}.t-conversation-list-scrollable{overflow-y:auto;height:100%}html:is(html):is(html):is(html):is(html):is(html) :where(.t-chatbox *:not(svg,svg *,.ProseMirror)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(.t-conversation-list *:not(svg,svg *)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(t-chatbox *:not(svg,svg *,.ProseMirror)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(t-conversation-list *:not(svg,svg *,.ProseMirror)){all:revert-layer}t-chatbox,t-conversation-list{display:block}t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list{font-family:Twemoji Country Flags,Inter,sans-serif;font-synthesis:initial;text-align:left;font-size:14px;font-weight:400;line-height:1.37;color:#111;letter-spacing:normal;margin:0;position:relative;background-color:#fff;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:none;box-sizing:border-box;overflow:hidden;max-height:100vh;max-height:100dvh;max-width:100vw;max-width:100dvw}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) button{font-family:inherit;font-size:1em}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *,:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *:before,:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *:after{box-sizing:border-box}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) svg{fill:currentColor}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) em{font-style:italic}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) strong{font-weight:700}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) del{text-decoration:line-through}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) code{font-family:Cascadia Code,Droid Sans Mono,Menlo,Consolas,Lucida Console,Monaco,monospace;font-variant-ligatures:none}t-conversation-list,.t-conversation-list{width:300px;height:600px}t-chatbox,.t-chatbox{width:400px;height:600px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.t-theme-chat-header button[data-action]{border-radius:.375em;font-size:inherit;margin:1px;padding:.25em .325em;cursor:pointer;transition:color .2s ease-in-out,background-color .2s ease-in-out,border .2s ease-in-out;color:#111;background-color:transparent;border:1px solid #525252}.t-theme-chat-header button[data-action]:hover{color:#fff;background-color:#111;border:1px solid #111}.t-theme-chat-header button[data-action]:active{color:#fff;background-color:#404040;border:1px solid #404040}.t-theme-chat-header button[data-action]:focus-visible{outline:#525252 solid 2px;outline-offset:2px}.t-theme-chat-header{display:flex;align-items:center;height:4.5em;background-color:#ececec;border-bottom:1px solid #d4d4d4;flex-shrink:0}.t-theme-chat-header .t-inner{flex-grow:1;flex-basis:0;display:flex;align-items:center;padding-left:1em;padding-right:1em;min-width:0}.t-theme-chat-header .t-content{flex-grow:1;display:flex;align-items:center;min-width:0}.t-theme-chat-header .t-image{width:45px;text-align:center;margin-right:.75em;flex-shrink:0}.t-theme-chat-header .t-info{flex-grow:1;flex-basis:0;min-width:0}.t-theme-chat-header .t-title{font-weight:600;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:3px}.t-theme-chat-header .t-subtitle{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:85%;margin-left:4px}.t-theme-chat-header .t-user{display:inline-block;vertical-align:middle}.t-theme-chat-header .t-online-indicator{display:inline-block;width:.75em;height:.75em;border-radius:100%;margin:0 .75em -1px .275em}.t-theme-chat-header .t-online-indicator[t-status=online]{background-color:#22c55e}.t-theme-chat-header .t-online-indicator[t-status=offline]{background-color:#fff;-webkit-box-shadow:inset 0 0 0 1px rgba(50,50,50,.4);box-shadow:inset 0 0 0 1px #32323266}.t-theme-message{display:block;margin-top:.35em}.t-theme-message:last-child{margin-top:1.35em}.t-theme-message:not(:last-child) .t-message-sender-name{display:none}.t-theme-message:not(:last-child) .t-theme-avatar{visibility:hidden}.t-theme-message[t-sender=system]{margin-top:1.35em}.t-theme-message[t-sender=system]+.t-theme-message[t-sender=system]{margin-top:.5em}.t-theme-message:has(.t-reactions):has(+.t-theme-message){margin-bottom:.75em}.t-theme-message .t-message-row{display:flex;align-items:center;gap:.5em}.t-theme-message[t-sender=currentUser] .t-message-row{flex-direction:row-reverse}.t-theme-message .t-message-body{white-space:normal;overflow:hidden;border-radius:.75em;border-width:1px;border-style:solid;word-wrap:break-word;position:relative;display:inline-block;max-width:calc(100% - 6.5em);border-color:#ececec;background-color:#f7f7f7;color:#111;padding:.75em 1em}.t-theme-message .t-message-body .t-theme-referenced-message{border-left:solid 2px;margin-bottom:.4em;font-size:93%;padding:0 .55em}.t-theme-message[t-sender=currentUser] .t-message-body{border-color:#007df9;background-color:#007df9;color:#fff}.t-theme-message .t-message-body .t-message-content{display:contents;margin-top:.75em}.t-theme-message .t-message-body:has(.t-theme-audio-block,.t-theme-voice-block,.t-theme-location-block){width:100%}.t-theme-message .t-message-body:not(:has(.t-message-sender-name,.t-theme-referenced-message,.t-theme-text-block:first-child,.t-theme-file-block:first-child)){padding-top:0}.t-theme-message .t-message-body:not(:has(.t-theme-text-block:first-child,.t-theme-file-block:first-child)) .t-message-sender-name{margin-bottom:.75em}.t-theme-message button[data-action]{border-radius:.375em;font-size:inherit;margin:1px 0;padding:.25em .325em;cursor:pointer;transition:color .2s ease-in-out,background-color .2s ease-in-out,border .2s ease-in-out}.t-theme-message[t-sender=currentUser] button[data-action]{color:#0761d1;background-color:#fff;border:1px solid white}.t-theme-message[t-sender=currentUser]:enabled button[data-action]:hover,.t-theme-message[t-sender=currentUser]:enabled button[data-action]:active{color:inherit;background-color:transparent}.t-theme-message[t-sender=currentUser] button[data-action]:focus-visible{outline:white solid 2px;outline-offset:2px}.t-theme-message[t-sender=other] button[data-action]{color:#111;background-color:transparent;border:1px solid #525252}.t-theme-message[t-sender=other]:enabled button[data-action]:hover{color:#fff;background-color:#111;border:1px solid #111}.t-theme-message[t-sender=other]:enabled button[data-action]:active{color:#fff;background-color:#404040;border:1px solid #404040}.t-theme-message[t-sender=other] button[data-action]:focus-visible{outline:#525252 solid 2px;outline-offset:2px}.t-theme-message[t-sender=system] button[data-action]{color:#fff;background-color:#007df9;border:1px solid #007df9}.t-theme-message[t-sender=system]:enabled button[data-action]:hover{color:#fff;background-color:#0761d1;border:1px solid #0761d1}.t-theme-message[t-sender=system]:enabled button[data-action]:active{color:#fff;background-color:#3291ff;border:1px solid #3291ff}.t-theme-message[t-sender=system] button[data-action]:focus-visible{outline:#007df9 solid 2px;outline-offset:2px}.t-theme-message button[data-action]:disabled{background-color:gray;border-color:gray}.t-theme-message .t-message-sender-name{font-size:75%;font-weight:700}.t-theme-message .t-reactions{margin-top:.25em;display:flex;flex-wrap:wrap;gap:.25em}.t-theme-message[t-sender=currentUser] .t-reactions{justify-content:flex-end;margin-right:.75em}.t-theme-message[t-sender=other] .t-reactions{margin-left:3.75em}.t-theme-message[t-sender=system] .t-message-body{background:transparent;width:100%;max-width:none;border:none}.t-theme-message[t-sender=system] .t-message-row{white-space:normal;border-radius:.75em;overflow:hidden;white-space:pre-wrap;background-color:transparent;color:#111;border:1px solid #d4d4d4}.t-theme-message .t-message-content a{color:currentColor}.t-theme-message .t-message-status{display:inline-flex;font-size:75%;float:right;margin-left:2em;margin-top:.6em;opacity:75%;min-width:3.5ch;text-align:right}.t-theme-message .t-message-loading-spinner{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;width:1em;height:1em}.t-theme-message .t-status-icon{margin-left:.25em;letter-spacing:-.3em;min-width:1em}.t-theme-message .t-message-row>button{border:none;width:36px;height:36px;padding:8px;border-radius:9999px;border:0;color:inherit;opacity:.75;cursor:pointer;font-size:120%;background:inherit}.t-theme-message .t-message-row>button:hover,.t-theme-message .t-message-row>button:focus{color:#0761d1}.t-theme-message .t-message-row>button:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}@media (hover: hover){.t-theme-message .t-message-row>button{visibility:hidden}.t-theme-message .t-message-row:hover>button,.t-theme-message .t-message-row:focus-within>button{visibility:visible}}@media (hover: none){.t-theme-message .t-message-row>button{opacity:.0001%}.t-theme-message .t-message-row:hover>button,.t-theme-message .t-message-row:focus-within>button{opacity:100%}}.t-message-action-menu-button .t-action-menu-icon{width:1.143em;height:1.143em}.t-theme-message .t-emoji-reactions{margin-top:.25em;margin-bottom:.5em;display:flex;flex-wrap:wrap;gap:.25em}.t-theme-message[t-sender=currentUser] .t-emoji-reactions{justify-content:flex-end;margin-right:3.5em}.t-theme-message[t-sender=other] .t-emoji-reactions{margin-left:3.5em}.t-theme-message .t-reaction-button{border:1px solid transparent;margin:0;padding:.2em .55em;border-radius:8em;background-color:#e8ecee}.t-theme-message .t-reaction-button[t-active]{background:#1e60e1;border:1px solid transparent;color:#fff}.t-theme-message .t-reaction-button[t-active]:hover{background:#1e60e1;border:1px solid transparent}.t-theme-message .t-reaction-button span{display:inline-block;vertical-align:middle}.t-theme-message .t-reaction-button .t-emoji{font-size:1.25eem}.t-theme-message .t-reaction-button .t-num-reactions{padding-left:.25em;font-size:.85em}.t-theme-message .t-reaction-picker{width:300px;height:200px;margin:0 10px;border-radius:.75em;border:1px solid #d4d4d4;overflow:hidden}.t-theme-message .t-mention{line-height:1.5;color:inherit;margin:0;border-radius:9999px;padding:.25rem .45rem}.t-theme-message .t-mention[t-is-current-user]{font-weight:700}.t-theme-message[t-sender=currentUser] .t-mention{background-color:#fff3}.t-theme-message[t-sender=currentUser] .t-mention[t-is-current-user]{background-color:#fff6}.t-theme-message[t-sender=other] .t-mention{background-color:#dcdcdc80}.t-theme-message[t-sender=other] .t-mention[t-is-current-user]{background-color:#dcdcdce6}.t-theme-message-action-menu{display:flex;flex-direction:column;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.35em}.t-theme-message-action-menu .t-menu-item{padding:.45em .65em;cursor:pointer;background:none;border:none;border-radius:.5em;text-align:left}.t-theme-message-action-menu .t-menu-item:hover{background-color:#007df9;color:#fff}.t-theme-message-action-menu .t-menu-item.t-danger{color:#ef4444}.t-theme-message-action-menu .t-menu-item.t-danger:hover{background-color:#fec8c866;color:#ef4444}.t-theme-message-field{display:flex;flex-direction:column}.t-theme-message-field[t-mode=send]{max-height:calc(100% - 100px)}.t-theme-message-field[t-mode=edit]{margin:.75em 0}.t-theme-message-field .t-wrapper{flex-shrink:0;position:relative;padding:16px;color:#111;font-size:16px;background-color:#ececec;border-top:#d4d4d4 solid 1px;max-width:100%;width:100%;margin:0 auto;z-index:2}.t-theme-message-field[t-mode=edit] .t-wrapper{border:#d4d4d4 solid 1px;border-radius:.75em}.t-theme-message-field .t-emoji-suggest-bar{width:100%;padding:.5rem;display:flex;overflow:auto hidden;height:60px;margin-top:-60px;flex-shrink:0;align-items:center;background-color:#ececec;border-top:#d4d4d4 solid 1px;z-index:1}.t-theme-message-field .t-emoji-suggest-bar button{display:flex;align-items:center;justify-content:center;border:none;background:none;cursor:pointer;font-size:1.375rem;width:2.375rem;height:2.375rem;padding:0 5px;border-radius:.5rem}.t-theme-message-field .t-emoji-suggest-bar button[t-focused]{background-color:#d4d4d4}.t-theme-message-field[t-mode=edit] .t-emoji-suggest-bar{border:#d4d4d4 solid 1px;border-radius:.75em .75em 0 0}.t-theme-message-field[t-mode=edit]:has(.t-emoji-suggest-bar) .t-wrapper{border-radius:0 0 .75em .75em;border-top:none}.t-theme-message-field .t-mention-suggest-list{width:auto;max-width:100%;max-height:150px;display:flex;flex-direction:column;overflow-x:auto;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.5em}.t-theme-message-field .t-mention-suggest-list button{display:flex;align-items:center;border:none;background:none;cursor:pointer;border-radius:4px;white-space:nowrap;width:100%;height:2rem;min-height:2rem;padding:0 .25rem;color:#111}.t-theme-message-field .t-mention-suggest-list button:hover,.t-theme-message-field .t-mention-suggest-list button.focused{background-color:#007df9;color:#fff}.t-theme-message-field .t-edit-row{display:flex;gap:.5em;margin-left:auto}.t-theme-message-field .t-edit-row button{display:inline-block;padding:.5rem 1rem;border:0;border-radius:.5rem;cursor:pointer;background-color:#1111111a;color:#111}.t-theme-message-field .t-edit-row button[t-action=save]{background-color:#007df9;color:#fff}.t-theme-message-field .t-text-form{width:100%;max-width:100%;margin:0 auto;display:flex}.t-theme-message-field[t-mode=edit] .t-text-form{flex-direction:column;gap:.5em}.t-theme-message-field .t-editor .t-text-input{min-height:3.143em;max-height:9em;border-radius:.65em;border:1px solid white;background-color:#fff;display:block;resize:none;overflow-x:hidden;overflow-y:auto;word-break:break-word;white-space:pre-wrap;padding:0 44px 0 1em;transition:box-shadow .15s ease-out}.t-theme-message-field .t-editor .t-text-input:focus-visible{border-color:#fff;outline:#a3a3a3 solid 1px}.t-theme-message-field .t-editor .t-text-input p{margin:.875em 0;padding:0;border:0;outline:0}.t-theme-message-field .t-editor .t-mention{color:#007df9}.t-theme-message-field .t-send-column{flex-grow:0;flex-shrink:0;white-space:nowrap;align-self:center;display:flex}.t-theme-message-field .t-textbox-column{position:relative;flex-grow:1;margin-right:.28em}.t-theme-message-field .t-send-button{width:2.571em;height:2.571em;padding:.571em;border:0;border-radius:9999px;display:inline-flex;justify-content:center;align-items:center;cursor:pointer;background:transparent;color:currentColor;opacity:.75;transition:.15s ease-out}.t-theme-message-field .t-send-button:hover,.t-theme-message-field .t-send-button:focus{background-color:#2626260d}.t-theme-message-field .t-send-button:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}.t-theme-message-field .t-send-button{display:flex}.t-theme-message-field .t-send-button[disabled]{color:currentColor}.t-theme-message-field .t-text-limit-indicator{opacity:.5;font-size:75%;margin:-.75em 0 .5em 2px}.t-theme-message-field .t-readonly{opacity:.5;user-select:none}.t-theme-message-field .t-button-overlay{position:absolute;right:0;top:0;bottom:0;margin-right:8px;display:flex;align-items:center}.t-theme-message-field [t-kind=icon-button]{width:36px;height:36px;padding:8px;border:0;border-radius:9999px;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;background:transparent;color:currentColor;opacity:.75;transition:.15s ease-out}.t-theme-message-field [t-kind=icon-button]:hover,.t-theme-message-field [t-kind=icon-button]:focus{background-color:#2626260d;color:#007df9;opacity:1}.t-theme-message-field [t-kind=icon-button]:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}.t-theme-message-field .t-edit-row button[t-action=save]:disabled{cursor:initial;background-color:#888;color:#fff}.t-theme-message-field .t-emoji-picker-wrapper{width:100%;height:350px;overflow:hidden;flex-shrink:1;border-top:1px solid #d4d4d4}.t-theme-icon{display:inline-block;vertical-align:middle;overflow:hidden}.t-message-divider{width:100%;margin:1.3em .5em 0;display:grid;grid-template-columns:1fr max-content 1fr;color:#95a7b1}.t-message-divider span{vertical-align:top;white-space:nowrap;height:1.3em;padding:0 20px}.t-message-divider .t-line[t-side=right]{display:grid;grid-template-columns:1fr max-content;gap:10px;grid-column:3}.t-message-divider .t-line .t-line-segment{height:0;width:100%;margin-top:10px;border:none;border-bottom:1px solid #95a7b1}.t-message-divider .t-line .t-unread-marker{position:relative;top:-4px;height:28px;padding:3px 10px;border-radius:100px;border:1px solid #95a7b1;vertical-align:middle}.t-theme-message-list-footer{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.5em;margin-top:1.35em}.t-theme-message-list-footer .t-typing-avatars{display:flex;flex-direction:row;align-items:left;justify-content:center;width:fit-content}.t-theme-message-list-footer .t-typing-avatars>.t-theme-avatar{width:2.6em;height:2.6em;display:flex;align-items:center;justify-content:center;color:#111;line-height:2.6em;vertical-align:text-top;font-size:.75em}.t-theme-message-list-footer .t-typing-avatars>.t-theme-avatar:not(:last-child){margin-right:-.66em}.t-theme-message-list-footer .t-typing-bubble{display:flex;flex-direction:row;justify-content:center;align-items:center;border-radius:1em;background-color:#f7f7f7;border:1px solid #ececec;color:#111;padding:0 1em;font-size:.75em}.t-theme-message-list-footer .t-typing-animation{display:flex;flex-direction:row;align-items:center;gap:4px;height:2.6em;line-height:2.6em}.t-theme-message-list-footer .t-typing-animation span{height:6px;width:6px;background-color:#737373;display:inline-block;border-radius:50%;opacity:.4}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(1){animation:1s blink infinite .3333s}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(2){animation:1s blink infinite .6666s}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(3){animation:1s blink infinite .9999s}@keyframes blink{50%{opacity:1}}.t-theme-audio-block{display:contents;width:100%;min-width:25ch}.t-theme-audio-block .t-audio-player{margin-bottom:.5em}.t-theme-audio-block .t-attachment-icon{width:1em;height:1em;margin-right:.2em}.t-theme-audio-block .t-filesize{font-size:.8em}.t-theme-file-block{display:contents}.t-theme-file-block a{word-break:break-all;text-decoration:none}.t-theme-file-block .t-filename{text-decoration:underline}.t-theme-file-block .t-attachment-icon{width:1em;height:1em;margin-right:.2em}.t-theme-file-block .t-filesize{white-space:nowrap;font-size:75%}.t-theme-file-block .t-loading-spinner{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;display:block;margin:auto;width:4em;height:4em}.t-theme-image-block{display:contents}.t-theme-image-block .download-icon{width:1em;height:1em;margin-right:.2em}.t-image-wrapper{display:block;height:auto;min-height:40px;max-height:400px}.t-theme-image-block .t-root{display:flex;justify-content:center;align-items:center;min-height:inherit;max-height:inherit;height:auto;max-width:min(calc(100% + 2em),calc(var(--img-w) * 1px));width:calc(100% + 2em);transform:translate(-1em);aspect-ratio:var(--img-w) / var(--img-h);overflow:hidden;margin:0 auto .5em}.t-theme-image-block .t-image{width:100%;height:100%;max-width:calc(var(--img-w) * 1px);max-height:calc(var(--img-h) * 1px);object-fit:contain}.t-theme-image-block .t-filesize{font-size:.8em}.t-theme-location-block{display:contents;min-height:100px;max-height:500px}.t-theme-location-block .t-root{display:block;height:200px;margin:0 -1em .5em}.t-theme-text-block{display:contents}.t-theme-text-block .t-text .t-emoji{height:1.15em;width:1.15em;margin:0 .1em .1em;vertical-align:middle}.t-theme-text-block .t-text{white-space:pre-wrap}.t-theme-text-block ul{padding-left:0;margin:0}.t-theme-text-block ul li{margin-left:1em;margin-bottom:.5em}.t-theme-video-block{display:contents}.t-theme-video-block .download-icon{width:1em;height:1em;margin-right:.2em}.t-video-wrapper{display:block;height:auto;min-height:40px;max-height:400px}.t-theme-video-block .t-root{display:flex;justify-content:center;align-items:center;min-height:inherit;max-height:inherit;height:auto;max-width:min(calc(100% + 2em),calc(var(--video-w) * 1px));width:calc(100% + 2em);transform:translate(-1em);aspect-ratio:var(--video-w) / var(--video-h);overflow:hidden;margin:0 auto .5em}.t-theme-video-block .t-video{width:100%;height:100%;max-width:calc(var(--video-w) * 1px);max-height:calc(var(--video-h) * 1px);object-fit:contain;background-color:#000000d9}.t-theme-video-block .t-filesize{font-size:.8em}.t-theme-conversation-list-item{color:#525252;text-decoration:none;width:100%;padding:0;height:auto;padding:1rem;border:none;border-bottom:1px solid #d4d4d4;background-color:transparent;overflow:hidden;display:flex;align-items:center;gap:.5rem;word-wrap:break-word;transition:color .1s ease-in-out,background-color .1s ease-in-out;background-color:#fff;text-align:initial}.t-theme-conversation-list-item a{color:#525252}.t-theme-conversation-list-item[t-selected] a{color:#fff}.t-theme-conversation-list-item:last-child{margin-bottom:10px}.t-theme-conversation-list-item:hover{background-color:#f7f7f7;cursor:pointer}.t-theme-conversation-list-item[t-selected]{color:#fff;background-color:#007df9}.t-theme-conversation-list-item[t-selected]:focus-visible{outline:#fff 2px solid;outline-offset:-4px;border-bottom:0}.t-theme-conversation-list-item:focus-visible{outline:#3291ff 2px solid;outline-offset:-2px}.t-theme-conversation-list-item[t-unread]{background-color:#f7f7f7;color:#111}.t-theme-conversation-list-item[t-selected][t-unread]{color:#fff;background-color:#007df9}.t-theme-conversation-list-item .t-inner{margin-left:10px;flex-basis:0;flex-grow:1;min-width:0}.t-theme-conversation-list-item .t-header,.t-theme-conversation-list-item .t-body{display:flex;align-items:center;flex-grow:1;flex-shrink:0;min-width:0;overflow:hidden}.t-theme-conversation-list-item .t-message-sender{margin-right:.2rem}.t-theme-conversation-list-item .t-timestamp{font-size:85%;opacity:.75}.t-theme-conversation-list-item .t-timestamp,.t-theme-conversation-list-item .t-unread-dot{flex-shrink:0;margin-left:4px}.t-theme-conversation-list-item .t-conversation-name{font-weight:600}.t-theme-conversation-list-item .t-conversation-name,.t-theme-conversation-list-item .t-message{flex-grow:1;font-size:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-theme-conversation-list-item .t-message{opacity:.75;flex-basis:0}.t-theme-conversation-list-item .t-unread-dot{display:flex;align-items:center;justify-content:center;padding:0 .4rem;border-radius:9999px;height:20px;width:auto;min-width:20px;text-align:center;line-height:inherit;font-size:85%;color:#fff;background-color:#007df9}.t-theme-conversation-list-item .t-unread-generic-dot{padding:.6ex;transform:scale(.999);border-radius:999px;background-color:#007df9}.t-theme-conversation-list-item[t-selected] .t-unread-generic-dot{padding:.6ex;transform:scale(.999);border-radius:999px;background-color:#fff}.t-theme-conversation-list-item[t-selected] .t-unread-dot{color:#007df9;background-color:#fff}.t-theme-conversation-list-item .t-unread-dot:empty{padding:0;min-width:10px;min-height:10px}.t-theme-conversation-list-item .t-message li{display:inline list-item;margin-right:.25rem}.t-theme-conversation-list-item .t-message ul{list-style:inside}.t-theme-avatar{display:block;overflow:hidden;background-color:#ececec;background-size:cover;background-repeat:no-repeat;background-position:center center;border-style:solid;border-radius:50%;border-width:2px;border-color:#fff;flex-shrink:0;align-self:flex-start;width:3em;height:3em}.t-theme-group-chat-image{display:block;overflow:hidden;position:relative;width:44px;height:44px;flex-shrink:0}.t-theme-group-chat-image .t-mini-avatar{border-radius:50%;border-width:2px;border-color:#fff;border-style:solid;box-shadow:0 1px 1px #8899a626;width:30px;height:30px;position:absolute;background-color:#f7f7f7;background-position:center;background-size:cover}.t-theme-group-chat-image .t-mini-avatar:nth-child(1){right:0;top:14px}.t-theme-group-chat-image .t-mini-avatar:nth-child(2){left:0;top:0}.t-theme-group-chat-image .t-counter{border-radius:50%;border:2px solid #fff;font-weight:600;position:absolute;min-width:18px;min-height:18px;max-width:22px;max-height:22px;left:0;bottom:0;display:flex;justify-content:center;align-items:center;color:#111;padding:0}.t-theme-group-chat-image .t-group{border-style:none;color:#ececec}.t-theme-referenced-message{display:flex;flex-direction:column}.t-theme-referenced-message .t-sender-name{font-weight:600;margin-bottom:2px}.t-theme-referenced-message .t-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:.165em 0}.t-theme-referenced-message .t-content a{color:currentColor}.t-theme-reply-bar{height:4.286em;display:flex;align-items:center;background-color:#ececec;padding:.714em;color:#262626;border-top:#d4d4d4 solid 1px}.t-theme-reply-bar .t-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:.165rem 0px}.t-theme-reply-bar .t-close-button{width:2.571em;height:2.571em;padding:.571em;border:0;border-radius:9999px;cursor:pointer;display:inline-flex;align-items:center;background:transparent;opacity:.75;transition:.15s ease-out}.t-theme-reply-bar .t-close-button:hover{background-color:#2626260d;color:#007df9;opacity:1}.t-theme-reply-bar .t-body{flex-grow:1;padding:0 1em;overflow:hidden}.t-theme-reply-bar .t-close-icon,.t-theme-reply-bar .t-reply-icon{width:1.428em;height:1.428em;min-width:1.428em;min-height:1.428em}.t-theme-reply-bar .t-mention{line-height:1.5;background-color:#c8c8c880;color:inherit;margin:0;border-radius:9999px;padding:.25rem .45rem}.t-theme-reply-bar .t-mention[t-is-current-user]{font-weight:700;background-color:#c8c8c8e6}.t-theme-compact-message-content>.t-theme-icon{width:1.25em;height:1.25em;margin-right:.25em}.t-theme-compact-message-content .t-text ul{list-style:inside;margin:0 0 0 .5em;padding:0;display:inline}.t-theme-compact-message-content .t-text li{display:inline list-item;margin-right:1em}.t-theme-compact-message-content .t-text li::marker{content:"• "}
|
|
1
|
+
@import"https://cdn.talkjs.com/fonts/Inter.css";.t-audio-player{width:100%;height:auto;display:flex;flex-direction:row;align-items:center;column-gap:10px;padding:1.5em 1em 0}.t-audio-player .t-waveform{flex-grow:1;z-index:0}.t-audio-player button{background:transparent;border:none;color:inherit;padding:0;cursor:pointer}.t-audio-player .t-playback-speed{width:4em}.t-audio-player .t-play-pause-icon{width:30px;height:30px}.t-audio-player .t-up-down-icon{width:1em;height:1em}.t-audio-player .t-up-down svg{margin-top:-2px}.t-audio-player .t-playback-heading{opacity:.5;padding:.5em 1em}.t-audio-player .t-playback-checkmark{display:inline-block;width:1em;margin-right:.5em}.t-audio-player .t-playback-speed-menu{display:flex;flex-direction:column;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.35em}.t-audio-player .t-playback-speed-menu .t-menu-item{padding:.45em .65em;cursor:pointer;background:none;border:none;border-radius:.5em;text-align:left}.t-audio-player .t-playback-speed-menu .t-menu-item:hover{background-color:#007df9;color:#fff}:is(.t-text-input .empty-node):before{position:absolute;color:currentColor;cursor:text;opacity:.6}:is(.t-text-input .empty-node):first-child:before{content:attr(data-placeholder)}.t-editor .ProseMirror{position:relative}.t-editor .ProseMirror{word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;font-feature-settings:"liga" 0}.t-editor .ProseMirror pre{white-space:pre-wrap}.t-editor .ProseMirror li{position:relative}.t-editor .ProseMirror-hideselection *::selection{background:transparent}.t-editor .ProseMirror-hideselection *::-moz-selection{background:transparent}.t-editor .ProseMirror-hideselection{caret-color:transparent}.t-editor .ProseMirror [draggable][contenteditable=false]{user-select:text}.t-editor .ProseMirror-selectednode{outline:2px solid #8cf}.t-editor li.ProseMirror-selectednode{outline:none}.t-editor li.ProseMirror-selectednode:after{content:"";position:absolute;inset:-2px -2px -2px -32px;border:2px solid #8cf;pointer-events:none}.t-editor img.ProseMirror-separator{display:inline!important;border:none!important;margin:0!important}.t-emoji-picker{width:100%;height:100%;overflow:hidden;flex-shrink:1}.t-emoji-picker emoji-picker{width:100%;border:0;height:100%;--border-size: 0;--num-columns: 10;--emoji-size: 21px;--category-emoji-size: 14px;--indicator-height: 2px;--outline-color: rgba(30, 96, 225, .5);--input-padding: 7px 11.5px;--button-active-background: #d4d4d4;--input-border-color: #d4d4d4;--input-focused-border-color: #b0b0b0;--indicator-color: #007df9;--button-hover-background: #d4d4d488;--input-border-radius: 4px;--input-font-size: inherit;--emoji-font-family: "Twemoji Country Flags", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", "EmojiOne Color", "Android Emoji", "Twemoji Mozilla", sans-serif}.t-emoji-picker[t-loading]{display:flex;align-items:center;justify-content:center;background-color:#fff;color:#007df9}.t-emoji-picker[t-loading] .t-loading-icon,.t-loading-icon{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;display:block;margin:auto;width:4em;height:4em}.t-emoji-suggest-bar{will-change:transform;transform:translateY(100%);transition:transform .1s ease-out}.t-emoji-suggest-bar.slide-enter{transform:translateY(100%)}.t-emoji-suggest-bar.slide-enter-active,.t-emoji-suggest-bar.slide-enter-done,.t-emoji-suggest-bar.slide-exit{transform:translateY(0)}.t-emoji-suggest-bar.slide-exit-active,.t-emoji-suggest-bar.slide-exit-done{transform:translateY(100%)}.t-emoji-suggest-bar{scrollbar-color:rgba(0,0,0,.2) transparent;scrollbar-width:thin;overflow-y:hidden}.t-emoji-suggest-bar:hover{scrollbar-color:rgba(0,0,0,.4) transparent}.t-emoji-suggest-bar:active{scrollbar-color:rgba(0,0,0,.6) transparent}@media (prefers-reduced-motion: reduce){.t-emoji-suggest-bar{transition:none}}.t-message-list{width:100%;height:100%;display:flex;flex-direction:column-reverse;overflow-x:hidden;overflow-y:auto;padding:16px;scrollbar-color:rgba(0,0,0,.2) transparent}.t-message-list:hover{scrollbar-color:rgba(0,0,0,.4) transparent}.t-message-list:active{scrollbar-color:rgba(0,0,0,.6) transparent}.t-message-group{display:flex;flex-direction:column-reverse}:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-panel{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%;height:100%;text-align:center;padding:25px;-webkit-font-smoothing:subpixel-antialiased;overflow-x:hidden;font-size:.95em;font-family:Open Sans,Helvetica,sans-serif}:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-error-panel{background-color:#f7f7f7}:is(:is(.t-chatbox,.t-conversation-list,t-chatbox,t-conversation-list) .t-error-panel) .t-heading{font-size:2em}.t-attach-overlay{z-index:2;width:100%;height:100%;padding:16px;background-color:#64646480;display:flex;justify-content:center;align-items:center}.t-upload-preview .t-preview{position:relative;background-color:#fff;border-radius:1rem;max-width:750px;width:100%;display:inline-block;overflow:auto;padding:.5rem}@media screen and (max-width: 500px){.t-upload-preview .t-preview{width:85%}}:is(.t-upload-preview .t-preview) .t-img-container{text-align:center;background-color:#0000001a}:is(.t-upload-preview .t-preview) img{display:block;max-width:100%;max-height:400px;margin-left:auto;margin-right:auto}:is(.t-upload-preview .t-preview) video{width:100%;height:100%;object-fit:fill}:is(.t-upload-preview .t-preview) .t-location-upload-preview{width:100%;background-color:#0000001a;padding-bottom:calc((400 / 600) * 100%);display:block}.t-upload-preview .t-cancel-row{text-align:right;position:sticky;top:8px;padding-right:8px;z-index:2;margin-bottom:-38px}.t-upload-preview .t-filename-row{white-space:pre-wrap;word-break:break-all;padding:.5rem 1rem 0}.t-is-file:is(.t-upload-preview .t-filename-row){display:flex;justify-content:center;align-items:center;min-height:250px;padding-top:32px;padding-bottom:32px;text-align:center;background-color:#0000001a;border-radius:1rem;margin-bottom:1rem}:is(.t-upload-preview .t-filename-row) .t-file-block{background-color:#fff;padding:16px 32px;border-radius:8px;display:inline-block}.t-upload-preview .t-error-row{border-width:.125rem;border-radius:1rem;padding:1rem;background-color:#fec8c866;border-color:transparent;color:#ef4444;white-space:normal}.t-upload-preview .t-send-row{position:sticky;bottom:0;padding:1rem;display:flex;justify-content:space-between}.t-upload-preview .t-cancel{border:0;border-radius:.5rem;padding:.75rem 1rem;cursor:pointer;color:currentColor}.t-upload-preview .t-confirm-send{margin-left:auto;border:0;border-radius:.5rem;padding:.75rem 1rem;cursor:pointer}.t-upload-preview .t-loading{height:80px;width:100%;display:flex;align-items:center;justify-content:center;color:#007df9}.t-upload-preview .t-preview,.t-upload-preview .t-send-row{background:#fff}.t-upload-preview .t-confirm-send{background-color:#007df9;color:#fff}.t-chatbox-content{flex-direction:column;margin:0;position:relative;width:100%;height:100%;display:flex;overflow-y:hidden}.t-chatbox-content>.t-attach-overlay{position:absolute;width:100%;height:100%;top:0;left:0}.t-chatbox-content>.t-drop-overlay{pointer-events:none}:is(.t-chatbox-content>.t-drop-overlay) .t-theme-icon{color:#1e1e1e80;width:300px;height:300px}.t-conversation-list-scrollable{overflow-y:auto;height:100%}html:is(html):is(html):is(html):is(html):is(html) :where(.t-chatbox *:not(svg,svg *,.ProseMirror)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(.t-conversation-list *:not(svg,svg *)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(t-chatbox *:not(svg,svg *,.ProseMirror)){all:revert-layer}html:is(html):is(html):is(html):is(html):is(html) :where(t-conversation-list *:not(svg,svg *,.ProseMirror)){all:revert-layer}t-chatbox,t-conversation-list{display:block}t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list{font-family:Twemoji Country Flags,Inter,sans-serif;font-synthesis:initial;text-align:left;font-size:14px;font-weight:400;line-height:1.37;color:#111;letter-spacing:normal;margin:0;position:relative;background-color:#fff;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:none;box-sizing:border-box;overflow:hidden;max-height:100vh;max-height:100dvh;max-width:100vw;max-width:100dvw}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) button{font-family:inherit;font-size:1em}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *,:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *:before,:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) *:after{box-sizing:border-box}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) svg{fill:currentColor}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) em{font-style:italic}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) strong{font-weight:700}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) del{text-decoration:line-through}:is(t-chatbox,t-conversation-list,.t-chatbox,.t-conversation-list) code{font-family:Cascadia Code,Droid Sans Mono,Menlo,Consolas,Lucida Console,Monaco,monospace;font-variant-ligatures:none}t-conversation-list,.t-conversation-list{width:300px;height:600px}t-chatbox,.t-chatbox{width:400px;height:600px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.t-theme-chat-header{display:flex;align-items:center;height:4.5em;background-color:#ececec;border-bottom:1px solid #d4d4d4;flex-shrink:0}.t-theme-chat-header .t-inner{flex-grow:1;flex-basis:0;display:flex;align-items:center;padding-left:1em;padding-right:1em;min-width:0}.t-theme-chat-header .t-content{flex-grow:1;display:flex;align-items:center;min-width:0}.t-theme-chat-header .t-image{width:45px;text-align:center;margin-right:.75em;flex-shrink:0}.t-theme-chat-header .t-info{flex-grow:1;flex-basis:0;min-width:0}.t-theme-chat-header .t-title{font-weight:600;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:3px}.t-theme-chat-header .t-subtitle{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:85%;margin-left:4px}.t-theme-chat-header .t-user{display:inline-block;vertical-align:middle}.t-theme-chat-header .t-online-indicator{display:inline-block;width:.75em;height:.75em;border-radius:100%;margin:0 .75em -1px .275em}.t-theme-chat-header .t-online-indicator[t-status=online]{background-color:#22c55e}.t-theme-chat-header .t-online-indicator[t-status=offline]{background-color:#fff;-webkit-box-shadow:inset 0 0 0 1px rgba(50,50,50,.4);box-shadow:inset 0 0 0 1px #32323266}.t-theme-message{display:block;margin-top:.35em}.t-theme-message:last-child{margin-top:1.35em}.t-theme-message:not(:last-child) .t-message-sender-name{display:none}.t-theme-message:not(:last-child) .t-theme-avatar{visibility:hidden}.t-theme-message[t-sender=system]{margin-top:1.35em}.t-theme-message[t-sender=system]+.t-theme-message[t-sender=system]{margin-top:.5em}.t-theme-message:has(.t-reactions):has(+.t-theme-message){margin-bottom:.75em}.t-theme-message .t-message-row{display:flex;align-items:center;gap:.5em}.t-theme-message[t-sender=currentUser] .t-message-row{flex-direction:row-reverse}.t-theme-message .t-message-body{white-space:normal;overflow:hidden;border-radius:.75em;border-width:1px;border-style:solid;word-wrap:break-word;position:relative;display:inline-block;max-width:calc(100% - 6.5em);border-color:#ececec;background-color:#f7f7f7;color:#111;padding:.75em 1em}.t-theme-message .t-message-body .t-theme-referenced-message{border-left:solid 2px;margin-bottom:.4em;font-size:93%;padding:0 .55em}.t-theme-message[t-sender=currentUser] .t-message-body{border-color:#007df9;background-color:#007df9;color:#fff}.t-theme-message .t-message-body .t-message-content{display:contents;margin-top:.75em}.t-theme-message .t-message-body:has(.t-theme-audio-block,.t-theme-voice-block,.t-theme-location-block){width:100%}.t-theme-message .t-message-body:not(:has(.t-message-sender-name,.t-theme-referenced-message,.t-theme-text-block:first-child,.t-theme-file-block:first-child)){padding-top:0}.t-theme-message .t-message-body:not(:has(.t-theme-text-block:first-child,.t-theme-file-block:first-child)) .t-message-sender-name{margin-bottom:.75em}.t-theme-message button[t-action]{border-radius:.375em;font-size:inherit;margin:1px 0;padding:.25em .325em;cursor:pointer;transition:color .2s ease-in-out,background-color .2s ease-in-out,border .2s ease-in-out}.t-theme-message[t-sender=currentUser] button[t-action]{color:#0761d1;background-color:#fff;border:1px solid white}.t-theme-message[t-sender=currentUser] button[t-action]:hover,.t-theme-message[t-sender=currentUser] button[t-action]:active{color:inherit;background-color:transparent}.t-theme-message[t-sender=currentUser] button[t-action]:focus-visible{outline:white solid 2px;outline-offset:2px}.t-theme-message[t-sender=other] button[t-action]{color:#111;background-color:transparent;border:1px solid #525252}.t-theme-message[t-sender=other] button[t-action]:hover{color:#fff;background-color:#111;border:1px solid #111}.t-theme-message[t-sender=other] button[t-action]:active{color:#fff;background-color:#404040;border:1px solid #404040}.t-theme-message[t-sender=other] button[t-action]:focus-visible{outline:#525252 solid 2px;outline-offset:2px}.t-theme-message[t-sender=system] button[t-action]{color:#fff;background-color:#007df9;border:1px solid #007df9}.t-theme-message[t-sender=system] button[t-action]:hover{color:#fff;background-color:#0761d1;border:1px solid #0761d1}.t-theme-message[t-sender=system] button[t-action]:active{color:#fff;background-color:#3291ff;border:1px solid #3291ff}.t-theme-message[t-sender=system] button[t-action]:focus-visible{outline:#007df9 solid 2px;outline-offset:2px}.t-theme-message .t-message-sender-name{font-size:75%;font-weight:700}.t-theme-message .t-reactions{margin-top:.25em;display:flex;flex-wrap:wrap;gap:.25em}.t-theme-message[t-sender=currentUser] .t-reactions{justify-content:flex-end;margin-right:.75em}.t-theme-message[t-sender=other] .t-reactions{margin-left:3.75em}.t-theme-message[t-sender=system] .t-message-body{background:transparent;width:100%;max-width:none;border:none}.t-theme-message[t-sender=system] .t-message-row{white-space:normal;border-radius:.75em;overflow:hidden;white-space:pre-wrap;background-color:transparent;color:#111;border:1px solid #d4d4d4}.t-theme-message .t-message-content a{color:currentColor}.t-theme-message .t-message-status{display:inline-flex;font-size:75%;float:right;margin-left:2em;margin-top:.6em;opacity:75%;min-width:3.5ch;text-align:right}.t-theme-message .t-message-loading-spinner{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;width:1em;height:1em}.t-theme-message .t-status-icon{margin-left:.25em;letter-spacing:-.3em;min-width:1em}.t-theme-message .t-message-row>button{border:none;width:36px;height:36px;padding:8px;border-radius:9999px;border:0;color:inherit;opacity:.75;cursor:pointer;font-size:120%;background:inherit}.t-theme-message .t-message-row>button:hover,.t-theme-message .t-message-row>button:focus{color:#0761d1}.t-theme-message .t-message-row>button:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}@media (hover: hover){.t-theme-message .t-message-row>button{visibility:hidden}.t-theme-message .t-message-row:hover>button,.t-theme-message .t-message-row:focus-within>button{visibility:visible}}@media (hover: none){.t-theme-message .t-message-row>button{opacity:.0001%}.t-theme-message .t-message-row:hover>button,.t-theme-message .t-message-row:focus-within>button{opacity:100%}}.t-message-action-menu-button .t-action-menu-icon{width:1.143em;height:1.143em}.t-theme-message .t-emoji-reactions{margin-top:.25em;margin-bottom:.5em;display:flex;flex-wrap:wrap;gap:.25em}.t-theme-message[t-sender=currentUser] .t-emoji-reactions{justify-content:flex-end;margin-right:3.5em}.t-theme-message[t-sender=other] .t-emoji-reactions{margin-left:3.5em}.t-theme-message .t-reaction-button{border:1px solid transparent;margin:0;padding:.2em .55em;border-radius:8em;background-color:#e8ecee}.t-theme-message .t-reaction-button[t-active]{background:#1e60e1;border:1px solid transparent;color:#fff}.t-theme-message .t-reaction-button[t-active]:hover{background:#1e60e1;border:1px solid transparent}.t-theme-message .t-reaction-button span{display:inline-block;vertical-align:middle}.t-theme-message .t-reaction-button .t-emoji{font-size:1.25eem}.t-theme-message .t-reaction-button .t-num-reactions{padding-left:.25em;font-size:.85em}.t-theme-message .t-reaction-picker{width:300px;height:200px;margin:0 10px;border-radius:.75em;border:1px solid #d4d4d4;overflow:hidden}.t-theme-message .t-mention{line-height:1.5;color:inherit;margin:0;border-radius:9999px;padding:.25rem .45rem}.t-theme-message .t-mention[t-is-current-user]{font-weight:700}.t-theme-message[t-sender=currentUser] .t-mention{background-color:#fff3}.t-theme-message[t-sender=currentUser] .t-mention[t-is-current-user]{background-color:#fff6}.t-theme-message[t-sender=other] .t-mention{background-color:#dcdcdc80}.t-theme-message[t-sender=other] .t-mention[t-is-current-user]{background-color:#dcdcdce6}.t-theme-message-action-menu{display:flex;flex-direction:column;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.35em}.t-theme-message-action-menu .t-menu-item{padding:.45em .65em;cursor:pointer;background:none;border:none;border-radius:.5em;text-align:left}.t-theme-message-action-menu .t-menu-item:hover{background-color:#007df9;color:#fff}.t-theme-message-action-menu .t-menu-item.t-danger{color:#ef4444}.t-theme-message-action-menu .t-menu-item.t-danger:hover{background-color:#fec8c866;color:#ef4444}.t-theme-message-field{display:flex;flex-direction:column}.t-theme-message-field[t-mode=send]{max-height:calc(100% - 100px)}.t-theme-message-field[t-mode=edit]{margin:.75em 0}.t-theme-message-field .t-wrapper{flex-shrink:0;position:relative;padding:16px;color:#111;font-size:16px;background-color:#ececec;border-top:#d4d4d4 solid 1px;max-width:100%;width:100%;margin:0 auto;z-index:2}.t-theme-message-field[t-mode=edit] .t-wrapper{border:#d4d4d4 solid 1px;border-radius:.75em}.t-theme-message-field .t-emoji-suggest-bar{width:100%;padding:.5rem;display:flex;overflow:auto hidden;height:60px;margin-top:-60px;flex-shrink:0;align-items:center;background-color:#ececec;border-top:#d4d4d4 solid 1px;z-index:1}.t-theme-message-field .t-emoji-suggest-bar button{display:flex;align-items:center;justify-content:center;border:none;background:none;cursor:pointer;font-size:1.375rem;width:2.375rem;height:2.375rem;padding:0 5px;border-radius:.5rem}.t-theme-message-field .t-emoji-suggest-bar button[t-focused]{background-color:#d4d4d4}.t-theme-message-field[t-mode=edit] .t-emoji-suggest-bar{border:#d4d4d4 solid 1px;border-radius:.75em .75em 0 0}.t-theme-message-field[t-mode=edit]:has(.t-emoji-suggest-bar) .t-wrapper{border-radius:0 0 .75em .75em;border-top:none}.t-theme-message-field .t-mention-suggest-list{width:auto;max-width:100%;max-height:150px;display:flex;flex-direction:column;overflow-x:auto;background-color:#fff;color:#111;border:1px solid #d4d4d4;border-radius:.75em;box-shadow:0 8px 24px #73737333;padding:.5em}.t-theme-message-field .t-mention-suggest-list button{display:flex;align-items:center;border:none;background:none;cursor:pointer;border-radius:4px;white-space:nowrap;width:100%;height:2rem;min-height:2rem;padding:0 .25rem;color:#111}.t-theme-message-field .t-mention-suggest-list button:hover,.t-theme-message-field .t-mention-suggest-list button.focused{background-color:#007df9;color:#fff}.t-theme-message-field .t-edit-row{display:flex;gap:.5em;margin-left:auto}.t-theme-message-field .t-edit-row button{display:inline-block;padding:.5rem 1rem;border:0;border-radius:.5rem;cursor:pointer;background-color:#1111111a;color:#111}.t-theme-message-field .t-edit-row button[t-action=save]{background-color:#007df9;color:#fff}.t-theme-message-field .t-text-form{width:100%;max-width:100%;margin:0 auto;display:flex}.t-theme-message-field[t-mode=edit] .t-text-form{flex-direction:column;gap:.5em}.t-theme-message-field .t-editor .t-text-input{min-height:3.143em;max-height:9em;border-radius:.65em;border:1px solid white;background-color:#fff;display:block;resize:none;overflow-x:hidden;overflow-y:auto;word-break:break-word;white-space:pre-wrap;padding:0 44px 0 1em;transition:box-shadow .15s ease-out}.t-theme-message-field .t-editor .t-text-input:focus-visible{border-color:#fff;outline:#a3a3a3 solid 1px}.t-theme-message-field .t-editor .t-text-input p{margin:.875em 0;padding:0;border:0;outline:0}.t-theme-message-field .t-editor .t-mention{color:#007df9}.t-theme-message-field .t-send-column{flex-grow:0;flex-shrink:0;white-space:nowrap;align-self:center;display:flex}.t-theme-message-field .t-textbox-column{position:relative;flex-grow:1;margin-right:.28em}.t-theme-message-field .t-send-button{width:2.571em;height:2.571em;padding:.571em;border:0;border-radius:9999px;display:inline-flex;justify-content:center;align-items:center;cursor:pointer;background:transparent;color:currentColor;opacity:.75;transition:.15s ease-out}.t-theme-message-field .t-send-button:hover,.t-theme-message-field .t-send-button:focus{background-color:#2626260d}.t-theme-message-field .t-send-button:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}.t-theme-message-field .t-send-button{display:flex}.t-theme-message-field .t-send-button[disabled]{color:currentColor}.t-theme-message-field .t-text-limit-indicator{opacity:.5;font-size:75%;margin:-.75em 0 .5em 2px}.t-theme-message-field .t-readonly{opacity:.5;user-select:none}.t-theme-message-field .t-button-overlay{position:absolute;right:0;top:0;bottom:0;margin-right:8px;display:flex;align-items:center}.t-theme-message-field [t-kind=icon-button]{width:36px;height:36px;padding:8px;border:0;border-radius:9999px;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;background:transparent;color:currentColor;opacity:.75;transition:.15s ease-out}.t-theme-message-field [t-kind=icon-button]:hover,.t-theme-message-field [t-kind=icon-button]:focus{background-color:#2626260d;color:#007df9;opacity:1}.t-theme-message-field [t-kind=icon-button]:focus-visible{outline:0;box-shadow:0 0 0 2px #007df97f}.t-theme-message-field .t-edit-row button[t-action=save]:disabled{cursor:initial;background-color:#888;color:#fff}.t-theme-message-field .t-emoji-picker-wrapper{width:100%;height:350px;overflow:hidden;flex-shrink:1;border-top:1px solid #d4d4d4}.t-theme-icon{display:inline-block;vertical-align:middle;overflow:hidden}.t-message-divider{width:100%;margin:1.3em .5em 0;display:grid;grid-template-columns:1fr max-content 1fr;color:#95a7b1}.t-message-divider span{vertical-align:top;white-space:nowrap;height:1.3em;padding:0 20px}.t-message-divider .t-line[t-side=right]{display:grid;grid-template-columns:1fr max-content;gap:10px;grid-column:3}.t-message-divider .t-line .t-line-segment{height:0;width:100%;margin-top:10px;border:none;border-bottom:1px solid #95a7b1}.t-message-divider .t-line .t-unread-marker{position:relative;top:-4px;height:28px;padding:3px 10px;border-radius:100px;border:1px solid #95a7b1;vertical-align:middle}.t-theme-message-list-footer{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:.5em;margin-top:1.35em}.t-theme-message-list-footer .t-typing-avatars{display:flex;flex-direction:row;align-items:left;justify-content:center;width:fit-content}.t-theme-message-list-footer .t-typing-avatars>.t-theme-avatar{width:2.6em;height:2.6em;display:flex;align-items:center;justify-content:center;color:#111;line-height:2.6em;vertical-align:text-top;font-size:.75em}.t-theme-message-list-footer .t-typing-avatars>.t-theme-avatar:not(:last-child){margin-right:-.66em}.t-theme-message-list-footer .t-typing-bubble{display:flex;flex-direction:row;justify-content:center;align-items:center;border-radius:1em;background-color:#f7f7f7;border:1px solid #ececec;color:#111;padding:0 1em;font-size:.75em}.t-theme-message-list-footer .t-typing-animation{display:flex;flex-direction:row;align-items:center;gap:4px;height:2.6em;line-height:2.6em}.t-theme-message-list-footer .t-typing-animation span{height:6px;width:6px;background-color:#737373;display:inline-block;border-radius:50%;opacity:.4}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(1){animation:1s blink infinite .3333s}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(2){animation:1s blink infinite .6666s}.t-theme-message-list-footer .t-typing-animation span:nth-of-type(3){animation:1s blink infinite .9999s}@keyframes blink{50%{opacity:1}}.t-theme-audio-block{display:contents;width:100%;min-width:25ch}.t-theme-audio-block .t-audio-player{margin-bottom:.5em}.t-theme-audio-block .t-attachment-icon{width:1em;height:1em;margin-right:.2em}.t-theme-audio-block .t-filesize{font-size:.8em}.t-theme-file-block{display:contents}.t-theme-file-block a{word-break:break-all;text-decoration:none}.t-theme-file-block .t-filename{text-decoration:underline}.t-theme-file-block .t-attachment-icon{width:1em;height:1em;margin-right:.2em}.t-theme-file-block .t-filesize{white-space:nowrap;font-size:75%}.t-theme-file-block .t-loading-spinner{animation:spin 1.2s cubic-bezier(.42,0,.58,1) infinite;display:block;margin:auto;width:4em;height:4em}.t-theme-image-block{display:contents}.t-theme-image-block .download-icon{width:1em;height:1em;margin-right:.2em}.t-image-wrapper{display:block;height:auto;min-height:40px;max-height:400px}.t-theme-image-block .t-root{display:flex;justify-content:center;align-items:center;min-height:inherit;max-height:inherit;height:auto;max-width:min(calc(100% + 2em),calc(var(--img-w) * 1px));width:calc(100% + 2em);transform:translate(-1em);aspect-ratio:var(--img-w) / var(--img-h);overflow:hidden;margin:0 auto .5em}.t-theme-image-block .t-image{width:100%;height:100%;max-width:calc(var(--img-w) * 1px);max-height:calc(var(--img-h) * 1px);object-fit:contain}.t-theme-image-block .t-filesize{font-size:.8em}.t-theme-location-block{display:contents;min-height:100px;max-height:500px}.t-theme-location-block .t-root{display:block;height:200px;margin:0 -1em .5em}.t-theme-text-block{display:contents}.t-theme-text-block .t-text .t-emoji{height:1.15em;width:1.15em;margin:0 .1em .1em;vertical-align:middle}.t-theme-text-block .t-text{white-space:pre-wrap}.t-theme-text-block ul{padding-left:0;margin:0}.t-theme-text-block ul li{margin-left:1em;margin-bottom:.5em}.t-theme-video-block{display:contents}.t-theme-video-block .download-icon{width:1em;height:1em;margin-right:.2em}.t-video-wrapper{display:block;height:auto;min-height:40px;max-height:400px}.t-theme-video-block .t-root{display:flex;justify-content:center;align-items:center;min-height:inherit;max-height:inherit;height:auto;max-width:min(calc(100% + 2em),calc(var(--video-w) * 1px));width:calc(100% + 2em);transform:translate(-1em);aspect-ratio:var(--video-w) / var(--video-h);overflow:hidden;margin:0 auto .5em}.t-theme-video-block .t-video{width:100%;height:100%;max-width:calc(var(--video-w) * 1px);max-height:calc(var(--video-h) * 1px);object-fit:contain;background-color:#000000d9}.t-theme-video-block .t-filesize{font-size:.8em}.t-theme-conversation-list-item{color:#525252;text-decoration:none;width:100%;padding:0;height:auto;padding:1rem;border:none;border-bottom:1px solid #d4d4d4;background-color:transparent;overflow:hidden;display:flex;align-items:center;gap:.5rem;word-wrap:break-word;transition:color .1s ease-in-out,background-color .1s ease-in-out;background-color:#fff;text-align:initial}.t-theme-conversation-list-item a{color:#525252}.t-theme-conversation-list-item[t-selected] a{color:#fff}.t-theme-conversation-list-item:last-child{margin-bottom:10px}.t-theme-conversation-list-item:hover{background-color:#f7f7f7;cursor:pointer}.t-theme-conversation-list-item[t-selected]{color:#fff;background-color:#007df9}.t-theme-conversation-list-item[t-selected]:focus-visible{outline:#fff 2px solid;outline-offset:-4px;border-bottom:0}.t-theme-conversation-list-item:focus-visible{outline:#3291ff 2px solid;outline-offset:-2px}.t-theme-conversation-list-item[t-unread]{background-color:#f7f7f7;color:#111}.t-theme-conversation-list-item[t-selected][t-unread]{color:#fff;background-color:#007df9}.t-theme-conversation-list-item .t-inner{margin-left:10px;flex-basis:0;flex-grow:1;min-width:0}.t-theme-conversation-list-item .t-header,.t-theme-conversation-list-item .t-body{display:flex;align-items:center;flex-grow:1;flex-shrink:0;min-width:0;overflow:hidden}.t-theme-conversation-list-item .t-message-sender{margin-right:.2rem}.t-theme-conversation-list-item .t-timestamp{font-size:85%;opacity:.75}.t-theme-conversation-list-item .t-timestamp,.t-theme-conversation-list-item .t-unread-dot{flex-shrink:0;margin-left:4px}.t-theme-conversation-list-item .t-conversation-name{font-weight:600}.t-theme-conversation-list-item .t-conversation-name,.t-theme-conversation-list-item .t-message{flex-grow:1;font-size:85%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-theme-conversation-list-item .t-message{opacity:.75;flex-basis:0}.t-theme-conversation-list-item .t-unread-dot{display:flex;align-items:center;justify-content:center;padding:0 .4rem;border-radius:9999px;height:20px;width:auto;min-width:20px;text-align:center;line-height:inherit;font-size:85%;color:#fff;background-color:#007df9}.t-theme-conversation-list-item .t-unread-generic-dot{padding:.6ex;transform:scale(.999);border-radius:999px;background-color:#007df9}.t-theme-conversation-list-item[t-selected] .t-unread-generic-dot{padding:.6ex;transform:scale(.999);border-radius:999px;background-color:#fff}.t-theme-conversation-list-item[t-selected] .t-unread-dot{color:#007df9;background-color:#fff}.t-theme-conversation-list-item .t-unread-dot:empty{padding:0;min-width:10px;min-height:10px}.t-theme-conversation-list-item .t-message li{display:inline list-item;margin-right:.25rem}.t-theme-conversation-list-item .t-message ul{list-style:inside}.t-theme-avatar{display:block;overflow:hidden;background-color:#ececec;background-size:cover;background-repeat:no-repeat;background-position:center center;border-style:solid;border-radius:50%;border-width:2px;border-color:#fff;flex-shrink:0;align-self:flex-start;width:3em;height:3em}.t-theme-group-chat-image{display:block;overflow:hidden;position:relative;width:44px;height:44px;flex-shrink:0}.t-theme-group-chat-image .t-mini-avatar{border-radius:50%;border-width:2px;border-color:#fff;border-style:solid;box-shadow:0 1px 1px #8899a626;width:30px;height:30px;position:absolute;background-color:#f7f7f7;background-position:center;background-size:cover}.t-theme-group-chat-image .t-mini-avatar:nth-child(1){right:0;top:14px}.t-theme-group-chat-image .t-mini-avatar:nth-child(2){left:0;top:0}.t-theme-group-chat-image .t-counter{border-radius:50%;border:2px solid #fff;font-weight:600;position:absolute;min-width:18px;min-height:18px;max-width:22px;max-height:22px;left:0;bottom:0;display:flex;justify-content:center;align-items:center;color:#111;padding:0}.t-theme-group-chat-image .t-group{border-style:none;color:#ececec}.t-theme-referenced-message{display:flex;flex-direction:column}.t-theme-referenced-message .t-sender-name{font-weight:600;margin-bottom:2px}.t-theme-referenced-message .t-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:.165em 0}.t-theme-referenced-message .t-content a{color:currentColor}.t-theme-reply-bar{height:4.286em;display:flex;align-items:center;background-color:#ececec;padding:.714em;color:#262626;border-top:#d4d4d4 solid 1px}.t-theme-reply-bar .t-content{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:.165rem 0px}.t-theme-reply-bar .t-close-button{width:2.571em;height:2.571em;padding:.571em;border:0;border-radius:9999px;cursor:pointer;display:inline-flex;align-items:center;background:transparent;opacity:.75;transition:.15s ease-out}.t-theme-reply-bar .t-close-button:hover{background-color:#2626260d;color:#007df9;opacity:1}.t-theme-reply-bar .t-body{flex-grow:1;padding:0 1em;overflow:hidden}.t-theme-reply-bar .t-close-icon,.t-theme-reply-bar .t-reply-icon{width:1.428em;height:1.428em;min-width:1.428em;min-height:1.428em}.t-theme-reply-bar .t-mention{line-height:1.5;background-color:#c8c8c880;color:inherit;margin:0;border-radius:9999px;padding:.25rem .45rem}.t-theme-reply-bar .t-mention[t-is-current-user]{font-weight:700;background-color:#c8c8c8e6}.t-theme-compact-message-content>.t-theme-icon{width:1.25em;height:1.25em;margin-right:.25em}.t-theme-compact-message-content .t-text ul{list-style:inside;margin:0 0 0 .5em;padding:0;display:inline}.t-theme-compact-message-content .t-text li{display:inline list-item;margin-right:1em}.t-theme-compact-message-content .t-text li::marker{content:"• "}
|
package/default.d.ts
CHANGED
|
@@ -159,6 +159,90 @@ export declare interface BrowserPermissionRequest {
|
|
|
159
159
|
showPrompt(): Promise<"granted" | "denied">;
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
+
/**
|
|
163
|
+
* A collection of actions available on the Chatbox UI.
|
|
164
|
+
*
|
|
165
|
+
* @public
|
|
166
|
+
*/
|
|
167
|
+
declare class ChatboxController {
|
|
168
|
+
#private;
|
|
169
|
+
/**
|
|
170
|
+
* Deletes the message with the given ID.
|
|
171
|
+
*
|
|
172
|
+
* @param messageId
|
|
173
|
+
*/
|
|
174
|
+
deleteMessage(messageId: string): Promise<void>;
|
|
175
|
+
/**
|
|
176
|
+
* Enable/disable editing of a given message.
|
|
177
|
+
*
|
|
178
|
+
* @param messageId When `null` is provided, editing mode will be disabled
|
|
179
|
+
*/
|
|
180
|
+
setEditing(messageId: string | null): void;
|
|
181
|
+
/**
|
|
182
|
+
* Edit the message with the given ID.
|
|
183
|
+
*
|
|
184
|
+
* @param messageId
|
|
185
|
+
* @param params
|
|
186
|
+
*/
|
|
187
|
+
editMessage(messageId: string, params: EditTextMessageParams | EditMessageParams): Promise<void>;
|
|
188
|
+
/**
|
|
189
|
+
* Send a text message to the current conversation.
|
|
190
|
+
*
|
|
191
|
+
* @param params
|
|
192
|
+
*/
|
|
193
|
+
sendMessage(params: SendTextMessageParams | SendMessageParams): Promise<void>;
|
|
194
|
+
/**
|
|
195
|
+
* Send a file message to the current conversation.
|
|
196
|
+
*
|
|
197
|
+
* @param message
|
|
198
|
+
*/
|
|
199
|
+
sendFileMessage(params: {
|
|
200
|
+
fileToken: FileToken;
|
|
201
|
+
custom?: Record<string, string>;
|
|
202
|
+
}): Promise<void>;
|
|
203
|
+
/**
|
|
204
|
+
* Send a location message to the current conversation.
|
|
205
|
+
*
|
|
206
|
+
* @param message
|
|
207
|
+
*/
|
|
208
|
+
sendLocationMessage(message: {
|
|
209
|
+
location: Coordinates;
|
|
210
|
+
custom?: Record<string, string>;
|
|
211
|
+
}): Promise<void>;
|
|
212
|
+
/**
|
|
213
|
+
* Set/unset the message that's currently being replied to.
|
|
214
|
+
*
|
|
215
|
+
* @param messageId - When `null` is provided, the "replying to" message is cleared
|
|
216
|
+
*/
|
|
217
|
+
setReferencedMessage(messageId: string | null): void;
|
|
218
|
+
/**
|
|
219
|
+
* Toggle the given emoji reaction for the given message. If the current user
|
|
220
|
+
* already added this reaction, it's removed, and otherwise, it's added.
|
|
221
|
+
*
|
|
222
|
+
* Called from the theme's Message component when the user clicks on an
|
|
223
|
+
* existing emoji reaction.
|
|
224
|
+
*
|
|
225
|
+
* @param messageId - The ID of the message you want to toggle the reaction on. This message must exist in the current conversation.
|
|
226
|
+
* @param emoji - The emoji you want to toggle. Must be a string of a single unicode emoji glyph, eg `"🎉"`.
|
|
227
|
+
*/
|
|
228
|
+
toggleReaction(messageId: string, emoji: string): Promise<void>;
|
|
229
|
+
/**
|
|
230
|
+
* Get the plaintext from the message field
|
|
231
|
+
*
|
|
232
|
+
* @returns The text
|
|
233
|
+
*/
|
|
234
|
+
getMessageFieldText(): string;
|
|
235
|
+
/**
|
|
236
|
+
* Set the plaintext in the message field
|
|
237
|
+
* @param text
|
|
238
|
+
*/
|
|
239
|
+
setMessageFieldText(text: string): void;
|
|
240
|
+
/**
|
|
241
|
+
* Focus the message field
|
|
242
|
+
*/
|
|
243
|
+
focusMessageField(): void;
|
|
244
|
+
}
|
|
245
|
+
|
|
162
246
|
/**
|
|
163
247
|
* The
|
|
164
248
|
* {@link https://talkjs.com/docs/Features/Chat_UIs/#chatbox | TalkJS Chatbox UI. }
|
|
@@ -166,15 +250,15 @@ export declare interface BrowserPermissionRequest {
|
|
|
166
250
|
*
|
|
167
251
|
* @public
|
|
168
252
|
*/
|
|
169
|
-
export declare const
|
|
253
|
+
export declare const ChatboxElement: new () => ChatboxElement_2;
|
|
170
254
|
|
|
171
|
-
declare interface
|
|
255
|
+
declare interface ChatboxElement_2 extends HTMLElement, NullishChatboxProps, ChatboxController {
|
|
172
256
|
}
|
|
173
257
|
|
|
174
258
|
/**
|
|
175
259
|
* @public
|
|
176
260
|
*/
|
|
177
|
-
|
|
261
|
+
declare interface ChatboxProps {
|
|
178
262
|
/**
|
|
179
263
|
* @hidden
|
|
180
264
|
*/
|
|
@@ -235,7 +319,7 @@ export declare interface ChatboxProps {
|
|
|
235
319
|
*
|
|
236
320
|
* @remarks
|
|
237
321
|
* See
|
|
238
|
-
* {@link https://talkjs.com/docs/
|
|
322
|
+
* {@link https://talkjs.com/docs/UI_Components/React/Customization/#custom-theme-components | Custom theme components }
|
|
239
323
|
* for more info.
|
|
240
324
|
*/
|
|
241
325
|
theme?: Partial<Theme>;
|
|
@@ -306,6 +390,16 @@ export declare interface ChatboxProps {
|
|
|
306
390
|
* @param event Event object describing the missing permission
|
|
307
391
|
*/
|
|
308
392
|
onMissingBrowserPermission?: (event: MissingBrowserPermissionEvent) => void;
|
|
393
|
+
/**
|
|
394
|
+
* This event fires when the user clicks an action button or an action Link
|
|
395
|
+
* inside a message.
|
|
396
|
+
*
|
|
397
|
+
* The event's `action` and `params` fields specify the name of action and its
|
|
398
|
+
* parameters, if any.
|
|
399
|
+
*
|
|
400
|
+
* @see {@link https://talkjs.com/docs/Guides/Web_Components/Action_Buttons_Links/ | Action Buttons and Links}
|
|
401
|
+
*/
|
|
402
|
+
onMessageAction?: (event: MessageActionEvent) => void;
|
|
309
403
|
/**
|
|
310
404
|
* Arbitrary custom data passed down to the theme.
|
|
311
405
|
*
|
|
@@ -319,63 +413,6 @@ export declare interface ChatboxProps {
|
|
|
319
413
|
themeCustom?: any;
|
|
320
414
|
}
|
|
321
415
|
|
|
322
|
-
/**
|
|
323
|
-
* A collection of actions available on the Chatbox UI.
|
|
324
|
-
*
|
|
325
|
-
* @public
|
|
326
|
-
*/
|
|
327
|
-
export declare interface ChatboxRef {
|
|
328
|
-
/**
|
|
329
|
-
* Deletes the message with the given ID.
|
|
330
|
-
*
|
|
331
|
-
* @param messageId
|
|
332
|
-
*/
|
|
333
|
-
deleteMessage(messageId: string): Promise<void>;
|
|
334
|
-
/**
|
|
335
|
-
* Enable/disable editing of a given message.
|
|
336
|
-
*
|
|
337
|
-
* @param messageId When `null` is provided, editing mode will be disabled
|
|
338
|
-
*/
|
|
339
|
-
setEditing(messageId: string | null): void;
|
|
340
|
-
/**
|
|
341
|
-
* Edit the message with the given ID.
|
|
342
|
-
*
|
|
343
|
-
* @param messageId
|
|
344
|
-
* @param params
|
|
345
|
-
*/
|
|
346
|
-
editMessage(messageId: string, params: EditTextMessageParams | EditMessageParams): Promise<void>;
|
|
347
|
-
/**
|
|
348
|
-
* Send a text message to the current conversation.
|
|
349
|
-
*
|
|
350
|
-
* @param params
|
|
351
|
-
*/
|
|
352
|
-
sendMessage(params: SendTextMessageParams | SendMessageParams): Promise<void>;
|
|
353
|
-
/**
|
|
354
|
-
* Send a file message to the current conversation.
|
|
355
|
-
*
|
|
356
|
-
* @param message
|
|
357
|
-
*/
|
|
358
|
-
sendFileMessage(params: {
|
|
359
|
-
fileToken: FileToken;
|
|
360
|
-
custom?: Record<string, string>;
|
|
361
|
-
}): Promise<void>;
|
|
362
|
-
/**
|
|
363
|
-
* Send a location message to the current conversation.
|
|
364
|
-
*
|
|
365
|
-
* @param message
|
|
366
|
-
*/
|
|
367
|
-
sendLocationMessage(message: {
|
|
368
|
-
location: Coordinates;
|
|
369
|
-
custom?: Record<string, string>;
|
|
370
|
-
}): Promise<void>;
|
|
371
|
-
/**
|
|
372
|
-
* Set/unset the message that's currently being replied to.
|
|
373
|
-
*
|
|
374
|
-
* @param messageId When `null` is provided, the "replying to" message is cleared
|
|
375
|
-
*/
|
|
376
|
-
setReferencedMessage(messageId: string | null): void;
|
|
377
|
-
}
|
|
378
|
-
|
|
379
416
|
/**
|
|
380
417
|
* @public
|
|
381
418
|
*/
|
|
@@ -416,9 +453,9 @@ declare interface CommonChatboxProps {
|
|
|
416
453
|
*/
|
|
417
454
|
t: Translation;
|
|
418
455
|
/**
|
|
419
|
-
*
|
|
456
|
+
* Public interface of the chatbox instance.
|
|
420
457
|
*/
|
|
421
|
-
chatbox:
|
|
458
|
+
chatbox: ChatboxController;
|
|
422
459
|
/**
|
|
423
460
|
* Arbitrary custom data passed down to the theme.
|
|
424
461
|
*
|
|
@@ -490,9 +527,9 @@ declare interface CommonConversationListProps {
|
|
|
490
527
|
*/
|
|
491
528
|
theme: Theme;
|
|
492
529
|
/**
|
|
493
|
-
*
|
|
530
|
+
* Public interface of the conversation list instance.
|
|
494
531
|
*/
|
|
495
|
-
conversationList:
|
|
532
|
+
conversationList: ConversationListController;
|
|
496
533
|
/**
|
|
497
534
|
* The underlying TalkJS session object that handles sending and receiving chat data.
|
|
498
535
|
*/
|
|
@@ -541,6 +578,32 @@ declare interface ConversationImageProps {
|
|
|
541
578
|
participants: ParticipantSnapshot[];
|
|
542
579
|
}
|
|
543
580
|
|
|
581
|
+
/**
|
|
582
|
+
* A collection of actions available on the ConversationList UI.
|
|
583
|
+
*
|
|
584
|
+
* @public
|
|
585
|
+
*/
|
|
586
|
+
declare class ConversationListController {
|
|
587
|
+
#private;
|
|
588
|
+
/**
|
|
589
|
+
* Select a conversation.
|
|
590
|
+
*
|
|
591
|
+
* @remarks
|
|
592
|
+
* This method is called from the theme's ConversationListItem component when
|
|
593
|
+
* the user clicks on the given conversation. You can also call it
|
|
594
|
+
* programmatically from elsewhere to simulate a user click.
|
|
595
|
+
*
|
|
596
|
+
* This method will trigger the
|
|
597
|
+
* {@linkcode ConversationListProps.onSelectConversation} event. In most
|
|
598
|
+
* cases, if you want to change the selected conversation programmatically
|
|
599
|
+
* from outside the conversation list, it's better to pass a different value
|
|
600
|
+
* to the {@linkcode ConversationListProps.selectedConversationId} prop
|
|
601
|
+
* instead, as that lets you keep your local state in sync with the props
|
|
602
|
+
* passed to the conversation list.
|
|
603
|
+
*/
|
|
604
|
+
selectConversation(conversationId: string): void;
|
|
605
|
+
}
|
|
606
|
+
|
|
544
607
|
/**
|
|
545
608
|
* The
|
|
546
609
|
* {@link https://talkjs.com/docs/Features/Chat_UIs/#conversation-list | Conversation List UI. }
|
|
@@ -550,9 +613,9 @@ declare interface ConversationImageProps {
|
|
|
550
613
|
*
|
|
551
614
|
* @public
|
|
552
615
|
*/
|
|
553
|
-
export declare const
|
|
616
|
+
export declare const ConversationListElement: new () => ConversationListElement_2;
|
|
554
617
|
|
|
555
|
-
declare interface
|
|
618
|
+
declare interface ConversationListElement_2 extends HTMLElement, NullishConversationListProps, ConversationListController {
|
|
556
619
|
}
|
|
557
620
|
|
|
558
621
|
declare interface ConversationListItemProps {
|
|
@@ -578,7 +641,7 @@ declare interface ConversationListItemProps {
|
|
|
578
641
|
/**
|
|
579
642
|
* @public
|
|
580
643
|
*/
|
|
581
|
-
|
|
644
|
+
declare interface ConversationListProps {
|
|
582
645
|
/**
|
|
583
646
|
* @hidden
|
|
584
647
|
*/
|
|
@@ -642,7 +705,7 @@ export declare interface ConversationListProps {
|
|
|
642
705
|
*
|
|
643
706
|
* @remarks
|
|
644
707
|
* See
|
|
645
|
-
* {@link https://talkjs.com/docs/
|
|
708
|
+
* {@link https://talkjs.com/docs/UI_Components/React/Customization/#custom-theme-components | Custom theme components }
|
|
646
709
|
* for more info.
|
|
647
710
|
*/
|
|
648
711
|
theme?: Partial<Theme>;
|
|
@@ -657,7 +720,7 @@ export declare interface ConversationListProps {
|
|
|
657
720
|
*
|
|
658
721
|
* Use this callback to have an adjacent chatbox show the correct
|
|
659
722
|
* conversation. See
|
|
660
|
-
* {@link https://talkjs.com/docs/
|
|
723
|
+
* {@link https://talkjs.com/docs/UI_Components/React/ConversationList/#respond-to-a-select-conversation-event | Respond to a select conversation event.}
|
|
661
724
|
*/
|
|
662
725
|
onSelectConversation?: (event: SelectConversationEvent) => void;
|
|
663
726
|
/**
|
|
@@ -673,24 +736,6 @@ export declare interface ConversationListProps {
|
|
|
673
736
|
themeCustom?: any;
|
|
674
737
|
}
|
|
675
738
|
|
|
676
|
-
/**
|
|
677
|
-
* A collection of actions available on the ConversationList UI.
|
|
678
|
-
*
|
|
679
|
-
* @public
|
|
680
|
-
*/
|
|
681
|
-
export declare interface ConversationListRef {
|
|
682
|
-
/**
|
|
683
|
-
* Programatically select a conversation.
|
|
684
|
-
*
|
|
685
|
-
* @param conversationId
|
|
686
|
-
*
|
|
687
|
-
* @remarks
|
|
688
|
-
* Note that this **will not** trigger the
|
|
689
|
-
* {@linkcode ConversationListProps.onSelectConversation} callback.
|
|
690
|
-
*/
|
|
691
|
-
selectConversation(conversationId: string): void;
|
|
692
|
-
}
|
|
693
|
-
|
|
694
739
|
/**
|
|
695
740
|
* @public
|
|
696
741
|
*/
|
|
@@ -880,6 +925,30 @@ declare interface LocationBlockProps {
|
|
|
880
925
|
block: LocationBlock;
|
|
881
926
|
}
|
|
882
927
|
|
|
928
|
+
/**
|
|
929
|
+
* An event object dispatched by the {@link ChatboxProps.onMessageAction} event.
|
|
930
|
+
*
|
|
931
|
+
* @public
|
|
932
|
+
*/
|
|
933
|
+
export declare interface MessageActionEvent {
|
|
934
|
+
/**
|
|
935
|
+
* The name of the action that was triggered.
|
|
936
|
+
*/
|
|
937
|
+
action: string;
|
|
938
|
+
/**
|
|
939
|
+
* The parameters of the action that was triggered, if any.
|
|
940
|
+
*/
|
|
941
|
+
params: Record<string, string>;
|
|
942
|
+
/**
|
|
943
|
+
* The message that contained the action link or action button.
|
|
944
|
+
*/
|
|
945
|
+
message: MessageSnapshot;
|
|
946
|
+
/**
|
|
947
|
+
* The current conversation.
|
|
948
|
+
*/
|
|
949
|
+
conversation: ConversationSnapshot;
|
|
950
|
+
}
|
|
951
|
+
|
|
883
952
|
/**
|
|
884
953
|
* @public
|
|
885
954
|
*/
|
|
@@ -1371,8 +1440,8 @@ export { }
|
|
|
1371
1440
|
|
|
1372
1441
|
declare global {
|
|
1373
1442
|
interface HTMLElementTagNameMap {
|
|
1374
|
-
"t-chatbox":
|
|
1375
|
-
"t-conversation-list":
|
|
1443
|
+
"t-chatbox": ChatboxElement;
|
|
1444
|
+
"t-conversation-list": ConversationListElement;
|
|
1376
1445
|
}
|
|
1377
1446
|
}
|
|
1378
1447
|
|