@epam/ai-dial-conversation-messages 1.1.0-dev.38 → 1.1.0-dev.43

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.
@@ -1 +1 @@
1
- {"version":3,"file":"StatusMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/MessageBubble/StatusMessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,4DAA4D;AAC5D,MAAM,WAAW,yBAAyB;IACxC,0FAA0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oFAAoF;IACpF,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,wDAAwD;AACxD,MAAM,WAAW,wBAAwB;IACvC,4BAA4B;IAC5B,MAAM,EAAE,yBAAyB,CAAC;CACnC;AAED;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAgB5D,CAAC"}
1
+ {"version":3,"file":"StatusMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/MessageBubble/StatusMessageBubble.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,4DAA4D;AAC5D,MAAM,WAAW,yBAAyB;IACxC,0FAA0F;IAC1F,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oFAAoF;IACpF,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,wDAAwD;AACxD,MAAM,WAAW,wBAAwB;IACvC,4BAA4B;IAC5B,MAAM,EAAE,yBAAyB,CAAC;CACnC;AAED;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAY5D,CAAC"}
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { AttachmentErrorReason as e, AttachmentType as t, DeploymentIcon as n, Highlight as r, MDMessageViewer as i, MIME_TYPE_EXT_MAP as a, MessageRating as o, MessageRole as s, RequestStatus as c, ResponseFormat as l, buildCssVars as u, mergeClasses as d, useCollapsedText as f } from "@epam/ai-dial-chat-shared";
2
- import { DIAL_ICON_SIZE as p, DialGhostIconButton as m, DialInput as h, DialLinkButton as g, DialNotification as _, DialPopup as v, DialPrimaryButton as y, DialRadioGroup as b, DialRoundedButton as x, DialSkeleton as S, DialSkeletonVariant as C, DialSlider as w, DialTag as T, DialTooltip as E, ElementSize as D, PopupSize as O, RadioGroupOrientation as k } from "@epam/ai-dial-ui-kit";
2
+ import { DIAL_ICON_SIZE as p, DialGhostIconButton as m, DialInput as h, DialLinkButton as g, DialPopup as _, DialPrimaryButton as v, DialRadioGroup as y, DialRoundedButton as b, DialSkeleton as x, DialSkeletonVariant as S, DialSlider as C, DialTag as w, DialTooltip as T, ElementSize as E, InfoMessageNotification as D, PopupSize as O, RadioGroupOrientation as k } from "@epam/ai-dial-ui-kit";
3
3
  import { IconCheck as A, IconChevronDown as j, IconChevronUp as M, IconClipboard as N, IconCopy as P, IconDownload as F, IconExternalLink as I, IconFile as L, IconFileTypeBmp as R, IconFileTypeCss as z, IconFileTypeCsv as B, IconFileTypeDoc as V, IconFileTypeDocx as ee, IconFileTypeHtml as te, IconFileTypeJpg as ne, IconFileTypeJs as re, IconFileTypeJsx as ie, IconFileTypePdf as ae, IconFileTypePhp as oe, IconFileTypePng as se, IconFileTypePpt as ce, IconFileTypeRs as le, IconFileTypeSql as ue, IconFileTypeSvg as de, IconFileTypeTs as fe, IconFileTypeTsx as pe, IconFileTypeTxt as me, IconFileTypeVue as he, IconFileTypeXls as ge, IconFileTypeXml as _e, IconFileTypeZip as ve, IconMarkdown as ye, IconMusic as be, IconPaperclip as xe, IconPencilMinus as Se, IconPhoto as H, IconRefresh as Ce, IconReload as we, IconTerminal2 as Te, IconThumbDown as Ee, IconThumbUp as De, IconTrashX as Oe, IconVideo as ke, IconX as Ae } from "@tabler/icons-react";
4
4
  import "react-dom";
5
5
  import { memo as je, useCallback as U, useEffect as Me, useId as Ne, useMemo as W, useRef as Pe, useState as G } from "react";
@@ -114,7 +114,7 @@ var Fe = "flex size-[84px] items-center justify-center rounded-xl border", Y = /
114
114
  "attachment-tile-indeterminate": "_attachment-tile-indeterminate_3x6ks_1"
115
115
  }, Z = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: a, className: o }) => /* @__PURE__ */ q(m, {
116
116
  icon: a,
117
- size: D.Small,
117
+ size: E.Small,
118
118
  className: d("absolute end-1 top-1 h-6 w-6 rounded-lg", o ?? X.hoverIcon),
119
119
  "aria-label": e,
120
120
  "aria-describedby": t ? n : void 0,
@@ -292,8 +292,8 @@ var Fe = "flex size-[84px] items-center justify-center rounded-xl border", Y = /
292
292
  imageLoadStatus: r
293
293
  };
294
294
  }, Qe = ({ attachment: e, onExpand: n, onClick: r, labels: i, onRemove: a, cssVars: o, onDownload: s, styles: c }) => {
295
- let { clickLabel: l = "Open attachment", expandLabel: u = "Expand pasted text" } = i ?? {}, { typography: f, className: m } = c ?? {}, { id: h, name: g } = e, _ = e.previewUrl ?? e.url, v = e.type === t.Pasted && n !== void 0, { isLoading: y, isError: b, isImage: x } = W(() => Ve(e), [e]), w = r !== void 0 && !v && !y && !b, { imageRef: T, imageLoadStatus: E } = Ze({
296
- enabled: x,
295
+ let { clickLabel: l = "Open attachment", expandLabel: u = "Expand pasted text" } = i ?? {}, { typography: f, className: m } = c ?? {}, { id: h, name: g } = e, _ = e.previewUrl ?? e.url, v = e.type === t.Pasted && n !== void 0, { isLoading: y, isError: b, isImage: C } = W(() => Ve(e), [e]), w = r !== void 0 && !v && !y && !b, { imageRef: T, imageLoadStatus: E } = Ze({
296
+ enabled: C,
297
297
  src: _
298
298
  }), D = () => {
299
299
  v && n ? n(h) : w && r && r(h);
@@ -319,8 +319,8 @@ var Fe = "flex size-[84px] items-center justify-center rounded-xl border", Y = /
319
319
  onClick: s,
320
320
  id: h
321
321
  }),
322
- E !== Xe.Loaded && /* @__PURE__ */ q(S, {
323
- variant: C.Rectangular,
322
+ E !== Xe.Loaded && /* @__PURE__ */ q(x, {
323
+ variant: S.Rectangular,
324
324
  width: "100%",
325
325
  height: "100%",
326
326
  active: E === Xe.Loading,
@@ -512,7 +512,7 @@ je(({ tabs: e, activeTabId: t, onTabChange: n, styles: r }) => {
512
512
  className: "flex flex-nowrap gap-1",
513
513
  children: e.map((e) => {
514
514
  let r = t === e.id;
515
- return /* @__PURE__ */ q(T, {
515
+ return /* @__PURE__ */ q(w, {
516
516
  label: e.label,
517
517
  selected: r,
518
518
  onClick: () => n(e.id),
@@ -522,7 +522,7 @@ je(({ tabs: e, activeTabId: t, onTabChange: n, styles: r }) => {
522
522
  })
523
523
  });
524
524
  });
525
- var at = (e) => /* @__PURE__ */ q(y, { ...e }), ot = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
525
+ var at = (e) => /* @__PURE__ */ q(v, { ...e }), ot = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
526
526
  let [s, c] = G(t), [l, u] = G(n), [d, f] = G(r), p = Pe(o);
527
527
  Me(() => {
528
528
  o && !p.current && (c(t), u(n), f(r)), p.current = o;
@@ -562,7 +562,7 @@ var at = (e) => /* @__PURE__ */ q(y, { ...e }), ot = ({ features: e, initialResp
562
562
  ], temperatureHint: _ }) => /* @__PURE__ */ J("div", {
563
563
  className: "flex flex-col gap-4 px-6 py-3",
564
564
  children: [
565
- e.responseFormat && /* @__PURE__ */ q(b, {
565
+ e.responseFormat && /* @__PURE__ */ q(y, {
566
566
  fieldTitle: s,
567
567
  labelClassName: st,
568
568
  elementId: "response-format",
@@ -587,7 +587,7 @@ var at = (e) => /* @__PURE__ */ q(y, { ...e }), ot = ({ features: e, initialResp
587
587
  },
588
588
  onChange: (e) => a(e ?? "")
589
589
  }),
590
- e.temperature && /* @__PURE__ */ q(w, {
590
+ e.temperature && /* @__PURE__ */ q(C, {
591
591
  labelProps: {
592
592
  label: m,
593
593
  className: st,
@@ -602,8 +602,8 @@ var at = (e) => /* @__PURE__ */ q(y, { ...e }), ot = ({ features: e, initialResp
602
602
  })
603
603
  ]
604
604
  });
605
- je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, title: o = "Chat settings", responseFormatLabel: s, responseFormatHint: c, responseFormatMarkdownLabel: l, responseFormatPlainTextLabel: u, systemPromptLabel: d, systemPromptTooltip: f, temperatureLabel: p, temperatureLabels: m, temperatureHint: h, saveLabel: g = "Apply changes", saveDisabledTooltip: _ }) => {
606
- let { responseFormat: y, systemPrompt: b, temperature: x, canSubmit: S, setResponseFormat: C, setSystemPrompt: w, setTemperature: T, handleSubmit: D } = ot({
605
+ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, title: o = "Chat settings", responseFormatLabel: s, responseFormatHint: c, responseFormatMarkdownLabel: l, responseFormatPlainTextLabel: u, systemPromptLabel: d, systemPromptTooltip: f, temperatureLabel: p, temperatureLabels: m, temperatureHint: h, saveLabel: g = "Apply changes", saveDisabledTooltip: v }) => {
606
+ let { responseFormat: y, systemPrompt: b, temperature: x, canSubmit: S, setResponseFormat: C, setSystemPrompt: w, setTemperature: E, handleSubmit: D } = ot({
607
607
  features: e,
608
608
  initialResponseFormat: t,
609
609
  initialSystemPrompt: n,
@@ -611,7 +611,7 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
611
611
  onSave: i,
612
612
  onClose: a
613
613
  });
614
- return /* @__PURE__ */ q(v, {
614
+ return /* @__PURE__ */ q(_, {
615
615
  open: !0,
616
616
  header: o,
617
617
  size: O.Sm,
@@ -619,9 +619,9 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
619
619
  className: "!bg-layer-2",
620
620
  footer: /* @__PURE__ */ q("div", {
621
621
  className: "flex justify-end px-6 py-4",
622
- children: /* @__PURE__ */ q(E, {
623
- tooltip: _,
624
- hideTooltip: S || !_,
622
+ children: /* @__PURE__ */ q(T, {
623
+ tooltip: v,
624
+ hideTooltip: S || !v,
625
625
  children: /* @__PURE__ */ q(at, {
626
626
  label: g,
627
627
  onClick: D,
@@ -636,7 +636,7 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
636
636
  temperature: x,
637
637
  onResponseFormatChange: C,
638
638
  onSystemPromptChange: w,
639
- onTemperatureChange: T,
639
+ onTemperatureChange: E,
640
640
  responseFormatLabel: s,
641
641
  responseFormatHint: c,
642
642
  responseFormatMarkdownLabel: l,
@@ -671,7 +671,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
671
671
  size: p.SM,
672
672
  "aria-hidden": !0
673
673
  }),
674
- size: D.Small,
674
+ size: E.Small,
675
675
  "aria-label": y?.editMessage ?? "Edit message",
676
676
  tooltipProps: { tooltip: v?.edit ?? "Edit" },
677
677
  onClick: t,
@@ -682,7 +682,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
682
682
  size: p.SM,
683
683
  "aria-hidden": !0
684
684
  }),
685
- size: D.Small,
685
+ size: E.Small,
686
686
  "aria-label": y?.deleteMessage ?? "Delete message",
687
687
  tooltipProps: { tooltip: v?.delete ?? "Delete" },
688
688
  onClick: r
@@ -692,7 +692,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
692
692
  size: p.SM,
693
693
  "aria-hidden": !0
694
694
  }),
695
- size: D.Small,
695
+ size: E.Small,
696
696
  "aria-label": y?.regenerateResponse ?? "Regenerate response",
697
697
  tooltipProps: { tooltip: v?.regenerate ?? "Regenerate" },
698
698
  onClick: i
@@ -702,7 +702,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
702
702
  size: p.SM,
703
703
  "aria-hidden": !0
704
704
  }),
705
- size: D.Small,
705
+ size: E.Small,
706
706
  "aria-label": y?.copyResponse ?? "Copy response",
707
707
  tooltipProps: { tooltip: b === "copy" ? v?.copied ?? "Copied!" : v?.copy ?? "Copy" },
708
708
  onClick: w
@@ -712,7 +712,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
712
712
  size: p.SM,
713
713
  "aria-hidden": !0
714
714
  }),
715
- size: D.Small,
715
+ size: E.Small,
716
716
  "aria-label": y?.copyAsMarkdown ?? "Copy as markdown",
717
717
  tooltipProps: { tooltip: b === "markdown" ? v?.copiedMarkdown ?? "Copied!" : v?.copyMarkdown ?? "Copy as Markdown" },
718
718
  onClick: T
@@ -722,7 +722,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
722
722
  size: p.SM,
723
723
  "aria-hidden": !0
724
724
  }),
725
- size: D.Small,
725
+ size: E.Small,
726
726
  "aria-label": y?.likeResponse ?? "Like response",
727
727
  "aria-pressed": f === o.Like,
728
728
  className: f === o.Like ? "!text-accent-primary" : void 0,
@@ -734,7 +734,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
734
734
  size: p.SM,
735
735
  "aria-hidden": !0
736
736
  }),
737
- size: D.Small,
737
+ size: E.Small,
738
738
  "aria-label": y?.dislikeResponse ?? "Dislike response",
739
739
  "aria-pressed": f === o.Dislike,
740
740
  className: f === o.Dislike ? "!text-accent-primary" : void 0,
@@ -750,7 +750,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
750
750
  collapsedText: "_collapsedText_1exhl_15",
751
751
  startersDivider: "_startersDivider_1exhl_26",
752
752
  text: "_text_1exhl_30"
753
- }, dt = ({ text: e, styles: r, actions: a, hasAlwaysVisibleActions: o, isStreaming: c, attachments: l, afterContent: f, starters: p, onSelectStarter: m, deploymentIconUrl: h, deploymentDisplayName: g, markdownComponents: _, onAttachmentClick: v, onDownloadAll: y, onAttachmentRetry: b, codeBlockTheme: S, labels: C }) => {
753
+ }, dt = ({ text: e, styles: r, actions: a, hasAlwaysVisibleActions: o, isStreaming: c, attachments: l, afterContent: f, starters: p, onSelectStarter: m, deploymentIconUrl: h, deploymentDisplayName: g, markdownComponents: _, onAttachmentClick: v, onDownloadAll: y, onAttachmentRetry: x, codeBlockTheme: S, labels: C }) => {
754
754
  let { colors: w, typography: T, className: E, bubbleClassName: D } = r ?? {}, { attachmentClickLabel: O, attachmentRetryLabel: k, attachmentOpenInNewTabLabel: A, startersAriaLabel: j = "Quick reply buttons", thinkingLabel: M, codeBlockCopyLabel: N, codeBlockCopiedLabel: P, assistantMessageAriaLabel: F = "Assistant message", deploymentIconFallbackLabel: I = "AI" } = C ?? {}, L = c ? (l ?? []).filter((e) => e.type !== t.Audio) : l ?? [], R = u({
755
755
  "--cm-bubble-text": w?.text,
756
756
  "--cm-starters-divider": w?.startersDivider
@@ -788,7 +788,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
788
788
  attachments: L,
789
789
  onAttachmentClick: (e) => v?.(l?.find((t) => t.id === e)),
790
790
  onDownloadAll: y,
791
- onRetry: b,
791
+ onRetry: x,
792
792
  labels: {
793
793
  clickLabel: O,
794
794
  retryLabel: k,
@@ -809,7 +809,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
809
809
  children: p.map((e, t) => /* @__PURE__ */ q("div", {
810
810
  role: "listitem",
811
811
  className: "min-w-[40px]",
812
- children: /* @__PURE__ */ q(x, {
812
+ children: /* @__PURE__ */ q(b, {
813
813
  label: e.title,
814
814
  className: "min-w-[40px]",
815
815
  onClick: () => m(e)
@@ -821,8 +821,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
821
821
  }, ft = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ q("div", {
822
822
  role: "status",
823
823
  "aria-live": "polite",
824
- className: "dial-info-notification dial-notification",
825
- children: /* @__PURE__ */ q(_, {
824
+ children: /* @__PURE__ */ q(D, {
826
825
  title: e,
827
826
  message: t,
828
827
  textClassName: "flex-row flex-wrap gap-1"
@@ -830,7 +829,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
830
829
  }), pt = /* @__PURE__ */ function(e) {
831
830
  return e.Bottom = "Bottom", e.Top = "Top", e;
832
831
  }({}), mt = 10, ht = ({ text: e, position: t = pt.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: a, collapsedLineCount: o = mt, labels: c, onAttachmentClick: l, onDownloadAll: m, onAttachmentRetry: h }) => {
833
- let { colors: _, typography: v, className: y, bubbleClassName: b } = n ?? {}, { showMoreLabel: x = "Show more", showLessLabel: S = "Show less", showMoreAriaLabel: C, showLessAriaLabel: w, attachmentClickLabel: T, attachmentRetryLabel: E, attachmentOpenInNewTabLabel: O, userMessageAriaLabel: k = "User message" } = c ?? {}, { textRef: A, isTextCollapsed: N, isOverflowing: P, collapsedMaxHeight: F, expandedMaxHeight: I, isCollapsed: L, toggleCollapsed: R } = f({
832
+ let { colors: _, typography: v, className: y, bubbleClassName: b } = n ?? {}, { showMoreLabel: x = "Show more", showLessLabel: S = "Show less", showMoreAriaLabel: C, showLessAriaLabel: w, attachmentClickLabel: T, attachmentRetryLabel: D, attachmentOpenInNewTabLabel: O, userMessageAriaLabel: k = "User message" } = c ?? {}, { textRef: A, isTextCollapsed: N, isOverflowing: P, collapsedMaxHeight: F, expandedMaxHeight: I, isCollapsed: L, toggleCollapsed: R } = f({
834
833
  text: e,
835
834
  collapsedLineCount: o
836
835
  }), z = u({
@@ -856,7 +855,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
856
855
  onRetry: h,
857
856
  labels: {
858
857
  clickLabel: T,
859
- retryLabel: E,
858
+ retryLabel: D,
860
859
  openInNewTabLabel: O
861
860
  },
862
861
  styles: { className: "max-w-[640px]" }
@@ -884,7 +883,7 @@ var lt = 2e3, ut = ({ role: e = s.User, onEdit: t, onEditHover: n, onDelete: r,
884
883
  "aria-controls": ae,
885
884
  className: "mt-3",
886
885
  onClick: R,
887
- size: D.Small
886
+ size: E.Small
888
887
  })]
889
888
  })
890
889
  }),
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-conversation-messages",
3
3
  "description": "Message bubble components for rendering conversation history with actions and source citations",
4
- "version": "1.1.0-dev.38",
4
+ "version": "1.1.0-dev.43",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -19,10 +19,10 @@
19
19
  "peerDependencies": {
20
20
  "react": "^19.0.0",
21
21
  "@tabler/icons-react": "^3.0.0",
22
- "@epam/ai-dial-ui-kit": "0.12.0-dev.36",
23
- "@epam/ai-dial-chat-shared": "1.1.0-dev.38",
24
- "@epam/ai-dial-conversation-input": "1.1.0-dev.38",
25
- "react-markdown": "^10.1.0"
22
+ "@epam/ai-dial-chat-shared": "1.1.0-dev.43",
23
+ "@epam/ai-dial-conversation-input": "1.1.0-dev.43",
24
+ "react-markdown": "^10.1.0",
25
+ "@epam/ai-dial-ui-kit": "^0.13.0-dev.12"
26
26
  },
27
27
  "repository": {
28
28
  "type": "git",