clay-server 2.19.0 → 2.20.0-beta.2

package/lib/public/css/icon-strip.css

@@ -830,13 +830,17 @@
   border: 1px solid var(--border);
   border-radius: 12px;
   padding: 8px;
-  width: 220px;
+  width: 300px;
+  max-height: 70vh;
+  overflow-y: auto;
   box-shadow: 0 8px 24px rgba(var(--shadow-rgb), 0.5);
   z-index: 10001;
   animation: ctxMenuAppear 0.15s ease-out;
   display: flex;
   flex-direction: column;
   gap: 4px;
+  scrollbar-width: thin;
+  scrollbar-color: var(--border) transparent;
 }
 
 .dm-user-picker-search {
@@ -861,11 +865,27 @@
 }
 
 .dm-user-picker-list {
-  max-height: 200px;
+  overflow: visible;
+}
+
+.dm-user-picker-list.dm-mates-list {
+  max-height: 336px;  /* ~7 items at ~48px each */
   overflow-y: auto;
   overflow-x: hidden;
   scrollbar-width: thin;
   scrollbar-color: var(--border) transparent;
+  mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
+  -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
+}
+
+.dm-user-picker-list.dm-mates-list.scrolled-bottom {
+  mask-image: linear-gradient(to bottom, transparent 0%, black 35%);
+  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 35%);
+}
+
+.dm-user-picker-list.dm-mates-list.no-overflow {
+  mask-image: none;
+  -webkit-mask-image: none;
 }
 
 .dm-user-picker-list::-webkit-scrollbar {
@@ -919,6 +939,39 @@
   text-align: center;
 }
 
+.dm-picker-fav-btn,
+.dm-picker-del-btn {
+  flex-shrink: 0;
+  border: none;
+  background: none;
+  cursor: pointer;
+  padding: 4px;
+  border-radius: 4px;
+  display: flex;
+  align-items: center;
+  opacity: 0.5;
+  transition: opacity 0.15s, color 0.15s;
+}
+
+.dm-picker-fav-btn:hover,
+.dm-picker-del-btn:hover {
+  opacity: 1;
+}
+
+.dm-picker-del-btn:hover {
+  color: var(--danger, #e74c3c) !important;
+}
+
+.dm-picker-fav-btn svg,
+.dm-picker-del-btn svg {
+  width: 16px;
+  height: 16px;
+}
+
+.dm-picker-fav .dm-picker-fav-btn {
+  opacity: 1;
+}
+
 /* --- Worktree folder groups --- */
 .icon-strip-group {
   display: flex;

package/lib/public/css/input.css

@@ -340,7 +340,8 @@
 }
 
 #attach-file-btn,
-#attach-image-btn {
+#attach-image-btn,
+#schedule-btn {
   width: 36px;
   height: 36px;
   border-radius: 50%;
@@ -356,10 +357,12 @@
 }
 
 #attach-file-btn .lucide,
-#attach-image-btn .lucide { width: 20px; height: 20px; }
+#attach-image-btn .lucide,
+#schedule-btn .lucide { width: 20px; height: 20px; flex-shrink: 0; }
 
 #attach-file-btn:hover,
-#attach-image-btn:hover { background: rgba(var(--overlay-rgb), 0.06); color: var(--text); }
+#attach-image-btn:hover,
+#schedule-btn:hover { background: rgba(var(--overlay-rgb), 0.06); color: var(--text); }
 
 #send-btn {
   flex-shrink: 0;
@@ -668,52 +671,69 @@
 }
 
 /* ==========================================================================
-   Rate Limit Schedule Mode
+   Message Scheduling
    ========================================================================== */
 
-/* Input area styling when rate limited */
-#input-row.input-rate-limited {
-  border-color: var(--warning, #d97706);
-  box-shadow: 0 0 0 1px color-mix(in srgb, var(--warning, #d97706) 20%, transparent);
+/* Schedule button — inline expand (like STT pill) */
+#schedule-btn {
+  transition: width 0.2s ease, border-radius 0.2s ease, background 0.15s, color 0.15s, padding 0.2s ease;
+  overflow: hidden;
+  white-space: nowrap;
+  gap: 6px;
+  position: relative;
 }
 
-#input-row.input-rate-limited:focus-within {
-  border-color: var(--warning, #d97706);
-  box-shadow: 0 0 0 1px color-mix(in srgb, var(--warning, #d97706) 30%, transparent);
+#schedule-btn.schedule-expanded {
+  width: auto;
+  padding: 0 10px 0 8px;
+  border-radius: 18px;
 }
 
-/* Scheduled message bubble in chat */
-.scheduled-msg-wrap {
-  display: flex;
-  justify-content: flex-end;
-  padding: 4px 16px;
+#schedule-btn.schedule-active {
+  color: var(--accent);
+  background: var(--accent-bg, rgba(99,102,241,0.15));
+}
+
+.schedule-inline-input {
+  width: 48px;
+  padding: 2px 4px;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--bg);
+  color: var(--text);
+  font-size: 12px;
+  text-align: center;
+  outline: none;
+}
+.schedule-inline-input:focus {
+  border-color: var(--accent);
 }
 
-.scheduled-msg-bubble {
-  max-width: 75%;
-  padding: 10px 14px;
-  border-radius: 12px;
-  background: color-mix(in srgb, var(--warning, #d97706) 8%, var(--bg-alt));
-  border: 1px dashed color-mix(in srgb, var(--warning, #d97706) 40%, transparent);
+.schedule-delay-label {
+  font-size: 12px;
+  font-weight: 600;
+  color: inherit;
 }
 
-.scheduled-msg-text {
-  font-size: 14px;
-  color: var(--text);
-  line-height: 1.5;
-  white-space: pre-wrap;
-  word-break: break-word;
+/* Scheduled message bubble: accent-tinted user bubble */
+.scheduled-msg-wrap .bubble {
+  background: color-mix(in srgb, var(--accent) 18%, var(--user-bubble, var(--bg-alt)));
+  border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent);
 }
 
+.scheduled-msg-wrap .msg-user-rewind-btn,
+.scheduled-msg-wrap .msg-actions { display: none !important; }
+
 .scheduled-msg-meta {
   display: flex;
   align-items: center;
   gap: 6px;
-  margin-top: 8px;
+  padding-right: 4px;
   font-size: 12px;
-  color: var(--warning, #d97706);
+  color: var(--accent);
 }
 
+.scheduled-msg-icon svg,
 .scheduled-msg-icon .lucide {
   width: 14px;
   height: 14px;

package/lib/public/css/mates.css

@@ -22,7 +22,7 @@
 }
 
 .title-bar-content.mate-dm-active .status,
-.title-bar-content.mate-dm-active .status * {
+.title-bar-content.mate-dm-active .status *:not(.rate-limit-popover) {
   color: rgba(255, 255, 255, 0.85) !important;
 }
 
@@ -966,6 +966,7 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 
 /* Sidebar file list */
 #mate-sidebar-knowledge.hidden,
+#mate-sidebar-memory.hidden,
 #mate-sidebar-conversations.hidden {
   display: none;
 }
@@ -1139,6 +1140,312 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
   color: var(--text-dimmer);
 }
 
+/* --- Memory panel --- */
+/* Memory viewer */
+@media (min-width: 1024px) {
+  #mate-memory-viewer {
+    width: 50%;
+    max-width: 720px;
+    min-width: 360px;
+    border-left: 1px solid var(--border-subtle);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    flex-shrink: 0;
+  }
+  #mate-memory-viewer.hidden { display: none; }
+}
+@media (max-width: 1023px) {
+  #mate-memory-viewer {
+    position: fixed;
+    inset: 0;
+    background: var(--bg);
+    z-index: 1100;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+  #mate-memory-viewer.hidden { display: none; }
+}
+.mate-memory-viewer-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 12px;
+  border-bottom: none;
+  flex-shrink: 0;
+  min-height: 44px;
+}
+.mate-memory-danger-btn:hover {
+  color: var(--error, #ff5555) !important;
+}
+
+/* Tabs */
+.mate-memory-viewer-tabs {
+  display: flex;
+  gap: 0;
+  padding: 0 12px;
+  border-bottom: 1px solid var(--border-subtle);
+  flex-shrink: 0;
+}
+.mate-memory-tab {
+  padding: 8px 16px;
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--text-dimmer);
+  background: none;
+  border: none;
+  border-bottom: 2px solid transparent;
+  cursor: pointer;
+  transition: color 0.15s, border-color 0.15s;
+}
+.mate-memory-tab:hover {
+  color: var(--text-secondary);
+}
+.mate-memory-tab.active {
+  color: var(--text);
+  border-bottom-color: var(--accent, #6c5ce7);
+  font-weight: 600;
+}
+
+/* Tab bodies */
+.mate-memory-tab-body {
+  flex: 1;
+  overflow-y: auto;
+  padding: 16px;
+}
+.mate-memory-tab-body.hidden {
+  display: none;
+}
+
+/* Summary tab */
+#mate-memory-summary-content h1 {
+  font-size: 18px;
+  font-weight: 700;
+  margin: 0 0 12px;
+  color: var(--text);
+}
+#mate-memory-summary-content h2 {
+  font-size: 14px;
+  font-weight: 600;
+  margin: 16px 0 8px;
+  color: var(--text);
+}
+#mate-memory-summary-content ul {
+  margin: 0 0 8px;
+  padding-left: 20px;
+}
+#mate-memory-summary-content li {
+  font-size: 13px;
+  color: var(--text-secondary);
+  line-height: 1.6;
+  margin-bottom: 2px;
+}
+
+/* Digest list */
+.mate-memory-digest-list {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.mate-memory-digest-list.hidden {
+  display: none;
+}
+.mate-memory-item {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding: 10px 12px;
+  border-radius: 8px;
+  cursor: pointer;
+  transition: background 0.12s;
+}
+.mate-memory-item:hover {
+  background: rgba(var(--overlay-rgb), 0.05);
+}
+.mate-memory-item-top {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+.mate-memory-date {
+  font-size: 11px;
+  color: var(--text-dimmer);
+}
+.mate-memory-type-badge {
+  font-size: 9px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  padding: 1px 5px;
+  border-radius: 3px;
+  background: rgba(var(--overlay-rgb), 0.08);
+  color: var(--text-dimmer);
+}
+.mate-memory-tag {
+  font-size: 9px;
+  padding: 1px 5px;
+  border-radius: 3px;
+  background: rgba(var(--accent-rgb, 108, 92, 231), 0.1);
+  color: var(--accent, #6c5ce7);
+}
+.mate-memory-delete-btn {
+  margin-left: auto;
+  background: none;
+  border: none;
+  color: var(--text-dimmer);
+  cursor: pointer;
+  padding: 2px;
+  display: none;
+  align-items: center;
+}
+.mate-memory-delete-btn svg { width: 13px; height: 13px; }
+.mate-memory-item:hover .mate-memory-delete-btn { display: flex; }
+.mate-memory-delete-btn:hover { color: var(--error, #ff5555); }
+.mate-memory-topic {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--text);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.mate-memory-position {
+  font-size: 12px;
+  color: var(--text-secondary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.mate-memory-empty {
+  padding: 24px 12px;
+  text-align: center;
+  font-size: 13px;
+  color: var(--text-dimmer);
+  line-height: 1.6;
+}
+
+/* Digest detail view */
+.mate-memory-digest-detail {
+  display: flex;
+  flex-direction: column;
+}
+.mate-memory-digest-detail.hidden {
+  display: none;
+}
+.mate-memory-detail-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding-bottom: 12px;
+  margin-bottom: 12px;
+  border-bottom: 1px solid var(--border-subtle);
+}
+.mate-memory-detail-back {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  background: none;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  font-size: 13px;
+  padding: 4px 8px;
+  border-radius: 6px;
+  transition: background 0.12s;
+}
+.mate-memory-detail-back:hover {
+  background: rgba(var(--overlay-rgb), 0.06);
+  color: var(--text);
+}
+.mate-memory-detail-back svg { width: 14px; height: 14px; }
+.mate-memory-detail-delete {
+  background: none;
+  border: none;
+  color: var(--text-dimmer);
+  cursor: pointer;
+  padding: 4px;
+  display: flex;
+  align-items: center;
+}
+.mate-memory-detail-delete svg { width: 15px; height: 15px; }
+.mate-memory-detail-body {
+  padding: 0 4px;
+}
+
+/* Memory detail fields */
+.mate-memory-detail {
+  margin-bottom: 16px;
+}
+.mate-memory-detail-label {
+  font-size: 10px;
+  text-transform: uppercase;
+  letter-spacing: 0.8px;
+  color: var(--text-dimmer);
+  margin-bottom: 4px;
+  font-weight: 600;
+}
+.mate-memory-detail-value {
+  font-size: 14px;
+  color: var(--text);
+  line-height: 1.5;
+  white-space: pre-wrap;
+}
+
+/* Memory delete confirmation */
+.mate-memory-confirm-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0,0,0,0.5);
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.mate-memory-confirm-dialog {
+  background: var(--bg);
+  border: 1px solid var(--border-subtle);
+  border-radius: 10px;
+  padding: 20px 24px;
+  min-width: 260px;
+  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
+}
+.mate-memory-confirm-msg {
+  font-size: 14px;
+  color: var(--text);
+  margin-bottom: 16px;
+  text-align: center;
+}
+.mate-memory-confirm-actions {
+  display: flex;
+  gap: 8px;
+  justify-content: flex-end;
+}
+.mate-memory-confirm-cancel {
+  padding: 6px 16px;
+  border-radius: 6px;
+  border: 1px solid var(--border-subtle);
+  background: none;
+  color: var(--text);
+  cursor: pointer;
+  font-size: 13px;
+}
+.mate-memory-confirm-cancel:hover {
+  background: rgba(var(--overlay-rgb), 0.06);
+}
+.mate-memory-confirm-delete {
+  padding: 6px 16px;
+  border-radius: 6px;
+  border: none;
+  background: var(--error, #ff5555);
+  color: #fff;
+  cursor: pointer;
+  font-size: 13px;
+  font-weight: 600;
+}
+.mate-memory-confirm-delete:hover {
+  opacity: 0.85;
+}
+
 /* Active file name in editor toolbar */
 .mate-knowledge-active-name {
   font-size: 14px;
@@ -1633,6 +1940,7 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 /* Match panel header heights to sidebar header (48px) */
 body.mate-dm-active .mate-knowledge-header-bar,
 body.mate-dm-active .mate-knowledge-viewer-header,
+body.mate-dm-active .mate-memory-viewer-header,
 body.mate-dm-active .scheduler-top-bar,
 body.mate-dm-active .notes-archive-header {
   height: 48px;
@@ -2130,11 +2438,17 @@ body.mate-dm-active .context-overflow-msg,
 body.mate-dm-active .sys-msg {
   display: none;
 }
-body.mate-dm-active .activity-inline:not(.mention-activity-bar) {
+body.mate-dm-active .activity-inline:not(.mention-activity-bar):not(.mate-pre-activity):not(.mate-thinking-activity) {
   padding-left: 60px;
   margin-left: 0;
   margin-right: 0;
 }
+.mate-thinking > .dm-bubble-content > .mate-thinking-activity,
+.mate-thinking > .dm-bubble-content > .mate-pre-activity {
+  margin: 4px 0 0;
+  padding: 0;
+  max-width: none;
+}
 
 /* ==========================================================================
    Mobile Mate DM Title Bar

package/lib/public/css/mention.css

@@ -163,6 +163,29 @@
   color: var(--mention-color, #6c5ce7);
 }
 
+.mention-stop-btn {
+  margin-left: auto;
+  background: none;
+  border: 1px solid var(--border, #333);
+  border-radius: 4px;
+  color: var(--text-secondary, #aaa);
+  cursor: pointer;
+  padding: 2px 6px;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 12px;
+  transition: color 0.15s, border-color 0.15s;
+}
+.mention-stop-btn:hover {
+  color: var(--danger, #e74c3c);
+  border-color: var(--danger, #e74c3c);
+}
+.mention-stop-btn svg {
+  width: 12px;
+  height: 12px;
+}
+
 .mention-content {
   font-size: 15px;
   line-height: 1.7;