@design.estate/dees-catalog 11.2.1 → 11.2.2

package/dist_bundle/bundle.js

@@ -172418,9 +172418,13 @@ var _DeesHarnessToolCard = class _DeesHarnessToolCard extends (_a89 = DeesElemen
     if (typeof collapseWhenFinished === "function") return collapseWhenFinished(this.enrichedCall);
     return collapseWhenFinished ?? false;
   }
-  /** Outcome line shown only while collapsed; the subtitle already carries the request. */
-  get collapsedSummary() {
-    if (this.isOpen || !this.descriptor.summary) return "";
+  /**
+   * Outcome line that stands in for the body while collapsed; the subtitle already carries the
+   * request. Derived from the settled call alone, not from the disclosure state, so the text stays
+   * put while the line animates open or closed instead of appearing and vanishing mid-transition.
+   */
+  get resultSummary() {
+    if (!this.descriptor.summary) return "";
     if (this.call.status !== "completed" && this.call.status !== "stopped") return "";
     return this.descriptor.summary(this.enrichedCall).trim();
   }
@@ -172447,7 +172451,7 @@ ${derivedSubtitle}` : subtitle;
     const effectiveStatus = harnessEffectiveToolStatus(call);
     const statusTone = effectiveStatus === "completed" ? "success" : effectiveStatus === "stopped" ? "warning" : effectiveStatus;
     const duration = harnessFormatDuration(call.startedAt, call.finishedAt);
-    const collapsedSummary = this.collapsedSummary;
+    const resultSummary = this.resultSummary;
     return b2`
       <div class="harness-card status-${effectiveStatus} ${descriptor.destructive ? "destructive" : ""} ${this.hasSubtaskPreview ? "subtaskPreviewCard" : ""} ${this.hasSubtaskPreview && open ? "subtaskPreviewOpen" : ""} ${this.returnFlash ? "returnFlash" : ""} ${this.outcomeScanTone ? `outcomeScan outcomeScan-${this.outcomeScanTone}` : ""}"
         @mouseenter=${this.cancelTerminalTailReturn}
@@ -172473,7 +172477,16 @@ ${derivedSubtitle}` : subtitle;
               ${this.renderMcpBadges(call)}
             </span>
             ${subtitle ? b2`<dees-harness-overflow-text class="subtitle" title=${subtitleTooltip}>${subtitle}</dees-harness-overflow-text>` : ""}
-            ${collapsedSummary ? b2`<dees-harness-overflow-text class="resultSummary" title=${collapsedSummary}>${collapsedSummary}</dees-harness-overflow-text>` : ""}
+            ${resultSummary ? b2`
+                  <span class="summaryDisclosure" aria-hidden=${open ? "true" : "false"}>
+                    <span class="summaryDisclosureInner">
+                      <dees-harness-overflow-text
+                        class="resultSummary"
+                        title=${resultSummary}
+                      >${resultSummary}</dees-harness-overflow-text>
+                    </span>
+                  </span>
+                ` : ""}
           </span>
           <span class="metaColumn">
             ${call.startedAt ? b2`<span class="duration">${harnessFormatClockTime(call.startedAt)}</span>` : ""}
@@ -172927,20 +172940,31 @@ __publicField(_DeesHarnessToolCard, "styles", [
       :host {
         display: block;
         container-type: inline-size;
-        margin-inline: auto;
         max-width: 100%;
         font-family: var(--dees-font-family);
-        transition: max-width var(--dees-transition-default) var(--dees-ease-standard);
       }
 
       /*
-       * A collapsed card may be held to a narrower measure than its row. The host — not the inner
-       * surface — carries the constraint so the card's own inline-size container keeps measuring
-       * what is actually rendered. The width comes from the context the card sits in: a transcript
-       * row that holds this card alone sets it, a multi-card grid cell leaves it unset, and a
-       * direct host falls back to the full row.
+       * A collapsed card may be held to a narrower measure than its row. The constraint lives on
+       * the card surface rather than the host for two reasons: the surface is its own inline-size
+       * container, so the header's container queries measure what is actually rendered, and a host
+       * cannot transition its own width. The shared default stylesheet applies a universal
+       * transition of background and color to every element; from the parent's tree that rule
+       * targets this host and outranks any host-scoped rule, so a width transition declared on the
+       * host is silently dropped and the card snaps instead of interpolating.
+       *
+       * The width comes from the context the card sits in: a transcript row of terminal and
+       * file-write cards sets it, side-by-side grids leave it unset, and a direct host falls back
+       * to the full row.
        */
-      :host([data-collapsed]) {
+      .harness-card {
+        max-width: 100%;
+        margin-inline: auto;
+        container-type: inline-size;
+        transition: max-width var(--dees-transition-default) var(--dees-ease-standard);
+      }
+
+      :host([data-collapsed]) .harness-card {
         max-width: var(--dees-harness-collapsed-tool-width, 100%);
       }
 
@@ -173093,7 +173117,31 @@ __publicField(_DeesHarnessToolCard, "styles", [
         font-size: 12px;
       }
 
-      /* Stands in for the body while a finished card is collapsed. */
+      /*
+       * Stands in for the body while a finished card is collapsed. It opens and closes on the same
+       * timing as the body and the width, so the header never steps by a line at the instant of a
+       * toggle; the node stays mounted and is hidden from assistive technology while open.
+       */
+      .summaryDisclosure {
+        display: grid;
+        grid-template-rows: 1fr;
+        min-height: 0;
+        opacity: 1;
+        transition:
+          grid-template-rows var(--dees-transition-default) var(--dees-ease-standard),
+          opacity var(--dees-transition-fast) var(--dees-ease-standard);
+      }
+
+      .summaryDisclosure[aria-hidden='true'] {
+        grid-template-rows: 0fr;
+        opacity: 0;
+      }
+
+      .summaryDisclosureInner {
+        min-height: 0;
+        overflow: hidden;
+      }
+
       .resultSummary {
         display: block;
         margin-top: 2px;
@@ -173486,7 +173534,10 @@ __publicField(_DeesHarnessToolCard, "styles", [
       }
 
       @media (prefers-reduced-motion: reduce) {
-        .bodyDisclosure {
+        /* The disclosure moves as one piece, so all three parts of it stop together. */
+        .bodyDisclosure,
+        .harness-card,
+        .summaryDisclosure {
           transition: none;
         }
 
@@ -223844,7 +223895,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "11.2.1",
+  version: "11.2.2",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };