@memori.ai/memori-react 6.7.2 → 6.8.0

package/src/components/ChatBubble/ChatBubble.stories.tsx

@@ -265,3 +265,16 @@ ComplexMarkdownMath2.args = {
     text: "Per calcolare le resistenze dei materiali per le verifiche rispetto ad azioni antropiche e ambientali secondo la Specifica Tecnica ST-VAL4, si procede in questo modo:\n\n1. **Determinazione della resistenza dei materiali:**\n   La resistenza dei materiali da utilizzare nelle verifiche accurate si determina a partire dalle indagini sull’opera. La caratterizzazione deve essere distinta per tutti i materiali presenti nell'opera, in accordo con la ST-PI. Le resistenze per verifiche rispetto ad azioni antropiche come i carichi da traffico e le azioni ambientali sono definite dalle LG20. Questo include la distinzione rispetto a quelle utilizzate per le azioni sismiche, come dettagliato dalle NTC18 e CIR19  .\n\n2. **Calcolo della resistenza:**\n   Il valore della resistenza dei materiali \\( f_d \\) da utilizzare nelle verifiche per carichi gravitazionali si ottiene mediante la seguente espressione:\n\n   \\[\n   f_d = \\min \\left( \\frac{f_m}{FC \\cdot \\gamma_M}, \\frac{f_k}{FC} \\right)\n   \\]\n\n   Dove:\n   - \\( f_m \\) è il valor medio della resistenza valutato dai risultati delle prove effettuate sui campioni prelevati in situ;\n   - \\( f_k \\) è la resistenza caratteristica calcolata sulla base dei risultati delle prove sui campioni prelevati in situ;\n   - \\( FC \\) è il Fattore di Confidenza associato al Livello di Conoscenza raggiunto;\n   - \\( \\gamma_M \\) è il fattore parziale di sicurezza del materiale   .\n\n3. **Caratterizzazione dei materiali:**\n   I valori medi, caratteristici e di progetto delle resistenze a compressione e trazione per il calcestruzzo, e delle resistenze a snervamento per l’acciaio ordinario sono determinati a partire dai risultati delle prove. Specifiche espressioni e metodi sono forniti per diversi materiali nell'Appendice 13 della ST-VAL4  .\n\n4. **Stima della resistenza da prove non distruttive:**\n   Per valutare le resistenze dei materiali, si possono anche utilizzare prove non distruttive come le prove SonReb per il calcestruzzo e le prove di durezza per l'acciaio ordinario e armonico. Formulazioni specifiche per queste prove si trovano in Appendice al §13.1 della ST-VAL4 .\n\n5. **Analisi dei risultati delle indagini:**\n   Gli esiti delle prove devono essere attentamente analizzati per confermare le caratteristiche originarie o rilevare eventuali decadimenti del materiale. Questo processo include anche l'identificazione delle cause di dispersione significative nei risultati delle prove  .\n\nSeguendo questi passaggi, si ottiene una stima accurata delle resistenze dei materiali che possono essere utilizzate per le verifiche di sicurezza rispetto ad azioni antropiche e ambientali.",
   },
 };
