collavre 0.24.1 → 0.25.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '080f4e1eadfbbb142d360670a3477f3c19f191d586ea47200b95e6566b63d64d'
-  data.tar.gz: 593a65708b18711b54283e4390af4b7b39267a0e20f9a98b2d3df3c3aede0a5e
+  metadata.gz: 00f44cd56c80236b248b47bde12cca35c26346460fe25c08fdcdae1bf450a094
+  data.tar.gz: bb63d8a149d4c909d063dc0637b26f3e7085286bde007f0f824715686b1369b2
 SHA512:
-  metadata.gz: 57e481a2c4284f2f705cd363f7417c6803d47af951a8e37bea75ef45366142442aec2231f572b2e021319d85283fba78ce613ae96df4e536e16188a5873fe8f3
-  data.tar.gz: aefdf3ea1327707b3e230089d5fe8787b428b92ba86d80ba32d244037be9aad82f5c1f36de99ccff779ec323210a1394bfc076e623d99ff46c44645f9bfc8330
+  metadata.gz: a066d2fd153f990fbf3de581e3816a04f40c85d1ce13c50c61bc69820adac836440bfa17915b26278cf6ba503c0029c1f8ef19bce009784c59d626edb348a34c
+  data.tar.gz: eeab20564f238078d0ed3f3234a77e06cb3368844e49eb555b8106f4de32f58184343cf2f92d26d958f6fc7bcfdea137816bc66cb2e2fddbe2df2f69c7541b45

data/README.md

@@ -169,7 +169,6 @@ gem "rubyzip"
 | `Collavre::Comment` | Real-time chat messages within creatives |
 | `Collavre::Topic` | Conversation namespaces within creatives |
 | `Collavre::CreativeShare` | Permission grants for sharing creatives |
-| `Collavre::InboxItem` | User notifications |
 
 ## Permissions
 

data/app/assets/stylesheets/collavre/comments_popup.css

