@ai-ecoverse/slicc-spectrum 2.10.0 → 2.11.0

package/dist/slicc-ui.js

@@ -54352,7 +54352,8 @@ function elapsed(ms) {
   return `${Math.floor(seconds / 60)}:${String(seconds % 60).padStart(2, "0")}`;
 }
 function liveLine(item2, now) {
-  return [item2.label, item2.what, item2.asker, elapsed(now - item2.since)].filter(Boolean).join(" \xB7 ");
+  const tail2 = item2.endedAt != null ? "Ended" : elapsed(now - item2.since);
+  return [item2.label, item2.what, item2.asker, tail2].filter(Boolean).join(" \xB7 ");
 }
 var SliccLive = class extends ModelElement {
   static properties = {
@@ -54393,6 +54394,9 @@ var SliccLive = class extends ModelElement {
       border-radius: 50%;
       background: var(--swc-negative-visual-color);
     }
+    .chip[data-ended] .dot {
+      background: var(--swc-neutral-visual-color);
+    }
     .text {
       flex: 0 1 auto;
       min-width: 0;
@@ -54426,6 +54430,9 @@ var SliccLive = class extends ModelElement {
   #items() {
     return this.model?.live?.items() ?? [];
   }
+  #live() {
+    return this.#items().some((item2) => item2.endedAt == null);
+  }
   #tick(on2) {
     if (on2 && !this.#timer) this.#timer = setInterval(() => this.now = Date.now(), 1e3);
     if (!on2 && this.#timer) {
@@ -54435,13 +54442,17 @@ var SliccLive = class extends ModelElement {
   }
   updated(changed2) {
     super.updated(changed2);
-    this.#tick(this.isConnected && this.#items().length > 0);
+    this.#tick(this.isConnected && this.#live());
   }
   #chip(item2) {
-    const rest = liveLine({ ...item2, label: "" }, this.now);
-    return b`<div class="chip" role="listitem" data-id=${item2.id} data-kind=${item2.kind}>
+    const ended3 = item2.endedAt != null;
+    const rest = [item2.what, item2.asker].filter(Boolean).join(" \xB7 ");
+    const stamp = ended3 ? null : elapsed(this.now - item2.since);
+    return b`<div class="chip" role="listitem" data-id=${item2.id} data-kind=${item2.kind} ?data-ended=${ended3}>
       <span class="dot" aria-hidden="true"></span>
-      <span class="text" title=${liveLine(item2, this.now)}><span class="label">${item2.label}</span><span class="detail"> · ${rest}</span></span>
+      <span class="text" title=${liveLine(item2, this.now)}
+        ><span class="label">${item2.label}</span>${rest ? b`<span class="detail"> · ${rest}</span>` : A}${ended3 ? b`<span class="ended"> · Ended</span>` : b`<span class="detail"> · ${stamp}</span>`}</span
+      >
       <swc-action-button size="s" quiet data-action="live-act" accessible-label=${`${item2.action.label}: ${item2.label}`} @click=${() => this.model?.live?.act(item2.id)}>${item2.action.label}</swc-action-button>
     </div>`;
   }