+
+export const ComplexMarkdownMath3 = Template.bind({});
+ComplexMarkdownMath3.args = {
+  memori,
+  apiUrl: 'https://backend.memori.ai',
+  tenant,
+  message: {
+    fromUser: false,
+    initial: false,
+    generatedByAI: true,
+    text: "Ok. \n\nPer calcolare l'urto su barriere metalliche, il documento *\"Ponti, viadotti e cavalcavia - Specifica Tecnica per la redazione delle Verifiche Accurate di sicurezza di Livello 4 (ST-VAL4)\"* fornisce un metodo specifico. Ecco l'iter riassunto:\n\n1. **Determinazione del sistema di forze orizzontali:** Partendo dal momento di plasticizzazione del montante (§5.1.3.10 delle NTC18). La forza orizzontale che plasticizza il montante può essere determinata con riferimento alla resistenza caratteristica degli elementi strutturali principali della barriera.\n\n2. **Quota di applicazione della forza:** La forza orizzontale deve essere applicata ad una quota h, che è il minimo tra (altezza della barriera - 0,10 m) e 1,00 m.\n\n3. **Amplificazione delle forze orizzontali:** Per il dimensionamento dell'impalcato, le forze orizzontali sono amplificate di un fattore di 1,50, e il coefficiente parziale di sicurezza per la combinazione di carico agli SLU per l’urto di veicolo in svio è assunto unitario.\n\n4. **Calcolo della massima azione tagliante:** Alla base del montante (estradosso cordolo):\n\n    \\[\n    F_{\\text{urto}} = \\frac{M_{\\text{pl}}}{h^*}\n    \\]\n\n    Dove:\n    - \\(M_{\\text{pl}}\\) è il momento plastico calcolato con la resistenza caratteristica.\n    - \\(h^* = h - h_R - h_C\\)\n    - \\(h\\) è pari all’altezza della forza di urto sulla superficie di rotolamento (1.00 m), \\(h_B\\) è l’altezza della forza rispetto all’estradosso del cordolo, \\(h_C\\) è l’altezza del cordolo, e \\(h_R\\) è l’altezza dell’irrigidimento del nodo e della piastra di base.\n\n5. **Determinazione del momento trasferito all’estradosso del cordolo:**\n\n    \\[\n    M_{\\text{urto}} = F_{\\text{urto}} \\cdot h_B = M_{\\text{pl}} \\cdot \\left(1 + \\frac{h_R}{h^*}\\right)\n    \\]\n\n6. **Amplificazione per le incertezze:** Il valore caratteristico è amplificato di un fattore parziale pari a 1,50 per tenere conto delle incertezze e possibili deformabilità della lamiera irrigidita.\n\n7. **Considerazione della plasticizzazione:** Nel caso di barriere ordinarie, si considera la piena plasticizzazione di tre montanti consecutivi a seguito dell’urto, salvo diversa valutazione motivata.\n\n8. **Normative alternative:** In assenza di informazioni, si può fare riferimento al valore normativo della forza d’urto di 100 kN (NTC18) da collocarsi a 100 mm sotto la sommità dell’elemento o 1,0 m sopra il livello del piano di marcia【4:0†source】【4:1†source】【4:4†source】【4:9†source】【4:5†source】. \n\nPer ulteriori dettagli o chiarimenti, puoi consultare la sezione del documento ST-VAL4 o scrivere a anna.sganzerla@tecneautostrade.it.",
+  },
+};

package/src/components/ChatBubble/ChatBubble.tsx

@@ -91,26 +91,33 @@ const ChatBubble: React.FC<Props> = ({
   const { t } = useTranslation();
   const [showingWhyThisAnswer, setShowingWhyThisAnswer] = useState(false);
 
-  const renderedText = sanitize(
-    (
-      marked.parse(
-        (message.translatedText || message.text)
-          .replaceAll('( ', '\\(')
-          .replaceAll(')', '\\)')
-      ) as string
-    )
-      .trim()
-      .replace(/\n/g, '<br>')
-      // replace consecutive <br> with a <br>
-      .replace(/(<br>)+/g, '<br><br>'),
-    {
-      ADD_ATTR: ['target'],
-    }
-  )
-    .replaceAll('[', '\\[')
-    .replaceAll(']', '\\]')
-    // replace consecutive <br> with a single <br>
-    .replace(/(<br>)+/g, '<br>');
+  const renderedText = message.fromUser
+    ? message.translatedText || message.text
+    : sanitize(
+        (
+          marked.parse(
+            (message.translatedText || message.text)
+              // remove markdown links
+              .replaceAll(
+                /\[([^\]]+)\]\([^)]+\)/g,
+                '<a href="$1" target="_blank" rel="noopener noreferrer">$1</a>'
+              )
+              .replaceAll('(', '\\(')
+              .replaceAll(')', '\\)')
+          ) as string
+        )
+          .trim()
+          .replace(/\n/g, '<br>')
+          // replace consecutive <br> with a <br>
+          .replace(/(<br>)+/g, '<br><br>'),
+        {
+          ADD_ATTR: ['target'],
+        }
+      )
+        .replaceAll('[', '\\[')
+        .replaceAll(']', '\\]')
+        // replace consecutive <br> with a single <br>
+        .replace(/(<br>)+/g, '<br>');
 
   useLayoutEffect(() => {
     if (typeof window !== 'undefined' && !message.fromUser) {
@@ -231,6 +238,7 @@ const ChatBubble: React.FC<Props> = ({
           }`}
         >
           <div
+            dir="auto"
             className="memori-chat--bubble-content"
             dangerouslySetInnerHTML={{ __html: renderedText }}
           />

package/src/components/ChatBubble/__snapshots__/ChatBubble.test.tsx.snap

@@ -10,10 +10,9 @@ exports[`renders ChatBubble from user with avatar as react element unchanged 1`]
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
     </div>
     <div
@@ -37,10 +36,9 @@ exports[`renders ChatBubble from user with avatar unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
     </div>
     <picture
@@ -66,10 +64,9 @@ exports[`renders ChatBubble from user with custom avatar unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
     </div>
     <picture
@@ -105,6 +102,7 @@ exports[`renders ChatBubble unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <p>
           Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
@@ -135,6 +133,7 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <p>
           Per calcolare l'ipotenusa di un triangolo rettangolo, puoi usare il Teorema di Pitagora. Il teorema afferma che in un triangolo rettangolo, il quadrato dell'ipotenusa (la lato opposto all'angolo retto) è uguale alla somma dei quadrati degli altri due lati.
@@ -151,9 +150,9 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
         <p>
           Dove:
           <br />
-          - \\(c \\) è l'ipotenusa.
+          - \\( c \\) è l'ipotenusa.
           <br />
-          - \\(a \\) e \\(b \\) sono i due cateti del triangolo.
+          - \\( a \\) e \\( b \\) sono i due cateti del triangolo.
         </p>
         <br />
         <h3>
@@ -165,7 +164,7 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
           <li>
             <p>
               <strong>
-                Misura o identifica i cateti \\(a \\) e \\(b \\)
+                Misura o identifica i cateti \\( a \\) e \\( b \\)
               </strong>
               :
               <br />
@@ -181,7 +180,7 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
               </strong>
               :
               <br />
-              Eleva al quadrato entrambe le misure dei cateti: \\(a^2 \\) e \\(b^2 \\).
+              Eleva al quadrato entrambe le misure dei cateti: \\( a^2 \\) e \\( b^2 \\).
             </p>
             <br />
           </li>
@@ -193,7 +192,7 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
               </strong>
               :
               <br />
-              Somma i risultati ottenuti: \\(a^2 + b^2 \\).
+              Somma i risultati ottenuti: \\( a^2 + b^2 \\).
             </p>
             <br />
           </li>
@@ -205,7 +204,7 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
               </strong>
               :
               <br />
-              Prendi la radice quadrata della somma per trovare l'ipotenusa: \\(c = \\sqrt{a^2 + b^2} \\).
+              Prendi la radice quadrata della somma per trovare l'ipotenusa: \\( c = \\sqrt{a^2 + b^2} \\).
             </p>
             <br />
           </li>
@@ -224,14 +223,14 @@ exports[`renders ChatBubble with complex markdown and math 1 unchanged 1`] = `
           <br />
           <li>
             <strong>
-              Cateto \\(a \\)
+              Cateto \\( a \\)
             </strong>
             : 3 cm
           </li>
           <br />
           <li>
             <strong>
-              Cateto \\(b \\)
+              Cateto \\( b \\)
             </strong>
             : 4 cm
           </li>
@@ -291,6 +290,7 @@ exports[`renders ChatBubble with complex markdown and math 2 unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <p>
           Per calcolare le resistenze dei materiali per le verifiche rispetto ad azioni antropiche e ambientali secondo la Specifica Tecnica ST-VAL4, si procede in questo modo:
@@ -315,13 +315,13 @@ exports[`renders ChatBubble with complex markdown and math 2 unchanged 1`] = `
                 Calcolo della resistenza:
               </strong>
               <br />
-              Il valore della resistenza dei materiali \\(f_d \\) da utilizzare nelle verifiche per carichi gravitazionali si ottiene mediante la seguente espressione:
+              Il valore della resistenza dei materiali \\( f_d \\) da utilizzare nelle verifiche per carichi gravitazionali si ottiene mediante la seguente espressione:
             </p>
             <br />
             <p>
               \\[
               <br />
-              f_d = \\min \\left(\\frac{f_m}{FC \\cdot \\gamma_M}, \\frac{f_k}{FC} \\right)
+              f_d = \\min \\left( \\frac{f_m}{FC \\cdot \\gamma_M}, \\frac{f_k}{FC} \\right)
               <br />
               \\]
             </p>
@@ -333,19 +333,19 @@ exports[`renders ChatBubble with complex markdown and math 2 unchanged 1`] = `
             <ul>
               <br />
               <li>
-                \\(f_m \\) è il valor medio della resistenza valutato dai risultati delle prove effettuate sui campioni prelevati in situ;
+                \\( f_m \\) è il valor medio della resistenza valutato dai risultati delle prove effettuate sui campioni prelevati in situ;
               </li>
               <br />
               <li>
-                \\(f_k \\) è la resistenza caratteristica calcolata sulla base dei risultati delle prove sui campioni prelevati in situ;
+                \\( f_k \\) è la resistenza caratteristica calcolata sulla base dei risultati delle prove sui campioni prelevati in situ;
               </li>
               <br />
               <li>
-                \\(FC \\) è il Fattore di Confidenza associato al Livello di Conoscenza raggiunto;
+                \\( FC \\) è il Fattore di Confidenza associato al Livello di Conoscenza raggiunto;
               </li>
               <br />
               <li>
-                \\(\\gamma_M \\) è il fattore parziale di sicurezza del materiale   .
+                \\( \\gamma_M \\) è il fattore parziale di sicurezza del materiale   .
               </li>
               <br />
             </ul>
@@ -419,6 +419,7 @@ exports[`renders ChatBubble with initial msg unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <p>
           Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
@@ -449,6 +450,7 @@ exports[`renders ChatBubble with markdown and breakline unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <p>
           Per l'avvio di una progettualità è necessario fornire le seguenti informazioni:
@@ -491,6 +493,7 @@ exports[`renders ChatBubble with markdown unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
         <h2>
           Test
@@ -644,7 +647,7 @@ exports[`renders ChatBubble with markdown unchanged 1`] = `
         <br />
         <p>
           <a
-            href="https://memori.ai%5C"
+            href="Vedi altro"
             rel="noopener noreferrer"
             target="_blank"
           >
@@ -667,10 +670,9 @@ exports[`renders ChatBubble with msg from BoE expert unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
       <div
         class="memori-chat--bubble-addon"
@@ -751,10 +753,9 @@ exports[`renders ChatBubble with msg generated by AI unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
       <div
         class="memori-chat--bubble-addon"
@@ -835,10 +836,9 @@ exports[`renders ChatBubble with user msg unchanged 1`] = `
     >
       <div
         class="memori-chat--bubble-content"
+        dir="auto"
       >
-        <p>
-          Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
-        </p>
+        Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </div>
     </div>
     <div

package/src/components/MemoriWidget/MemoriWidget.tsx

@@ -71,6 +71,8 @@ import {
   hasTouchscreen,
   stripDuplicates,
   stripEmojis,
+  escapeHTML,
+  stripMarkdown,
 } from '../../helpers/utils';
 import { anonTag } from '../../helpers/constants';
 import { getErrori18nKey } from '../../helpers/error';
@@ -1622,6 +1624,21 @@ const MemoriWidget = ({
             voiceType === 'MALE' ? 'el-GR-NestorasNeural' : 'el-GR-AthinaNeural'
           }`;
           break;
+        case 'AR':
+          voice = `${
+            voiceType === 'MALE' ? 'ar-SA-HamedNeural' : 'ar-SA-ZariyahNeural'
+          }`;
+          break;
+        case 'ZH':
+          voice = `${
+            voiceType === 'MALE' ? 'zh-CN-YunxiNeural' : 'zh-CN-XiaoxiaoNeural'
+          }`;
+          break;
+        case 'JA':
+          voice = `${
+            voiceType === 'MALE' ? 'ja-JP-KeitaNeural' : 'ja-JP-NanamiNeural'
+          }`;
+          break;
         default:
           voice = `${
             voiceType === 'MALE' ? 'it-IT-DiegoNeural' : 'it-IT-IsabellaNeural'
@@ -1681,6 +1698,15 @@ const MemoriWidget = ({
       case 'EL':
         voice = 'el-GR';
         break;
+      case 'AR':
+        voice = 'ar-SA';
+        break;
+      case 'ZH':
+        voice = 'zh-CN';
+        break;
+      case 'JA':
+        voice = 'ja-JP';
+        break;
       default:
         voice = 'it-IT';
         break;
@@ -1717,12 +1743,6 @@ const MemoriWidget = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const escapeHTML = (text: string) => {
-    const el = document.createElement('textarea');
-    el.textContent = text;
-    return el.innerHTML;
-  };
-
   const replaceTextWithPhonemes = (text: string, lang: string) => {
     if (!phonemesMap) return text;
 
@@ -1846,7 +1866,7 @@ const MemoriWidget = ({
       `<speak version="1.0" xmlns="http://www.w3.org/2001/10/synthesis" xmlns:mstts="https://www.w3.org/2001/mstts" xmlns:emo="http://www.w3.org/2009/10/emotionml" xml:lang="${getCultureCodeByLanguage(
         userLang
       )}"><voice name="${getTTSVoice(userLang)}"><s>${replaceTextWithPhonemes(
-        escapeHTML(stripEmojis(text)),
+        escapeHTML(stripMarkdown(stripEmojis(text))),
         userLang.toLowerCase()
       )}</s></voice></speak>`,
       result => {

package/src/components/StartPanel/__snapshots__/StartPanel.test.tsx.snap

@@ -1335,6 +1335,24 @@ exports[`renders StartPanel with integrationConfig unchanged 1`] = `
           >
             Ελληνικά
           </option>
+          <option
+            aria-label="العربية"
+            value="AR"
+          >
+            العربية
+          </option>
+          <option
+            aria-label="中文"
+            value="ZH"
+          >
+            中文
+          </option>
+          <option
+            aria-label="日本語"
+            value="JA"
+          >
+            日本語
+          </option>
         </select>
       </div>
       <button

package/src/components/layouts/__snapshots__/Chat.test.tsx.snap

@@ -317,6 +317,24 @@ exports[`renders Chat layout unchanged 1`] = `
                 >
                   Ελληνικά
                 </option>
+                <option
+                  aria-label="العربية"
+                  value="AR"
+                >
+                  العربية
+                </option>
+                <option
+                  aria-label="中文"
+                  value="ZH"
+                >
+                  中文
+                </option>
+                <option
+                  aria-label="日本語"
+                  value="JA"
+                >
+                  日本語
+                </option>
               </select>
             </div>
             <button

package/src/components/layouts/__snapshots__/FullPage.test.tsx.snap

@@ -356,6 +356,24 @@ exports[`renders FullPage layout unchanged 1`] = `
                   >
                     Ελληνικά
                   </option>
+                  <option
+                    aria-label="العربية"
+                    value="AR"
+                  >
+                    العربية
+                  </option>
+                  <option
+                    aria-label="中文"
+                    value="ZH"
+                  >
+                    中文
+                  </option>
+                  <option
+                    aria-label="日本語"
+                    value="JA"
+                  >
+                    日本語
+                  </option>
                 </select>
               </div>
               <button

package/src/components/layouts/__snapshots__/Totem.test.tsx.snap

@@ -410,6 +410,24 @@ exports[`renders Totem layout unchanged 1`] = `
                 >
                   Ελληνικά
                 </option>
+                <option
+                  aria-label="العربية"
+                  value="AR"
+                >
+                  العربية
+                </option>
+                <option
+                  aria-label="中文"
+                  value="ZH"
+                >
+                  中文
+                </option>
+                <option
+                  aria-label="日本語"
+                  value="JA"
+                >
+                  日本語
+                </option>
               </select>
             </div>
             <button

package/src/helpers/constants.ts

@@ -10,6 +10,9 @@ export const chatLanguages = [
   { value: 'PL', label: 'Polski' },
   { value: 'FI', label: 'Suomi' },
   { value: 'EL', label: 'Ελληνικά' },
+  { value: 'AR', label: 'العربية' },
+  { value: 'ZH', label: '中文' },
+  { value: 'JA', label: '日本語' },
 ];
 
 export const allowedMediaTypes = [

package/src/helpers/utils.test.ts

@@ -1,4 +1,4 @@
-import { difference, stripEmojis } from './utils';
+import { difference, stripEmojis, stripMarkdown } from './utils';
 
 describe('Utils/difference', () => {
   it('should return the difference between two objects with numeric values', () => {
@@ -43,3 +43,80 @@ describe('utils/stripEmojis', () => {
     expect(result).toEqual('Hello');
   });
 });
+
+describe('utils/stripMarkdown', () => {
+  it('should strip markdown headings from a string', () => {
+    const result = stripMarkdown('# Hello');
+    expect(result).toEqual('Hello');
+  });
+
+  it('should strip markdown bold and italic from a string', () => {
+    const result = stripMarkdown('**Hello** _world_');
+    expect(result).toEqual('Hello world');
+  });
+
+  it('should strip markdown links from a string', () => {
+    const result = stripMarkdown('[example.com](https://example.com)');
+    expect(result).toEqual('example.com');
+  });
+
+  it('should strip markdown images from a string', () => {
+    const result = stripMarkdown('![example.com](https://example.com)');
+    expect(result).toEqual('');
+  });
+
+  it('should strip markdown blockquotes from a string', () => {
+    const result = stripMarkdown('> Hello');
+    expect(result).toEqual('Hello');
+  });
+
+  it('should strip markdown horizontal rules from a string', () => {
+    const result = stripMarkdown('---');
+    expect(result).toEqual('');
+  });
+
+  it('should strip markdown strikethrough from a string', () => {
+    const result = stripMarkdown('~~Hello~~');
+    expect(result).toEqual('Hello');
+  });
+
+  it('should strip markdown code blocks from a string', () => {
+    const result = stripMarkdown('```Hello```');
+    expect(result).toEqual('');
+  });
+
+  it('should strip markdown multiline code blocks from a string', () => {
+    const result = stripMarkdown('```\nHello\n```');
+    expect(result).toEqual('');
+  });
+
+  it('should strip markdown inline code from a string', () => {
+    const result = stripMarkdown('`Hello`');
+    expect(result).toEqual('');
+  });
+
+  it('should strip markdown lists from a string', () => {
+    const result = stripMarkdown('- Hello');
+    expect(result).toEqual('Hello');
+  });
+
+  it('should strip markdown tables from a string', () => {
+    const result = stripMarkdown('| Hello |');
+    expect(result).toEqual('');
+  });
+
+  it('should strip block mathjax from a string', () => {
+    const result = stripMarkdown('\\[ c = \\sqrt{a^2 + b^2} \\]');
+    expect(result).toEqual('');
+  });
+
+  it('should strip block mathjax from a string with multiple lines', () => {
+    const result = stripMarkdown('$$\nHello\n$$');
+    expect(result).toEqual('');
+  });
+
+  it('should strip inline mathjax from a string', () => {
+    const result = stripMarkdown('\\( f_m \\)');
+    expect(result).toEqual('');
+  });
+});

package/src/helpers/utils.ts

@@ -146,6 +146,46 @@ export const stripEmojis = (text: string) => {
   return text.replaceAll(/[^\p{L}\p{N}\p{P}\p{Z}^$\n]/gu, '').trim();
 };
 
+export const stripMarkdown = (text: string) => {
+  // Remove code blocks
+  text = text.replaceAll(/```[\s\S]*?```/g, '');
+  // Remove inline code
+  text = text.replaceAll(/`[^`]*`/g, '');
+  // Remove images
+  text = text.replaceAll(/!\[[^\]]*\]\([^)]*\)/g, '');
+  // Remove links but keep the text
+  text = text.replaceAll(/\[([^\]]*)\]\([^)]*\)/g, '$1');
+  // Remove blockquotes but keep the text
+  text = text.replaceAll(/^> /gm, '');
+  // Remove headings but keep the text
+  text = text.replaceAll(/^#+ /gm, '');
+  // Remove bold and italic symbols and keep the text
+  text = text.replaceAll(/[*_]/g, '');
+  // Remove horizontal rules
+  text = text.replaceAll(/---/g, '');
+  // Remove strikethrough and keep the text
+  text = text.replaceAll(/~~/g, '');
+  // Remove lists
+  text = text.replaceAll(/^\s*[-*+] /gm, '');
+  text = text.replaceAll(/^\s*\d+\.\s+/gm, '');
+  // Remove tables
+  text = text.replaceAll(/^\|.*\|$/gm, '');
+  // Remove MathJax
+  text = text.replaceAll(/\$\$[\s\S]*?\$\$/g, '');
+  text = text.replaceAll(/\$[\s\S]*?\$/g, '');
+  text = text.replaceAll(/\\\([\s\S]*?\\\)/g, '');
+  text = text.replaceAll(/\\\[[\s\S]*?\\\]/g, '');
+  // Remove extra spaces and newlines
+  text = text.replaceAll(/\s+/g, ' ').trim();
+  return text;
+};
+
+export const escapeHTML = (text: string) => {
+  const el = document.createElement('textarea');
+  el.textContent = text;
+  return el.innerHTML;
+};
+
 export const getFieldFromCustomData = (
   fieldName: string,
   data: string | undefined

package/src/index.tsx

@@ -294,7 +294,7 @@ const Memori: React.FC<Props> = ({
               processHtmlClass: 'memori-chat--bubble-content',
             },
             tex: {
-              inlineMath: [['$', '$'], ['\\$', '\\$'], ['(',')'], ['\(','\)'], ['\[', '\]'], ['[', ']'], ['\\(', '\\)'], ['\\[', '\\]'], ['((','))']],
+              inlineMath: [['$', '$'], ['\\$', '\\$'], ['(',')'], ['(','\\)'], ['\[', '\]'], ['[', '\\]'], ['[', ']'], ['\\(', '\\)'], ['\\[', '\\]'], ['((','))']],
               displayMath: [['$$', '$$'], ['\\[[', '\\]]']],
               processEscapes: true,
             },