@nqminds/mcp-client 1.0.24 → 1.0.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/MCPChat.d.ts.map +1 -1
  2. package/dist/MCPChat.js +9 -4
  3. package/dist/styles/MCPChat.css +23 -12
  4. package/package.json +1 -1
package/dist/MCPChat.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MCPChat.d.ts","sourceRoot":"","sources":["../src/MCPChat.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,OAAO,KAAK,EAAyB,YAAY,EAAe,MAAM,SAAS,CAAC;AA+ChF,wBAAgB,OAAO,CAAC,EACtB,aAAa,EACb,WAA6B,EAC7B,YAAiB,EACjB,SAAc,GACf,EAAE,YAAY,qBAogBd"}
1
+ {"version":3,"file":"MCPChat.d.ts","sourceRoot":"","sources":["../src/MCPChat.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAGxE,OAAO,KAAK,EAAyB,YAAY,EAAe,MAAM,SAAS,CAAC;AA+ChF,wBAAgB,OAAO,CAAC,EACtB,aAAa,EACb,WAA6B,EAC7B,YAAiB,EACjB,SAAc,GACf,EAAE,YAAY,qBA+gBd"}
package/dist/MCPChat.js CHANGED
@@ -39,6 +39,7 @@ export function MCPChat({ companyNumber, apiEndpoint = "/api/mcp/chat", customSt
39
39
  const [input, setInput] = useState("");
40
40
  const [isLoading, setIsLoading] = useState(false);
41
41
  const [thinkingSteps, setThinkingSteps] = useState([]);
42
+ const [processingStartTime, setProcessingStartTime] = useState(null);
42
43
  const [isOpen, setIsOpen] = useState(false);
43
44
  const [preparingAction, setPreparingAction] = useState(null);
44
45
  const [directPromptOpen, setDirectPromptOpen] = useState(false);
@@ -89,6 +90,7 @@ export function MCPChat({ companyNumber, apiEndpoint = "/api/mcp/chat", customSt
89
90
  setMessages((prev) => [...prev, userMessage]);
90
91
  setInput("");
91
92
  setThinkingSteps([]);
93
+ setProcessingStartTime(userMessage.timestamp);
92
94
  let thinkingStepCounter = 0;
93
95
  const addThinkingStep = (message) => {
94
96
  setThinkingSteps((prev) => [
@@ -329,20 +331,23 @@ export function MCPChat({ companyNumber, apiEndpoint = "/api/mcp/chat", customSt
329
331
  React.createElement("span", { className: "mcp-action-card-icon" }, action.icon),
330
332
  React.createElement("span", { className: "mcp-action-card-label" }, action.label))))),
331
333
  React.createElement("button", { className: "mcp-chat-now-button", onClick: handleChatNow }, "\uD83D\uDCAC Or just chat\u2026"))),
332
- visibleMessages.map((msg, idx) => (React.createElement("div", { key: idx, className: `mcp-chat-message ${msg.role === "user" ? "mcp-chat-message-user" : "mcp-chat-message-assistant"}` },
334
+ visibleMessages
335
+ .filter((msg) => !(msg.isStreaming && msg.content === ""))
336
+ .map((msg, idx) => (React.createElement("div", { key: idx, className: `mcp-chat-message ${msg.role === "user" ? "mcp-chat-message-user" : "mcp-chat-message-assistant"}` },
333
337
  React.createElement("div", { className: "mcp-chat-message-bubble" },
334
338
  msg.role === "assistant" ? (React.createElement("div", { className: "mcp-chat-message-content markdown-content" },
335
339
  React.createElement(ReactMarkdown, { remarkPlugins: [remarkGfm] }, msg.content))) : (React.createElement("div", { className: "mcp-chat-message-content" }, msg.content)),
336
- React.createElement("div", { className: "mcp-chat-message-timestamp" },
340
+ msg.role === "assistant" && !msg.isStreaming && (React.createElement("div", { className: "mcp-chat-message-timestamp" },
337
341
  msg.timestamp.toLocaleTimeString(),
338
- msg.role === "assistant" && msg.tokenInfo && (React.createElement("span", { className: "mcp-chat-token-info" }, msg.tokenInfo))))))),
342
+ msg.tokenInfo && (React.createElement("span", { className: "mcp-chat-token-info" }, msg.tokenInfo)))))))),
339
343
  isLoading && (React.createElement("div", { className: "mcp-chat-message mcp-chat-message-assistant" },
340
344
  React.createElement("div", { className: "mcp-chat-thinking" },
341
345
  React.createElement("div", { className: "mcp-chat-thinking-title" },
342
346
  React.createElement("span", { className: "mcp-preparing-spinner" }),
343
347
  thinkingSteps.length === 0
344
348
  ? " Thinking…"
345
- : " Processing…"),
349
+ : " Processing…",
350
+ processingStartTime && (React.createElement("span", { className: "mcp-chat-thinking-time" }, processingStartTime.toLocaleTimeString()))),
346
351
  thinkingSteps.length > 0 && (React.createElement("div", { className: "mcp-chat-thinking-steps" },
347
352
  thinkingSteps.map((step) => (React.createElement("div", { key: step.id, className: "mcp-chat-thinking-step" }, step.message))),
348
353
  React.createElement("div", { ref: thinkingEndRef })))))),
package/dist/styles/MCPChat.css CHANGED
@@ -630,37 +630,41 @@
630
630
  Thinking steps
631
631
  ─────────────────────────────────────────────── */
632
632
  .mcp-chat-thinking {
633
- padding: 14px 18px;
634
- border-radius: 12px;
633
+ padding: 20px 24px;
634
+ border-radius: 14px;
635
635
  background: var(--mcp-card-bg);
636
636
  border: 1px solid var(--mcp-border);
637
637
  width: 100%;
638
+ min-width: fit-content;
639
+ min-height: 140px;
640
+ box-sizing: border-box;
638
641
  display: flex;
639
642
  flex-direction: column;
640
- gap: 8px;
643
+ gap: 12px;
641
644
  }
642
645
 
643
646
  .mcp-chat-thinking-title {
644
- font-size: 14px;
645
- font-weight: 600;
646
- opacity: 0.8;
647
+ font-size: 16px;
648
+ font-weight: 700;
649
+ opacity: 0.9;
647
650
  color: var(--mcp-text);
648
651
  display: flex;
649
652
  align-items: center;
650
- gap: 8px;
653
+ gap: 10px;
654
+ width: 100%;
651
655
  }
652
656
 
653
657
  .mcp-chat-thinking-steps {
654
- max-height: 120px;
658
+ max-height: 320px;
655
659
  overflow-y: auto;
656
- font-size: 13px;
657
- line-height: 1.6;
660
+ font-size: 15px;
661
+ line-height: 1.7;
658
662
  color: var(--mcp-text-secondary);
659
663
  }
660
664
 
661
665
  .mcp-chat-thinking-step {
662
- padding-bottom: 6px;
663
- margin-bottom: 6px;
666
+ padding: 6px 0;
667
+ margin-bottom: 4px;
664
668
  border-bottom: 1px solid var(--mcp-border);
665
669
  }
666
670
 
@@ -668,6 +672,13 @@
668
672
  border-bottom: none;
669
673
  }
670
674
 
675
+ .mcp-chat-thinking-time {
676
+ margin-left: auto;
677
+ font-size: 13px;
678
+ font-weight: 400;
679
+ opacity: 0.6;
680
+ }
681
+
671
682
  /* ───────────────────────────────────────────────
672
683
  Input form
673
684
  ─────────────────────────────────────────────── */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nqminds/mcp-client",
3
- "version": "1.0.24",
3
+ "version": "1.0.26",
4
4
  "description": "Reusable MCP client component with AI chat interface",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",