llmasaservice-ui 0.7.19 → 0.7.20

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 (7) hide show
  1. package/dist/index.d.mts +2 -0
  2. package/dist/index.d.ts +2 -0
  3. package/dist/index.js +24 -5
  4. package/dist/index.mjs +24 -5
  5. package/package.json +1 -1
  6. package/src/AgentPanel.tsx +4 -1
  7. package/src/ChatPanel.tsx +25 -2
package/dist/index.d.mts CHANGED
@@ -66,6 +66,7 @@ interface ChatPanelProps {
66
66
  callId: string;
67
67
  };
68
68
  };
69
+ hideRagContextInPrompt?: boolean;
69
70
  }
70
71
  interface ExtraProps$1 extends React.HTMLAttributes<HTMLElement> {
71
72
  inline?: boolean;
@@ -117,6 +118,7 @@ interface AgentPanelProps {
117
118
  callId: string;
118
119
  };
119
120
  };
121
+ hideRagContextInPrompt?: boolean;
120
122
  }
121
123
  interface ExtraProps extends React.HTMLAttributes<HTMLElement> {
122
124
  inline?: boolean;
package/dist/index.d.ts CHANGED
@@ -66,6 +66,7 @@ interface ChatPanelProps {
66
66
  callId: string;
67
67
  };
68
68
  };
69
+ hideRagContextInPrompt?: boolean;
69
70
  }
70
71
  interface ExtraProps$1 extends React.HTMLAttributes<HTMLElement> {
71
72
  inline?: boolean;
@@ -117,6 +118,7 @@ interface AgentPanelProps {
117
118
  callId: string;
118
119
  };
119
120
  };
121
+ hideRagContextInPrompt?: boolean;
120
122
  }
