import { p as proxyCustomElement, H, e as createEvent, h, c as Host } from './p-ae373651.js';
import { e as defaultIconPack, i as useLanguage } from './p-5b3a7f00.js';
import './p-a83ccdbd.js';
import { S as SyncWithStore } from './p-070aa695.js';
import { d as defineCustomElement$a } from './p-a3bf84d7.js';
import { d as defineCustomElement$9 } from './p-85587a5c.js';
import { d as defineCustomElement$8 } from './p-c1ab8045.js';
import { d as defineCustomElement$7 } from './p-3e0452c4.js';
import { d as defineCustomElement$6 } from './p-00e98940.js';
import { d as defineCustomElement$5 } from './p-241583c3.js';
import { d as defineCustomElement$4 } from './p-0304f83a.js';
import { d as defineCustomElement$3 } from './p-02d63986.js';
import { d as defineCustomElement$2 } from './p-e6245534.js';
import { d as defineCustomElement$1 } from './p-6ccdf3c3.js';

const rtkChatMessageCss = ".message-wrapper{display:flex;gap:var(--rtk-space-2, 8px);margin-left:var(--rtk-space-4, 16px);margin-right:var(--rtk-space-4, 16px);margin-top:var(--rtk-space-4, 16px)}[is-continued] .message-wrapper{margin-top:var(--rtk-space-0, 0px)}.message-wrapper.align-right{flex-direction:row-reverse}.file-picker{display:none}.message{position:relative;display:flex}.show-on-hover rtk-menu{visibility:hidden}.show-on-hover:hover rtk-menu{visibility:visible}.align-right .message{justify-content:flex-end;margin-left:auto}.align-right .message .head{margin-right:var(--rtk-space-1, 4px);margin-left:var(--rtk-space-0, 0px);flex-direction:row-reverse;gap:var(--rtk-space-4, 16px)}.align-right .message rtk-text-message .bubble,.align-right .message rtk-image-message .bubble,.align-right .message rtk-file-message .bubble{padding-right:var(--rtk-space-5, 20px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.align-right .message .actions rtk-icon{color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.align-right rtk-menu{left:auto;right:var(--rtk-space-0, 0px)}.head{margin-bottom:var(--rtk-space-2, 8px);margin-left:var(--rtk-space-1, 4px);display:flex;align-items:center;gap:var(--rtk-space-2, 8px)}.head .name{font-size:14px;font-weight:600}.head .time{font-size:12px;color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}rtk-menu{position:absolute;left:var(--rtk-space-0, 0px);top:var(--rtk-space-6, 24px);border-radius:var(--rtk-border-radius-lg, 12px)}rtk-menu rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);cursor:pointer}[is-continued] rtk-menu{top:var(--rtk-space-2, 8px)}.actions{display:flex;align-items:center;justify-content:center;padding:var(--rtk-space-0\\.5, 2px);border-width:var(--rtk-border-width-none, 0);border-style:none;background-color:transparent}.actions rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-1000, 255 255 255))}.body{margin-top:var(--rtk-space-1, 4px);margin-bottom:var(--rtk-space-1, 4px);overflow-wrap:break-word;font-size:14px;line-height:1.375}.body .emoji{font-size:24px}.body.bubble{margin-top:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-1, 4px);max-width:var(--rtk-space-96, 384px);padding-top:var(--rtk-space-3, 12px);padding-bottom:var(--rtk-space-3, 12px);padding-left:var(--rtk-space-5, 20px);padding-right:var(--rtk-space-5, 20px);overflow-wrap:break-word;font-size:14px;line-height:1.375;border-radius:var(--rtk-border-radius-md, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity))}.body.bubble p{margin:var(--rtk-space-0, 0px);word-break:break-word}p{margin:var(--rtk-space-0, 0px)}rtk-text-message,rtk-image-message,rtk-file-message{display:block;font-family:var(--rtk-font-family, sans-serif);color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));box-sizing:border-box}*[is-continued]{margin-top:var(--rtk-space-0, 0px)}.image{position:relative;height:var(--rtk-space-40, 160px);max-width:var(--rtk-space-64, 256px);cursor:pointer}.image img{display:none;height:100%;width:100%;border-radius:var(--rtk-border-radius-sm, 4px);-o-object-fit:cover;object-fit:cover}.image .image-spinner{display:flex;height:100%;width:100%;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity))}.image .image-spinner rtk-spinner{--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-text-opacity))}.image .image-errored{display:flex;height:100%;width:100%;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--rtk-border-radius-sm, 4px);background-color:rgba(var(--rtk-colors-danger, 255 45 45) / 0.1);--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}.image .actions{display:none;height:var(--rtk-space-8, 32px);align-items:center;position:absolute;top:var(--rtk-space-2, 8px);right:var(--rtk-space-2, 8px);border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255));overflow:hidden;--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.image .actions .action{height:var(--rtk-space-8, 32px);width:var(--rtk-space-8, 32px);border-radius:var(--rtk-border-radius-none, 0);border-width:var(--rtk-border-width-none, 0);border-style:none;background-color:transparent;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.image .actions .action:hover{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}.image.loaded img{display:block}.image.loaded .image-spinner{display:none}.image:hover .actions,.image:focus .actions{display:flex}.file{display:flex;align-items:center;gap:var(--rtk-space-1, 4px);padding-left:var(--rtk-space-2, 8px);padding-right:var(--rtk-space-2, 8px);padding-top:var(--rtk-space-1\\.5, 6px);padding-bottom:var(--rtk-space-1\\.5, 6px);border-radius:var(--rtk-border-radius-sm, 4px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-700, 255 255 255 / 0.64))}.file .file-data{flex:1 1 0%}.file .file-data .name{word-break:break-all;color:rgb(var(--rtk-colors-text-1000, 255 255 255));overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.file .file-data .file-data-split{margin-top:var(--rtk-space-0\\.5, 2px);display:flex;align-items:center;font-size:12px}.file .file-data .file-data-split .ext{margin-right:var(--rtk-space-2, 8px);text-transform:uppercase;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.file .file-data .file-data-split .divider{height:var(--rtk-space-4, 16px);width:var(--rtk-space-0\\.5, 2px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}.file .file-data .file-data-split .size{margin-left:var(--rtk-space-2, 8px)}a{--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-text-opacity));text-decoration-line:none}a:hover{text-decoration-line:underline}.new-chat-marker{display:flex;width:100%;align-items:center;gap:var(--rtk-space-2, 8px);--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-text-opacity))}.new-chat-marker::before{content:'';height:1px;flex:1 1 0%;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / 0.5)}.show-new-messages-ctr{pointer-events:none;display:flex;justify-content:flex-end;padding:var(--rtk-space-3, 12px);z-index:0;margin-top:calc(var(--rtk-space-14, 56px) * -1)}.show-new-messages{pointer-events:auto;--tw-translate-y:calc(var(--rtk-space-6, 24px) * -1);transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.show-new-messages.active{--tw-translate-y:var(--rtk-space-0, 0px);transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:1}blockquote{margin:var(--rtk-space-0, 0px);margin-bottom:var(--rtk-space-3, 12px);background-color:transparent}.block-quote,blockquote{--tw-border-spacing-x:1px;--tw-border-spacing-y:1px;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y);border-top-width:var(--rtk-border-width-none, 0);border-bottom-width:var(--rtk-border-width-none, 0);border-left-width:var(--rtk-border-width-md, 2px);border-right-width:var(--rtk-border-width-none, 0);border-style:solid;border-left-color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));padding:var(--rtk-space-0\\.5, 2px);padding-left:var(--rtk-space-2, 8px);margin-bottom:var(--rtk-space-2, 8px) !important;border-radius:var(--rtk-border-radius-sm, 4px);border-top-left-radius:var(--rtk-border-radius-none, 0);border-bottom-left-radius:var(--rtk-border-radius-none, 0)}.link{color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.align-right .block-quote{border-color:rgb(var(--rtk-colors-text-on-brand-600, var(--rtk-colors-text-600, 255 255 255 / 0.52)));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity))}.align-right .link{color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.align-right .image .actions rtk-icon{--tw-text-opacity:1;color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-text-opacity))}.avatar{display:flex;width:var(--rtk-space-6, 24px)}.avatar rtk-avatar{height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px);font-size:10px}.message{width:75%}.left-align .body{margin-top:var(--rtk-space-4, 16px)}.left-align [is-continued] .body{margin-top:var(--rtk-space-0, 0px)}.left-align .body{--tw-translate-x:calc(var(--rtk-space-8, 32px) * -1);transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}";
const RtkChatMessageStyle0 = rtkChatMessageCss;

