@aparte/core 0.16.0 → 0.16.1

package/dist/index.css

@@ -4454,6 +4454,15 @@ aparte-chat-viewport.aparte-viewport--framework::-webkit-scrollbar-thumb {
    so it can't collide with the framework's children). */
 aparte-chat-viewport.aparte-viewport--framework,
 aparte-chat-viewport[framework-managed] {
+  /* The base rule gives this element `width: 100%`, and core ships no global
+     border-box reset — every `box-sizing` in these sheets is per-element, on purpose.
+     So the padding below was ADDED to 100% and the host overflowed its own chat by
+     32px, which `aparte-chat`'s `overflow: hidden` then clipped: measured on a 1500px
+     chat, the host was 1532 wide and hung 32px past the end edge. An app with its own
+     `* { box-sizing: border-box }` never saw it, which is exactly why it survived —
+     every example in this repo has one. The composer cannot share a column with a
+     transcript that is off-centre, so it is fixed here rather than compensated there. */
+  box-sizing: border-box;
   overflow-y: auto;
   overflow-x: hidden;
   overscroll-behavior: contain;
@@ -5259,6 +5268,34 @@ aparte-composer {
   display: block;
   /* Container-query root — see aparte-chat-viewport. */
   container-type: inline-size;
+  /* The transcript's own inline gutter, read from the token that produces it.
+     `.aparte-composer-shell` and `.aparte-message` both cap at
+     `--aparte-message-max-width` and centre with `margin: 0 auto`, so on a container
+     WIDER than the cap they lined up by construction. Below it the cap stops applying,
+     each becomes 100% of its own parent — and this element had no padding, so the
+     composer went flush to the chat's edges while the transcript kept its inset.
+     Measured at a 512px chat: message column 26/26, composer 0/0. Every chat narrower
+     than 800px was hit — a phone, an embedded widget, either pane of `<aparte-split>`,
+     an app shell whose docked sidebar leaves the chat narrow on a wide window.
+
+     INLINE ONLY, and that is not shorthand-avoidance: the block axis is already spaced
+     deliberately, 16px above from the viewport and 16px below from
+     `--aparte-chat-bottom-gap` (shell.css), which were tuned to match. The `padding`
+     shorthand would add a second 16px to each.
+
+     No 520px step to follow the transcript's, and it is not an oversight: a container
+     query cannot match its own container, and this element IS one (the line above).
+     Nothing above it is a container either, and `aparte-chat` may never become one —
+     it would then be the containing block of the `position: fixed` select dropdown
+     that exists to escape `overflow: hidden` (select.css, and the same warning in
+     split.css). So below 520px the transcript tightens to 8px and this stays at 16.
+     A flat 16 was measured against a step: the step wins for vanilla at phone width
+     and LOSES for framework-managed, which is the majority path, because the
+     transcript's own step targets a class framework mode never builds. Flat is a
+     uniform 10px worst case in both modes — which is the scrollbar gutter the
+     transcript reserves and the composer cannot, and which is 0 on the overlay
+     scrollbars every phone has. */
+  padding-inline: var(--aparte-viewport-padding);
 }
 
 aparte-composer-input {
@@ -5593,7 +5630,16 @@ aparte-composer-cancel .aparte-cc-button:hover {
    reply text beside it for attention it did not deserve. */
 .aparte-tool-summary {
     display: flex; align-items: center; gap: var(--aparte-space-4);
-    padding: var(--aparte-space-2) var(--aparte-space-3); margin-inline-start: calc(var(--aparte-space-3) * -1);
+    /* The negative margin is what puts the row's CONTENT on the message column rather
+       than one padding in from it — the padding here is the hover surface, not the
+       column. So it has to be given back on BOTH sides. It used to be
+       `margin-inline-start` alone: the name, the icon and the chevron landed on the
+       column, and the trailing state stopped `--aparte-space-3` short of the right edge
+       every line of prose reaches. Measured at a 512px chat: text L26/R26, the state's
+       right edge at R32 — six pixels, on the one line of a turn whose whole job is to
+       read as a quiet aside beside the text. `margin-inline` puts it at R26 and makes
+       the hover surface symmetric with it. */
+    padding: var(--aparte-space-2) var(--aparte-space-3); margin-inline: calc(var(--aparte-space-3) * -1);
     border-radius: var(--aparte-tool-row-radius);
     cursor: pointer; list-style: none;
 }
@@ -6807,7 +6853,7 @@ aparte-sidebar,
  *           <aparte-composer>
  *             <div class="aparte-composer-shell">
  *               <div class="aparte-composer-row">
- *                 <aparte-composer-input style="flex: 1"></aparte-composer-input>
+ *                 <aparte-composer-input></aparte-composer-input>
  *                 <aparte-composer-send></aparte-composer-send>
  *               </div>
  *             </div>
@@ -7295,6 +7341,26 @@ aparte-split[disabled] > .aparte-split__handle:hover {
   overflow-y: auto;
 }
 
+/* A fenced block that came through MARKDOWN, not through the `code` segment.
+   `@aparte/plugin-marked` renders ``` as a bare <pre><code>, and the recipe below is
+   scoped to `.aparte-code-content-wrapper` — a class only the code SEGMENT renderer
+   emits, which marked cannot produce. So a markdown block matched no `pre` rule at all
+   and kept the UA's `white-space: pre`: it never wrapped, laid out at its own intrinsic
+   width, and `aparte-chat-bubble`'s `overflow: hidden` amputated the tail. No scrollbar,
+   no ellipsis — the code was simply gone. Measured on the vanilla example: one block's
+   `scrollWidth` was a CONSTANT 963px at chat widths 1500, 800, 600, 512 and 380, against
+   client widths 776 / 724 / 524 / 460 / 328. It overflowed even at 1500.
+
+   Only the two wrapping declarations are shared, not the surface: the padding and the
+   background below are the code CARD's, and a markdown block has no card. Giving it one
+   is a look decision, not this fix. */
+.aparte-content pre,
+.aparte-segment-content pre,
+.aparte-thinking-content pre {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
 .aparte-code-content-wrapper pre {
   margin: 0;
   padding: var(--aparte-space-6);

package/dist/index.js

@@ -3290,9 +3290,10 @@ class AparteChatViewport extends HTMLElement {
     const now = performance.now();
     const settlingOurs = drop <= churn + 2 && now - this._ownScrollAt < this._ownScrollWindowMs && now - this._readerInputAt >= this._ownScrollWindowMs;
     const readerWentUp = drop > 1 && !settlingOurs;
+    const readerHandOnIt = drop > 1 && now - this._readerInputAt < this._ownScrollWindowMs;
     this._lastScrollTop = top;
     this._lastScrollHeight = height;
-    if (this._isAtBottom()) {
+    if (this._isAtBottom() && !readerHandOnIt) {
       this._isAutoScrollEnabled = true;
     } else if (readerWentUp) {
       this._isAutoScrollEnabled = false;