121
123
  interface ExtraProps extends React.HTMLAttributes<HTMLElement> {
122
124
  inline?: boolean;
package/dist/index.js CHANGED
@@ -203,7 +203,8 @@ var ChatPanel = ({
203
203
  callToActionMustSendEmail = false,
204
204
  ragQueryLimit = 10,
205
205
  ragRankLimit = 5,
206
- initialHistory = {}
206
+ initialHistory = {},
207
+ hideRagContextInPrompt = true
207
208
  }) => {
208
209
  const { send, response, idle, stop, lastCallId } = (0, import_llmasaservice_client.useLLM)({
209
210
  project_id,
@@ -614,7 +615,7 @@ var ChatPanel = ({
614
615
  html += `
615
616
  <div class="history-entry">
616
617
  <div class="prompt-container">
617
- <div class="prompt">${convertMarkdownToHTML(prompt)}</div>
618
+ <div class="prompt">${convertMarkdownToHTML(formatPromptForDisplay(prompt))}</div>
618
619
  </div>
619
620
  <div class="response-container">
620
621
  <div class="response">${convertMarkdownToHTML(response2.content)}</div>
@@ -717,6 +718,22 @@ var ChatPanel = ({
717
718
  })
718
719
  });
719
720
  };
721
+ const formatPromptForDisplay = (prompt) => {
722
+ var _a;
723
+ if (!prompt) {
724
+ return "";
725
+ }
726
+ if (hideRagContextInPrompt && prompt.includes("CONTEXT:")) {
727
+ const parts = prompt.split("CONTEXT:");
728
+ const withoutContext = parts.length > 0 ? parts[0] : "";
729
+ if (withoutContext.includes("PROMPT:")) {
730
+ const promptParts = withoutContext.split("PROMPT:");
731
+ return promptParts.length > 1 ? (_a = promptParts[1]) != null ? _a : "".trim() : withoutContext.trim();
732
+ }
733
+ return withoutContext.trim();
734
+ }
735
+ return prompt;
736
+ };
720
737
  return /* @__PURE__ */ import_react3.default.createElement(import_react3.default.Fragment, null, /* @__PURE__ */ import_react3.default.createElement(
721
738
  "div",
722
739
  {
@@ -732,7 +749,7 @@ var ChatPanel = ({
732
749
  rehypePlugins: [import_rehype_raw.default]
733
750
  },
734
751
  initialMessage
735
- ))) : null, Object.entries(history).map(([prompt, response2], index) => /* @__PURE__ */ import_react3.default.createElement("div", { className: "history-entry", key: index }, hideInitialPrompt && index === 0 ? null : /* @__PURE__ */ import_react3.default.createElement("div", { className: "prompt" }, prompt), /* @__PURE__ */ import_react3.default.createElement("div", { className: "response" }, index === Object.keys(history).length - 1 && isLoading ? /* @__PURE__ */ import_react3.default.createElement("div", { className: "loading-text" }, "loading...") : null, /* @__PURE__ */ import_react3.default.createElement(
752
+ ))) : null, Object.entries(history).map(([prompt, response2], index) => /* @__PURE__ */ import_react3.default.createElement("div", { className: "history-entry", key: index }, hideInitialPrompt && index === 0 ? null : /* @__PURE__ */ import_react3.default.createElement("div", { className: "prompt" }, formatPromptForDisplay(prompt)), /* @__PURE__ */ import_react3.default.createElement("div", { className: "response" }, index === Object.keys(history).length - 1 && isLoading ? /* @__PURE__ */ import_react3.default.createElement("div", { className: "loading-text" }, "loading...") : null, /* @__PURE__ */ import_react3.default.createElement(
736
753
  import_react_markdown.default,
737
754
  {
738
755
  className: markdownClass,
@@ -1145,7 +1162,8 @@ var AgentPanel = ({
1145
1162
  //callToActionMustSendEmail = false,
1146
1163
  //ragQueryLimit = 10,
1147
1164
  //ragRankLimit = 5,
1148
- initialHistory = {}
1165
+ initialHistory = {},
1166
+ hideRagContextInPrompt = true
1149
1167
  }) => {
1150
1168
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
1151
1169
  const [followOnPrompt, setFollowOnPrompt] = (0, import_react4.useState)("");
@@ -1236,7 +1254,8 @@ var AgentPanel = ({
1236
1254
  showPoweredBy,
1237
1255
  messages,
1238
1256
  conversation,
1239
- initialHistory
1257
+ initialHistory,
1258
+ hideRagContextInPrompt
1240
1259
  }
1241
1260
  ));
1242
1261
  };
package/dist/index.mjs CHANGED
@@ -169,7 +169,8 @@ var ChatPanel = ({
169
169
  callToActionMustSendEmail = false,
170
170
  ragQueryLimit = 10,
171
171
  ragRankLimit = 5,
172
- initialHistory = {}
172
+ initialHistory = {},
173
+ hideRagContextInPrompt = true
173
174
  }) => {
174
175
  const { send, response, idle, stop, lastCallId } = useLLM({
175
176
  project_id,
@@ -580,7 +581,7 @@ var ChatPanel = ({
580
581
  html += `
581
582
  <div class="history-entry">
582
583
  <div class="prompt-container">
583
- <div class="prompt">${convertMarkdownToHTML(prompt)}</div>
584
+ <div class="prompt">${convertMarkdownToHTML(formatPromptForDisplay(prompt))}</div>
584
585
  </div>
585
586
  <div class="response-container">
586
587
  <div class="response">${convertMarkdownToHTML(response2.content)}</div>
@@ -683,6 +684,22 @@ var ChatPanel = ({
683
684
  })
684
685
  });
685
686
  };
687
+ const formatPromptForDisplay = (prompt) => {
688
+ var _a;
689
+ if (!prompt) {
690
+ return "";
691
+ }
692
+ if (hideRagContextInPrompt && prompt.includes("CONTEXT:")) {
693
+ const parts = prompt.split("CONTEXT:");
694
+ const withoutContext = parts.length > 0 ? parts[0] : "";
695
+ if (withoutContext.includes("PROMPT:")) {
696
+ const promptParts = withoutContext.split("PROMPT:");
697
+ return promptParts.length > 1 ? (_a = promptParts[1]) != null ? _a : "".trim() : withoutContext.trim();
698
+ }
699
+ return withoutContext.trim();
700
+ }
701
+ return prompt;
702
+ };
686
703
  return /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
687
704
  "div",
688
705
  {
@@ -698,7 +715,7 @@ var ChatPanel = ({
698
715
  rehypePlugins: [rehypeRaw]
699
716
  },
700
717
  initialMessage
701
- ))) : null, Object.entries(history).map(([prompt, response2], index) => /* @__PURE__ */ React3.createElement("div", { className: "history-entry", key: index }, hideInitialPrompt && index === 0 ? null : /* @__PURE__ */ React3.createElement("div", { className: "prompt" }, prompt), /* @__PURE__ */ React3.createElement("div", { className: "response" }, index === Object.keys(history).length - 1 && isLoading ? /* @__PURE__ */ React3.createElement("div", { className: "loading-text" }, "loading...") : null, /* @__PURE__ */ React3.createElement(
718
+ ))) : null, Object.entries(history).map(([prompt, response2], index) => /* @__PURE__ */ React3.createElement("div", { className: "history-entry", key: index }, hideInitialPrompt && index === 0 ? null : /* @__PURE__ */ React3.createElement("div", { className: "prompt" }, formatPromptForDisplay(prompt)), /* @__PURE__ */ React3.createElement("div", { className: "response" }, index === Object.keys(history).length - 1 && isLoading ? /* @__PURE__ */ React3.createElement("div", { className: "loading-text" }, "loading...") : null, /* @__PURE__ */ React3.createElement(
702
719
  ReactMarkdown,
703
720
  {
704
721
  className: markdownClass,
@@ -1111,7 +1128,8 @@ var AgentPanel = ({
1111
1128
  //callToActionMustSendEmail = false,
1112
1129
  //ragQueryLimit = 10,
1113
1130
  //ragRankLimit = 5,
1114
- initialHistory = {}
1131
+ initialHistory = {},
1132
+ hideRagContextInPrompt = true
1115
1133
  }) => {
1116
1134
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
1117
1135
  const [followOnPrompt, setFollowOnPrompt] = useState4("");
@@ -1202,7 +1220,8 @@ var AgentPanel = ({
1202
1220
  showPoweredBy,
1203
1221
  messages,
1204
1222
  conversation,
1205
- initialHistory
1223
+ initialHistory,
1224
+ hideRagContextInPrompt
1206
1225
  }
1207
1226
  ));
1208
1227
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "llmasaservice-ui",
3
- "version": "0.7.19",
3
+ "version": "0.7.20",
4
4
  "description": "Prebuilt UI components for LLMAsAService.io",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
package/src/AgentPanel.tsx CHANGED
@@ -58,6 +58,7 @@ export interface AgentPanelProps {
58
58
  //ragQueryLimit?: number;
59
59
  //ragRankLimit?: number;
60
60
  initialHistory?: { [key: string]: { content: string; callId: string } };
61
+ hideRagContextInPrompt?: boolean;
61
62
  }
62
63
  interface ExtraProps extends React.HTMLAttributes<HTMLElement> {
63
64
  inline?: boolean;
@@ -102,7 +103,8 @@ const AgentPanel: React.FC<AgentPanelProps & ExtraProps> = ({
102
103
  //callToActionMustSendEmail = false,
103
104
  //ragQueryLimit = 10,
104
105
  //ragRankLimit = 5,
105
- initialHistory = {}
106
+ initialHistory = {},
107
+ hideRagContextInPrompt = true,
106
108
  }) => {
107
109
  const [followOnPrompt, setFollowOnPrompt] = useState<string>("");
108
110
 
@@ -239,6 +241,7 @@ const AgentPanel: React.FC<AgentPanelProps & ExtraProps> = ({
239
241
  messages={messages}
240
242
  conversation={conversation}
241
243
  initialHistory={initialHistory}
244
+ hideRagContextInPrompt={hideRagContextInPrompt}
242
245
  />
243
246
  )}
244
247
  </>
package/src/ChatPanel.tsx CHANGED
@@ -69,6 +69,7 @@ export interface ChatPanelProps {
69
69
  initialHistory?: {
70
70
  [prompt: string]: { content: string; callId: string };
71
71
  };
72
+ hideRagContextInPrompt?: boolean;
72
73
  }
73
74
 
74
75
  interface ExtraProps extends React.HTMLAttributes<HTMLElement> {
@@ -116,6 +117,7 @@ const ChatPanel: React.FC<ChatPanelProps & ExtraProps> = ({
116
117
  ragQueryLimit = 10,
117
118
  ragRankLimit = 5,
118
119
  initialHistory = {},
120
+ hideRagContextInPrompt = true,
119
121
  }) => {
120
122
  const { send, response, idle, stop, lastCallId } = useLLM({
121
123
  project_id: project_id,
@@ -614,7 +616,7 @@ const ChatPanel: React.FC<ChatPanelProps & ExtraProps> = ({
614
616
  html += `
615
617
  <div class="history-entry">
616
618
  <div class="prompt-container">
617
- <div class="prompt">${convertMarkdownToHTML(prompt)}</div>
619
+ <div class="prompt">${convertMarkdownToHTML(formatPromptForDisplay(prompt))}</div>
618
620
  </div>
619
621
  <div class="response-container">
620
622
  <div class="response">${convertMarkdownToHTML(response.content)}</div>
@@ -738,6 +740,27 @@ const ChatPanel: React.FC<ChatPanelProps & ExtraProps> = ({
738
740
  });
739
741
  };
740
742
 
743
+ const formatPromptForDisplay = (prompt: string): string => {
744
+ if (!prompt) {
745
+ return "";
746
+ }
747
+
748
+ if (hideRagContextInPrompt && prompt.includes("CONTEXT:")) {
749
+ const parts = prompt.split("CONTEXT:");
750
+ const withoutContext = parts.length > 0 ? parts[0] as string : "";
751
+
752
+ // Remove the optional chaining since withoutContext is always a string
753
+ if (withoutContext.includes("PROMPT:")) {
754
+ const promptParts = withoutContext.split("PROMPT:");
755
+ return promptParts.length > 1 ? promptParts[1] ?? "".trim() : withoutContext.trim();
756
+ }
757
+
758
+ return withoutContext.trim();
759
+ }
760
+
761
+ return prompt;
762
+ }
763
+
741
764
  return (
742
765
  <>
743
766
  <div
@@ -763,7 +786,7 @@ const ChatPanel: React.FC<ChatPanelProps & ExtraProps> = ({
763
786
  {Object.entries(history).map(([prompt, response], index) => (
764
787
  <div className="history-entry" key={index}>
765
788
  {hideInitialPrompt && index === 0 ? null : (
766
- <div className="prompt">{prompt}</div>
789
+ <div className="prompt">{formatPromptForDisplay(prompt)}</div>
767
790
  )}
768
791
 
769
792
  <div className="response">