@@ -194,6 +194,9 @@ body.chat-fullscreen {
     color: var(--color-text);
     cursor: pointer;
     padding: 0;
+    width: var(--space-px-5);
+    height: var(--space-px-5);
+    flex: 0 0 var(--space-px-5);
     display: inline-flex;
     align-items: center;
     justify-content: center;
@@ -201,9 +204,16 @@ body.chat-fullscreen {
     line-height: 1;
 }
 
+.comments-popup-action > span {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+
 .comments-popup-action-icon {
-    width: 16px;
-    height: 16px;
+    display: block;
+    width: var(--space-px-3);
+    height: var(--space-px-3);
     fill: currentColor;
 }
 
@@ -1489,6 +1499,15 @@ body.chat-fullscreen {
     font-size: var(--text-00);
 }
 
+/* The avatar is also the release control for the topic's agent assignment. */
+.topic-agent-avatar-releasable {
+    cursor: pointer;
+}
+
+.topic-agent-avatar-releasable:hover {
+    opacity: 0.6;
+}
+
 .ai-agent-draggable {
     cursor: grab;
 }
@@ -1515,6 +1534,21 @@ body.chat-fullscreen {
     border-color: var(--color-secondary-active);
 }
 
+.topic-unread-badge {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 1.3em;
+    height: 1.3em;
+    padding: 0 0.35em;
+    border-radius: 999px;
+    background: var(--color-danger);
+    color: var(--color-badge-text);
+    font-size: 0.75em;
+    font-weight: bold;
+    line-height: 1;
+}
+
 .topic-tag.has-new-messages {
     position: relative;
     border-color: var(--color-active);
@@ -1700,9 +1734,33 @@ body.chat-fullscreen {
 .topic-archived-toggle:hover {
     opacity: 1;
 }
+/* Archived topics still receive messages. When the section is collapsed there is
+   no chip to badge, so the toggle carries the unread dot instead. */
+.topic-archived-toggle.has-new-messages {
+    position: relative;
+    opacity: 1;
+    border-color: var(--color-active);
+}
+.topic-archived-toggle.has-new-messages::after {
+    content: "";
+    position: absolute;
+    top: -3px;
+    right: -3px;
+    width: 7px;
+    height: 7px;
+    border-radius: 50%;
+    background-color: var(--color-danger);
+}
 .topic-tag.topic-archived {
     opacity: 0.5;
     font-style: italic;
+    cursor: pointer;
+}
+/* Archived topics are readable and selectable — the dimming marks them as
+   archived, it must not make the one you are reading illegible. */
+.topic-tag.topic-archived:hover,
+.topic-tag.topic-archived.active {
+    opacity: 1;
 }
 
 /* Topic list popup button (pinned right of the scrolling tab bar) */
@@ -1733,17 +1791,29 @@ body.chat-fullscreen {
     background: var(--color-section-bg);
     color: var(--color-text);
 }
+.topic-list-btn[aria-expanded="true"] {
+    background: var(--color-section-bg);
+    color: var(--color-text);
+}
 
 /* Archived entries inside the topic list popup */
 .topic-list-item {
-    display: inline-flex;
+    display: flex;
     align-items: center;
     gap: 0.3em;
+    width: 100%;
 }
 .topic-list-item--archived {
-    opacity: 0.5;
     font-style: italic;
 }
+.topic-list-item--archived > svg,
+.topic-list-item--archived > .topic-list-item-label {
+    opacity: 0.5;
+}
+.topic-list-item .topic-unread-badge {
+    flex-shrink: 0;
+    margin-left: auto;
+}
 .topic-branch-icon {
     font-size: 0.75em;
     opacity: 0.6;
@@ -1887,6 +1957,11 @@ body.chat-fullscreen {
   position: static;
 }
 
+/* Chevron icon shown while the docked chat is collapsed */
+.comments-popup-actions .popup-close-btn svg {
+  display: block;
+}
+
 /* Streaming indicator for AI comments */
 .comment-content.streaming {
     min-height: 1.5em;
@@ -1966,111 +2041,114 @@ li:hover .topic-create-option {
     text-decoration: underline;
 }
 
-/* ── Inline typo correction (volatile overlay; never serialized) ───────────── */
-/* The backdrop mirrors the textarea text exactly and paints <mark> spans over
-   it. The backdrop sits ON TOP of the textarea (higher z-index) but is
-   pointer-events:none, so clicks pass through to the textarea everywhere EXCEPT
-   over a <mark> (pointer-events:auto) — that's what makes the marks clickable.
-   If the textarea were on top, the browser would hit-test it first and the mark
-   click handlers would never fire. The backdrop's text is transparent, so the
-   textarea's real (opaque) glyphs show through and only the underlines paint. */
-.typo-input-wrap {
-    position: relative;
-    display: block;
+/* Empty chat state — feature discovery cards */
+#no-comments {
+    padding: 24px 16px;
 }
 
-.typo-input-wrap > textarea {
+.feature-cards-title {
+    margin: 0 0 12px;
+    color: var(--text-muted);
+    font-size: 0.9em;
+    text-align: center;
+}
+
+.feature-card-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
+    gap: 10px;
+    max-width: 560px;
+    margin: 0 auto;
+}
+
+.feature-card {
     position: relative;
-    background: transparent;
-    z-index: 0;
+    padding: 14px 12px;
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-2);
+    background: var(--surface-section);
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
 }
 
-.typo-backdrop {
+.feature-card-dismiss {
     position: absolute;
-    inset: 0;
-    overflow: hidden;
-    pointer-events: none;
-    z-index: 1;
+    top: 4px;
+    right: 6px;
+    border: none;
+    background: none;
+    color: var(--text-muted);
+    font-size: 1.1em;
+    line-height: 1;
+    cursor: pointer;
+    padding: 2px 4px;
+    border-radius: var(--radius-1);
 }
 
-.typo-highlights {
-    margin: 0;
-    color: transparent;
-    white-space: pre-wrap;
-    overflow-wrap: break-word;
-    word-break: break-word;
+.feature-card-dismiss:hover {
+    background: var(--surface-hover);
+    color: var(--text-primary);
 }
 
-/* Two states, distinguished by BOTH shape and colour (colour-blind safe). */
-.typo-mark {
-    background: transparent;
-    color: transparent;
-    pointer-events: auto;
-    cursor: pointer;
-    border-radius: 2px;
+.feature-card-icon {
+    font-size: 1.4em;
 }
 
-/* Auto-applied (>= threshold): faint straight underline — resolved, dim. */
-.typo-mark-applied {
-    text-decoration: underline solid var(--color-link);
-    text-decoration-thickness: 1px;
-    text-underline-offset: 2px;
-    opacity: 0.55;
+.feature-card-title {
+    font-weight: 600;
+    color: var(--text-primary);
 }
 
-/* Candidate (< threshold): wavy dotted amber underline — needs a decision. */
-.typo-mark-candidate {
-    text-decoration: underline wavy var(--color-warning);
-    text-decoration-thickness: 1px;
-    text-underline-offset: 2px;
+.feature-card-description {
+    margin: 0;
+    color: var(--text-muted);
+    font-size: 0.85em;
 }
 
-/* Creatable combobox reusing CommonPopup positioning. */
-.typo-popup {
-    position: absolute;
-    z-index: 100000;
-    min-width: 180px;
-    max-width: 320px;
-    background: var(--surface-section);
+.feature-card-action {
+    align-self: flex-start;
+    margin-top: 4px;
+    padding: 4px 10px;
     border: 1px solid var(--border-color);
-    border-radius: 8px;
-    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18);
-    padding: 6px;
+    border-radius: var(--radius-2);
+    background: var(--surface-btn);
+    color: var(--text-on-btn);
+    font-size: 0.85em;
+    cursor: pointer;
 }
 
-.typo-popup-input {
-    width: 100%;
-    box-sizing: border-box;
-    padding: 6px 8px;
-    border: 1px solid var(--border-color);
-    border-radius: 6px;
-    font: inherit;
-    margin-bottom: 6px;
+.feature-card-action:hover {
+    background: var(--surface-hover);
 }
 
-.typo-popup-list {
-    list-style: none;
-    margin: 0;
-    padding: 0;
-    max-height: 200px;
-    overflow-y: auto;
+.feature-card-guide-link {
+    font-size: 0.8em;
+    color: var(--text-muted);
+    text-decoration: underline;
 }
 
-.typo-popup-list .common-popup-item {
-    padding: 6px 8px;
-    border-radius: 6px;
-    cursor: pointer;
+.chat-empty-minimal {
     display: flex;
-    justify-content: space-between;
+    align-items: center;
+    justify-content: center;
     gap: 8px;
+    color: var(--text-muted);
 }
 
-.typo-popup-list .common-popup-item.active,
-.typo-popup-list .common-popup-item:hover {
-    background: var(--surface-hover);
+.chat-empty-restore-btn {
+    border: 1px solid var(--border-color);
+    background: var(--surface-btn);
+    color: var(--text-muted);
+    border-radius: var(--radius-round);
+    width: 20px;
+    height: 20px;
+    line-height: 1;
+    cursor: pointer;
+    font-size: 0.75em;
 }
 
-.typo-popup-role {
-    color: var(--text-muted);
-    font-size: 0.85em;
+.chat-empty-restore-btn:hover {
+    background: var(--surface-hover);
+    color: var(--text-primary);
 }