var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
        r = Reflect.decorate(decorators, target, key, desc);
    else
        for (var i = decorators.length - 1; i >= 0; i--)
            if (d = decorators[i])
                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
const RtkChatMessage = /*@__PURE__*/ proxyCustomElement(class RtkChatMessage extends H {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        this.edit = createEvent(this, "edit", 7);
        this.reply = createEvent(this, "reply", 7);
        this.pin = createEvent(this, "pin", 7);
        this.delete = createEvent(this, "delete", 7);
        /** Icon pack */
        this.iconPack = defaultIconPack;
        /** Language */
        this.t = useLanguage();
        /** if sender is self */
        this.isSelf = false;
        /** can edit message */
        this.canEdit = false;
        /** can delete message */
        this.canDelete = false;
        /** can quote reply this message */
        this.canReply = false;
        /** can pin this message */
        this.canPin = false;
        /** disables controls */
        this.disableControls = false;
        /** aligns message to right */
        this.alignRight = false;
        /** hides avatar */
        this.hideAvatar = false;
        this.now = new Date();
        /** Whether to left align the chat bubbles */
        this.leftAlign = false;
        this.renderMessage = () => {
            switch (this.message.type) {
                case 'text':
                    return (h("div", { "is-continued": this.isContinued, key: this.message.id }, this.isUnread && (h("div", { class: "new-chat-marker", part: "new-chat-marker" }, this.t('chat.new'))), h("rtk-text-message", { message: this.message, now: this.now, isContinued: this.isContinued, "data-timestamp": this.message.time.getTime(), iconPack: this.iconPack, t: this.t, showBubble: true })));
                case 'image':
                    return (h("div", { "is-continued": this.isContinued, key: this.message.id }, this.isUnread && (h("div", { class: "new-chat-marker", part: "new-chat-marker" }, this.t('chat.new'))), h("rtk-image-message", { message: this.message, now: this.now, isContinued: this.isContinued, iconPack: this.iconPack, "data-timestamp": this.message.time.getTime(), t: this.t, showBubble: true })));
                case 'file':
                    return (h("div", { "is-continued": this.isContinued, key: this.message.id }, this.isUnread && (h("div", { class: "new-chat-marker", part: "new-chat-marker" }, this.t('chat.new'))), h("rtk-file-message", { message: this.message, now: this.now, isContinued: this.isContinued, iconPack: this.iconPack, t: this.t, "data-timestamp": this.message.time.getTime(), showBubble: true })));
                case 'custom':
                    this.child.setAttribute('message', JSON.stringify(this.message));
                    const node = this.child.cloneNode(true);
                    return (h("div", { "is-continued": this.isContinued, key: this.message.id, ref: (el) => el.appendChild(node) }));
            }
        };
        this.onReply = () => {
            this.reply.emit(this.message);
        };
        this.onPinned = () => {
            this.pin.emit(this.message);
        };
        this.onDelete = () => {
            this.delete.emit(this.message);
        };
        this.onEdit = async () => {
            this.edit.emit(this.message);
        };
        this.isTouchDevice = () => {
            return 'ontouchstart' in window || navigator.maxTouchPoints > 0;
        };
    }
    renderControls() {
        if (this.disableControls)
            return;
        return (h("rtk-menu", { placement: this.alignRight ? 'bottom-end' : 'bottom-start' }, h("button", { slot: "trigger", class: "actions" }, h("rtk-icon", { icon: this.iconPack.chevron_down })), h("rtk-menu-list", null, this.canReply && (h("rtk-menu-item", { onClick: this.onReply }, h("rtk-icon", { icon: this.iconPack.back, slot: "start" }), this.t('chat.reply'))), this.canPin && (h("rtk-menu-item", { onClick: this.onPinned }, h("rtk-icon", { icon: this.iconPack.pin, slot: "start" }), this.t('pin'))), this.canEdit && (h("rtk-menu-item", { onClick: this.onEdit }, h("rtk-icon", { icon: this.iconPack.edit, slot: "start" }), this.t('chat.edit_msg'))), this.canDelete && (h("rtk-menu-item", { onClick: this.onDelete }, h("rtk-icon", { icon: this.iconPack.delete, slot: "start" }), this.t('chat.delete_msg'))))));
    }
    renderAvatar() {
        if (this.hideAvatar)
            return;
        if (this.isContinued) {
            return h("div", { class: "avatar" });
        }
        return (h("div", { class: "avatar" }, h("rtk-avatar", { size: "sm", participant: {
                name: this.message.displayName,
                picture: this.senderDisplayPicture,
            } })));
    }
    render() {
        return (h(Host, { key: '4ca0e3d6e38c1f576ebffbc4c06eae77ab9fb4d5' }, h("div", { key: '182c410a2ba918fc0dde0600234c336f83a74c80', class: {
                'message-wrapper': true,
                'align-right': this.alignRight,
                'left-align': this.leftAlign,
            }, "is-continued": this.isContinued }, this.renderAvatar(), h("div", { key: '2aa6e896e51e7d766b4a48a7128f5784f0e0e48f', class: {
                message: true,
                'show-on-hover': !this.isTouchDevice(),
            }, "is-continued": this.isContinued }, this.renderMessage(), this.renderControls()))));
    }
    get $el() { return this; }
    static get style() { return RtkChatMessageStyle0; }
}, [1, "rtk-chat-message", {
        "message": [16],
        "isContinued": [4, "is-continued"],
        "child": [16],
        "isUnread": [4, "is-unread"],
        "size": [513],
        "iconPack": [16],
        "t": [16],
        "isSelf": [4, "is-self"],
        "canEdit": [4, "can-edit"],
        "canDelete": [4, "can-delete"],
        "canReply": [4, "can-reply"],
        "canPin": [4, "can-pin"],
        "disableControls": [4, "disable-controls"],
        "alignRight": [4, "align-right"],
        "senderDisplayPicture": [1, "sender-display-picture"],
        "hideAvatar": [4, "hide-avatar"],
        "leftAlign": [4, "left-align"],
        "now": [32]
    }]);
__decorate([
    SyncWithStore()
], RtkChatMessage.prototype, "iconPack", void 0);
__decorate([
    SyncWithStore()
], RtkChatMessage.prototype, "t", void 0);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["rtk-chat-message", "rtk-avatar", "rtk-button", "rtk-file-message", "rtk-icon", "rtk-image-message", "rtk-menu", "rtk-menu-item", "rtk-menu-list", "rtk-spinner", "rtk-text-message"];
    components.forEach(tagName => { switch (tagName) {
        case "rtk-chat-message":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, RtkChatMessage);
            }
            break;
        case "rtk-avatar":
            if (!customElements.get(tagName)) {
                defineCustomElement$a();
            }
            break;
        case "rtk-button":
            if (!customElements.get(tagName)) {
                defineCustomElement$9();
            }
            break;
        case "rtk-file-message":
            if (!customElements.get(tagName)) {
                defineCustomElement$8();
            }
            break;
        case "rtk-icon":
            if (!customElements.get(tagName)) {
                defineCustomElement$7();
            }
            break;
        case "rtk-image-message":
            if (!customElements.get(tagName)) {
                defineCustomElement$6();
            }
            break;
        case "rtk-menu":
            if (!customElements.get(tagName)) {
                defineCustomElement$5();
            }
            break;
        case "rtk-menu-item":
            if (!customElements.get(tagName)) {
                defineCustomElement$4();
            }
            break;
        case "rtk-menu-list":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "rtk-spinner":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
        case "rtk-text-message":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}
defineCustomElement();

export { RtkChatMessage as R, defineCustomElement as d };
