@homecode/ui 5.19.0 → 5.20.1

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 (6) hide show
  1. package/dist/esm/src/components/Chat/ChatMessage.js +8 -5
  2. package/dist/esm/src/components/Chat/ChatMessage.styl.js +2 -2
  3. package/dist/esm/src/components/Chat/ChatView.js +1 -0
  4. package/dist/esm/types/src/components/Chat/Chat.types.d.ts +2 -0
  5. package/dist/esm/types/src/components/Chat/ChatMessage.test.d.ts +1 -0
  6. package/package.json +1 -1
package/dist/esm/src/components/Chat/ChatMessage.js CHANGED
@@ -8,10 +8,12 @@ import S from './ChatMessage.styl.js';
8
8
  import { parseSystemEvent, getDisplayParts, getDisplayContent } from './content.js';
9
9
 
10
10
  function ChatMessage({ data, isStacked, className, onButtonClick, }) {
11
- const { content, role, createdAt } = data;
11
+ const { content, role, createdAt, author } = data;
12
12
  const id = data.id;
13
13
  const isSystem = role === 'SYSTEM';
14
14
  const date = createdAt ? new Date(createdAt) : null;
15
+ const hasDate = Boolean(date) && !Number.isNaN(date.getTime());
16
+ const hasAuthor = author != null && author !== '' && !isStacked;
15
17
  const systemEvent = useMemo(() => (isSystem ? parseSystemEvent(content) : null), [isSystem, content]);
16
18
  const parts = useMemo(() => (isSystem ? null : getDisplayParts(content)), [content, isSystem]);
17
19
  const body = useMemo(() => {
@@ -41,10 +43,11 @@ function ChatMessage({ data, isStacked, className, onButtonClick, }) {
41
43
  : getDisplayContent(content);
42
44
  return jsx(ChatFormattedText, { text: text, onButtonClick: onButtonClick });
43
45
  }, [content, isSystem, onButtonClick, parts, systemEvent]);
44
- return (jsxs("div", { className: cn(S.root, S[role], isStacked && S.stacked, className), "data-id": id, children: [date && !Number.isNaN(date.getTime()) && (jsx("div", { className: S.meta, children: date.toLocaleTimeString(undefined, {
45
- hour: 'numeric',
46
- minute: '2-digit',
47
- }) })), jsx("div", { className: S.text, children: jsx("div", { className: S.textContent, children: isSystem ? (jsx(Expand, { className: S.systemFold, headerClassName: S.systemFoldTrigger, size: "s", isOpen: false, header: systemEvent?.summary || getDisplayContent(content), content: () => (jsx("div", { className: S.systemFoldContent, children: body })) })) : (body) }) })] }));
46
+ return (jsxs("div", { className: cn(S.root, S[role], isStacked && S.stacked, className), "data-id": id, children: [(hasAuthor || hasDate) && (jsxs("div", { className: S.meta, children: [hasAuthor && jsx("span", { className: S.author, children: author }), hasDate &&
47
+ date.toLocaleTimeString(undefined, {
48
+ hour: 'numeric',
49
+ minute: '2-digit',
50
+ })] })), jsx("div", { className: S.text, children: jsx("div", { className: S.textContent, children: isSystem ? (jsx(Expand, { className: S.systemFold, headerClassName: S.systemFoldTrigger, size: "s", isOpen: false, header: systemEvent?.summary || getDisplayContent(content), content: () => (jsx("div", { className: S.systemFoldContent, children: body })) })) : (body) }) })] }));
48
51
  }
49
52
 
50
53
  export { ChatMessage };
package/dist/esm/src/components/Chat/ChatMessage.styl.js CHANGED
@@ -1,5 +1,5 @@
1
- var css_248z = ".ChatMessage_root__JkQi6{align-items:flex-start;display:flex;flex-direction:column;max-width:100%;padding:0 var(--p-5) var(--p-2)}.ChatMessage_root__JkQi6:last-child:after{content:\"\";display:block;height:20vh;width:100%}@media (max-width:768px){.ChatMessage_root__JkQi6{padding:0 var(--p-2) var(--p-2)}}.ChatMessage_root__JkQi6+.ChatMessage_root__JkQi6{margin-top:20px}.ChatMessage_root__JkQi6 .ChatMessage_textContent__O-pxi{padding:0}.ChatMessage_root__JkQi6.ChatMessage_USER__UEEuA{align-items:flex-end;padding-right:var(--p-5)}.ChatMessage_root__JkQi6.ChatMessage_USER__UEEuA .ChatMessage_text__CNGXE{background-color:var(--active-color-alpha-500);padding:6px var(--p-2)}.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_textContent__O-pxi,.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_text__CNGXE{width:100%!important}.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_text__CNGXE{padding-top:4px}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf{align-items:stretch}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf+.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf{margin-top:-6px!important}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf .ChatMessage_text__CNGXE{font-size:90%;opacity:.8;padding:0;width:100%}.ChatMessage_root__JkQi6.ChatMessage_stacked__LoLL0 .ChatMessage_meta__lMww1{display:none}.ChatMessage_text__CNGXE{border-radius:14px;display:flex;flex-direction:row;max-width:100%;overflow:hidden;padding:var(--p-2);width:-moz-fit-content;width:fit-content}.ChatMessage_textContent__O-pxi{max-width:100%;text-align:left;white-space:pre-line;word-break:break-word}.ChatMessage_textContent__O-pxi h1,.ChatMessage_textContent__O-pxi h2,.ChatMessage_textContent__O-pxi h3,.ChatMessage_textContent__O-pxi h4,.ChatMessage_textContent__O-pxi h5,.ChatMessage_textContent__O-pxi h6{margin-top:1em}.ChatMessage_textContent__O-pxi a{margin-bottom:-.1em;margin-top:-.3em;padding:0 .3em .1em .4em!important}.ChatMessage_SYSTEM__bkOnf .ChatMessage_textContent__O-pxi a{margin-bottom:0;margin-top:0}.ChatMessage_meta__lMww1{font-size:11px;margin-bottom:4px;opacity:.5;padding:0 4px}.ChatMessage_parts__z7LHI{display:flex;flex-direction:column;gap:var(--p-2)}.ChatMessage_mediaPart__A67rQ{border-radius:var(--p-2);max-height:320px;max-width:100%}.ChatMessage_systemFold__FUSrL{width:100%}.ChatMessage_systemFoldTrigger__35Hnd{max-width:100%;overflow:hidden;padding:2px 10px;text-overflow:ellipsis;white-space:nowrap}.ChatMessage_systemFoldContent__0G-uw{padding:0 10px}";
2
- var S = {"root":"ChatMessage_root__JkQi6","textContent":"ChatMessage_textContent__O-pxi","USER":"ChatMessage_USER__UEEuA","text":"ChatMessage_text__CNGXE","AGENT":"ChatMessage_AGENT__fvHxv","SYSTEM":"ChatMessage_SYSTEM__bkOnf","stacked":"ChatMessage_stacked__LoLL0","meta":"ChatMessage_meta__lMww1","parts":"ChatMessage_parts__z7LHI","mediaPart":"ChatMessage_mediaPart__A67rQ","systemFold":"ChatMessage_systemFold__FUSrL","systemFoldTrigger":"ChatMessage_systemFoldTrigger__35Hnd","systemFoldContent":"ChatMessage_systemFoldContent__0G-uw"};
1
+ var css_248z = ".ChatMessage_root__JkQi6{align-items:flex-start;display:flex;flex-direction:column;max-width:100%;padding:0 var(--p-5) var(--p-2)}.ChatMessage_root__JkQi6:last-child:after{content:\"\";display:block;height:20vh;width:100%}@media (max-width:768px){.ChatMessage_root__JkQi6{padding:0 var(--p-2) var(--p-2)}}.ChatMessage_root__JkQi6+.ChatMessage_root__JkQi6{margin-top:20px}.ChatMessage_root__JkQi6 .ChatMessage_textContent__O-pxi{padding:0}.ChatMessage_root__JkQi6.ChatMessage_USER__UEEuA{align-items:flex-end;padding-right:var(--p-5)}.ChatMessage_root__JkQi6.ChatMessage_USER__UEEuA .ChatMessage_text__CNGXE{background-color:var(--active-color-alpha-500);padding:6px var(--p-2)}.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_textContent__O-pxi,.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_text__CNGXE{width:100%!important}.ChatMessage_root__JkQi6.ChatMessage_AGENT__fvHxv .ChatMessage_text__CNGXE{padding-top:4px}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf{align-items:stretch}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf+.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf{margin-top:-6px!important}.ChatMessage_root__JkQi6.ChatMessage_SYSTEM__bkOnf .ChatMessage_text__CNGXE{font-size:90%;opacity:.8;padding:0;width:100%}.ChatMessage_root__JkQi6.ChatMessage_stacked__LoLL0 .ChatMessage_meta__lMww1{display:none}.ChatMessage_text__CNGXE{border-radius:14px;display:flex;flex-direction:row;max-width:100%;overflow:hidden;padding:var(--p-2);width:-moz-fit-content;width:fit-content}.ChatMessage_textContent__O-pxi{max-width:100%;text-align:left;white-space:pre-line;word-break:break-word}.ChatMessage_textContent__O-pxi h1,.ChatMessage_textContent__O-pxi h2,.ChatMessage_textContent__O-pxi h3,.ChatMessage_textContent__O-pxi h4,.ChatMessage_textContent__O-pxi h5,.ChatMessage_textContent__O-pxi h6{margin-top:1em}.ChatMessage_textContent__O-pxi a{margin-bottom:-.1em;margin-top:-.3em;padding:0 .3em .1em .4em!important}.ChatMessage_SYSTEM__bkOnf .ChatMessage_textContent__O-pxi a{margin-bottom:0;margin-top:0}.ChatMessage_meta__lMww1{align-items:baseline;display:flex;font-size:11px;gap:6px;margin-bottom:4px;max-width:100%;opacity:.5;padding:0 4px}.ChatMessage_author__084lv{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ChatMessage_parts__z7LHI{display:flex;flex-direction:column;gap:var(--p-2)}.ChatMessage_mediaPart__A67rQ{border-radius:var(--p-2);max-height:320px;max-width:100%}.ChatMessage_systemFold__FUSrL{width:100%}.ChatMessage_systemFoldTrigger__35Hnd{max-width:100%;overflow:hidden;padding:2px 10px;text-overflow:ellipsis;white-space:nowrap}.ChatMessage_systemFoldContent__0G-uw{padding:0 10px}";
2
+ var S = {"root":"ChatMessage_root__JkQi6","textContent":"ChatMessage_textContent__O-pxi","USER":"ChatMessage_USER__UEEuA","text":"ChatMessage_text__CNGXE","AGENT":"ChatMessage_AGENT__fvHxv","SYSTEM":"ChatMessage_SYSTEM__bkOnf","stacked":"ChatMessage_stacked__LoLL0","meta":"ChatMessage_meta__lMww1","author":"ChatMessage_author__084lv","parts":"ChatMessage_parts__z7LHI","mediaPart":"ChatMessage_mediaPart__A67rQ","systemFold":"ChatMessage_systemFold__FUSrL","systemFoldTrigger":"ChatMessage_systemFoldTrigger__35Hnd","systemFoldContent":"ChatMessage_systemFoldContent__0G-uw"};
3
3
  if (typeof document !== 'undefined') {
4
4
  var __uilibHead = document.head || document.getElementsByTagName('head')[0];
5
5
  if (__uilibHead) {
package/dist/esm/src/components/Chat/ChatView.js CHANGED
@@ -32,6 +32,7 @@ function ChatView({ messages, isPrompting, emptyLabel = 'Start the conversation'
32
32
  const prev = visible[index - 1];
33
33
  const isStacked = Boolean(prev) &&
34
34
  prev.role === message.role &&
35
+ prev.author === message.author &&
35
36
  message.role !== 'SYSTEM';
36
37
  return (jsx(ChatMessage, { data: message, isStacked: isStacked, isLastMessage: index === visible.length - 1, onButtonClick: onButtonClick }, message.id || `${message.role}-${index}`));
37
38
  })] }), footer && (jsx("div", { className: cn(S.footer, footerClassName), children: footer }))] }));
package/dist/esm/types/src/components/Chat/Chat.types.d.ts CHANGED
@@ -28,6 +28,8 @@ export type ChatMessageData = {
28
28
  role: ChatRole;
29
29
  content: string;
30
30
  createdAt?: string | Date;
31
+ /** Sender display name, shown above the bubble. Hidden when `isStacked`. */
32
+ author?: ReactNode;
31
33
  };
32
34
  export type ChatFormattedTextProps = FormattedTextProps;
33
35
  export type ChatMessageProps = {
package/dist/esm/types/src/components/Chat/ChatMessage.test.d.ts ADDED
@@ -0,0 +1 @@
1
+ import '@testing-library/jest-dom';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homecode/ui",
3
- "version": "5.19.0",
3
+ "version": "5.20.1",
4
4
  "description": "React UI components library",
5
5
  "scripts": {
6
6
  "tests": "jest",