@plmbr/notebook-intelligence 5.0.1 → 5.1.0-a.1

package/src/tool-call-stream.ts

@@ -0,0 +1,44 @@
+import { UUID } from '@lumino/coreutils';
+import { ResponseStreamDataType } from './tokens';
+
+/**
+ * The subset of a chat message's stream-content item this helper needs. A
+ * structural subset of `IChatMessageContent` (defined in chat-sidebar) so it
+ * can be unit-tested without importing the sidebar (and creating a cycle).
+ */
+export interface IToolCallStreamItem {
+  id: string;
+  type: ResponseStreamDataType;
+  content: any;
+  created: Date;
+}
+
+/**
+ * Merge a streamed tool-call payload into `contents` by its tool-call id.
+ *
+ * A tool call streams twice under one id (once when it starts, once when it
+ * finishes). The first emission pushes a new card; the second updates that
+ * card's content (its status) in place, so the call stays a single persistent
+ * row rather than appending a duplicate. Mutates `contents`.
+ */
+export function upsertToolCallContent(
+  contents: IToolCallStreamItem[],
+  content: { id: string; [key: string]: any },
+  created: Date
+): void {
+  const existing = contents.find(
+    c =>
+      c.type === ResponseStreamDataType.ToolCall &&
+      c.content?.id === content?.id
+  );
+  if (existing) {
+    existing.content = content;
+  } else {
+    contents.push({
+      id: UUID.uuid4(),
+      type: ResponseStreamDataType.ToolCall,
+      content,
+      created
+    });
+  }
+}

package/src/utils.ts

@@ -407,10 +407,11 @@ export function safeAnchorUri(uri: string | undefined | null): string | null {
  * user happens to be in the JupyterLab working directory.
  */
 export function buildResumeCommand(cwd: string, sessionId: string): string {
+  const quotedSessionId = shellSingleQuote(sessionId);
   if (!cwd) {
-    return `claude --resume ${sessionId}`;
+    return `claude --resume ${quotedSessionId}`;
   }
-  return `cd ${shellSingleQuote(cwd)} && claude --resume ${sessionId}`;
+  return `cd ${shellSingleQuote(cwd)} && claude --resume ${quotedSessionId}`;
 }
 
 /**

package/style/base.css

@@ -643,6 +643,7 @@ pre:has(.code-block-header) {
 
 .chat-message-feedback:focus-within,
 .chat-message-feedback:has(.selected),
+.chat-message-feedback.always-visible,
 .chat-message:hover .chat-message-feedback {
   opacity: 1;
 }
@@ -779,6 +780,169 @@ pre:has(.code-block-header) {
   margin-top: 2px;
 }
 
+.nbi-tool-call-wrapper {
+  margin: 2px 0;
+}
+
+.nbi-tool-call {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 3px 6px;
+  border-radius: 4px;
+  background-color: var(--jp-layout-color2);
+  font-size: var(--jp-ui-font-size1);
+}
+
+.nbi-tool-call-kind-icon {
+  flex-shrink: 0;
+  color: var(--jp-ui-font-color2);
+}
+
+.nbi-tool-call-title {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.nbi-tool-call-status-icon {
+  flex-shrink: 0;
+  color: var(--jp-ui-font-color2);
+}
+
+.nbi-tool-call-completed .nbi-tool-call-status-icon {
+  color: var(--jp-success-color1);
+}
+
+.nbi-tool-call-failed .nbi-tool-call-status-icon {
+  color: var(--jp-error-color1);
+}
+
+.nbi-tool-call-in-progress .nbi-tool-call-status-icon {
+  animation: nbi-tool-call-spin 1s linear infinite;
+}
+
+@keyframes nbi-tool-call-spin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .nbi-tool-call-in-progress .nbi-tool-call-status-icon {
+    animation: none;
+  }
+}
+
+.nbi-tool-call-diff-toggle {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  padding: 0;
+  border: none;
+  background: none;
+  color: var(--jp-ui-font-color2);
+  cursor: pointer;
+}
+
+.nbi-tool-call-diffs {
+  margin: 2px 0 2px 18px;
+  padding-left: 6px;
+  border-left: 2px solid var(--jp-border-color2);
+}
+
+.nbi-tool-call-diff + .nbi-tool-call-diff {
+  margin-top: 4px;
+}
+
+.nbi-tool-call-diff-path {
+  overflow: hidden;
+  font-size: var(--jp-ui-font-size0);
+  color: var(--jp-ui-font-color2);
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.nbi-tool-call-diff-body {
+  margin: 2px 0;
+  overflow-x: auto;
+  font-family: var(--jp-code-font-family);
+  font-size: var(--jp-code-font-size);
+  line-height: 1.4;
+}
+
+.nbi-tool-call-diff-line {
+  display: flex;
+}
+
+.nbi-diff-gutter {
+  flex-shrink: 0;
+  width: 1ch;
+  user-select: none;
+  text-align: center;
+}
+
+.nbi-diff-text {
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+/* Semi-transparent tints rather than the solid --jp-*-color3 fills (which are
+   light pastels in BOTH themes): the tint sits over the card background so the
+   line stays readable with the theme's own (light-on-dark / dark-on-light)
+   text color instead of forcing dark text onto a pale fill. */
+.nbi-diff-add {
+  background-color: rgb(64 160 43 / 22%);
+}
+
+.nbi-diff-remove {
+  background-color: rgb(248 81 73 / 22%);
+}
+
+.nbi-diff-context {
+  color: var(--jp-ui-font-color2);
+}
+
+.nbi-tool-call-diff-truncated {
+  font-size: var(--jp-ui-font-size0);
+  font-style: italic;
+  color: var(--jp-ui-font-color2);
+}
+
+.nbi-tool-call-group {
+  margin: 2px 0;
+}
+
+.nbi-tool-call-group-header {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  width: 100%;
+  padding: 2px 4px;
+  border: none;
+  background: none;
+  color: var(--jp-ui-font-color2);
+  font-size: var(--jp-ui-font-size0);
+  text-align: left;
+  cursor: pointer;
+}
+
+.nbi-tool-call-group-summary {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.nbi-tool-call-group-body {
+  margin-left: 6px;
+}
+
 .user-input-autocomplete,
 .mode-tools-popover,
 .workspace-file-popover {
@@ -1503,12 +1667,17 @@ button.send-button:disabled:active:not(.send-button-stop) {
 .expandable-content-text {
   display: none;
   margin: 5px;
-  padding: 0 5px;
-  border: 1px solid var(--jp-border-color2);
-  border-radius: 5px;
+  padding: 8px 10px;
+  border-radius: 6px;
   max-height: 200px;
   overflow-y: auto;
-  box-shadow: inset 0 0 15px 15px rgb(23 23 23 / 50%);
+  background-color: var(--jp-layout-color2);
+}
+
+/* Inline code also fills with --jp-layout-color2, which now matches this box's
+   fill; recess nested code to --jp-layout-color1 so it stays distinct. */
+.expandable-content-text :not(pre) > code {
+  background-color: var(--jp-layout-color1);
 }
 
 .expandable-content .collapsed-icon {