@yext/chat-ui-react 0.5.6 → 0.6.0-alpha.38.2

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 (156) hide show
  1. package/README.md +9 -11
  2. package/THIRD-PARTY-NOTICES +1 -1
  3. package/lib/commonjs/package.json.js +6 -0
  4. package/lib/commonjs/package.json.js.map +1 -0
  5. package/lib/commonjs/src/components/ChatHeader.js +21 -20
  6. package/lib/commonjs/src/components/ChatHeader.js.map +1 -1
  7. package/lib/commonjs/src/components/ChatInput.js +28 -26
  8. package/lib/commonjs/src/components/ChatInput.js.map +1 -1
  9. package/lib/commonjs/src/components/ChatPanel.d.ts.map +1 -1
  10. package/lib/commonjs/src/components/ChatPanel.js +28 -28
  11. package/lib/commonjs/src/components/ChatPanel.js.map +1 -1
  12. package/lib/commonjs/src/components/ChatPopUp.d.ts.map +1 -1
  13. package/lib/commonjs/src/components/ChatPopUp.js +24 -23
  14. package/lib/commonjs/src/components/ChatPopUp.js.map +1 -1
  15. package/lib/commonjs/src/components/FeedbackButtons.js +21 -20
  16. package/lib/commonjs/src/components/FeedbackButtons.js.map +1 -1
  17. package/lib/commonjs/src/components/LoadingDots.js +8 -7
  18. package/lib/commonjs/src/components/LoadingDots.js.map +1 -1
  19. package/lib/commonjs/src/components/Markdown.js +26 -21
  20. package/lib/commonjs/src/components/Markdown.js.map +1 -1
  21. package/lib/commonjs/src/components/MessageBubble.js +20 -19
  22. package/lib/commonjs/src/components/MessageBubble.js.map +1 -1
  23. package/lib/commonjs/src/components/index.d.ts +0 -1
  24. package/lib/commonjs/src/components/index.d.ts.map +1 -1
  25. package/lib/commonjs/src/hooks/useComposedCssClasses.js +9 -8
  26. package/lib/commonjs/src/hooks/useComposedCssClasses.js.map +1 -1
  27. package/lib/commonjs/src/hooks/useDefaultHandleApiError.js +10 -9
  28. package/lib/commonjs/src/hooks/useDefaultHandleApiError.js.map +1 -1
  29. package/lib/commonjs/src/hooks/useReportAnalyticsEvent.d.ts.map +1 -1
  30. package/lib/commonjs/src/hooks/useReportAnalyticsEvent.js +11 -14
  31. package/lib/commonjs/src/hooks/useReportAnalyticsEvent.js.map +1 -1
  32. package/lib/commonjs/src/icons/Arrow.js +7 -6
  33. package/lib/commonjs/src/icons/Arrow.js.map +1 -1
  34. package/lib/commonjs/src/icons/Chat.js +7 -6
  35. package/lib/commonjs/src/icons/Chat.js.map +1 -1
  36. package/lib/commonjs/src/icons/Cross.js +7 -6
  37. package/lib/commonjs/src/icons/Cross.js.map +1 -1
  38. package/lib/commonjs/src/icons/DualSync.js +7 -6
  39. package/lib/commonjs/src/icons/DualSync.js.map +1 -1
  40. package/lib/commonjs/src/icons/ThumbsDown.js +7 -6
  41. package/lib/commonjs/src/icons/ThumbsDown.js.map +1 -1
  42. package/lib/commonjs/src/icons/ThumbsDownFill.js +7 -6
  43. package/lib/commonjs/src/icons/ThumbsDownFill.js.map +1 -1
  44. package/lib/commonjs/src/icons/ThumbsUp.js +7 -6
  45. package/lib/commonjs/src/icons/ThumbsUp.js.map +1 -1
  46. package/lib/commonjs/src/icons/ThumbsUpFill.js +7 -6
  47. package/lib/commonjs/src/icons/ThumbsUpFill.js.map +1 -1
  48. package/lib/commonjs/src/index.js +18 -19
  49. package/lib/commonjs/src/index.js.map +1 -1
  50. package/lib/commonjs/src/utils/withStylelessCssClasses.js +4 -4
  51. package/lib/commonjs/src/utils/withStylelessCssClasses.js.map +1 -1
  52. package/lib/esm/index.d.ts +0 -12
  53. package/lib/esm/package.json.mjs +4 -0
  54. package/lib/esm/package.json.mjs.map +1 -0
  55. package/lib/esm/src/components/{ChatHeader.js → ChatHeader.mjs} +14 -11
  56. package/lib/esm/src/components/ChatHeader.mjs.map +1 -0
  57. package/lib/esm/src/components/{ChatInput.js → ChatInput.mjs} +14 -11
  58. package/lib/esm/src/components/ChatInput.mjs.map +1 -0
  59. package/lib/esm/src/components/ChatPanel.d.ts.map +1 -1
  60. package/lib/esm/src/components/{ChatPanel.js → ChatPanel.mjs} +16 -14
  61. package/lib/esm/src/components/ChatPanel.mjs.map +1 -0
  62. package/lib/esm/src/components/ChatPopUp.d.ts.map +1 -1
  63. package/lib/esm/src/components/{ChatPopUp.js → ChatPopUp.mjs} +15 -12
  64. package/lib/esm/src/components/ChatPopUp.mjs.map +1 -0
  65. package/lib/esm/src/components/{FeedbackButtons.js → FeedbackButtons.mjs} +15 -12
  66. package/lib/esm/src/components/FeedbackButtons.mjs.map +1 -0
  67. package/lib/esm/src/components/LoadingDots.mjs +14 -0
  68. package/lib/esm/src/components/LoadingDots.mjs.map +1 -0
  69. package/lib/esm/src/components/{Markdown.js → Markdown.mjs} +14 -11
  70. package/lib/esm/src/components/Markdown.mjs.map +1 -0
  71. package/lib/esm/src/components/{MessageBubble.js → MessageBubble.mjs} +13 -10
  72. package/lib/esm/src/components/MessageBubble.mjs.map +1 -0
  73. package/lib/esm/src/components/index.d.ts +0 -1
  74. package/lib/esm/src/components/index.d.ts.map +1 -1
  75. package/lib/esm/src/hooks/{useComposedCssClasses.js → useComposedCssClasses.mjs} +7 -4
  76. package/lib/esm/src/hooks/useComposedCssClasses.mjs.map +1 -0
  77. package/lib/esm/src/hooks/{useDefaultHandleApiError.js → useDefaultHandleApiError.mjs} +7 -4
  78. package/lib/esm/src/hooks/useDefaultHandleApiError.mjs.map +1 -0
  79. package/lib/esm/src/hooks/useReportAnalyticsEvent.d.ts.map +1 -1
  80. package/lib/esm/src/hooks/{useReportAnalyticsEvent.js → useReportAnalyticsEvent.mjs} +8 -6
  81. package/lib/esm/src/hooks/useReportAnalyticsEvent.mjs.map +1 -0
  82. package/lib/esm/src/icons/Arrow.mjs +8 -0
  83. package/lib/esm/src/icons/Arrow.mjs.map +1 -0
  84. package/lib/esm/src/icons/Chat.mjs +8 -0
  85. package/lib/esm/src/icons/Chat.mjs.map +1 -0
  86. package/lib/esm/src/icons/Cross.mjs +8 -0
  87. package/lib/esm/src/icons/Cross.mjs.map +1 -0
  88. package/lib/esm/src/icons/DualSync.mjs +8 -0
  89. package/lib/esm/src/icons/DualSync.mjs.map +1 -0
  90. package/lib/esm/src/icons/ThumbsDown.mjs +8 -0
  91. package/lib/esm/src/icons/ThumbsDown.mjs.map +1 -0
  92. package/lib/esm/src/icons/ThumbsDownFill.mjs +8 -0
  93. package/lib/esm/src/icons/ThumbsDownFill.mjs.map +1 -0
  94. package/lib/esm/src/icons/ThumbsUp.mjs +8 -0
  95. package/lib/esm/src/icons/ThumbsUp.mjs.map +1 -0
  96. package/lib/esm/src/icons/ThumbsUpFill.mjs +8 -0
  97. package/lib/esm/src/icons/ThumbsUpFill.mjs.map +1 -0
  98. package/lib/esm/src/index.mjs +7 -0
  99. package/lib/esm/src/index.mjs.map +1 -0
  100. package/lib/esm/src/utils/{withStylelessCssClasses.js → withStylelessCssClasses.mjs} +4 -2
  101. package/lib/esm/src/utils/withStylelessCssClasses.mjs.map +1 -0
  102. package/package.json +9 -6
  103. package/src/components/ChatPanel.tsx +18 -16
  104. package/src/components/ChatPopUp.tsx +26 -22
  105. package/src/components/index.ts +0 -2
  106. package/src/hooks/useReportAnalyticsEvent.ts +1 -2
  107. package/lib/commonjs/package.json +0 -99
  108. package/lib/commonjs/src/components/ChatStyleProvider.d.ts +0 -13
  109. package/lib/commonjs/src/components/ChatStyleProvider.d.ts.map +0 -1
  110. package/lib/commonjs/src/components/ChatStyleProvider.js +0 -19
  111. package/lib/commonjs/src/components/ChatStyleProvider.js.map +0 -1
  112. package/lib/commonjs/src/components/index.js +0 -16
  113. package/lib/commonjs/src/components/index.js.map +0 -1
  114. package/lib/commonjs/src/hooks/index.js +0 -6
  115. package/lib/commonjs/src/hooks/index.js.map +0 -1
  116. package/lib/esm/package.json +0 -99
  117. package/lib/esm/src/components/ChatHeader.js.map +0 -1
  118. package/lib/esm/src/components/ChatInput.js.map +0 -1
  119. package/lib/esm/src/components/ChatPanel.js.map +0 -1
  120. package/lib/esm/src/components/ChatPopUp.js.map +0 -1
  121. package/lib/esm/src/components/ChatStyleProvider.d.ts +0 -13
  122. package/lib/esm/src/components/ChatStyleProvider.d.ts.map +0 -1
  123. package/lib/esm/src/components/ChatStyleProvider.js +0 -15
  124. package/lib/esm/src/components/ChatStyleProvider.js.map +0 -1
  125. package/lib/esm/src/components/FeedbackButtons.js.map +0 -1
  126. package/lib/esm/src/components/LoadingDots.js +0 -11
  127. package/lib/esm/src/components/LoadingDots.js.map +0 -1
  128. package/lib/esm/src/components/Markdown.js.map +0 -1
  129. package/lib/esm/src/components/MessageBubble.js.map +0 -1
  130. package/lib/esm/src/components/index.js +0 -7
  131. package/lib/esm/src/components/index.js.map +0 -1
  132. package/lib/esm/src/hooks/index.js +0 -2
  133. package/lib/esm/src/hooks/index.js.map +0 -1
  134. package/lib/esm/src/hooks/useComposedCssClasses.js.map +0 -1
  135. package/lib/esm/src/hooks/useDefaultHandleApiError.js.map +0 -1
  136. package/lib/esm/src/hooks/useReportAnalyticsEvent.js.map +0 -1
  137. package/lib/esm/src/icons/Arrow.js +0 -5
  138. package/lib/esm/src/icons/Arrow.js.map +0 -1
  139. package/lib/esm/src/icons/Chat.js +0 -5
  140. package/lib/esm/src/icons/Chat.js.map +0 -1
  141. package/lib/esm/src/icons/Cross.js +0 -5
  142. package/lib/esm/src/icons/Cross.js.map +0 -1
  143. package/lib/esm/src/icons/DualSync.js +0 -5
  144. package/lib/esm/src/icons/DualSync.js.map +0 -1
  145. package/lib/esm/src/icons/ThumbsDown.js +0 -5
  146. package/lib/esm/src/icons/ThumbsDown.js.map +0 -1
  147. package/lib/esm/src/icons/ThumbsDownFill.js +0 -5
  148. package/lib/esm/src/icons/ThumbsDownFill.js.map +0 -1
  149. package/lib/esm/src/icons/ThumbsUp.js +0 -5
  150. package/lib/esm/src/icons/ThumbsUp.js.map +0 -1
  151. package/lib/esm/src/icons/ThumbsUpFill.js +0 -5
  152. package/lib/esm/src/icons/ThumbsUpFill.js.map +0 -1
  153. package/lib/esm/src/index.js +0 -3
  154. package/lib/esm/src/index.js.map +0 -1
  155. package/lib/esm/src/utils/withStylelessCssClasses.js.map +0 -1
  156. package/src/components/ChatStyleProvider.tsx +0 -15
@@ -1,9 +1,10 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.ThumbsUpIcon = void 0;
4
- const jsx_runtime_1 = require("react/jsx-runtime");
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+
5
5
  function ThumbsUpIcon({ className, }) {
6
- return ((0, jsx_runtime_1.jsx)("svg", { width: "100%", height: "100%", viewBox: "0 0 20 20", stroke: "currentColor", className: className, xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M5 13.9091C5.13887 14.2691 5.65964 14.8582 6.9789 15.5127C6.9789 15.5127 7.63854 15.8727 8.61063 15.9709C8.61063 15.9709 9.68687 16.0364 10.6242 15.9709C10.6242 15.9709 12.2907 16.0364 12.3601 14.3018C12.3601 14.3018 13.4711 13.7455 13.1934 12.5019C13.1934 12.5019 14.4779 11.8473 13.9919 10.5055C13.9919 10.5055 14.9639 10.1455 14.9987 9.03281C14.9987 9.03281 15.1028 7.72374 13.4711 7.42919H10.3465C10.3465 7.42919 10.8673 6.31648 10.8673 5.59649C10.8673 5.59649 10.8673 3.76378 8.68007 4.0256C8.68007 4.0256 7.84684 4.12378 7.49967 5.26922C7.49967 5.26922 7.01362 6.64375 6.45814 7.16738C6.45814 7.16738 5.69435 7.95283 5.20831 8.34555C5.20831 8.34555 4.82641 8.70554 5.17359 9.03281C5.17359 9.03281 5.48605 9.2619 5.76379 9.03281C6.11096 8.70554 7.11777 7.78919 7.11777 7.78919C7.11777 7.78919 7.81212 7.10193 8.02043 6.51284L8.40233 5.49831C8.40233 5.49831 8.50648 4.71286 9.3397 4.90923C9.3397 4.90923 10.0688 5.00741 9.96462 5.79285C9.96462 5.79285 9.72159 6.74193 9.54801 7.10193C9.54801 7.10193 9.37442 7.4292 9.30498 7.62556C9.30498 7.62556 9.13139 7.82192 9.23555 8.05101C9.23555 8.05101 9.27026 8.37827 9.79103 8.31282H13.2975C13.2975 8.31282 14.339 8.44373 14.0266 9.36008C14.0266 9.36008 13.8877 9.72008 13.4364 9.85098C13.4364 9.85098 12.985 9.88371 12.9156 10.1455C12.9156 10.1455 12.7767 10.3746 13.0545 10.6364C13.0545 10.6364 13.4364 10.9964 13.1239 11.5528C13.1239 11.5528 12.985 11.8473 12.5337 11.9128C12.5337 11.9128 11.9782 12.0764 12.2907 12.5673C12.2907 12.5673 12.6032 13.0255 12.1865 13.4509C12.1865 13.4509 11.7699 13.7128 11.6658 13.7455C11.6658 13.7455 11.388 13.9418 11.5269 14.2037C11.5269 14.2037 11.6658 14.6291 11.2839 14.9236C11.2839 14.9236 11.0756 15.12 10.7284 15.1527C10.7284 15.1527 8.78422 15.1527 8.40233 15.0873C8.40233 15.0873 7.49967 15.0873 6.28455 13.9746C6.28455 13.9746 5.69435 13.2873 5.3819 13.4509C5.3819 13.4509 5 13.5818 5.06944 13.9418L5 13.9091Z", fill: "currentColor" }) }));
6
+ return (jsxRuntime.jsx("svg", { width: "100%", height: "100%", viewBox: "0 0 20 20", stroke: "currentColor", className: className, xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M5 13.9091C5.13887 14.2691 5.65964 14.8582 6.9789 15.5127C6.9789 15.5127 7.63854 15.8727 8.61063 15.9709C8.61063 15.9709 9.68687 16.0364 10.6242 15.9709C10.6242 15.9709 12.2907 16.0364 12.3601 14.3018C12.3601 14.3018 13.4711 13.7455 13.1934 12.5019C13.1934 12.5019 14.4779 11.8473 13.9919 10.5055C13.9919 10.5055 14.9639 10.1455 14.9987 9.03281C14.9987 9.03281 15.1028 7.72374 13.4711 7.42919H10.3465C10.3465 7.42919 10.8673 6.31648 10.8673 5.59649C10.8673 5.59649 10.8673 3.76378 8.68007 4.0256C8.68007 4.0256 7.84684 4.12378 7.49967 5.26922C7.49967 5.26922 7.01362 6.64375 6.45814 7.16738C6.45814 7.16738 5.69435 7.95283 5.20831 8.34555C5.20831 8.34555 4.82641 8.70554 5.17359 9.03281C5.17359 9.03281 5.48605 9.2619 5.76379 9.03281C6.11096 8.70554 7.11777 7.78919 7.11777 7.78919C7.11777 7.78919 7.81212 7.10193 8.02043 6.51284L8.40233 5.49831C8.40233 5.49831 8.50648 4.71286 9.3397 4.90923C9.3397 4.90923 10.0688 5.00741 9.96462 5.79285C9.96462 5.79285 9.72159 6.74193 9.54801 7.10193C9.54801 7.10193 9.37442 7.4292 9.30498 7.62556C9.30498 7.62556 9.13139 7.82192 9.23555 8.05101C9.23555 8.05101 9.27026 8.37827 9.79103 8.31282H13.2975C13.2975 8.31282 14.339 8.44373 14.0266 9.36008C14.0266 9.36008 13.8877 9.72008 13.4364 9.85098C13.4364 9.85098 12.985 9.88371 12.9156 10.1455C12.9156 10.1455 12.7767 10.3746 13.0545 10.6364C13.0545 10.6364 13.4364 10.9964 13.1239 11.5528C13.1239 11.5528 12.985 11.8473 12.5337 11.9128C12.5337 11.9128 11.9782 12.0764 12.2907 12.5673C12.2907 12.5673 12.6032 13.0255 12.1865 13.4509C12.1865 13.4509 11.7699 13.7128 11.6658 13.7455C11.6658 13.7455 11.388 13.9418 11.5269 14.2037C11.5269 14.2037 11.6658 14.6291 11.2839 14.9236C11.2839 14.9236 11.0756 15.12 10.7284 15.1527C10.7284 15.1527 8.78422 15.1527 8.40233 15.0873C8.40233 15.0873 7.49967 15.0873 6.28455 13.9746C6.28455 13.9746 5.69435 13.2873 5.3819 13.4509C5.3819 13.4509 5 13.5818 5.06944 13.9418L5 13.9091Z", fill: "currentColor" }) }));
7
7
  }
8
+
8
9
  exports.ThumbsUpIcon = ThumbsUpIcon;
9
- //# sourceMappingURL=ThumbsUp.js.map
10
+ //# sourceMappingURL=ThumbsUp.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ThumbsUp.js","sourceRoot":"","sources":["../../../../src/icons/ThumbsUp.tsx"],"names":[],"mappings":";;;;AAAA,SAAgB,YAAY,CAAC,EAC3B,SAAS,GAGV;IACC,OAAO,CACL,gCACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,cAAc,EACrB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,YAElC,iCACE,CAAC,EAAC,i3DAAi3D,EACn3D,IAAI,EAAC,cAAc,GACnB,GACE,CACP,CAAC;AACJ,CAAC;AApBD,oCAoBC"}
1
+ {"version":3,"file":"ThumbsUp.js","sources":["../../../../src/icons/ThumbsUp.tsx"],"sourcesContent":["export function ThumbsUpIcon({\n className,\n}: {\n className?: string;\n}): JSX.Element {\n return (\n <svg\n width=\"100%\"\n height=\"100%\"\n viewBox=\"0 0 20 20\"\n stroke=\"currentColor\"\n className={className}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M5 13.9091C5.13887 14.2691 5.65964 14.8582 6.9789 15.5127C6.9789 15.5127 7.63854 15.8727 8.61063 15.9709C8.61063 15.9709 9.68687 16.0364 10.6242 15.9709C10.6242 15.9709 12.2907 16.0364 12.3601 14.3018C12.3601 14.3018 13.4711 13.7455 13.1934 12.5019C13.1934 12.5019 14.4779 11.8473 13.9919 10.5055C13.9919 10.5055 14.9639 10.1455 14.9987 9.03281C14.9987 9.03281 15.1028 7.72374 13.4711 7.42919H10.3465C10.3465 7.42919 10.8673 6.31648 10.8673 5.59649C10.8673 5.59649 10.8673 3.76378 8.68007 4.0256C8.68007 4.0256 7.84684 4.12378 7.49967 5.26922C7.49967 5.26922 7.01362 6.64375 6.45814 7.16738C6.45814 7.16738 5.69435 7.95283 5.20831 8.34555C5.20831 8.34555 4.82641 8.70554 5.17359 9.03281C5.17359 9.03281 5.48605 9.2619 5.76379 9.03281C6.11096 8.70554 7.11777 7.78919 7.11777 7.78919C7.11777 7.78919 7.81212 7.10193 8.02043 6.51284L8.40233 5.49831C8.40233 5.49831 8.50648 4.71286 9.3397 4.90923C9.3397 4.90923 10.0688 5.00741 9.96462 5.79285C9.96462 5.79285 9.72159 6.74193 9.54801 7.10193C9.54801 7.10193 9.37442 7.4292 9.30498 7.62556C9.30498 7.62556 9.13139 7.82192 9.23555 8.05101C9.23555 8.05101 9.27026 8.37827 9.79103 8.31282H13.2975C13.2975 8.31282 14.339 8.44373 14.0266 9.36008C14.0266 9.36008 13.8877 9.72008 13.4364 9.85098C13.4364 9.85098 12.985 9.88371 12.9156 10.1455C12.9156 10.1455 12.7767 10.3746 13.0545 10.6364C13.0545 10.6364 13.4364 10.9964 13.1239 11.5528C13.1239 11.5528 12.985 11.8473 12.5337 11.9128C12.5337 11.9128 11.9782 12.0764 12.2907 12.5673C12.2907 12.5673 12.6032 13.0255 12.1865 13.4509C12.1865 13.4509 11.7699 13.7128 11.6658 13.7455C11.6658 13.7455 11.388 13.9418 11.5269 14.2037C11.5269 14.2037 11.6658 14.6291 11.2839 14.9236C11.2839 14.9236 11.0756 15.12 10.7284 15.1527C10.7284 15.1527 8.78422 15.1527 8.40233 15.0873C8.40233 15.0873 7.49967 15.0873 6.28455 13.9746C6.28455 13.9746 5.69435 13.2873 5.3819 13.4509C5.3819 13.4509 5 13.5818 5.06944 13.9418L5 13.9091Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"names":["_jsx"],"mappings":";;;;AAAgB,SAAA,YAAY,CAAC,EAC3B,SAAS,GAGV,EAAA;AACC,IAAA,QACEA,cACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,MAAM,EAAC,cAAc,EACrB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,YAElCA,cACE,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,i3DAAi3D,EACn3D,IAAI,EAAC,cAAc,EACnB,CAAA,EAAA,CACE,EACN;AACJ;;;;"}
@@ -1,9 +1,10 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.ThumbsUpFillIcon = void 0;
4
- const jsx_runtime_1 = require("react/jsx-runtime");
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+
5
5
  function ThumbsUpFillIcon({ className, }) {
6
- return ((0, jsx_runtime_1.jsx)("svg", { width: "100%", height: "100%", viewBox: "0 0 20 20", fill: "none", className: className, xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M14.059 10.5061C14.5293 11.8877 13.2864 12.5128 13.2864 12.5128C13.5887 13.7299 12.4802 14.322 12.4802 14.322C12.413 16.0655 10.8006 15.9997 10.8006 15.9997C9.89359 15.9997 8.85223 15.9997 8.85223 15.9997C7.91166 15.901 7.27341 15.5391 7.27341 15.5391C6.29924 15.0457 5.79536 14.5852 5.52663 14.2233C5.52663 14.2233 4.51887 11.6904 5.29148 8.89426C5.33673 8.73052 5.35867 8.69688 5.39226 8.63109C5.45944 8.43372 5.52663 8.36793 5.52663 8.36793C6.0641 8.00608 6.73594 7.18369 6.73594 7.18369C7.27341 6.69026 7.7437 5.27576 7.7437 5.27576C8.07962 4.12442 8.88583 4.02573 8.88583 4.02573C11.0357 3.76257 11.0021 5.60471 11.0021 5.60471C11.0021 6.32841 10.4982 7.41396 10.4982 7.41396H13.5215C15.0668 7.71002 14.9996 9.05873 14.9996 9.05873C14.9996 10.1772 14.0254 10.539 14.0254 10.539L14.059 10.5061Z", fill: "currentColor" }) }));
6
+ return (jsxRuntime.jsx("svg", { width: "100%", height: "100%", viewBox: "0 0 20 20", fill: "none", className: className, xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M14.059 10.5061C14.5293 11.8877 13.2864 12.5128 13.2864 12.5128C13.5887 13.7299 12.4802 14.322 12.4802 14.322C12.413 16.0655 10.8006 15.9997 10.8006 15.9997C9.89359 15.9997 8.85223 15.9997 8.85223 15.9997C7.91166 15.901 7.27341 15.5391 7.27341 15.5391C6.29924 15.0457 5.79536 14.5852 5.52663 14.2233C5.52663 14.2233 4.51887 11.6904 5.29148 8.89426C5.33673 8.73052 5.35867 8.69688 5.39226 8.63109C5.45944 8.43372 5.52663 8.36793 5.52663 8.36793C6.0641 8.00608 6.73594 7.18369 6.73594 7.18369C7.27341 6.69026 7.7437 5.27576 7.7437 5.27576C8.07962 4.12442 8.88583 4.02573 8.88583 4.02573C11.0357 3.76257 11.0021 5.60471 11.0021 5.60471C11.0021 6.32841 10.4982 7.41396 10.4982 7.41396H13.5215C15.0668 7.71002 14.9996 9.05873 14.9996 9.05873C14.9996 10.1772 14.0254 10.539 14.0254 10.539L14.059 10.5061Z", fill: "currentColor" }) }));
7
7
  }
8
+
8
9
  exports.ThumbsUpFillIcon = ThumbsUpFillIcon;
9
- //# sourceMappingURL=ThumbsUpFill.js.map
10
+ //# sourceMappingURL=ThumbsUpFill.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ThumbsUpFill.js","sourceRoot":"","sources":["../../../../src/icons/ThumbsUpFill.tsx"],"names":[],"mappings":";;;;AAAA,SAAgB,gBAAgB,CAAC,EAC/B,SAAS,GAGV;IACC,OAAO,CACL,gCACE,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,YAElC,iCACE,CAAC,EAAC,gyBAAgyB,EAClyB,IAAI,EAAC,cAAc,GACnB,GACE,CACP,CAAC;AACJ,CAAC;AApBD,4CAoBC"}
1
+ {"version":3,"file":"ThumbsUpFill.js","sources":["../../../../src/icons/ThumbsUpFill.tsx"],"sourcesContent":["export function ThumbsUpFillIcon({\n className,\n}: {\n className?: string;\n}): JSX.Element {\n return (\n <svg\n width=\"100%\"\n height=\"100%\"\n viewBox=\"0 0 20 20\"\n fill=\"none\"\n className={className}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M14.059 10.5061C14.5293 11.8877 13.2864 12.5128 13.2864 12.5128C13.5887 13.7299 12.4802 14.322 12.4802 14.322C12.413 16.0655 10.8006 15.9997 10.8006 15.9997C9.89359 15.9997 8.85223 15.9997 8.85223 15.9997C7.91166 15.901 7.27341 15.5391 7.27341 15.5391C6.29924 15.0457 5.79536 14.5852 5.52663 14.2233C5.52663 14.2233 4.51887 11.6904 5.29148 8.89426C5.33673 8.73052 5.35867 8.69688 5.39226 8.63109C5.45944 8.43372 5.52663 8.36793 5.52663 8.36793C6.0641 8.00608 6.73594 7.18369 6.73594 7.18369C7.27341 6.69026 7.7437 5.27576 7.7437 5.27576C8.07962 4.12442 8.88583 4.02573 8.88583 4.02573C11.0357 3.76257 11.0021 5.60471 11.0021 5.60471C11.0021 6.32841 10.4982 7.41396 10.4982 7.41396H13.5215C15.0668 7.71002 14.9996 9.05873 14.9996 9.05873C14.9996 10.1772 14.0254 10.539 14.0254 10.539L14.059 10.5061Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n}\n"],"names":["_jsx"],"mappings":";;;;AAAgB,SAAA,gBAAgB,CAAC,EAC/B,SAAS,GAGV,EAAA;AACC,IAAA,QACEA,cACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,SAAS,EACpB,KAAK,EAAC,4BAA4B,YAElCA,cACE,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,gyBAAgyB,EAClyB,IAAI,EAAC,cAAc,EACnB,CAAA,EAAA,CACE,EACN;AACJ;;;;"}
@@ -1,19 +1,18 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
- };
16
- Object.defineProperty(exports, "__esModule", { value: true });
17
- __exportStar(require("./components"), exports);
18
- __exportStar(require("./hooks"), exports);
19
- //# sourceMappingURL=index.js.map
1
+ 'use strict';
2
+
3
+ var ChatInput = require('./components/ChatInput.js');
4
+ var ChatHeader = require('./components/ChatHeader.js');
5
+ var MessageBubble = require('./components/MessageBubble.js');
6
+ var ChatPanel = require('./components/ChatPanel.js');
7
+ var ChatPopUp = require('./components/ChatPopUp.js');
8
+ var useComposedCssClasses = require('./hooks/useComposedCssClasses.js');
9
+
10
+
11
+
12
+ exports.ChatInput = ChatInput.ChatInput;
13
+ exports.ChatHeader = ChatHeader.ChatHeader;
14
+ exports.MessageBubble = MessageBubble.MessageBubble;
15
+ exports.ChatPanel = ChatPanel.ChatPanel;
16
+ exports.ChatPopUp = ChatPopUp.ChatPopUp;
17
+ exports.useComposedCssClasses = useComposedCssClasses.useComposedCssClasses;
18
+ //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,+CAA6B;AAC7B,0CAAwB"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
@@ -1,6 +1,5 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.withStylelessCssClasses = void 0;
1
+ 'use strict';
2
+
4
3
  /**
5
4
  * Append styleless css classnames that user can target to add custom styling to components.
6
5
  * The classes follows a format of "yext-chat-component-name__css-interface-field-name".
@@ -26,5 +25,6 @@ function withStylelessCssClasses(componentName, builtInClasses) {
26
25
  });
27
26
  return classes;
28
27
  }
28
+
29
29
  exports.withStylelessCssClasses = withStylelessCssClasses;
30
- //# sourceMappingURL=withStylelessCssClasses.js.map
30
+ //# sourceMappingURL=withStylelessCssClasses.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"withStylelessCssClasses.js","sourceRoot":"","sources":["../../../../src/utils/withStylelessCssClasses.ts"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;GAcG;AACH,SAAgB,uBAAuB,CAGrC,aAAqB,EACrB,cAAkD;IAElD,MAAM,YAAY,GAAG,CAAC,GAAW,EAAE,EAAE,CACnC,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,KAAK,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;IAC9D,MAAM,OAAO,GAAG,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;QAC1C,IAAI,OAAO,OAAO,CAAC,GAAG,CAAC,KAAK,QAAQ,EAAE;YACpC,OAAO,CAAC,GAAG,CAAC,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,aAAa,YAAY,CACrD,aAAa,CACd,KAAK,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;SAC3B;IACH,CAAC,CAAC,CAAC;IACH,OAAO,OAAO,CAAC;AACjB,CAAC;AAjBD,0DAiBC"}
1
+ {"version":3,"file":"withStylelessCssClasses.js","sources":["../../../../src/utils/withStylelessCssClasses.ts"],"sourcesContent":["/**\n * Append styleless css classnames that user can target to add custom styling to components.\n * The classes follows a format of \"yext-chat-component-name__css-interface-field-name\".\n *\n * @example\n * the styleless css class name for {@link MessageBubble}'s \"message__bot\" field defined\n * in its {@link MessageBubbleCssClasses} interface is \"yext-chat-message-bubble__message__bot\"\n *\n * @internal\n *\n * @param componentName - the component name\n * @param builtInClasses - built in css classnames of the component\n *\n * @returns builtInClasses with styleless css classnames\n */\nexport function withStylelessCssClasses<\n ClassInterface extends Partial<Record<keyof ClassInterface, string | object>>\n>(\n componentName: string,\n builtInClasses: Readonly<Required<ClassInterface>>\n): ClassInterface {\n const formatString = (str: string) =>\n str.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);\n const classes = { ...builtInClasses };\n Object.keys(builtInClasses).forEach((key) => {\n if (typeof classes[key] === \"string\") {\n classes[key] = `${classes[key]} yext-chat${formatString(\n componentName\n )}__${formatString(key)}`;\n }\n });\n return classes;\n}\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AACa,SAAA,uBAAuB,CAGrC,aAAqB,EACrB,cAAkD,EAAA;IAElD,MAAM,YAAY,GAAG,CAAC,GAAW,KAC/B,GAAG,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,KAAK,CAAA,CAAA,EAAI,KAAK,CAAC,WAAW,EAAE,CAAE,CAAA,CAAC,CAAC;AAC9D,IAAA,MAAM,OAAO,GAAG,EAAE,GAAG,cAAc,EAAE,CAAC;IACtC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,KAAI;AAC1C,QAAA,IAAI,OAAO,OAAO,CAAC,GAAG,CAAC,KAAK,QAAQ,EAAE;YACpC,OAAO,CAAC,GAAG,CAAC,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,CAAA,UAAA,EAAa,YAAY,CACrD,aAAa,CACd,CAAK,EAAA,EAAA,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC;AAC3B,SAAA;AACH,KAAC,CAAC,CAAC;AACH,IAAA,OAAO,OAAO,CAAC;AACjB;;;;"}
@@ -2,7 +2,6 @@
2
2
 
3
3
  import { JSX as JSX_2 } from 'react/jsx-runtime';
4
4
  import { Message } from '@yext/chat-headless-react';
5
- import { PropsWithChildren } from 'react';
6
5
 
7
6
  /**
8
7
  * A component that renders the header of a chat bot panel,
@@ -193,17 +192,6 @@ export declare interface ChatPopUpProps extends Omit<ChatHeaderProps, "showClose
193
192
  customCssClasses?: ChatPopUpCssClasses;
194
193
  }
195
194
 
196
- /**
197
- * Adds Chat styling scoped to this component and its children.
198
- *
199
- * @remarks
200
- * Internaly, this will import "\@yext/chat-ui-react/bundle.css".
201
- * This is for use cases where the application doesn't use tailwind.
202
- *
203
- * @public
204
- */
205
- export declare function ChatStyleProvider({ children }: PropsWithChildren): JSX_2.Element;
206
-
207
195
  /**
208
196
  * The CSS class interface for the FeedbackButtons component.
209
197
  *
@@ -0,0 +1,4 @@
1
+ var version = "0.6.0-alpha.38.2";
2
+
3
+ export { version };
4
+ //# sourceMappingURL=package.json.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"package.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
@@ -1,11 +1,12 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useChatActions } from "@yext/chat-headless-react";
3
- import { DualSyncIcon } from "../icons/DualSync";
4
- import { useComposedCssClasses } from "../hooks/useComposedCssClasses";
5
- import { useCallback, useRef, useState } from "react";
6
- import { twMerge } from "tailwind-merge";
7
- import { CrossIcon } from "../icons/Cross";
8
- import { withStylelessCssClasses } from "../utils/withStylelessCssClasses";
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { useChatActions } from '@yext/chat-headless-react';
3
+ import { DualSyncIcon } from '../icons/DualSync.mjs';
4
+ import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
5
+ import { useState, useRef, useCallback } from 'react';
6
+ import { twMerge } from 'tailwind-merge';
7
+ import { CrossIcon } from '../icons/Cross.mjs';
8
+ import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
9
+
9
10
  const builtInCssClasses = withStylelessCssClasses("Header", {
10
11
  container: "w-full pl-4 pr-3 py-3 flex justify-between bg-gradient-to-tr from-blue-600 to-blue-800",
11
12
  title: "text-white text-xl font-medium truncate pr-1",
@@ -22,7 +23,7 @@ const builtInCssClasses = withStylelessCssClasses("Header", {
22
23
  *
23
24
  * @param props - {@link ChatHeaderProps}
24
25
  */
25
- export function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }) {
26
+ function ChatHeader({ title, showRestartButton, restartButtonIcon, showCloseButton, closeButtonIcon, onClose, customCssClasses, }) {
26
27
  const chat = useChatActions();
27
28
  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);
28
29
  const [isSpinning, setIsSpinning] = useState(false);
@@ -36,6 +37,8 @@ export function ChatHeader({ title, showRestartButton, restartButtonIcon, showCl
36
37
  }, 1000);
37
38
  chat.restartConversation();
38
39
  }, [chat]);
39
- return (_jsxs("div", { className: cssClasses.container, children: [_jsx("h1", { className: cssClasses.title, children: title }), showRestartButton && (_jsx("button", { "aria-label": "Restart Conversation", onClick: onRestart, className: restartButtonCssClasses, children: restartButtonIcon ?? (_jsx(DualSyncIcon, { className: cssClasses.restartButtonIcon })) })), showCloseButton && (_jsx("button", { "aria-label": "Close Chat", onClick: onClose, className: cssClasses.closeButton, children: closeButtonIcon ?? (_jsx(CrossIcon, { className: cssClasses.closeButtonIcon })) }))] }));
40
+ return (jsxs("div", { className: cssClasses.container, children: [jsx("h1", { className: cssClasses.title, children: title }), showRestartButton && (jsx("button", { "aria-label": "Restart Conversation", onClick: onRestart, className: restartButtonCssClasses, children: restartButtonIcon ?? (jsx(DualSyncIcon, { className: cssClasses.restartButtonIcon })) })), showCloseButton && (jsx("button", { "aria-label": "Close Chat", onClick: onClose, className: cssClasses.closeButton, children: closeButtonIcon ?? (jsx(CrossIcon, { className: cssClasses.closeButtonIcon })) }))] }));
40
41
  }
41
- //# sourceMappingURL=ChatHeader.js.map
42
+
43
+ export { ChatHeader };
44
+ //# sourceMappingURL=ChatHeader.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatHeader.mjs","sources":["../../../../src/components/ChatHeader.tsx"],"sourcesContent":["import { useChatActions } from \"@yext/chat-headless-react\";\nimport { DualSyncIcon } from \"../icons/DualSync\";\nimport { useComposedCssClasses } from \"../hooks/useComposedCssClasses\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { CrossIcon } from \"../icons/Cross\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\n\n/**\n * The CSS class interface for the {@link ChatHeader} component.\n *\n * @public\n */\nexport interface ChatHeaderCssClasses {\n container?: string;\n title?: string;\n restartButton?: string;\n restartButtonIcon?: string;\n closeButton?: string;\n closeButtonIcon?: string;\n}\n\nconst builtInCssClasses: Readonly<ChatHeaderCssClasses> =\n withStylelessCssClasses(\"Header\", {\n container:\n \"w-full pl-4 pr-3 py-3 flex justify-between bg-gradient-to-tr from-blue-600 to-blue-800\",\n title: \"text-white text-xl font-medium truncate pr-1\",\n restartButton: \"w-8 h-8 ml-auto shrink-0 flex justify-center items-center\",\n restartButtonIcon: \"text-white stroke-[0.2] w-[26px] h-[26px]\",\n closeButton:\n \"w-8 h-8 hover:scale-110 shrink-0 flex justify-center items-center\",\n closeButtonIcon: \"text-white w-[26px] h-[26px]\",\n });\n\n/**\n * The props for the {@link ChatHeader} component.\n *\n * @public\n */\nexport interface ChatHeaderProps {\n /**\n * The headers's title text, essentially how the chat window identifies itself to the user.\n */\n title: string;\n /**\n * Displays a restart button which allows the user to restart the conversation.\n * Defaults to false.\n */\n showRestartButton?: boolean;\n /**\n * Displays a close button which will invoke {@link ChatHeaderProps.onClose} on click.\n * Default to false.\n */\n showCloseButton?: boolean;\n /** A function which is called when the close button is clicked. */\n onClose?: () => void;\n /** Custom icon for for restart button. */\n restartButtonIcon?: JSX.Element;\n /** Custom icon for for close button. */\n closeButtonIcon?: JSX.Element;\n /** CSS classes for customizing the component styling. */\n customCssClasses?: ChatHeaderCssClasses;\n}\n\n/**\n * A component that renders the header of a chat bot panel,\n * including the title and a button to reset the conversation.\n *\n * @public\n *\n * @param props - {@link ChatHeaderProps}\n */\nexport function ChatHeader({\n title,\n showRestartButton,\n restartButtonIcon,\n showCloseButton,\n closeButtonIcon,\n onClose,\n customCssClasses,\n}: ChatHeaderProps) {\n const chat = useChatActions();\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n\n const [isSpinning, setIsSpinning] = useState(false);\n const restartButtonCssClasses = twMerge(\n cssClasses.restartButton,\n isSpinning ? \"animate-[spin_0.3s_linear]\" : \"hover:scale-110\"\n );\n\n const clearTimerRef = useRef<ReturnType<typeof setTimeout>>();\n const onRestart = useCallback(async () => {\n clearTimeout(clearTimerRef.current);\n setIsSpinning(true);\n clearTimerRef.current = setTimeout(() => {\n setIsSpinning(false);\n }, 1000);\n chat.restartConversation();\n }, [chat]);\n\n return (\n <div className={cssClasses.container}>\n <h1 className={cssClasses.title}>{title}</h1>\n {showRestartButton && (\n <button\n aria-label=\"Restart Conversation\"\n onClick={onRestart}\n className={restartButtonCssClasses}\n >\n {restartButtonIcon ?? (\n <DualSyncIcon className={cssClasses.restartButtonIcon} />\n )}\n </button>\n )}\n {showCloseButton && (\n <button\n aria-label=\"Close Chat\"\n onClick={onClose}\n className={cssClasses.closeButton}\n >\n {closeButtonIcon ?? (\n <CrossIcon className={cssClasses.closeButtonIcon} />\n )}\n </button>\n )}\n </div>\n );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AAsBA,MAAM,iBAAiB,GACrB,uBAAuB,CAAC,QAAQ,EAAE;AAChC,IAAA,SAAS,EACP,wFAAwF;AAC1F,IAAA,KAAK,EAAE,8CAA8C;AACrD,IAAA,aAAa,EAAE,2DAA2D;AAC1E,IAAA,iBAAiB,EAAE,2CAA2C;AAC9D,IAAA,WAAW,EACT,mEAAmE;AACrE,IAAA,eAAe,EAAE,8BAA8B;AAChD,CAAA,CAAC,CAAC;AAgCL;;;;;;;AAOG;SACa,UAAU,CAAC,EACzB,KAAK,EACL,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,OAAO,EACP,gBAAgB,GACA,EAAA;AAChB,IAAA,MAAM,IAAI,GAAG,cAAc,EAAE,CAAC;IAE9B,MAAM,UAAU,GAAG,qBAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAE9E,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AACpD,IAAA,MAAM,uBAAuB,GAAG,OAAO,CACrC,UAAU,CAAC,aAAa,EACxB,UAAU,GAAG,4BAA4B,GAAG,iBAAiB,CAC9D,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG,MAAM,EAAiC,CAAC;AAC9D,IAAA,MAAM,SAAS,GAAG,WAAW,CAAC,YAAW;AACvC,QAAA,YAAY,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QACpC,aAAa,CAAC,IAAI,CAAC,CAAC;AACpB,QAAA,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC,MAAK;YACtC,aAAa,CAAC,KAAK,CAAC,CAAC;SACtB,EAAE,IAAI,CAAC,CAAC;QACT,IAAI,CAAC,mBAAmB,EAAE,CAAC;AAC7B,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;AAEX,IAAA,QACEA,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA,QAAA,EAAA,CAClCC,GAAI,CAAA,IAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,KAAK,EAAG,QAAA,EAAA,KAAK,GAAM,EAC5C,iBAAiB,KAChBA,8BACa,sBAAsB,EACjC,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE,uBAAuB,YAEjC,iBAAiB,KAChBA,GAAC,CAAA,YAAY,IAAC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAI,CAAA,CAC1D,EACM,CAAA,CACV,EACA,eAAe,KACdA,GAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EACa,YAAY,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,UAAU,CAAC,WAAW,YAEhC,eAAe,KACdA,GAAC,CAAA,SAAS,IAAC,SAAS,EAAE,UAAU,CAAC,eAAe,EAAI,CAAA,CACrD,GACM,CACV,CAAA,EAAA,CACG,EACN;AACJ;;;;"}
@@ -1,11 +1,12 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useCallback, useState } from "react";
3
- import { useChatActions, useChatState } from "@yext/chat-headless-react";
4
- import { ArrowIcon } from "../icons/Arrow";
5
- import { useComposedCssClasses } from "../hooks";
6
- import TextareaAutosize from "react-textarea-autosize";
7
- import { useDefaultHandleApiError } from "../hooks/useDefaultHandleApiError";
8
- import { withStylelessCssClasses } from "../utils/withStylelessCssClasses";
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { useState, useCallback } from 'react';
3
+ import { useChatActions, useChatState } from '@yext/chat-headless-react';
4
+ import { ArrowIcon } from '../icons/Arrow.mjs';
5
+ import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
6
+ import TextareaAutosize from 'react-textarea-autosize';
7
+ import { useDefaultHandleApiError } from '../hooks/useDefaultHandleApiError.mjs';
8
+ import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
9
+
9
10
  const builtInCssClasses = withStylelessCssClasses("Input", {
10
11
  container: "w-full h-fit flex flex-row relative @container",
11
12
  textArea: "w-full p-4 pr-12 border border-slate-300 rounded-3xl resize-none text-[13px] @[480px]:text-base placeholder:text-[13px] placeholder:@[480px]:text-base text-slate-900",
@@ -22,7 +23,7 @@ const builtInCssClasses = withStylelessCssClasses("Input", {
22
23
  *
23
24
  * @param props - {@link ChatInputProps}
24
25
  */
25
- export function ChatInput({ placeholder = "Type a message...", stream = false, inputAutoFocus = false, handleError, sendButtonIcon = _jsx(ArrowIcon, {}), customCssClasses, }) {
26
+ function ChatInput({ placeholder = "Type a message...", stream = false, inputAutoFocus = false, handleError, sendButtonIcon = jsx(ArrowIcon, {}), customCssClasses, }) {
26
27
  const chat = useChatActions();
27
28
  const [input, setInput] = useState("");
28
29
  const canSendMessage = useChatState((state) => state.conversation.canSendMessage);
@@ -46,6 +47,8 @@ export function ChatInput({ placeholder = "Type a message...", stream = false, i
46
47
  const onInputChange = useCallback((e) => {
47
48
  setInput(e.target.value);
48
49
  }, []);
49
- return (_jsxs("div", { className: cssClasses.container, children: [_jsx(TextareaAutosize, { autoFocus: inputAutoFocus, onKeyDown: handleKeyDown, value: input, onChange: onInputChange, className: cssClasses.textArea, placeholder: placeholder }), _jsx("button", { "aria-label": "Send Message", disabled: !canSendMessage || input.trim().length === 0, onClick: sendMessage, className: cssClasses.sendButton, children: sendButtonIcon })] }));
50
+ return (jsxs("div", { className: cssClasses.container, children: [jsx(TextareaAutosize, { autoFocus: inputAutoFocus, onKeyDown: handleKeyDown, value: input, onChange: onInputChange, className: cssClasses.textArea, placeholder: placeholder }), jsx("button", { "aria-label": "Send Message", disabled: !canSendMessage || input.trim().length === 0, onClick: sendMessage, className: cssClasses.sendButton, children: sendButtonIcon })] }));
50
51
  }
51
- //# sourceMappingURL=ChatInput.js.map
52
+
53
+ export { ChatInput };
54
+ //# sourceMappingURL=ChatInput.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatInput.mjs","sources":["../../../../src/components/ChatInput.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\nimport { useChatActions, useChatState } from \"@yext/chat-headless-react\";\nimport { ArrowIcon } from \"../icons/Arrow\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport TextareaAutosize from \"react-textarea-autosize\";\nimport { useDefaultHandleApiError } from \"../hooks/useDefaultHandleApiError\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\n\n/**\n * The CSS class interface for the {@link ChatInput} component.\n *\n * @public\n */\nexport interface ChatInputCssClasses {\n container?: string;\n textArea?: string;\n sendButton?: string;\n}\n\nconst builtInCssClasses: ChatInputCssClasses = withStylelessCssClasses(\n \"Input\",\n {\n container: \"w-full h-fit flex flex-row relative @container\",\n textArea:\n \"w-full p-4 pr-12 border border-slate-300 rounded-3xl resize-none text-[13px] @[480px]:text-base placeholder:text-[13px] placeholder:@[480px]:text-base text-slate-900\",\n sendButton:\n \"rounded-full p-1.5 w-8 h-8 stroke-2 text-white bg-blue-600 disabled:bg-slate-200 hover:bg-blue-800 active:scale-90 transition-all absolute right-4 bottom-2.5 @[480px]:bottom-3.5\",\n }\n);\n\n/**\n * The props for the {@link ChatInput} component.\n *\n * @public\n */\nexport interface ChatInputProps {\n /**\n * The input's placeholder text when no text has been entered by the user.\n * Defaults to \"Type a message...\".\n */\n placeholder?: string;\n /**\n * Enable streaming behavior by making a request to Chat Streaming API.\n * This feature is experimental, and is subject to change.\n * Defaults to false.\n */\n stream?: boolean;\n /** Enable auto focus for the input box. Defaults to false. */\n inputAutoFocus?: boolean;\n /**\n * A function which is called when an error occurs from Chat API while processing the user's message.\n * By default, the error is logged to the console and an error message is added to state.\n */\n handleError?: (e: unknown) => void;\n /** Custom icon for the send button. */\n sendButtonIcon?: JSX.Element;\n /** CSS classes for customizing the component styling. */\n customCssClasses?: ChatInputCssClasses;\n}\n\n/**\n * A component that allows user to input message and send to Chat API.\n *\n * @remarks\n * Pressing \"Enter\" key will send the current message.\n * To add a newline, press \"Shift\" and \"Enter\".\n *\n * @public\n *\n * @param props - {@link ChatInputProps}\n */\nexport function ChatInput({\n placeholder = \"Type a message...\",\n stream = false,\n inputAutoFocus = false,\n handleError,\n sendButtonIcon = <ArrowIcon />,\n customCssClasses,\n}: ChatInputProps) {\n const chat = useChatActions();\n const [input, setInput] = useState(\"\");\n const canSendMessage = useChatState(\n (state) => state.conversation.canSendMessage\n );\n const defaultHandleApiError = useDefaultHandleApiError();\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n\n const sendMessage = useCallback(async () => {\n const res = stream\n ? chat.streamNextMessage(input)\n : chat.getNextMessage(input);\n setInput(\"\");\n res.catch((e) => (handleError ? handleError(e) : defaultHandleApiError(e)));\n }, [chat, input, handleError, defaultHandleApiError, stream]);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (!e.shiftKey && e.key === \"Enter\") {\n e.preventDefault();\n if (canSendMessage && input.trim().length !== 0) {\n sendMessage();\n }\n }\n },\n [sendMessage, canSendMessage, input]\n );\n\n const onInputChange = useCallback(\n (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n setInput(e.target.value);\n },\n []\n );\n\n return (\n <div className={cssClasses.container}>\n <TextareaAutosize\n autoFocus={inputAutoFocus}\n onKeyDown={handleKeyDown}\n value={input}\n onChange={onInputChange}\n className={cssClasses.textArea}\n placeholder={placeholder}\n />\n <button\n aria-label=\"Send Message\"\n disabled={!canSendMessage || input.trim().length === 0}\n onClick={sendMessage}\n className={cssClasses.sendButton}\n >\n {sendButtonIcon}\n </button>\n </div>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;AAmBA,MAAM,iBAAiB,GAAwB,uBAAuB,CACpE,OAAO,EACP;AACE,IAAA,SAAS,EAAE,gDAAgD;AAC3D,IAAA,QAAQ,EACN,uKAAuK;AACzK,IAAA,UAAU,EACR,mLAAmL;AACtL,CAAA,CACF,CAAC;AAgCF;;;;;;;;;;AAUG;AACG,SAAU,SAAS,CAAC,EACxB,WAAW,GAAG,mBAAmB,EACjC,MAAM,GAAG,KAAK,EACd,cAAc,GAAG,KAAK,EACtB,WAAW,EACX,cAAc,GAAGA,GAAA,CAAC,SAAS,EAAA,EAAA,CAAG,EAC9B,gBAAgB,GACD,EAAA;AACf,IAAA,MAAM,IAAI,GAAG,cAAc,EAAE,CAAC;IAC9B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AACvC,IAAA,MAAM,cAAc,GAAG,YAAY,CACjC,CAAC,KAAK,KAAK,KAAK,CAAC,YAAY,CAAC,cAAc,CAC7C,CAAC;AACF,IAAA,MAAM,qBAAqB,GAAG,wBAAwB,EAAE,CAAC;IAEzD,MAAM,UAAU,GAAG,qBAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;AAE9E,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,YAAW;QACzC,MAAM,GAAG,GAAG,MAAM;AAChB,cAAE,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;AAC/B,cAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;QAC/B,QAAQ,CAAC,EAAE,CAAC,CAAC;QACb,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAC9E,KAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,CAAC,CAAC,CAAC;AAE9D,IAAA,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,CAA2C,KAAI;QAC9C,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;YACpC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,cAAc,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,EAAE;AAC/C,gBAAA,WAAW,EAAE,CAAC;AACf,aAAA;AACF,SAAA;KACF,EACD,CAAC,WAAW,EAAE,cAAc,EAAE,KAAK,CAAC,CACrC,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,CAAyC,KAAI;AAC5C,QAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;KAC1B,EACD,EAAE,CACH,CAAC;AAEF,IAAA,QACEC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,CAAC,SAAS,EAClC,QAAA,EAAA,CAAAD,GAAA,CAAC,gBAAgB,EAAA,EACf,SAAS,EAAE,cAAc,EACzB,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,aAAa,EACvB,SAAS,EAAE,UAAU,CAAC,QAAQ,EAC9B,WAAW,EAAE,WAAW,EACxB,CAAA,EACFA,GACa,CAAA,QAAA,EAAA,EAAA,YAAA,EAAA,cAAc,EACzB,QAAQ,EAAE,CAAC,cAAc,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,EACtD,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,UAAU,CAAC,UAAU,EAE/B,QAAA,EAAA,cAAc,EACR,CAAA,CAAA,EAAA,CACL,EACN;AACJ;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAEL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAO7E;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uBAAuB,CAAC,EAAE,uBAAuB,CAAC;CACnD;AAeD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,kBAAkB,GAAG,SAAS,CAAC,EAC9D,IAAI,CAAC,cAAc,EAAE,kBAAkB,CAAC;IAC1C,kDAAkD;IAClD,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACrB;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CA2D9C"}
1
+ {"version":3,"file":"ChatPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAEL,uBAAuB,EACvB,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAO7E;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,mBAAmB,CAAC;IACtC,uBAAuB,CAAC,EAAE,uBAAuB,CAAC;CACnD;AAeD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,kBAAkB,GAAG,SAAS,CAAC,EAC9D,IAAI,CAAC,cAAc,EAAE,kBAAkB,CAAC;IAC1C,kDAAkD;IAClD,MAAM,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACrB;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CA6D9C"}
@@ -1,14 +1,14 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { createElement as _createElement } from "react";
3
- import { useEffect, useRef } from "react";
4
- import { useChatState, useChatActions } from "@yext/chat-headless-react";
5
- import { MessageBubble, } from "./MessageBubble";
6
- import { ChatInput } from "./ChatInput";
7
- import { LoadingDots } from "./LoadingDots";
8
- import { useComposedCssClasses } from "../hooks";
9
- import { useDefaultHandleApiError } from "../hooks/useDefaultHandleApiError";
10
- import { withStylelessCssClasses } from "../utils/withStylelessCssClasses";
11
- import { useReportAnalyticsEvent } from "../hooks/useReportAnalyticsEvent";
1
+ import { jsx, jsxs } from 'react/jsx-runtime';
2
+ import { useEffect, useRef, createElement } from 'react';
3
+ import { useChatActions, useChatState } from '@yext/chat-headless-react';
4
+ import { MessageBubble } from './MessageBubble.mjs';
5
+ import { ChatInput } from './ChatInput.mjs';
6
+ import { LoadingDots } from './LoadingDots.mjs';
7
+ import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
8
+ import { useDefaultHandleApiError } from '../hooks/useDefaultHandleApiError.mjs';
9
+ import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
10
+ import { useReportAnalyticsEvent } from '../hooks/useReportAnalyticsEvent.mjs';
11
+
12
12
  const builtInCssClasses = withStylelessCssClasses("Panel", {
13
13
  container: "h-full w-full flex flex-col relative shadow-2xl bg-white",
14
14
  messagesScrollContainer: "flex flex-col mt-auto overflow-hidden",
@@ -27,7 +27,7 @@ const builtInCssClasses = withStylelessCssClasses("Panel", {
27
27
  *
28
28
  * @param props - {@link ChatPanelProps}
29
29
  */
30
- export function ChatPanel(props) {
30
+ function ChatPanel(props) {
31
31
  const { header, customCssClasses } = props;
32
32
  const chat = useChatActions();
33
33
  const messages = useChatState((state) => state.conversation.messages);
@@ -58,6 +58,8 @@ export function ChatPanel(props) {
58
58
  behavior: "smooth",
59
59
  });
60
60
  }, [messages]);
61
- return (_jsxs("div", { className: cssClasses.container, children: [header, _jsx("div", { className: cssClasses.messagesScrollContainer, children: _jsxs("div", { ref: messagesRef, className: cssClasses.messagesContainer, children: [messages.map((message, index) => (_createElement(MessageBubble, { ...props, customCssClasses: cssClasses.messageBubbleCssClasses, key: index, message: message }))), loading && _jsx(LoadingDots, {})] }) }), _jsx("div", { className: cssClasses.inputContainer, children: _jsx(ChatInput, { ...props, customCssClasses: cssClasses.inputCssClasses }) })] }));
61
+ return (jsx("div", { className: "yext-chat", children: jsxs("div", { className: cssClasses.container, children: [header, jsx("div", { className: cssClasses.messagesScrollContainer, children: jsxs("div", { ref: messagesRef, className: cssClasses.messagesContainer, children: [messages.map((message, index) => (createElement(MessageBubble, { ...props, customCssClasses: cssClasses.messageBubbleCssClasses, key: index, message: message }))), loading && jsx(LoadingDots, {})] }) }), jsx("div", { className: cssClasses.inputContainer, children: jsx(ChatInput, { ...props, customCssClasses: cssClasses.inputCssClasses }) })] }) }));
62
62
  }
63
- //# sourceMappingURL=ChatPanel.js.map
63
+
64
+ export { ChatPanel };
65
+ //# sourceMappingURL=ChatPanel.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatPanel.mjs","sources":["../../../../src/components/ChatPanel.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { useChatState, useChatActions } from \"@yext/chat-headless-react\";\nimport {\n MessageBubble,\n MessageBubbleCssClasses,\n MessageBubbleProps,\n} from \"./MessageBubble\";\nimport { ChatInput, ChatInputCssClasses, ChatInputProps } from \"./ChatInput\";\nimport { LoadingDots } from \"./LoadingDots\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { useDefaultHandleApiError } from \"../hooks/useDefaultHandleApiError\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n/**\n * The CSS class interface for the {@link ChatPanel} component.\n *\n * @public\n */\nexport interface ChatPanelCssClasses {\n container?: string;\n messagesContainer?: string;\n messagesScrollContainer?: string;\n inputContainer?: string;\n inputCssClasses?: ChatInputCssClasses;\n messageBubbleCssClasses?: MessageBubbleCssClasses;\n}\n\nconst builtInCssClasses: ChatPanelCssClasses = withStylelessCssClasses(\n \"Panel\",\n {\n container: \"h-full w-full flex flex-col relative shadow-2xl bg-white\",\n messagesScrollContainer: \"flex flex-col mt-auto overflow-hidden\",\n messagesContainer: \"flex flex-col gap-y-1 px-4 overflow-auto\",\n inputContainer: \"w-full p-4\",\n messageBubbleCssClasses: {\n topContainer: \"first:mt-4\",\n },\n }\n);\n\n/**\n * The props for the {@link ChatPanel} component.\n *\n * @public\n */\nexport interface ChatPanelProps\n extends Omit<MessageBubbleProps, \"customCssClasses\" | \"message\">,\n Omit<ChatInputProps, \"customCssClasses\"> {\n /** A header to render at the top of the panel. */\n header?: JSX.Element;\n /**\n * CSS classes for customizing the component styling.\n */\n customCssClasses?: ChatPanelCssClasses;\n}\n\n/**\n * A component that renders a full panel for chat bot interactions. This includes\n * the message bubbles for the conversation, input box with send button, and header\n * (if provided).\n *\n * @public\n *\n * @param props - {@link ChatPanelProps}\n */\nexport function ChatPanel(props: ChatPanelProps) {\n const { header, customCssClasses } = props;\n const chat = useChatActions();\n const messages = useChatState((state) => state.conversation.messages);\n const loading = useChatState((state) => state.conversation.isLoading);\n const canSendMessage = useChatState(\n (state) => state.conversation.canSendMessage\n );\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const defaultHandleApiError = useDefaultHandleApiError();\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n\n useEffect(() => {\n reportAnalyticsEvent({\n action: \"CHAT_IMPRESSION\",\n });\n }, [reportAnalyticsEvent]);\n\n // Fetch the first message on load, if there are no existing messages or a request being processed\n useEffect(() => {\n if (messages.length !== 0 || !canSendMessage) {\n return;\n }\n const { stream = false, handleError } = props;\n const res = stream ? chat.streamNextMessage() : chat.getNextMessage();\n res.catch((e) => (handleError ? handleError(e) : defaultHandleApiError(e)));\n }, [chat, props, messages, defaultHandleApiError, canSendMessage]);\n\n const messagesRef = useRef<HTMLDivElement>(null);\n\n // Scroll to the bottom of the chat when the messages change\n useEffect(() => {\n messagesRef.current?.scroll({\n top: messagesRef.current?.scrollHeight,\n behavior: \"smooth\",\n });\n }, [messages]);\n\n return (\n <div className=\"yext-chat\">\n <div className={cssClasses.container}>\n {header}\n <div className={cssClasses.messagesScrollContainer}>\n <div ref={messagesRef} className={cssClasses.messagesContainer}>\n {messages.map((message, index) => (\n <MessageBubble\n {...props}\n customCssClasses={cssClasses.messageBubbleCssClasses}\n key={index}\n message={message}\n />\n ))}\n {loading && <LoadingDots />}\n </div>\n </div>\n <div className={cssClasses.inputContainer}>\n <ChatInput {...props} customCssClasses={cssClasses.inputCssClasses} />\n </div>\n </div>\n </div>\n );\n}\n"],"names":["_jsx","_jsxs","_createElement"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ChatPopUp.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAEL,oBAAoB,EACpB,eAAe,EAChB,MAAM,cAAc,CAAC;AAMtB;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,eAAe,CAAC,EAAE,mBAAmB,CAAC;CACvC;AA8BD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,kBAAkB,CAAC,EACnE,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,kBAAkB,CAAC;IACrD,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CA8D9C"}
1
+ {"version":3,"file":"ChatPopUp.d.ts","sourceRoot":"","sources":["../../../../src/components/ChatPopUp.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAa,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7E,OAAO,EAEL,oBAAoB,EACpB,eAAe,EAChB,MAAM,cAAc,CAAC;AAMtB;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,eAAe,CAAC,EAAE,mBAAmB,CAAC;CACvC;AA8BD;;;;GAIG;AACH,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,eAAe,EAAE,iBAAiB,GAAG,kBAAkB,CAAC,EACnE,IAAI,CAAC,cAAc,EAAE,QAAQ,GAAG,kBAAkB,CAAC;IACrD,0DAA0D;IAC1D,mBAAmB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,mBAAmB,CAAC;CACxC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CAkE9C"}
@@ -1,12 +1,13 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useCallback, useEffect, useState } from "react";
3
- import { ChatIcon } from "../icons/Chat";
4
- import { ChatPanel } from "./ChatPanel";
5
- import { ChatHeader, } from "./ChatHeader";
6
- import { twMerge } from "tailwind-merge";
7
- import { useComposedCssClasses } from "../hooks";
8
- import { withStylelessCssClasses } from "../utils/withStylelessCssClasses";
9
- import { useReportAnalyticsEvent } from "../hooks/useReportAnalyticsEvent";
1
+ import { jsx, jsxs } from 'react/jsx-runtime';
2
+ import { useEffect, useState, useCallback } from 'react';
3
+ import { ChatIcon } from '../icons/Chat.mjs';
4
+ import { ChatPanel } from './ChatPanel.mjs';
5
+ import { ChatHeader } from './ChatHeader.mjs';
6
+ import { twMerge } from 'tailwind-merge';
7
+ import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
8
+ import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
9
+ import { useReportAnalyticsEvent } from '../hooks/useReportAnalyticsEvent.mjs';
10
+
10
11
  const fixedPosition = "fixed bottom-6 right-4 lg:bottom-14 lg:right-10 z-50 ";
11
12
  const builtInCssClasses = withStylelessCssClasses("PopUp", {
12
13
  container: "transition-all",
@@ -36,7 +37,7 @@ const builtInCssClasses = withStylelessCssClasses("PopUp", {
36
37
  *
37
38
  * @param props - {@link ChatPanelProps}
38
39
  */
39
- export function ChatPopUp(props) {
40
+ function ChatPopUp(props) {
40
41
  const { openPanelButtonIcon, customCssClasses, showRestartButton = true, onClose: customOnClose, title, } = props;
41
42
  const reportAnalyticsEvent = useReportAnalyticsEvent();
42
43
  useEffect(() => {
@@ -55,6 +56,8 @@ export function ChatPopUp(props) {
55
56
  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);
56
57
  const panelCssClasses = twMerge(cssClasses.panel, showChat ? cssClasses.panel__display : cssClasses.panel__hidden);
57
58
  const buttonCssClasses = twMerge(cssClasses.button, showChat ? cssClasses.button__hidden : cssClasses.button__display);
58
- return (_jsxs("div", { className: cssClasses.container, children: [_jsx("div", { className: panelCssClasses, "aria-label": "Chat Popup Panel", children: _jsx(ChatPanel, { ...props, customCssClasses: cssClasses.panelCssClasses, header: _jsx(ChatHeader, { title: title, showRestartButton: showRestartButton, showCloseButton: true, onClose: onClose, customCssClasses: cssClasses.headerCssClasses }) }) }), _jsx("button", { "aria-label": "Chat Popup Button", onClick: onClick, className: buttonCssClasses, children: openPanelButtonIcon ?? _jsx(ChatIcon, { className: cssClasses.buttonIcon }) })] }));
59
+ return (jsx("div", { className: "yext-chat", children: jsxs("div", { className: cssClasses.container, children: [jsx("div", { className: panelCssClasses, "aria-label": "Chat Popup Panel", children: jsx(ChatPanel, { ...props, customCssClasses: cssClasses.panelCssClasses, header: jsx(ChatHeader, { title: title, showRestartButton: showRestartButton, showCloseButton: true, onClose: onClose, customCssClasses: cssClasses.headerCssClasses }) }) }), jsx("button", { "aria-label": "Chat Popup Button", onClick: onClick, className: buttonCssClasses, children: openPanelButtonIcon ?? (jsx(ChatIcon, { className: cssClasses.buttonIcon })) })] }) }));
59
60
  }
60
- //# sourceMappingURL=ChatPopUp.js.map
61
+
62
+ export { ChatPopUp };
63
+ //# sourceMappingURL=ChatPopUp.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChatPopUp.mjs","sources":["../../../../src/components/ChatPopUp.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from \"react\";\nimport { ChatIcon } from \"../icons/Chat\";\nimport { ChatPanel, ChatPanelCssClasses, ChatPanelProps } from \"./ChatPanel\";\nimport {\n ChatHeader,\n ChatHeaderCssClasses,\n ChatHeaderProps,\n} from \"./ChatHeader\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n/**\n * The CSS class interface for the {@link ChatPopUp} component.\n *\n * @public\n */\nexport interface ChatPopUpCssClasses {\n container?: string;\n panel?: string;\n panel__display?: string;\n panel__hidden?: string;\n button?: string;\n button__display?: string;\n button__hidden?: string;\n buttonIcon?: string;\n headerCssClasses?: ChatHeaderCssClasses;\n panelCssClasses?: ChatPanelCssClasses;\n}\n\nconst fixedPosition = \"fixed bottom-6 right-4 lg:bottom-14 lg:right-10 z-50 \";\nconst builtInCssClasses: ChatPopUpCssClasses = withStylelessCssClasses(\n \"PopUp\",\n {\n container: \"transition-all\",\n panel:\n fixedPosition +\n \"w-80 max-[480px]:right-0 max-[480px]:bottom-0 max-[480px]:w-full max-[480px]:h-full lg:w-96 h-[75vh]\",\n panel__display: \"duration-300 translate-y-0\",\n panel__hidden: \"duration-300 translate-y-[20%] opacity-0 invisible\",\n button:\n fixedPosition +\n \"p-2 w-12 h-12 lg:w-16 lg:h-16 flex justify-center items-center text-white shadow-xl rounded-full bg-gradient-to-br from-blue-600 to-blue-700 hover:-translate-y-2 duration-150\",\n button__display: \"duration-300 transform translate-y-0\",\n button__hidden:\n \"duration-300 transform translate-y-[20%] opacity-0 invisible\",\n buttonIcon: \"text-blue-600 w-[28px] h-[28px] lg:w-[40px] lg:h-[40px]\",\n headerCssClasses: {\n container: \"max-[480px]:rounded-none rounded-t-3xl\",\n },\n panelCssClasses: {\n container: \"max-[480px]:rounded-none rounded-3xl\",\n inputContainer: \"max-[480px]:rounded-none rounded-b-3xl\",\n messagesScrollContainer: \"rounded-b-3xl\",\n },\n }\n);\n\n/**\n * The props for the {@link ChatPopUp} component.\n *\n * @public\n */\nexport interface ChatPopUpProps\n extends Omit<ChatHeaderProps, \"showCloseButton\" | \"customCssClasses\">,\n Omit<ChatPanelProps, \"header\" | \"customCssClasses\"> {\n /** Custom icon for the popup button to open the panel. */\n openPanelButtonIcon?: JSX.Element;\n /**\n * CSS classes for customizing the component styling.\n */\n customCssClasses?: ChatPopUpCssClasses;\n}\n\n/**\n * A component that renders a popup button that displays and hides\n * a panel for chat bot interactions.\n *\n * @public\n *\n * @param props - {@link ChatPanelProps}\n */\nexport function ChatPopUp(props: ChatPopUpProps) {\n const {\n openPanelButtonIcon,\n customCssClasses,\n showRestartButton = true,\n onClose: customOnClose,\n title,\n } = props;\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n\n useEffect(() => {\n reportAnalyticsEvent({\n action: \"CHAT_IMPRESSION\",\n });\n }, [reportAnalyticsEvent]);\n\n const [showChat, setShowChat] = useState(false);\n const onClick = useCallback(() => {\n setShowChat(!showChat);\n }, [showChat]);\n\n const onClose = useCallback(() => {\n setShowChat(false);\n customOnClose?.();\n }, [customOnClose]);\n\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const panelCssClasses = twMerge(\n cssClasses.panel,\n showChat ? cssClasses.panel__display : cssClasses.panel__hidden\n );\n const buttonCssClasses = twMerge(\n cssClasses.button,\n showChat ? cssClasses.button__hidden : cssClasses.button__display\n );\n\n return (\n <div className=\"yext-chat\">\n <div className={cssClasses.container}>\n <div className={panelCssClasses} aria-label=\"Chat Popup Panel\">\n <ChatPanel\n {...props}\n customCssClasses={cssClasses.panelCssClasses}\n header={\n <ChatHeader\n title={title}\n showRestartButton={showRestartButton}\n showCloseButton={true}\n onClose={onClose}\n customCssClasses={cssClasses.headerCssClasses}\n />\n }\n />\n </div>\n <button\n aria-label=\"Chat Popup Button\"\n onClick={onClick}\n className={buttonCssClasses}\n >\n {openPanelButtonIcon ?? (\n <ChatIcon className={cssClasses.buttonIcon} />\n )}\n </button>\n </div>\n </div>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
@@ -1,12 +1,13 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { ThumbsDownIcon } from "../icons/ThumbsDown";
3
- import { ThumbsUpIcon } from "../icons/ThumbsUp";
4
- import { useCallback, useState } from "react";
5
- import { ThumbsUpFillIcon } from "../icons/ThumbsUpFill";
6
- import { ThumbsDownFillIcon } from "../icons/ThumbsDownFill";
7
- import { withStylelessCssClasses } from "../utils/withStylelessCssClasses";
8
- import { useComposedCssClasses } from "../hooks";
9
- import { useReportAnalyticsEvent } from "../hooks/useReportAnalyticsEvent";
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { ThumbsDownIcon } from '../icons/ThumbsDown.mjs';
3
+ import { ThumbsUpIcon } from '../icons/ThumbsUp.mjs';
4
+ import { useState, useCallback } from 'react';
5
+ import { ThumbsUpFillIcon } from '../icons/ThumbsUpFill.mjs';
6
+ import { ThumbsDownFillIcon } from '../icons/ThumbsDownFill.mjs';
7
+ import { withStylelessCssClasses } from '../utils/withStylelessCssClasses.mjs';
8
+ import { useComposedCssClasses } from '../hooks/useComposedCssClasses.mjs';
9
+ import { useReportAnalyticsEvent } from '../hooks/useReportAnalyticsEvent.mjs';
10
+
10
11
  const builtInCssClasses = withStylelessCssClasses("FeedbackButtons", {
11
12
  container: "flex gap-x-1 absolute -right-1 -top-3 opacity-0 group-hover:opacity-100 duration-200",
12
13
  thumbsUpButton: "w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center",
@@ -22,7 +23,7 @@ const builtInCssClasses = withStylelessCssClasses("FeedbackButtons", {
22
23
  *
23
24
  * @internal
24
25
  */
25
- export function FeedbackButtons({ customCssClasses, responseId, }) {
26
+ function FeedbackButtons({ customCssClasses, responseId, }) {
26
27
  const reportAnalyticsEvent = useReportAnalyticsEvent();
27
28
  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);
28
29
  const [selectedThumb, setSelectedThumb] = useState();
@@ -44,6 +45,8 @@ export function FeedbackButtons({ customCssClasses, responseId, }) {
44
45
  },
45
46
  });
46
47
  }, [reportAnalyticsEvent, responseId]);
47
- return (_jsxs("div", { className: cssClasses.container, children: [_jsx("button", { className: cssClasses.thumbsUpButton, onClick: onClickThumbsUp, children: selectedThumb === "UP" ? (_jsx(ThumbsUpFillIcon, { className: cssClasses.thumbsUpFillIcon })) : (_jsx(ThumbsUpIcon, { className: cssClasses.thumbsUpIcon })) }), _jsx("button", { className: cssClasses.thumbsDownButton, onClick: onClickThumbsDown, children: selectedThumb === "DOWN" ? (_jsx(ThumbsDownFillIcon, { className: cssClasses.thumbsDownFillIcon })) : (_jsx(ThumbsDownIcon, { className: cssClasses.thumbsDownIcon })) })] }));
48
+ return (jsxs("div", { className: cssClasses.container, children: [jsx("button", { className: cssClasses.thumbsUpButton, onClick: onClickThumbsUp, children: selectedThumb === "UP" ? (jsx(ThumbsUpFillIcon, { className: cssClasses.thumbsUpFillIcon })) : (jsx(ThumbsUpIcon, { className: cssClasses.thumbsUpIcon })) }), jsx("button", { className: cssClasses.thumbsDownButton, onClick: onClickThumbsDown, children: selectedThumb === "DOWN" ? (jsx(ThumbsDownFillIcon, { className: cssClasses.thumbsDownFillIcon })) : (jsx(ThumbsDownIcon, { className: cssClasses.thumbsDownIcon })) })] }));
48
49
  }
49
- //# sourceMappingURL=FeedbackButtons.js.map
50
+
51
+ export { FeedbackButtons };
52
+ //# sourceMappingURL=FeedbackButtons.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FeedbackButtons.mjs","sources":["../../../../src/components/FeedbackButtons.tsx"],"sourcesContent":["import { ThumbsDownIcon } from \"../icons/ThumbsDown\";\nimport { ThumbsUpIcon } from \"../icons/ThumbsUp\";\nimport { useCallback, useState } from \"react\";\nimport { ThumbsUpFillIcon } from \"../icons/ThumbsUpFill\";\nimport { ThumbsDownFillIcon } from \"../icons/ThumbsDownFill\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n/**\n * The CSS class interface for the FeedbackButtons component.\n *\n * @public\n */\nexport interface FeedbackButtonsCssClasses {\n container?: string;\n thumbsUpButton?: string;\n thumbsUpIcon?: string;\n thumbsUpFillIcon?: string;\n thumbsDownButton?: string;\n thumbsDownIcon?: string;\n thumbsDownFillIcon?: string;\n}\n\nconst builtInCssClasses: FeedbackButtonsCssClasses =\n withStylelessCssClasses<FeedbackButtonsCssClasses>(\"FeedbackButtons\", {\n container:\n \"flex gap-x-1 absolute -right-1 -top-3 opacity-0 group-hover:opacity-100 duration-200\",\n thumbsUpButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsUpIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsUpFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownButton:\n \"w-6 h-6 bg-gray-700 rounded-md flex justify-center items-center\",\n thumbsDownIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n thumbsDownFillIcon: \"text-white w-[22px] h-[22px] stroke-[0.2]\",\n });\n\n/**\n * The props for the FeedbackButtons component.\n *\n * @internal\n */\ninterface FeedbackButtonsProps {\n /** The response ID correlates to the current message to give feedback on. */\n responseId?: string;\n /** CSS classes for customizing the component styling. */\n customCssClasses?: FeedbackButtonsCssClasses;\n}\n\n/**\n * Displays feedback buttons (e.g. thumbs up and thumbs down) that will\n * report analytic events on click.\n *\n * @internal\n */\nexport function FeedbackButtons({\n customCssClasses,\n responseId,\n}: FeedbackButtonsProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n const [selectedThumb, setSelectedThumb] = useState<\n \"UP\" | \"DOWN\" | undefined\n >();\n const onClickThumbsUp = useCallback(() => {\n setSelectedThumb(\"UP\");\n reportAnalyticsEvent({\n action: \"THUMBS_UP\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n const onClickThumbsDown = useCallback(() => {\n setSelectedThumb(\"DOWN\");\n reportAnalyticsEvent({\n action: \"THUMBS_DOWN\",\n chat: {\n responseId,\n },\n });\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <div className={cssClasses.container}>\n <button className={cssClasses.thumbsUpButton} onClick={onClickThumbsUp}>\n {selectedThumb === \"UP\" ? (\n <ThumbsUpFillIcon className={cssClasses.thumbsUpFillIcon} />\n ) : (\n <ThumbsUpIcon className={cssClasses.thumbsUpIcon} />\n )}\n </button>\n <button\n className={cssClasses.thumbsDownButton}\n onClick={onClickThumbsDown}\n >\n {selectedThumb === \"DOWN\" ? (\n <ThumbsDownFillIcon className={cssClasses.thumbsDownFillIcon} />\n ) : (\n <ThumbsDownIcon className={cssClasses.thumbsDownIcon} />\n )}\n </button>\n </div>\n );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;AAwBA,MAAM,iBAAiB,GACrB,uBAAuB,CAA4B,iBAAiB,EAAE;AACpE,IAAA,SAAS,EACP,sFAAsF;AACxF,IAAA,cAAc,EACZ,iEAAiE;AACnE,IAAA,YAAY,EAAE,2CAA2C;AACzD,IAAA,gBAAgB,EAAE,2CAA2C;AAC7D,IAAA,gBAAgB,EACd,iEAAiE;AACnE,IAAA,cAAc,EAAE,2CAA2C;AAC3D,IAAA,kBAAkB,EAAE,2CAA2C;AAChE,CAAA,CAAC,CAAC;AAcL;;;;;AAKG;SACa,eAAe,CAAC,EAC9B,gBAAgB,EAChB,UAAU,GACW,EAAA;AACrB,IAAA,MAAM,oBAAoB,GAAG,uBAAuB,EAAE,CAAC;IACvD,MAAM,UAAU,GAAG,qBAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;IAC9E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAE/C,CAAC;AACJ,IAAA,MAAM,eAAe,GAAG,WAAW,CAAC,MAAK;QACvC,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACvB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,WAAW;AACnB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,MAAM,iBAAiB,GAAG,WAAW,CAAC,MAAK;QACzC,gBAAgB,CAAC,MAAM,CAAC,CAAC;AACzB,QAAA,oBAAoB,CAAC;AACnB,YAAA,MAAM,EAAE,aAAa;AACrB,YAAA,IAAI,EAAE;gBACJ,UAAU;AACX,aAAA;AACF,SAAA,CAAC,CAAC;AACL,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;IAEvC,QACEA,cAAK,SAAS,EAAE,UAAU,CAAC,SAAS,aAClCC,GAAQ,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,OAAO,EAAE,eAAe,EAAA,QAAA,EACnE,aAAa,KAAK,IAAI,IACrBA,IAAC,gBAAgB,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,gBAAgB,EAAA,CAAI,KAE5DA,GAAA,CAAC,YAAY,EAAC,EAAA,SAAS,EAAE,UAAU,CAAC,YAAY,GAAI,CACrD,EAAA,CACM,EACTA,GACE,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,gBAAgB,EACtC,OAAO,EAAE,iBAAiB,EAAA,QAAA,EAEzB,aAAa,KAAK,MAAM,IACvBA,GAAA,CAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAA,CAAI,KAEhEA,GAAC,CAAA,cAAc,IAAC,SAAS,EAAE,UAAU,CAAC,cAAc,GAAI,CACzD,EAAA,CACM,CACL,EAAA,CAAA,EACN;AACJ;;;;"}
@@ -0,0 +1,14 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { twMerge } from 'tailwind-merge';
3
+
4
+ /**
5
+ * A component that signifies loading status.
6
+ *
7
+ * @internal
8
+ */
9
+ function LoadingDots({ className }) {
10
+ return (jsxs("div", { "aria-label": "Loading Indicator", className: twMerge("flex gap-1 p-2 animate-fade-in", className), children: [jsx("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite]" }), jsx("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.3s]" }), jsx("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.6s]" })] }));
11
+ }
12
+
13
+ export { LoadingDots };
14
+ //# sourceMappingURL=LoadingDots.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LoadingDots.mjs","sources":["../../../../src/components/LoadingDots.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\n\n/**\n * A component that signifies loading status.\n *\n * @internal\n */\nexport function LoadingDots({ className }: { className?: string }) {\n return (\n <div\n aria-label=\"Loading Indicator\"\n className={twMerge(\"flex gap-1 p-2 animate-fade-in\", className)}\n >\n <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite]\" />\n <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.3s]\" />\n <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.6s]\" />\n </div>\n );\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAEA;;;;AAIG;AACa,SAAA,WAAW,CAAC,EAAE,SAAS,EAA0B,EAAA;AAC/D,IAAA,QACEA,IAAA,CAAA,KAAA,EAAA,EAAA,YAAA,EACa,mBAAmB,EAC9B,SAAS,EAAE,OAAO,CAAC,gCAAgC,EAAE,SAAS,CAAC,EAAA,QAAA,EAAA,CAE/DC,aAAK,SAAS,EAAC,gEAAgE,EAAA,CAAG,EAClFA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qEAAqE,EAAG,CAAA,EACvFA,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,qEAAqE,EAAG,CAAA,CAAA,EAAA,CACnF,EACN;AACJ;;;;"}
@@ -1,10 +1,11 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import ReactMarkdown from "react-markdown";
3
- import remarkGfm from "remark-gfm";
4
- import rehypeRaw from "rehype-raw";
5
- import rehypeSanitize from "rehype-sanitize";
6
- import { useMemo } from "react";
7
- import { useReportAnalyticsEvent } from "../hooks/useReportAnalyticsEvent";
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import ReactMarkdown from 'react-markdown';
3
+ import remarkGfm from 'remark-gfm';
4
+ import rehypeRaw from 'rehype-raw';
5
+ import rehypeSanitize from 'rehype-sanitize';
6
+ import { useMemo } from 'react';
7
+ import { useReportAnalyticsEvent } from '../hooks/useReportAnalyticsEvent.mjs';
8
+
8
9
  // The Remark and Rehype plugins to use in conjunction with ReactMarkdown.
9
10
  const unifiedPlugins = {
10
11
  remark: [
@@ -24,7 +25,7 @@ const unifiedPlugins = {
24
25
  *
25
26
  * @internal
26
27
  */
27
- export function Markdown({ content, responseId, className }) {
28
+ function Markdown({ content, responseId, className }) {
28
29
  const reportAnalyticsEvent = useReportAnalyticsEvent();
29
30
  const components = useMemo(() => {
30
31
  const createClickHandlerFn = (href) => () => {
@@ -38,10 +39,12 @@ export function Markdown({ content, responseId, className }) {
38
39
  };
39
40
  return {
40
41
  a: ({ node: _, children, ...props }) => {
41
- return (_jsx("a", { ...props, onClick: createClickHandlerFn(props.href), target: "_blank", rel: "noopener noreferrer", className: "cursor-pointer", children: children }));
42
+ return (jsx("a", { ...props, onClick: createClickHandlerFn(props.href), target: "_blank", rel: "noopener noreferrer", className: "cursor-pointer", children: children }));
42
43
  },
43
44
  };
44
45
  }, [reportAnalyticsEvent, responseId]);
45
- return (_jsx(ReactMarkdown, { className: className, children: content, remarkPlugins: unifiedPlugins.remark, rehypePlugins: unifiedPlugins.rehype, components: components }));
46
+ return (jsx(ReactMarkdown, { className: className, children: content, remarkPlugins: unifiedPlugins.remark, rehypePlugins: unifiedPlugins.rehype, components: components }));
46
47
  }
47
- //# sourceMappingURL=Markdown.js.map
48
+
49
+ export { Markdown };
50
+ //# sourceMappingURL=Markdown.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Markdown.mjs","sources":["../../../../src/components/Markdown.tsx"],"sourcesContent":["import ReactMarkdown, {\n PluggableList,\n ReactMarkdownOptions,\n} from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport rehypeRaw from \"rehype-raw\";\nimport rehypeSanitize from \"rehype-sanitize\";\nimport { useMemo } from \"react\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\n\n// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.\nconst unifiedPlugins: { remark?: PluggableList; rehype: PluggableList } = {\n remark: [\n remarkGfm, //renders Github-Flavored Markdown\n ],\n rehype: [\n rehypeRaw, //to support HTML embedded in markdown\n rehypeSanitize, //to sanitize HTML content\n ],\n};\n\ninterface MarkdownProps {\n /** Stringified markdown. */\n content: string;\n /** The response ID correlates to the current message. */\n responseId?: string;\n /** Classnames for the container. */\n className?: string;\n}\n\n/**\n * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include\n * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.\n *\n * @remarks\n * A link click will send a CHAT_LINK_CLICK analytics event\n *\n * @internal\n */\nexport function Markdown({ content, responseId, className }: MarkdownProps) {\n const reportAnalyticsEvent = useReportAnalyticsEvent();\n\n const components: ReactMarkdownOptions[\"components\"] = useMemo(() => {\n const createClickHandlerFn = (href?: string) => () => {\n reportAnalyticsEvent({\n action: \"CHAT_LINK_CLICK\",\n destinationUrl: href,\n chat: {\n responseId,\n },\n });\n };\n return {\n a: ({ node: _, children, ...props }) => {\n return (\n <a\n {...props}\n onClick={createClickHandlerFn(props.href)}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"cursor-pointer\"\n >\n {children}\n </a>\n );\n },\n };\n }, [reportAnalyticsEvent, responseId]);\n\n return (\n <ReactMarkdown\n className={className}\n children={content}\n remarkPlugins={unifiedPlugins.remark}\n rehypePlugins={unifiedPlugins.rehype}\n components={components}\n />\n );\n}\n"],"names":["_jsx"],"mappings":";;;;;;;;AAUA;AACA,MAAM,cAAc,GAAsD;AACxE,IAAA,MAAM,EAAE;AACN,QAAA,SAAS;AACV,KAAA;AACD,IAAA,MAAM,EAAE;QACN,SAAS;AACT,QAAA,cAAc;AACf,KAAA;CACF,CAAC;AAWF;;;;;;;;AAQG;AACG,SAAU,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAiB,EAAA;AACxE,IAAA,MAAM,oBAAoB,GAAG,uBAAuB,EAAE,CAAC;AAEvD,IAAA,MAAM,UAAU,GAAuC,OAAO,CAAC,MAAK;QAClE,MAAM,oBAAoB,GAAG,CAAC,IAAa,KAAK,MAAK;AACnD,YAAA,oBAAoB,CAAC;AACnB,gBAAA,MAAM,EAAE,iBAAiB;AACzB,gBAAA,cAAc,EAAE,IAAI;AACpB,gBAAA,IAAI,EAAE;oBACJ,UAAU;AACX,iBAAA;AACF,aAAA,CAAC,CAAC;AACL,SAAC,CAAC;QACF,OAAO;AACL,YAAA,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,KAAI;AACrC,gBAAA,QACEA,GAAA,CAAA,GAAA,EAAA,EAAA,GACM,KAAK,EACT,OAAO,EAAE,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,EACzC,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,SAAS,EAAC,gBAAgB,EAEzB,QAAA,EAAA,QAAQ,EACP,CAAA,EACJ;aACH;SACF,CAAC;AACJ,KAAC,EAAE,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC,CAAC;AAEvC,IAAA,QACEA,GAAA,CAAC,aAAa,EAAA,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,OAAO,EACjB,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,UAAU,EAAE,UAAU,EAAA,CACtB,EACF;AACJ;;;;"}