@ai-matrx/meet 0.7.2 → 0.7.5

package/dist/styles.css

@@ -1330,3 +1330,525 @@
 .mx-meet-list__action:hover {
   background: var(--mx-meet-bg-hover);
 }
+
+/* ---------- Meet wave 2: menus, reactions, notices, settings ---------- */
+
+.mx-meet__anchor {
+  position: relative;
+  display: inline-flex;
+}
+
+.mx-meet__popover {
+  z-index: 30;
+  min-width: 220px;
+  max-width: calc(100vw - 16px);
+  max-height: min(70dvh, 520px);
+  overflow-y: auto;
+  background: var(--mx-meet-bg-raised);
+  color: var(--mx-meet-text);
+  border: 1px solid var(--mx-meet-border);
+  border-radius: var(--mx-meet-radius-sm);
+  box-shadow: var(--mx-meet-shadow);
+  padding: 6px;
+  animation: mx-meet-pop var(--mx-meet-duration) var(--mx-meet-ease);
+}
+
+@keyframes mx-meet-pop {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.mx-meet__emoji-bar {
+  display: flex;
+  gap: 2px;
+}
+
+.mx-meet__emoji {
+  width: 40px;
+  height: 40px;
+  border: none;
+  border-radius: 999px;
+  background: none;
+  font-size: 22px;
+  line-height: 1;
+  cursor: pointer;
+  transition: transform var(--mx-meet-duration) var(--mx-meet-ease),
+    background var(--mx-meet-duration) var(--mx-meet-ease);
+}
+
+.mx-meet__emoji:hover {
+  background: var(--mx-meet-bg-hover);
+  transform: scale(1.18);
+}
+
+.mx-meet__menu {
+  display: flex;
+  flex-direction: column;
+}
+
+.mx-meet__menu-item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-height: 36px;
+  padding: 6px 10px;
+  border: none;
+  border-radius: 8px;
+  background: none;
+  color: inherit;
+  font: inherit;
+  font-size: 14px;
+  text-align: left;
+  cursor: pointer;
+  white-space: nowrap;
+}
+
+.mx-meet__menu-item:hover,
+.mx-meet__menu-item:focus-visible {
+  background: var(--mx-meet-bg-hover);
+  outline: none;
+}
+
+.mx-meet__menu-item--danger {
+  color: var(--mx-meet-danger);
+}
+
+.mx-meet__menu-sep {
+  height: 1px;
+  margin: 4px 6px;
+  background: var(--mx-meet-border);
+}
+
+.mx-meet__menu-form {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 6px;
+  width: min(300px, calc(100vw - 32px));
+}
+
+.mx-meet__menu-actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 12px;
+}
+
+.mx-meet__send--danger {
+  background: var(--mx-meet-danger);
+}
+
+.mx-meet__send--danger:hover {
+  background: var(--mx-meet-danger-hover);
+}
+
+.mx-meet__toast,
+.mx-meet__notice-bar {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 25;
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  max-width: calc(100% - 32px);
+  padding: 8px 8px 8px 14px;
+  border-radius: 999px;
+  background: var(--mx-meet-stage-label-bg);
+  color: var(--mx-meet-stage-text);
+  font-size: 14px;
+  box-shadow: var(--mx-meet-shadow);
+  animation: mx-meet-pop var(--mx-meet-duration) var(--mx-meet-ease);
+}
+
+.mx-meet__toast {
+  bottom: calc(var(--mx-meet-control-size) + 36px);
+}
+
+.mx-meet__toast--failed {
+  background: var(--mx-meet-danger);
+  color: var(--mx-meet-text-on-accent);
+}
+
+.mx-meet__notice-bar {
+  top: 64px;
+}
+
+.mx-meet__toast-close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  border: none;
+  border-radius: 999px;
+  background: none;
+  color: inherit;
+  cursor: pointer;
+}
+
+.mx-meet__toast-close:hover {
+  background: rgba(255, 255, 255, 0.14);
+}
+
+.mx-meet__primary--small {
+  min-height: 32px;
+  padding: 0 14px;
+  font-size: 14px;
+}
+
+.mx-meet__sheet-backdrop {
+  position: absolute;
+  inset: 0;
+  z-index: 40;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(0, 0, 0, 0.45);
+  padding: 16px;
+}
+
+.mx-meet__sheet {
+  width: min(480px, 100%);
+  max-height: 100%;
+  overflow-y: auto;
+  background: var(--mx-meet-bg);
+  color: var(--mx-meet-text);
+  border-radius: var(--mx-meet-radius);
+  box-shadow: var(--mx-meet-shadow);
+}
+
+.mx-meet__shortcuts {
+  margin: 0;
+  padding: 8px var(--mx-meet-space) var(--mx-meet-space);
+}
+
+.mx-meet__shortcut {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  padding: 8px 0;
+  border-bottom: 1px solid var(--mx-meet-border);
+  font-size: 14px;
+}
+
+.mx-meet__shortcut:last-child {
+  border-bottom: none;
+}
+
+.mx-meet__shortcut dd {
+  margin: 0;
+}
+
+.mx-meet__kbd {
+  display: inline-block;
+  padding: 2px 8px;
+  border: 1px solid var(--mx-meet-border-strong);
+  border-radius: 6px;
+  background: var(--mx-meet-bg-subtle);
+  font-family: var(--mx-meet-font);
+  font-size: 12px;
+  white-space: nowrap;
+}
+
+.mx-meet__tile-actions--open {
+  opacity: 1;
+}
+
+.mx-meet__tile-hand {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 3px 8px;
+  border-radius: 999px;
+  background: var(--mx-meet-warning);
+  color: var(--mx-meet-text-on-accent);
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.mx-meet__tile-flag {
+  display: inline-flex;
+  margin-right: 4px;
+  color: var(--mx-meet-warning);
+}
+
+.mx-meet__signal {
+  display: inline-flex;
+  color: var(--mx-meet-stage-text-muted);
+  opacity: 0.7;
+}
+
+.mx-meet__signal--poor {
+  color: var(--mx-meet-warning);
+  opacity: 1;
+}
+
+.mx-meet__signal--lost {
+  color: var(--mx-meet-danger);
+  opacity: 1;
+}
+
+.mx-meet__panel .mx-meet__signal {
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__section {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.mx-meet__section-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.mx-meet__section-title {
+  margin: 0;
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--mx-meet-text-muted);
+}
+
+.mx-meet__queue {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  counter-reset: mx-meet-queue;
+}
+
+.mx-meet__bulk {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.mx-meet__chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  min-height: 32px;
+  padding: 0 12px;
+  border: 1px solid var(--mx-meet-border);
+  border-radius: 999px;
+  background: var(--mx-meet-bg-subtle);
+  color: var(--mx-meet-text);
+  font: inherit;
+  font-size: 13px;
+  cursor: pointer;
+  align-self: flex-start;
+}
+
+.mx-meet__chip:hover {
+  background: var(--mx-meet-bg-hover);
+}
+
+.mx-meet__chip:disabled {
+  cursor: progress;
+  opacity: 0.6;
+}
+
+.mx-meet__search {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 12px;
+  border: 1px solid var(--mx-meet-border);
+  border-radius: var(--mx-meet-radius-sm);
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__input--bare {
+  border: none;
+  padding-left: 0;
+  background: none;
+}
+
+.mx-meet__input--bare:focus-visible {
+  outline: none;
+}
+
+.mx-meet__you {
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__composer--chat {
+  flex-direction: column;
+  align-items: stretch;
+  margin-top: auto;
+  position: sticky;
+  bottom: 0;
+  background: var(--mx-meet-bg);
+  padding-top: 8px;
+}
+
+.mx-meet__composer-row {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.mx-meet__select--compact {
+  min-height: 36px;
+  padding: 6px 10px;
+  flex: 0 0 auto;
+}
+
+.mx-meet__chat-meta {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  font-size: 12px;
+  color: var(--mx-meet-text-muted);
+}
+
+.mx-meet__chat-meta strong {
+  color: var(--mx-meet-text);
+  font-size: 13px;
+}
+
+.mx-meet__chat-meta time {
+  margin-left: auto;
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__chat-private {
+  color: var(--mx-meet-warning);
+}
+
+.mx-meet__chat-text {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+.mx-meet__chat-line--private {
+  padding: 6px 8px;
+  border-radius: 8px;
+  background: var(--mx-meet-bg-subtle);
+}
+
+.mx-meet__chat-failed {
+  font-size: 12px;
+  color: var(--mx-meet-danger);
+}
+
+.mx-meet__chat-pending {
+  font-size: 12px;
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__meter {
+  height: 6px;
+  border-radius: 999px;
+  background: var(--mx-meet-bg-active);
+  overflow: hidden;
+}
+
+.mx-meet__meter span {
+  display: block;
+  height: 100%;
+  background: var(--mx-meet-speaking);
+  transition: width 80ms linear;
+}
+
+.mx-meet__meter--preview {
+  position: absolute;
+  left: 16px;
+  right: 16px;
+  bottom: 16px;
+  background: rgba(255, 255, 255, 0.18);
+}
+
+.mx-meet__preview {
+  position: relative;
+}
+
+.mx-meet__preview-note {
+  position: absolute;
+  left: 16px;
+  right: 16px;
+  top: 16px;
+  margin: 0;
+  padding: 8px 12px;
+  border-radius: var(--mx-meet-radius-sm);
+  background: var(--mx-meet-stage-label-bg);
+  color: var(--mx-meet-stage-text);
+  font-size: 13px;
+}
+
+.mx-meet__video--mirror {
+  transform: scaleX(-1);
+}
+
+.mx-meet__field-row {
+  display: flex;
+  align-items: flex-end;
+  gap: 8px;
+}
+
+.mx-meet__field-row .mx-meet__field {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+.mx-meet__field-row .mx-meet__chip {
+  min-height: 44px;
+  align-self: flex-end;
+}
+
+.mx-meet__hint {
+  display: block;
+  width: 100%;
+  margin-left: 26px;
+  font-size: 12px;
+  color: var(--mx-meet-text-faint);
+}
+
+.mx-meet__toggle:has(.mx-meet__hint) {
+  flex-wrap: wrap;
+  row-gap: 0;
+}
+
+.mx-meet__pills {
+  display: inline-flex;
+  gap: 4px;
+  padding: 3px;
+  border-radius: 999px;
+  background: var(--mx-meet-bg-subtle);
+  border: 1px solid var(--mx-meet-border);
+  align-self: flex-start;
+}
+
+.mx-meet__pill {
+  min-height: 32px;
+  padding: 0 14px;
+  border: none;
+  border-radius: 999px;
+  background: none;
+  color: var(--mx-meet-text-muted);
+  font: inherit;
+  font-size: 13px;
+  cursor: pointer;
+}
+
+.mx-meet__pill--on {
+  background: var(--mx-meet-bg-raised);
+  color: var(--mx-meet-text);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-matrx/meet",
-  "version": "0.7.2",
+  "version": "0.7.5",
   "description": "Enterprise, AI-native calls and meetings for Matrx clients: LiveKit Cloud rooms with server-minted tokens, instant ring/accept/decline, Zoom-grade meetings with durable links, lobby admission and guest join, host controls, Egress recording with enforced consent, live transcription and an AI note-taker on the platform agent system, and a drop-in polished React UI — signaling on @ai-matrx/realtime, invitations on @ai-matrx/messaging.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -60,12 +60,13 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
+    "@livekit/track-processors": "^0.8.1",
     "livekit-client": "^2.22.3",
-    "@ai-matrx/agents": "latest",
+    "@ai-matrx/messaging": "latest",
     "@ai-matrx/design-system": "latest",
     "@ai-matrx/kit": "latest",
-    "@ai-matrx/messaging": "latest",
-    "@ai-matrx/realtime": "latest"
+    "@ai-matrx/realtime": "latest",
+    "@ai-matrx/agents": "latest"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.5",