@qfei-design/make-ai-assistant 0.2.5 → 0.2.6

package/dist/styles.css

@@ -18,7 +18,9 @@
   --make-ai-internal-on-overlay: var(--make-ai-theme-on-overlay, var(--make-ai-on-overlay, #fcfcff));
   --make-ai-internal-overlay-shadow: color-mix(in srgb, var(--make-ai-internal-accent) 18%, transparent);
   --make-ai-internal-highlight: color-mix(in srgb, var(--make-ai-internal-bg) 58%, transparent);
-  --make-ai-internal-drawer-width: var(--make-ai-drawer-width, 432px);
+  --make-ai-internal-drawer-min-width: var(--make-ai-drawer-width, 432px);
+  --make-ai-internal-drawer-width: var(--make-ai-internal-drawer-min-width);
+  --make-ai-internal-drawer-max-width: max(var(--make-ai-internal-drawer-min-width), min(1024px, 72vw));
   --make-ai-internal-drawer-resize-line: var(--make-ai-drawer-resize-line, var(--make-ai-internal-accent));
   --make-ai-internal-z-index: var(--make-ai-z-index, 1050);
   --make-ai-internal-font-size-body: var(--make-ai-font-size-body, .75rem);
@@ -171,7 +173,11 @@
   position: fixed;
   right: 0;
   top: 0;
-  width: min(var(--make-ai-internal-drawer-width), 100vw);
+  width: min(
+    var(--make-ai-internal-drawer-width),
+    var(--make-ai-internal-drawer-max-width),
+    100vw
+  );
   z-index: var(--make-ai-internal-z-index);
   animation: make-ai-drawer-in 180ms cubic-bezier(.2, .75, .35, 1);
 }
@@ -640,8 +646,9 @@
   font-size: var(--make-ai-internal-font-size-markdown);
   gap: 10px;
   line-height: 1.7;
-  max-width: min(100%, 66ch);
+  max-width: 100%;
   white-space: normal;
+  width: 100%;
 }
 
 .make-ai-assistant__assistant-text p,
@@ -745,6 +752,29 @@
   max-width: 100%;
   overflow-x: auto;
   overscroll-behavior-inline: contain;
+  scrollbar-color: color-mix(in srgb, var(--make-ai-internal-accent) 46%, var(--make-ai-internal-border)) transparent;
+  scrollbar-width: thin;
+}
+
+.make-ai-assistant__markdown-table-scroll::-webkit-scrollbar {
+  height: 6px;
+  width: 6px;
+}
+
+.make-ai-assistant__markdown-table-scroll::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.make-ai-assistant__markdown-table-scroll::-webkit-scrollbar-thumb {
+  background: color-mix(in srgb, var(--make-ai-internal-accent) 46%, var(--make-ai-internal-border));
+  background-clip: padding-box;
+  border: 1px solid transparent;
+  border-radius: 999px;
+}
+
+.make-ai-assistant__markdown-table-scroll:hover::-webkit-scrollbar-thumb,
+.make-ai-assistant__markdown-table-scroll:focus-within::-webkit-scrollbar-thumb {
+  background: color-mix(in srgb, var(--make-ai-internal-accent) 64%, var(--make-ai-internal-border));
 }
 
 .make-ai-assistant__markdown-table {
@@ -1539,10 +1569,6 @@ button.make-ai-artifact__record:hover { background: var(--make-ai-internal-accen
     padding: 24px var(--make-ai-internal-panel-gutter-wide) 32px;
   }
 
-  .make-ai-assistant__assistant-text {
-    max-width: min(100%, 76ch);
-  }
-
   .make-ai-assistant__message--user .make-ai-assistant__message-turn {
     max-width: min(72%, 420px);
   }
@@ -1566,8 +1592,15 @@ button.make-ai-artifact__record:hover { background: var(--make-ai-internal-accen
     padding-bottom: 36px;
   }
 
-  .make-ai-assistant__assistant-text {
-    max-width: min(100%, 82ch);
+  .make-ai-assistant__assistant-text > p,
+  .make-ai-assistant__assistant-text > .make-ai-assistant__markdown-heading,
+  .make-ai-assistant__assistant-text > ul {
+    max-width: min(100%, 96ch);
+  }
+
+  .make-ai-assistant__markdown-table-scroll,
+  .make-ai-assistant__assistant-text > pre {
+    width: 100%;
   }
 
   .make-ai-assistant__message--user .make-ai-assistant__message-turn {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qfei-design/make-ai-assistant",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "Platform-wide Make AI Assistant contracts, React shell, and context-aware artifact templates.",
   "type": "module",
   "sideEffects": [