@cloudflare/realtimekit-ui 1.1.0-staging.1 → 1.1.0-staging.2

package/dist/cjs/rtk-avatar_24.cjs.entry.js

@@ -1914,7 +1914,7 @@ __decorate$6([
 ], RtkMenu$1.prototype, "t", void 0);
 RtkMenu$1.style = RtkMenuStyle0;
 
-const rtkMenuItemCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;align-items:center;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);cursor:pointer;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;color:rgb(var(--rtk-colors-text-1000, 255 255 255));font-size:14px}::slotted([slot='start']){margin-right:var(--rtk-space-2, 8px)}::slotted([slot='end']){margin-left:var(--rtk-space-2, 8px)}:host(:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}:host(.red){--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}";
+const rtkMenuItemCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;align-items:center;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);cursor:pointer;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;color:rgb(var(--rtk-colors-text-1000, 255 255 255));font-size:14px}::slotted([slot='start']){margin-right:var(--rtk-space-2, 8px)}::slotted([slot='end']){margin-left:var(--rtk-space-2, 8px)}:host(:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity))}:host(.primary:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity))}:host(.red){--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}";
 const RtkMenuItemStyle0 = rtkMenuItemCss;
 
 var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -1930,13 +1930,15 @@ var __decorate$5 = (undefined && undefined.__decorate) || function (decorators,
 const RtkMenuItem = class {
     constructor(hostRef) {
         index$1.registerInstance(this, hostRef);
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Icon pack */
         this.iconPack = uiStore.defaultIconPack;
         /** Language */
         this.t = uiStore.useLanguage();
     }
     render() {
-        return (index$1.h(index$1.Host, { key: 'a5c802aa2cb8cb235dc1e68d54ec9703c57df0b9' }, index$1.h("slot", { key: 'b448160fdd220fd814d471ddc08d7f784af10c49', name: "start" }), index$1.h("slot", { key: '0b342d2547a7835ea23d1974c3fd1b2e3507e779' }), index$1.h("slot", { key: '6670a8ed947d2bd6fb1651e9c6c1cd52f5ca419c', name: "end" })));
+        return (index$1.h(index$1.Host, { key: '7ae0e75aa59e0ce3b6a919eb258f218d84033bdd', class: { [this.menuVariant]: true } }, index$1.h("slot", { key: '4fd6d31e2ecb9f99bdc7442e796c5dadcb8bcf74', name: "start" }), index$1.h("slot", { key: '04ef7d82759ff42015480b3cd789d941ffa574f0' }), index$1.h("slot", { key: 'ad3c22309470a6b71d6b6b9f0f8b58cde7f76f3c', name: "end" })));
     }
 };
 __decorate$5([
@@ -1947,7 +1949,7 @@ __decorate$5([
 ], RtkMenuItem.prototype, "t", void 0);
 RtkMenuItem.style = RtkMenuItemStyle0;
 
-const rtkMenuListCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;width:-moz-max-content;width:max-content;flex-direction:column;padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255));overflow:hidden;border-radius:var(--rtk-border-radius-sm, 4px);--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)}";
+const rtkMenuListCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;width:-moz-max-content;width:max-content;flex-direction:column;padding:var(--rtk-space-0, 0px);color:rgb(var(--rtk-colors-text-1000, 255 255 255));border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));overflow:hidden;border-radius:var(--rtk-border-radius-sm, 4px);--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);-webkit-backdrop-filter:blur(60px);backdrop-filter:blur(60px)}:host(.primary){--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / 0.3)}";
 const RtkMenuListStyle0 = rtkMenuListCss;
 
 var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -1965,11 +1967,13 @@ const RtkMenuList = class {
         index$1.registerInstance(this, hostRef);
         /** Icon pack */
         this.iconPack = uiStore.defaultIconPack;
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Language */
         this.t = uiStore.useLanguage();
     }
     render() {
-        return (index$1.h(index$1.Host, { key: '1357690e48bef0c8c0e953886f1fd7754f0e4e4d' }, index$1.h("slot", { key: 'f3a221b7a4d28f53add6b658a0510294a998d6c1' })));
+        return (index$1.h(index$1.Host, { key: '1dd2702af95e0270488e6be1813b5979bd676697', class: { [this.menuVariant]: true } }, index$1.h("slot", { key: 'cbe97d571726800ad4a3e25b8c0e261b9a0cd40a' })));
     }
 };
 __decorate$4([
@@ -1980,7 +1984,7 @@ __decorate$4([
 ], RtkMenuList.prototype, "t", void 0);
 RtkMenuList.style = RtkMenuListStyle0;
 
-const rtkMessageViewCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{max-width:var(--rtk-space-96, 384px)}.message-wrapper{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:var(--rtk-space-2, 8px)}.message-wrapper.incoming{flex-direction:row}.message{display:flex;flex-direction:column;align-items:flex-end}.incoming .message{display:flex;flex-direction:column;align-items:flex-start}.header{margin-top:var(--rtk-space-1, 4px);margin-bottom:var(--rtk-space-1, 4px);align-self:flex-end;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:12px;font-weight:600}.incoming .header{align-self:flex-start}.body{display:flex;flex-direction:column;min-width:var(--rtk-space-24, 96px);font-family:var(--rtk-font-family, sans-serif);color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:14px;line-height:1.375;position:relative}.bubble{max-width:90%;padding:var(--rtk-space-2, 8px);border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:var(--rtk-border-radius-md, 8px)}.incoming .bubble{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.metadata{margin-top:var(--rtk-space-2, 8px);align-self:flex-end;font-size:10px;color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}.avatar{display:none}rtk-menu{position:absolute;right:var(--rtk-space-0, 0px);top:var(--rtk-space-0, 0px);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}.actions{display:flex;align-items:center;justify-content:center;padding-left:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);padding-top:var(--rtk-space-1, 4px);padding-right:var(--rtk-space-1, 4px);border-radius:var(--rtk-border-radius-md, 8px);border-width:var(--rtk-border-width-none, 0);border-style:none;background:radial-gradient(\n    at top right,\n    rgb(var(--rtk-colors-brand-300, 73 124 253)) 60%,\n    rgba(255, 255, 255, 0) 80%\n  )}.actions rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.incoming .actions{background:radial-gradient(\n      at top right,\n      rgb(var(--rtk-colors-background-800, 30 30 30)) 60%,\n      rgba(255, 255, 255, 0) 80%\n    )}.incoming .actions rtk-icon{color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.incoming rtk-avatar{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}@media (min-width: 400px){.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;overflow:clip;border-radius:9999px}}@media (hover: hover){rtk-menu{visibility:hidden}.body:hover rtk-menu{visibility:visible}}";
+const rtkMessageViewCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{max-width:var(--rtk-space-96, 384px)}.message-wrapper{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:var(--rtk-space-2, 8px)}.message-wrapper.incoming{flex-direction:row}.message{display:flex;flex-direction:column;align-items:flex-end}.incoming .message{display:flex;flex-direction:column;align-items:flex-start}.header{margin-top:var(--rtk-space-1, 4px);margin-bottom:var(--rtk-space-1, 4px);align-self:flex-end;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:12px;font-weight:600}.incoming .header{align-self:flex-start}.body{display:flex;flex-direction:column;min-width:var(--rtk-space-24, 96px);font-family:var(--rtk-font-family, sans-serif);color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:14px;line-height:1.375;position:relative}.bubble{max-width:90%;padding:var(--rtk-space-2, 8px);border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:var(--rtk-border-radius-md, 8px)}.incoming .bubble{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.metadata{margin-top:var(--rtk-space-2, 8px);align-self:flex-end;font-size:10px;color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}.avatar{display:none}rtk-menu{position:absolute;right:var(--rtk-space-1, 4px);top:var(--rtk-space-1, 4px);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}.actions{display:flex;align-items:center;justify-content:center;border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity));padding:var(--rtk-space-1, 4px);border-radius:var(--rtk-border-radius-md, 8px);border-width:var(--rtk-border-width-none, 0);border-style:none}.actions rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.incoming rtk-avatar{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.incoming .actions{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity))}@media (min-width: 400px){.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;overflow:clip;border-radius:9999px}}@media (hover: hover){rtk-menu{visibility:hidden}.body:hover rtk-menu{visibility:visible}}";
 const RtkMessageViewStyle0 = rtkMessageViewCss;
 
 var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -2015,10 +2019,10 @@ const RtkMessageView = class {
         this.iconPack = uiStore.defaultIconPack;
     }
     renderActions() {
-        return (index$1.h("rtk-menu", { placement: "top-end", offset: 1 }, index$1.h("button", { slot: "trigger", class: "actions" }, index$1.h("rtk-icon", { icon: this.iconPack.chevron_down })), index$1.h("rtk-menu-list", null, this.actions.map((action) => (index$1.h("rtk-menu-item", { onClick: () => this.onAction.emit(action.id) }, action.icon && index$1.h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
+        return (index$1.h("rtk-menu", { placement: this.isSelf ? 'bottom-start' : 'bottom-end', offset: 1 }, index$1.h("button", { slot: "trigger", class: "actions" }, index$1.h("rtk-icon", { icon: this.iconPack.chevron_down })), index$1.h("rtk-menu-list", { menuVariant: this.isSelf ? 'primary' : 'secondary' }, this.actions.map((action) => (index$1.h("rtk-menu-item", { menuVariant: this.isSelf ? 'primary' : 'secondary', onClick: () => this.onAction.emit(action.id) }, action.icon && index$1.h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
     }
     render() {
-        return (index$1.h(index$1.Host, { key: '61882011f477f816296277a4f2d5622d224e47f0' }, index$1.h("div", { key: 'ae21bfc0c499879da6a2167f0cad5203475de696', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (index$1.h("aside", { key: '73b10ebb1dccdc4e2c9258f185eb14f07d11d542', class: "avatar", part: "avatar" }, index$1.h("rtk-avatar", { key: 'e07971bf9d7738fb2dcc015d339a13d5dca7c6f7', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), index$1.h("div", { key: '1e24801f717589e598c4160bea7ab10a59acfcc2', class: "message", part: "message" }, !this.hideAuthorName && (index$1.h("div", { key: '3178f750ad798b7d83508f82ead36ee5407fee4c', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), index$1.h("div", { key: '056445ef0c557d7d756330df5778ad8bc2d41e60', class: { body: true, bubble: this.variant === 'bubble' } }, index$1.h("slot", { key: '6d5486666ce2238e4387c2621d562b24704a9317' }), !this.hideMetadata && !!this.time && (index$1.h("div", { key: '1d4b9bdbb3aaf288dce4b43a31354df3d413b2b4', class: "metadata", title: date.formatDateTime(this.time) }, date.elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
+        return (index$1.h(index$1.Host, { key: '96feddf08120ae0e2aa89e955a16e8e4a43c78fb' }, index$1.h("div", { key: '79184165b5312ea52f0cbb57e25cfd4a757fc65f', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (index$1.h("aside", { key: 'a2ccd72fbec0153282db018fb3473bf10f2176e9', class: "avatar", part: "avatar" }, index$1.h("rtk-avatar", { key: 'ecc9f5f77de0a47dfb5985c6f48e5f117c64b45e', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), index$1.h("div", { key: '3a72dc77c04eeb4d6015bf46dd9cc0bc9f533943', class: "message", part: "message" }, !this.hideAuthorName && (index$1.h("div", { key: '153a94b9fa6b23dac3fe4da62a22cbf66e4e73dc', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), index$1.h("div", { key: 'a36d44da27ea1a4d18feb91726d22e7adf983914', class: { body: true, bubble: this.variant === 'bubble' } }, index$1.h("slot", { key: '4ef8ca3766b562201e4e4443438c91679f09d471' }), !this.hideMetadata && !!this.time && (index$1.h("div", { key: '66754f1dd1a65ebdcda24449475b1f603db3ff1e', class: "metadata", title: date.formatDateTime(this.time) }, date.elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
     }
 };
 __decorate$3([

package/dist/collection/components/rtk-menu-item/rtk-menu-item.css

@@ -37,7 +37,12 @@ p {
 
 :host(:hover) {
   --tw-bg-opacity: 1;
-  background-color: rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));
+  background-color: rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity));
+}
+
+:host(.primary:hover) {
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity));
 }
 
 :host(.red) {

package/dist/collection/components/rtk-menu-item/rtk-menu-item.js

@@ -21,13 +21,15 @@ import { useLanguage } from "../../lib/lang";
  */
 export class RtkMenuItem {
     constructor() {
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Icon pack */
         this.iconPack = defaultIconPack;
         /** Language */
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: 'a5c802aa2cb8cb235dc1e68d54ec9703c57df0b9' }, h("slot", { key: 'b448160fdd220fd814d471ddc08d7f784af10c49', name: "start" }), h("slot", { key: '0b342d2547a7835ea23d1974c3fd1b2e3507e779' }), h("slot", { key: '6670a8ed947d2bd6fb1651e9c6c1cd52f5ca419c', name: "end" })));
+        return (h(Host, { key: '7ae0e75aa59e0ce3b6a919eb258f218d84033bdd', class: { [this.menuVariant]: true } }, h("slot", { key: '4fd6d31e2ecb9f99bdc7442e796c5dadcb8bcf74', name: "start" }), h("slot", { key: '04ef7d82759ff42015480b3cd789d941ffa574f0' }), h("slot", { key: 'ad3c22309470a6b71d6b6b9f0f8b58cde7f76f3c', name: "end" })));
     }
     static get is() { return "rtk-menu-item"; }
     static get encapsulation() { return "shadow"; }
@@ -68,6 +70,26 @@ export class RtkMenuItem {
                 "attribute": "size",
                 "reflect": true
             },
+            "menuVariant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'primary' | 'secondary'",
+                    "resolved": "\"primary\" | \"secondary\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Variant"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "menu-variant",
+                "reflect": false,
+                "defaultValue": "'secondary'"
+            },
             "iconPack": {
                 "type": "unknown",
                 "mutable": false,

package/dist/collection/components/rtk-menu-list/rtk-menu-list.css

@@ -17,14 +17,25 @@ p {
   width: -moz-max-content;
   width: max-content;
   flex-direction: column;
-  padding-top: var(--rtk-space-2, 8px);
-  padding-bottom: var(--rtk-space-2, 8px);
-  --tw-bg-opacity: 1;
-  background-color: rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));
+  padding: var(--rtk-space-0, 0px);
   color: rgb(var(--rtk-colors-text-1000, 255 255 255));
+  border-width: 1px;
+  border-style: solid;
+  --tw-border-opacity: 1;
+  border-color: rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));
   overflow: hidden;
   border-radius: var(--rtk-border-radius-sm, 4px);
   --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);
+  -webkit-backdrop-filter: blur(60px);
+          backdrop-filter: blur(60px);
+}
+
+:host(.primary) {
+  --tw-border-opacity: 1;
+  border-color: rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));
+  background-color: rgba(var(--rtk-colors-brand-300, 73 124 253) / 0.3);
 }

package/dist/collection/components/rtk-menu-list/rtk-menu-list.js

@@ -21,11 +21,13 @@ export class RtkMenuList {
     constructor() {
         /** Icon pack */
         this.iconPack = defaultIconPack;
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Language */
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: '1357690e48bef0c8c0e953886f1fd7754f0e4e4d' }, h("slot", { key: 'f3a221b7a4d28f53add6b658a0510294a998d6c1' })));
+        return (h(Host, { key: '1dd2702af95e0270488e6be1813b5979bd676697', class: { [this.menuVariant]: true } }, h("slot", { key: 'cbe97d571726800ad4a3e25b8c0e261b9a0cd40a' })));
     }
     static get is() { return "rtk-menu-list"; }
     static get encapsulation() { return "shadow"; }
@@ -65,6 +67,26 @@ export class RtkMenuList {
                 "setter": false,
                 "defaultValue": "defaultIconPack"
             },
+            "menuVariant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'primary' | 'secondary'",
+                    "resolved": "\"primary\" | \"secondary\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Variant"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "menu-variant",
+                "reflect": false,
+                "defaultValue": "'secondary'"
+            },
             "t": {
                 "type": "unknown",
                 "mutable": false,

package/dist/collection/components/rtk-message-view/rtk-message-view.css

@@ -112,8 +112,8 @@ p {
 
 rtk-menu {
   position: absolute;
-  right: var(--rtk-space-0, 0px);
-  top: var(--rtk-space-0, 0px);
+  right: var(--rtk-space-1, 4px);
+  top: var(--rtk-space-1, 4px);
   border-radius: var(--rtk-border-radius-lg, 12px);
 }
 
@@ -122,44 +122,42 @@ rtk-menu rtk-icon {
   width: var(--rtk-space-4, 16px);
   cursor: pointer;
 }
+
 .actions {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding-left: var(--rtk-space-2, 8px);
-  padding-bottom: var(--rtk-space-2, 8px);
-  padding-top: var(--rtk-space-1, 4px);
-  padding-right: var(--rtk-space-1, 4px);
+  border-width: 1px;
+  border-style: solid;
+  --tw-border-opacity: 1;
+  border-color: rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity));
+  padding: var(--rtk-space-1, 4px);
   border-radius: var(--rtk-border-radius-md, 8px);
   border-width: var(--rtk-border-width-none, 0);
   border-style: none;
-  background: radial-gradient(
-    at top right,
-    rgb(var(--rtk-colors-brand-300, 73 124 253)) 60%,
-    rgba(255, 255, 255, 0) 80%
-  );
 }
+
 .actions rtk-icon {
   height: var(--rtk-space-4, 16px);
   width: var(--rtk-space-4, 16px);
   color: rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));
 }
-.incoming .actions {
-    background: radial-gradient(
-      at top right,
-      rgb(var(--rtk-colors-background-800, 30 30 30)) 60%,
-      rgba(255, 255, 255, 0) 80%
-    );
-  }
-.incoming .actions rtk-icon {
-  color: rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));
-}
+
 .incoming rtk-avatar {
   --tw-bg-opacity: 1;
   background-color: rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));
   color: rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));
 }
 
+.incoming .actions {
+  --tw-border-opacity: 1;
+  border-color: rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));
+  --tw-bg-opacity: 1;
+  background-color: rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));
+}
+
 @media (min-width: 400px) {
   .avatar {
     display: flex;

package/dist/collection/components/rtk-message-view/rtk-message-view.js

@@ -32,10 +32,10 @@ export class RtkMessageView {
         this.iconPack = defaultIconPack;
     }
     renderActions() {
-        return (h("rtk-menu", { placement: "top-end", offset: 1 }, h("button", { slot: "trigger", class: "actions" }, h("rtk-icon", { icon: this.iconPack.chevron_down })), h("rtk-menu-list", null, this.actions.map((action) => (h("rtk-menu-item", { onClick: () => this.onAction.emit(action.id) }, action.icon && h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
+        return (h("rtk-menu", { placement: this.isSelf ? 'bottom-start' : 'bottom-end', offset: 1 }, h("button", { slot: "trigger", class: "actions" }, h("rtk-icon", { icon: this.iconPack.chevron_down })), h("rtk-menu-list", { menuVariant: this.isSelf ? 'primary' : 'secondary' }, this.actions.map((action) => (h("rtk-menu-item", { menuVariant: this.isSelf ? 'primary' : 'secondary', onClick: () => this.onAction.emit(action.id) }, action.icon && h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
     }
     render() {
-        return (h(Host, { key: '61882011f477f816296277a4f2d5622d224e47f0' }, h("div", { key: 'ae21bfc0c499879da6a2167f0cad5203475de696', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (h("aside", { key: '73b10ebb1dccdc4e2c9258f185eb14f07d11d542', class: "avatar", part: "avatar" }, h("rtk-avatar", { key: 'e07971bf9d7738fb2dcc015d339a13d5dca7c6f7', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), h("div", { key: '1e24801f717589e598c4160bea7ab10a59acfcc2', class: "message", part: "message" }, !this.hideAuthorName && (h("div", { key: '3178f750ad798b7d83508f82ead36ee5407fee4c', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), h("div", { key: '056445ef0c557d7d756330df5778ad8bc2d41e60', class: { body: true, bubble: this.variant === 'bubble' } }, h("slot", { key: '6d5486666ce2238e4387c2621d562b24704a9317' }), !this.hideMetadata && !!this.time && (h("div", { key: '1d4b9bdbb3aaf288dce4b43a31354df3d413b2b4', class: "metadata", title: formatDateTime(this.time) }, elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
+        return (h(Host, { key: '96feddf08120ae0e2aa89e955a16e8e4a43c78fb' }, h("div", { key: '79184165b5312ea52f0cbb57e25cfd4a757fc65f', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (h("aside", { key: 'a2ccd72fbec0153282db018fb3473bf10f2176e9', class: "avatar", part: "avatar" }, h("rtk-avatar", { key: 'ecc9f5f77de0a47dfb5985c6f48e5f117c64b45e', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), h("div", { key: '3a72dc77c04eeb4d6015bf46dd9cc0bc9f533943', class: "message", part: "message" }, !this.hideAuthorName && (h("div", { key: '153a94b9fa6b23dac3fe4da62a22cbf66e4e73dc', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), h("div", { key: 'a36d44da27ea1a4d18feb91726d22e7adf983914', class: { body: true, bubble: this.variant === 'bubble' } }, h("slot", { key: '4ef8ca3766b562201e4e4443438c91679f09d471' }), !this.hideMetadata && !!this.time && (h("div", { key: '66754f1dd1a65ebdcda24449475b1f603db3ff1e', class: "metadata", title: formatDateTime(this.time) }, elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
     }
     static get is() { return "rtk-message-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/components/{p-ee98bbaf.js → p-012889ce.js}

@@ -8,8 +8,8 @@ import { d as defineCustomElement$8 } from './p-488d88a8.js';
 import { d as defineCustomElement$7 } from './p-3b29dda1.js';
 import { d as defineCustomElement$6 } from './p-190db142.js';
 import { d as defineCustomElement$5 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$4 } from './p-a6296b02.js';
-import { d as defineCustomElement$3 } from './p-080acf18.js';
+import { d as defineCustomElement$4 } from './p-567de036.js';
+import { d as defineCustomElement$3 } from './p-2bdd7bd3.js';
 import { d as defineCustomElement$2 } from './p-0a35a909.js';
 import { d as defineCustomElement$1 } from './p-9889bee5.js';
 

package/dist/components/{p-a6f2b402.js → p-0df5ca92.js}

@@ -8,9 +8,9 @@ import { d as defineCustomElement$a } from './p-3b29dda1.js';
 import { d as defineCustomElement$9 } from './p-63ef7ea4.js';
 import { d as defineCustomElement$8 } from './p-88bef213.js';
 import { d as defineCustomElement$7 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$6 } from './p-a6296b02.js';
-import { d as defineCustomElement$5 } from './p-080acf18.js';
-import { d as defineCustomElement$4 } from './p-fe911889.js';
+import { d as defineCustomElement$6 } from './p-567de036.js';
+import { d as defineCustomElement$5 } from './p-2bdd7bd3.js';
+import { d as defineCustomElement$4 } from './p-5c66ba12.js';
 import { d as defineCustomElement$3 } from './p-a9540d93.js';
 import { d as defineCustomElement$2 } from './p-0a35a909.js';
 import { d as defineCustomElement$1 } from './p-a94b2e67.js';

package/dist/components/{p-e8df7ac5.js → p-1367b1af.js}

@@ -8,8 +8,8 @@ import { S as SyncWithStore } from './p-47c25f64.js';
 import { d as defineCustomElement$6 } from './p-f4e75ea9.js';
 import { d as defineCustomElement$5 } from './p-1391bef0.js';
 import { d as defineCustomElement$4 } from './p-3b29dda1.js';
-import { d as defineCustomElement$3 } from './p-a6296b02.js';
-import { d as defineCustomElement$2 } from './p-080acf18.js';
+import { d as defineCustomElement$3 } from './p-567de036.js';
+import { d as defineCustomElement$2 } from './p-2bdd7bd3.js';
 import { d as defineCustomElement$1 } from './p-0a35a909.js';
 
 const rtkParticipantCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{position:relative;display:flex;height:var(--rtk-space-14, 56px);align-items:center;justify-content:space-between;cursor:pointer;color:rgb(var(--rtk-colors-text-1000, 255 255 255))}:host rtk-avatar{height:var(--rtk-space-8, 32px);width:var(--rtk-space-8, 32px);font-size:14px}.left{display:flex;align-items:center}.left>*{margin-right:var(--rtk-space-2, 8px)}.left>*:last-child{margin-right:var(--rtk-space-0, 0px)}.right{display:flex;align-items:center;justify-content:flex-end}.right>*{margin-left:var(--rtk-space-2, 8px)}.right>*:first-child{margin-left:var(--rtk-space-0, 0px)}.name{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}rtk-icon{height:var(--rtk-space-6, 24px);width:var(--rtk-space-6, 24px)}rtk-icon.red{--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}rtk-icon.more{cursor:pointer}.menu{position:relative;display:inline-block;color:rgb(var(--rtk-colors-text-1000, 255 255 255))}#menu-list{position:absolute;z-index:20}";

package/dist/components/{p-080acf18.js → p-2bdd7bd3.js}

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
 import { e as defaultIconPack, h as useLanguage } from './p-7fc0dc2f.js';
 import { S as SyncWithStore } from './p-47c25f64.js';
 
-const rtkMenuListCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;width:-moz-max-content;width:max-content;flex-direction:column;padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-1000, 255 255 255));overflow:hidden;border-radius:var(--rtk-border-radius-sm, 4px);--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)}";
+const rtkMenuListCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;width:-moz-max-content;width:max-content;flex-direction:column;padding:var(--rtk-space-0, 0px);color:rgb(var(--rtk-colors-text-1000, 255 255 255));border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity));overflow:hidden;border-radius:var(--rtk-border-radius-sm, 4px);--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);-webkit-backdrop-filter:blur(60px);backdrop-filter:blur(60px)}:host(.primary){--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / 0.3)}";
 const RtkMenuListStyle0 = rtkMenuListCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -22,15 +22,18 @@ const RtkMenuList = /*@__PURE__*/ proxyCustomElement(class RtkMenuList extends H
         this.__attachShadow();
         /** Icon pack */
         this.iconPack = defaultIconPack;
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Language */
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: '1357690e48bef0c8c0e953886f1fd7754f0e4e4d' }, h("slot", { key: 'f3a221b7a4d28f53add6b658a0510294a998d6c1' })));
+        return (h(Host, { key: '1dd2702af95e0270488e6be1813b5979bd676697', class: { [this.menuVariant]: true } }, h("slot", { key: 'cbe97d571726800ad4a3e25b8c0e261b9a0cd40a' })));
     }
     static get style() { return RtkMenuListStyle0; }
 }, [1, "rtk-menu-list", {
         "iconPack": [16],
+        "menuVariant": [1, "menu-variant"],
         "t": [16]
     }]);
 __decorate([

package/dist/components/{p-a6296b02.js → p-567de036.js}

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, h, e as Host } from './p-c3592601.js';
 import { e as defaultIconPack, h as useLanguage } from './p-7fc0dc2f.js';
 import { S as SyncWithStore } from './p-47c25f64.js';
 
-const rtkMenuItemCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;align-items:center;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);cursor:pointer;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;color:rgb(var(--rtk-colors-text-1000, 255 255 255));font-size:14px}::slotted([slot='start']){margin-right:var(--rtk-space-2, 8px)}::slotted([slot='end']){margin-left:var(--rtk-space-2, 8px)}:host(:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity))}:host(.red){--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}";
+const rtkMenuItemCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}:host{display:flex;align-items:center;padding-left:var(--rtk-space-3, 12px);padding-right:var(--rtk-space-3, 12px);padding-top:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);cursor:pointer;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;color:rgb(var(--rtk-colors-text-1000, 255 255 255));font-size:14px}::slotted([slot='start']){margin-right:var(--rtk-space-2, 8px)}::slotted([slot='end']){margin-left:var(--rtk-space-2, 8px)}:host(:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-900, 26 26 26) / var(--tw-bg-opacity))}:host(.primary:hover){--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity))}:host(.red){--tw-text-opacity:1;color:rgba(var(--rtk-colors-danger, 255 45 45) / var(--tw-text-opacity))}";
 const RtkMenuItemStyle0 = rtkMenuItemCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -20,17 +20,20 @@ const RtkMenuItem = /*@__PURE__*/ proxyCustomElement(class RtkMenuItem extends H
         super();
         this.__registerHost();
         this.__attachShadow();
+        /** Variant */
+        this.menuVariant = 'secondary';
         /** Icon pack */
         this.iconPack = defaultIconPack;
         /** Language */
         this.t = useLanguage();
     }
     render() {
-        return (h(Host, { key: 'a5c802aa2cb8cb235dc1e68d54ec9703c57df0b9' }, h("slot", { key: 'b448160fdd220fd814d471ddc08d7f784af10c49', name: "start" }), h("slot", { key: '0b342d2547a7835ea23d1974c3fd1b2e3507e779' }), h("slot", { key: '6670a8ed947d2bd6fb1651e9c6c1cd52f5ca419c', name: "end" })));
+        return (h(Host, { key: '7ae0e75aa59e0ce3b6a919eb258f218d84033bdd', class: { [this.menuVariant]: true } }, h("slot", { key: '4fd6d31e2ecb9f99bdc7442e796c5dadcb8bcf74', name: "start" }), h("slot", { key: '04ef7d82759ff42015480b3cd789d941ffa574f0' }), h("slot", { key: 'ad3c22309470a6b71d6b6b9f0f8b58cde7f76f3c', name: "end" })));
     }
     static get style() { return RtkMenuItemStyle0; }
 }, [1, "rtk-menu-item", {
         "size": [513],
+        "menuVariant": [1, "menu-variant"],
         "iconPack": [16],
         "t": [16]
     }]);

package/dist/components/{p-fe911889.js → p-5c66ba12.js}

@@ -6,11 +6,11 @@ import './p-a83ccdbd.js';
 import { d as defineCustomElement$6 } from './p-f4e75ea9.js';
 import { d as defineCustomElement$5 } from './p-3b29dda1.js';
 import { d as defineCustomElement$4 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$3 } from './p-a6296b02.js';
-import { d as defineCustomElement$2 } from './p-080acf18.js';
+import { d as defineCustomElement$3 } from './p-567de036.js';
+import { d as defineCustomElement$2 } from './p-2bdd7bd3.js';
 import { d as defineCustomElement$1 } from './p-0a35a909.js';
 
-const rtkMessageViewCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{max-width:var(--rtk-space-96, 384px)}.message-wrapper{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:var(--rtk-space-2, 8px)}.message-wrapper.incoming{flex-direction:row}.message{display:flex;flex-direction:column;align-items:flex-end}.incoming .message{display:flex;flex-direction:column;align-items:flex-start}.header{margin-top:var(--rtk-space-1, 4px);margin-bottom:var(--rtk-space-1, 4px);align-self:flex-end;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:12px;font-weight:600}.incoming .header{align-self:flex-start}.body{display:flex;flex-direction:column;min-width:var(--rtk-space-24, 96px);font-family:var(--rtk-font-family, sans-serif);color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:14px;line-height:1.375;position:relative}.bubble{max-width:90%;padding:var(--rtk-space-2, 8px);border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:var(--rtk-border-radius-md, 8px)}.incoming .bubble{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.metadata{margin-top:var(--rtk-space-2, 8px);align-self:flex-end;font-size:10px;color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}.avatar{display:none}rtk-menu{position:absolute;right:var(--rtk-space-0, 0px);top:var(--rtk-space-0, 0px);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}.actions{display:flex;align-items:center;justify-content:center;padding-left:var(--rtk-space-2, 8px);padding-bottom:var(--rtk-space-2, 8px);padding-top:var(--rtk-space-1, 4px);padding-right:var(--rtk-space-1, 4px);border-radius:var(--rtk-border-radius-md, 8px);border-width:var(--rtk-border-width-none, 0);border-style:none;background:radial-gradient(\n    at top right,\n    rgb(var(--rtk-colors-brand-300, 73 124 253)) 60%,\n    rgba(255, 255, 255, 0) 80%\n  )}.actions rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.incoming .actions{background:radial-gradient(\n      at top right,\n      rgb(var(--rtk-colors-background-800, 30 30 30)) 60%,\n      rgba(255, 255, 255, 0) 80%\n    )}.incoming .actions rtk-icon{color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.incoming rtk-avatar{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}@media (min-width: 400px){.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;overflow:clip;border-radius:9999px}}@media (hover: hover){rtk-menu{visibility:hidden}.body:hover rtk-menu{visibility:visible}}";
+const rtkMessageViewCss = ":host{line-height:initial;font-family:var(--rtk-font-family, sans-serif);font-feature-settings:normal;font-variation-settings:normal}p{margin:var(--rtk-space-0, 0px);padding:var(--rtk-space-0, 0px)}.scrollbar{scrollbar-width:thin;scrollbar-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))\n    var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar{height:var(--rtk-space-1\\.5, 6px);width:var(--rtk-space-1\\.5, 6px);border-radius:9999px;background-color:var(--rtk-scrollbar-background, transparent)}.scrollbar::-webkit-scrollbar-thumb{border-radius:9999px;background-color:var(--rtk-scrollbar-color, rgb(var(--rtk-colors-background-600, 60 60 60)))}:host{max-width:var(--rtk-space-96, 384px)}.message-wrapper{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:var(--rtk-space-2, 8px)}.message-wrapper.incoming{flex-direction:row}.message{display:flex;flex-direction:column;align-items:flex-end}.incoming .message{display:flex;flex-direction:column;align-items:flex-start}.header{margin-top:var(--rtk-space-1, 4px);margin-bottom:var(--rtk-space-1, 4px);align-self:flex-end;color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:12px;font-weight:600}.incoming .header{align-self:flex-start}.body{display:flex;flex-direction:column;min-width:var(--rtk-space-24, 96px);font-family:var(--rtk-font-family, sans-serif);color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88));font-size:14px;line-height:1.375;position:relative}.bubble{max-width:90%;padding:var(--rtk-space-2, 8px);border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-500, 33 96 253) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)));border-radius:var(--rtk-border-radius-md, 8px)}.incoming .bubble{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-800, 30 30 30) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.metadata{margin-top:var(--rtk-space-2, 8px);align-self:flex-end;font-size:10px;color:rgb(var(--rtk-colors-text-800, 255 255 255 / 0.76))}.avatar{display:none}rtk-menu{position:absolute;right:var(--rtk-space-1, 4px);top:var(--rtk-space-1, 4px);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}.actions{display:flex;align-items:center;justify-content:center;border-width:1px;border-style:solid;--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-brand-600, 13 81 253) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-brand-300, 73 124 253) / var(--tw-bg-opacity));padding:var(--rtk-space-1, 4px);border-radius:var(--rtk-border-radius-md, 8px);border-width:var(--rtk-border-width-none, 0);border-style:none}.actions rtk-icon{height:var(--rtk-space-4, 16px);width:var(--rtk-space-4, 16px);color:rgb(var(--rtk-colors-text-on-brand-1000, var(--rtk-colors-text-1000, 255 255 255)))}.incoming rtk-avatar{--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-600, 60 60 60) / var(--tw-bg-opacity));color:rgb(var(--rtk-colors-text-900, 255 255 255 / 0.88))}.incoming .actions{--tw-border-opacity:1;border-color:rgba(var(--rtk-colors-background-700, 44 44 44) / var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(var(--rtk-colors-background-1000, 8 8 8) / var(--tw-bg-opacity))}@media (min-width: 400px){.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;overflow:clip;border-radius:9999px}}@media (hover: hover){rtk-menu{visibility:hidden}.body:hover rtk-menu{visibility:visible}}";
 const RtkMessageViewStyle0 = rtkMessageViewCss;
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -47,10 +47,10 @@ const RtkMessageView = /*@__PURE__*/ proxyCustomElement(class RtkMessageView ext
         this.iconPack = defaultIconPack;
     }
     renderActions() {
-        return (h("rtk-menu", { placement: "top-end", offset: 1 }, h("button", { slot: "trigger", class: "actions" }, h("rtk-icon", { icon: this.iconPack.chevron_down })), h("rtk-menu-list", null, this.actions.map((action) => (h("rtk-menu-item", { onClick: () => this.onAction.emit(action.id) }, action.icon && h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
+        return (h("rtk-menu", { placement: this.isSelf ? 'bottom-start' : 'bottom-end', offset: 1 }, h("button", { slot: "trigger", class: "actions" }, h("rtk-icon", { icon: this.iconPack.chevron_down })), h("rtk-menu-list", { menuVariant: this.isSelf ? 'primary' : 'secondary' }, this.actions.map((action) => (h("rtk-menu-item", { menuVariant: this.isSelf ? 'primary' : 'secondary', onClick: () => this.onAction.emit(action.id) }, action.icon && h("rtk-icon", { icon: action.icon, slot: "start" }), action.label))))));
     }
     render() {
-        return (h(Host, { key: '61882011f477f816296277a4f2d5622d224e47f0' }, h("div", { key: 'ae21bfc0c499879da6a2167f0cad5203475de696', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (h("aside", { key: '73b10ebb1dccdc4e2c9258f185eb14f07d11d542', class: "avatar", part: "avatar" }, h("rtk-avatar", { key: 'e07971bf9d7738fb2dcc015d339a13d5dca7c6f7', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), h("div", { key: '1e24801f717589e598c4160bea7ab10a59acfcc2', class: "message", part: "message" }, !this.hideAuthorName && (h("div", { key: '3178f750ad798b7d83508f82ead36ee5407fee4c', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), h("div", { key: '056445ef0c557d7d756330df5778ad8bc2d41e60', class: { body: true, bubble: this.variant === 'bubble' } }, h("slot", { key: '6d5486666ce2238e4387c2621d562b24704a9317' }), !this.hideMetadata && !!this.time && (h("div", { key: '1d4b9bdbb3aaf288dce4b43a31354df3d413b2b4', class: "metadata", title: formatDateTime(this.time) }, elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
+        return (h(Host, { key: '96feddf08120ae0e2aa89e955a16e8e4a43c78fb' }, h("div", { key: '79184165b5312ea52f0cbb57e25cfd4a757fc65f', class: { 'message-wrapper': true, [this.viewType]: true } }, !this.hideAvatar && (h("aside", { key: 'a2ccd72fbec0153282db018fb3473bf10f2176e9', class: "avatar", part: "avatar" }, h("rtk-avatar", { key: 'ecc9f5f77de0a47dfb5985c6f48e5f117c64b45e', participant: { name: this.authorName, picture: this.avatarUrl }, size: "sm" }))), h("div", { key: '3a72dc77c04eeb4d6015bf46dd9cc0bc9f533943', class: "message", part: "message" }, !this.hideAuthorName && (h("div", { key: '153a94b9fa6b23dac3fe4da62a22cbf66e4e73dc', class: "header" }, this.authorName, " ", this.isSelf ? ' (You)' : '')), h("div", { key: 'a36d44da27ea1a4d18feb91726d22e7adf983914', class: { body: true, bubble: this.variant === 'bubble' } }, h("slot", { key: '4ef8ca3766b562201e4e4443438c91679f09d471' }), !this.hideMetadata && !!this.time && (h("div", { key: '66754f1dd1a65ebdcda24449475b1f603db3ff1e', class: "metadata", title: formatDateTime(this.time) }, elapsedDuration(this.time, new Date(Date.now())))), this.actions.length !== 0 && this.renderActions())))));
     }
     static get style() { return RtkMessageViewStyle0; }
 }, [1, "rtk-message-view", {

package/dist/components/{p-2f08d7eb.js → p-ad938f18.js}

@@ -7,7 +7,7 @@ import { d as defineCustomElement$m } from './p-f4e75ea9.js';
 import { d as defineCustomElement$l } from './p-1391bef0.js';
 import { d as defineCustomElement$k } from './p-d4e2ac64.js';
 import { d as defineCustomElement$j } from './p-f47894a6.js';
-import { d as defineCustomElement$i } from './p-a6f2b402.js';
+import { d as defineCustomElement$i } from './p-0df5ca92.js';
 import { d as defineCustomElement$h } from './p-65cd2fe3.js';
 import { d as defineCustomElement$g } from './p-20290b0b.js';
 import { d as defineCustomElement$f } from './p-3da4880c.js';
@@ -17,9 +17,9 @@ import { d as defineCustomElement$c } from './p-3b29dda1.js';
 import { d as defineCustomElement$b } from './p-63ef7ea4.js';
 import { d as defineCustomElement$a } from './p-88bef213.js';
 import { d as defineCustomElement$9 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$8 } from './p-a6296b02.js';
-import { d as defineCustomElement$7 } from './p-080acf18.js';
-import { d as defineCustomElement$6 } from './p-fe911889.js';
+import { d as defineCustomElement$8 } from './p-567de036.js';
+import { d as defineCustomElement$7 } from './p-2bdd7bd3.js';
+import { d as defineCustomElement$6 } from './p-5c66ba12.js';
 import { d as defineCustomElement$5 } from './p-a9540d93.js';
 import { d as defineCustomElement$4 } from './p-0a35a909.js';
 import { d as defineCustomElement$3 } from './p-d3de8b85.js';

package/dist/components/{p-188bfe87.js → p-c0454e82.js}

@@ -5,9 +5,9 @@ import { S as SyncWithStore } from './p-47c25f64.js';
 import { d as defineCustomElement$8 } from './p-f4e75ea9.js';
 import { d as defineCustomElement$7 } from './p-1391bef0.js';
 import { d as defineCustomElement$6 } from './p-3b29dda1.js';
-import { d as defineCustomElement$5 } from './p-a6296b02.js';
-import { d as defineCustomElement$4 } from './p-080acf18.js';
-import { d as defineCustomElement$3 } from './p-e8df7ac5.js';
+import { d as defineCustomElement$5 } from './p-567de036.js';
+import { d as defineCustomElement$4 } from './p-2bdd7bd3.js';
+import { d as defineCustomElement$3 } from './p-1367b1af.js';
 import { d as defineCustomElement$2 } from './p-0a35a909.js';
 import { d as defineCustomElement$1 } from './p-0d582365.js';
 

package/dist/components/rtk-chat-message.js

@@ -1,4 +1,4 @@
-import { R as RtkChatMessage$1, d as defineCustomElement$1 } from './p-ee98bbaf.js';
+import { R as RtkChatMessage$1, d as defineCustomElement$1 } from './p-012889ce.js';
 
 const RtkChatMessage = RtkChatMessage$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-chat-messages-ui-paginated.js

@@ -1,4 +1,4 @@
-import { R as RtkChatMessagesUiPaginated$1, d as defineCustomElement$1 } from './p-a6f2b402.js';
+import { R as RtkChatMessagesUiPaginated$1, d as defineCustomElement$1 } from './p-0df5ca92.js';
 
 const RtkChatMessagesUiPaginated = RtkChatMessagesUiPaginated$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-chat-messages-ui.js

@@ -11,9 +11,9 @@ import { d as defineCustomElement$b } from './p-3b29dda1.js';
 import { d as defineCustomElement$a } from './p-63ef7ea4.js';
 import { d as defineCustomElement$9 } from './p-88bef213.js';
 import { d as defineCustomElement$8 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$7 } from './p-a6296b02.js';
-import { d as defineCustomElement$6 } from './p-080acf18.js';
-import { d as defineCustomElement$5 } from './p-fe911889.js';
+import { d as defineCustomElement$7 } from './p-567de036.js';
+import { d as defineCustomElement$6 } from './p-2bdd7bd3.js';
+import { d as defineCustomElement$5 } from './p-5c66ba12.js';
 import { d as defineCustomElement$4 } from './p-0a35a909.js';
 import { d as defineCustomElement$3 } from './p-a94b2e67.js';
 import { d as defineCustomElement$2 } from './p-fa8f6b4a.js';

package/dist/components/rtk-chat-search-results.js

@@ -4,13 +4,13 @@ import './p-a83ccdbd.js';
 import { S as SyncWithStore } from './p-47c25f64.js';
 import { d as defineCustomElement$d } from './p-f4e75ea9.js';
 import { d as defineCustomElement$c } from './p-1391bef0.js';
-import { d as defineCustomElement$b } from './p-ee98bbaf.js';
+import { d as defineCustomElement$b } from './p-012889ce.js';
 import { d as defineCustomElement$a } from './p-488d88a8.js';
 import { d as defineCustomElement$9 } from './p-3b29dda1.js';
 import { d as defineCustomElement$8 } from './p-190db142.js';
 import { d as defineCustomElement$7 } from './p-f8f5cb31.js';
-import { d as defineCustomElement$6 } from './p-a6296b02.js';
-import { d as defineCustomElement$5 } from './p-080acf18.js';
+import { d as defineCustomElement$6 } from './p-567de036.js';
+import { d as defineCustomElement$5 } from './p-2bdd7bd3.js';
 import { d as defineCustomElement$4 } from './p-a9540d93.js';
 import { d as defineCustomElement$3 } from './p-0a35a909.js';
 import { d as defineCustomElement$2 } from './p-9889bee5.js';

package/dist/components/rtk-chat.js

@@ -1,4 +1,4 @@
-import { R as RtkChat$1, d as defineCustomElement$1 } from './p-2f08d7eb.js';
+import { R as RtkChat$1, d as defineCustomElement$1 } from './p-ad938f18.js';
 
 const RtkChat = RtkChat$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/rtk-meeting.js

@@ -8,9 +8,9 @@ import { i as index } from './p-f47d4fe8.js';
 import { d as defineCustomElement$o } from './p-f4e75ea9.js';
 import { d as defineCustomElement$n } from './p-1391bef0.js';
 import { d as defineCustomElement$m } from './p-d4e2ac64.js';
-import { d as defineCustomElement$l } from './p-2f08d7eb.js';
+import { d as defineCustomElement$l } from './p-ad938f18.js';
 import { d as defineCustomElement$k } from './p-f47894a6.js';
-import { d as defineCustomElement$j } from './p-a6f2b402.js';
+import { d as defineCustomElement$j } from './p-0df5ca92.js';
 import { d as defineCustomElement$i } from './p-65cd2fe3.js';
 import { d as defineCustomElement$h } from './p-20290b0b.js';
 import { d as defineCustomElement$g } from './p-3da4880c.js';
@@ -20,9 +20,9 @@ import { d as defineCustomElement$d } from './p-3b29dda1.js';
 import { d as defineCustomElement$c } from './p-63ef7ea4.js';
 import { d as defineCustomElement$b } from './p-88bef213.js';
 import { d as defineCustomElement$a } from './p-f8f5cb31.js';
-import { d as defineCustomElement$9 } from './p-a6296b02.js';
-import { d as defineCustomElement$8 } from './p-080acf18.js';
-import { d as defineCustomElement$7 } from './p-fe911889.js';
+import { d as defineCustomElement$9 } from './p-567de036.js';
+import { d as defineCustomElement$8 } from './p-2bdd7bd3.js';
+import { d as defineCustomElement$7 } from './p-5c66ba12.js';
 import { d as defineCustomElement$6 } from './p-a9540d93.js';
 import { d as defineCustomElement$5 } from './p-0a35a909.js';
 import { d as defineCustomElement$4 } from './p-d3de8b85.js';