igniteui-webcomponents 6.3.1 → 6.3.2

package/{components/chat/extras/markdown-renderer.d.ts → extras/chat-markdown-renderer.d.ts}

@@ -1,4 +1,4 @@
-import type { IgcChatMessage } from '../types.js';
+import type { IgcChatMessage } from '../components/chat/types.js';
 /**
  * Options to configure the MarkdownMessageRenderer.
  */

package/{components/chat/extras/markdown-renderer.js → extras/chat-markdown-renderer.js}

@@ -25,6 +25,15 @@ export async function createMarkdownRenderer(options) {
     if (!options?.noHighlighter) {
         const themes = options?.theme ?? DEFAULT_THEME;
         const langs = options?.languages ?? DEFAULT_LANGUAGES;
+        const colorReplacements = {
+            '#6f42c1': 'var(--shiki-purple)',
+            '#032f62': 'var(--shiki-dark-blue)',
+            '#24292e': 'var(--shiki-navy)',
+            '#d73a49': 'var(--shiki-red)',
+            '#005cc5': 'var(--shiki-blue)',
+            '#22863a': 'var(--shiki-green)',
+            '#e36209': 'var(--shiki-orange)',
+        };
         const highlighter = await createHighlighter({
             langs,
             themes: Object.keys(bundledThemes),
@@ -32,7 +41,23 @@ export async function createMarkdownRenderer(options) {
         markdown.use(markedShiki({
             highlight(code, lang, _) {
                 try {
-                    return highlighter.codeToHtml(code, { lang, themes });
+                    return highlighter.codeToHtml(code, {
+                        lang,
+                        themes,
+                        colorReplacements: {
+                            'github-light': {
+                                ...colorReplacements,
+                                '#fff': 'var(--shiki-bg)',
+                                '#24292e': 'var(--shiki-fg)',
+                            },
+                            'github-dark': {
+                                ...colorReplacements,
+                                '#24292e': 'var(--shiki-bg)',
+                                '#e1e4e8': 'var(--shiki-fg)',
+                            },
+                        },
+                        defaultColor: 'light-dark()',
+                    });
                 }
                 catch {
                     return `<pre><code>${sanitizer(code)}</code></pre>`;
@@ -46,4 +71,4 @@ export async function createMarkdownRenderer(options) {
             : '';
     };
 }
-//# sourceMappingURL=markdown-renderer.js.map
+//# sourceMappingURL=chat-markdown-renderer.js.map

package/extras/chat-markdown-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-markdown-renderer.js","sourceRoot":"","sources":["../../src/extras/chat-markdown-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,WAAW,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAChC,OAAO,WAAW,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAGpE,MAAM,iBAAiB,GAAG,CAAC,YAAY,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACtE,MAAM,aAAa,GAAG;IACpB,KAAK,EAAE,cAAc;IACrB,IAAI,EAAE,aAAa;CACpB,CAAC;AA8BF,MAAM,CAAC,KAAK,UAAU,sBAAsB,CAC1C,OAAiC;IAEjC,MAAM,SAAS,GAAG,OAAO,EAAE,SAAS,IAAI,SAAS,CAAC,QAAQ,CAAC;IAE3D,MAAM,QAAQ,GAAG,IAAI,MAAM,CAAC;QAC1B,MAAM,EAAE,IAAI;QACZ,GAAG,EAAE,IAAI;QACT,UAAU,EAAE;YACV;gBACE,IAAI,EAAE,MAAM;gBACZ,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE;oBAC5B,OAAO,YAAY,IAAI,+CAA+C,KAAK,CAAC,CAAC,CAAC,UAAU,KAAK,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,MAAM,CAAC;gBACtH,CAAC;aACF;SACF;KACF,CAAC,CAAC;IAEH,IAAI,CAAC,OAAO,EAAE,aAAa,EAAE,CAAC;QAC5B,MAAM,MAAM,GAAG,OAAO,EAAE,KAAK,IAAI,aAAa,CAAC;QAC/C,MAAM,KAAK,GAAG,OAAO,EAAE,SAAS,IAAI,iBAAiB,CAAC;QACtD,MAAM,iBAAiB,GAAG;YACxB,SAAS,EAAE,qBAAqB;YAChC,SAAS,EAAE,wBAAwB;YACnC,SAAS,EAAE,mBAAmB;YAC9B,SAAS,EAAE,kBAAkB;YAC7B,SAAS,EAAE,mBAAmB;YAC9B,SAAS,EAAE,oBAAoB;YAC/B,SAAS,EAAE,qBAAqB;SACjC,CAAC;QAEF,MAAM,WAAW,GAAG,MAAM,iBAAiB,CAAC;YAC1C,KAAK;YACL,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;SACnC,CAAC,CAAC;QAEH,QAAQ,CAAC,GAAG,CACV,WAAW,CAAC;YACV,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,CAAC;gBACrB,IAAI,CAAC;oBACH,OAAO,WAAW,CAAC,UAAU,CAAC,IAAI,EAAE;wBAClC,IAAI;wBACJ,MAAM;wBACN,iBAAiB,EAAE;4BACjB,cAAc,EAAE;gCACd,GAAG,iBAAiB;gCACpB,MAAM,EAAE,iBAAiB;gCACzB,SAAS,EAAE,iBAAiB;6BAC7B;4BACD,aAAa,EAAE;gCACb,GAAG,iBAAiB;gCACpB,SAAS,EAAE,iBAAiB;gCAC5B,SAAS,EAAE,iBAAiB;6BAC7B;yBACF;wBACD,YAAY,EAAE,cAAc;qBAC7B,CAAC,CAAC;gBACL,CAAC;gBAAC,MAAM,CAAC;oBACP,OAAO,cAAc,SAAS,CAAC,IAAI,CAAC,eAAe,CAAC;gBACtD,CAAC;YACH,CAAC;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAED,OAAO,KAAK,EAAE,OAAuB,EAAoB,EAAE;QACzD,OAAO,OAAO,CAAC,IAAI;YACjB,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,MAAM,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;YAC3D,CAAC,CAAC,EAAE,CAAC;IACT,CAAC,CAAC;AACJ,CAAC","sourcesContent":["import DOMPurify from 'dompurify';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { Marked } from 'marked';\nimport markedShiki from 'marked-shiki';\nimport { bundledThemes, createHighlighter } from 'shiki/bundle/web';\nimport type { IgcChatMessage } from '../components/chat/types.js';\n\nconst DEFAULT_LANGUAGES = ['javascript', 'typescript', 'html', 'css'];\nconst DEFAULT_THEME = {\n  light: 'github-light',\n  dark: 'github-dark',\n};\n\n/**\n * Options to configure the MarkdownMessageRenderer.\n */\nexport interface MarkdownRendererOptions {\n  /**\n   * If true, disables syntax highlighting entirely.\n   */\n  noHighlighter?: boolean;\n\n  /**\n   * List of programming languages to support in syntax highlighting.\n   */\n  languages?: string[];\n\n  /**\n   * The theme used by the syntax highlighter (e.g., 'github-light').\n   */\n  theme?: {\n    light?: string;\n    dark?: string;\n  };\n\n  /**\n   * A custom HTML sanitization function. Defaults to DOMPurify.sanitize.\n   */\n  sanitizer?: (html: string) => string;\n}\n\nexport async function createMarkdownRenderer(\n  options?: MarkdownRendererOptions\n) {\n  const sanitizer = options?.sanitizer ?? DOMPurify.sanitize;\n\n  const markdown = new Marked({\n    breaks: true,\n    gfm: true,\n    extensions: [\n      {\n        name: 'link',\n        renderer({ href, title, text }) {\n          return `<a href=\"${href}\" target=\"_blank\" rel=\"noopener noreferrer\" ${title ? `title=\"${title}\"` : ''}>${text}</a>`;\n        },\n      },\n    ],\n  });\n\n  if (!options?.noHighlighter) {\n    const themes = options?.theme ?? DEFAULT_THEME;\n    const langs = options?.languages ?? DEFAULT_LANGUAGES;\n    const colorReplacements = {\n      '#6f42c1': 'var(--shiki-purple)',\n      '#032f62': 'var(--shiki-dark-blue)',\n      '#24292e': 'var(--shiki-navy)',\n      '#d73a49': 'var(--shiki-red)',\n      '#005cc5': 'var(--shiki-blue)',\n      '#22863a': 'var(--shiki-green)',\n      '#e36209': 'var(--shiki-orange)',\n    };\n\n    const highlighter = await createHighlighter({\n      langs,\n      themes: Object.keys(bundledThemes),\n    });\n\n    markdown.use(\n      markedShiki({\n        highlight(code, lang, _) {\n          try {\n            return highlighter.codeToHtml(code, {\n              lang,\n              themes,\n              colorReplacements: {\n                'github-light': {\n                  ...colorReplacements,\n                  '#fff': 'var(--shiki-bg)',\n                  '#24292e': 'var(--shiki-fg)',\n                },\n                'github-dark': {\n                  ...colorReplacements,\n                  '#24292e': 'var(--shiki-bg)',\n                  '#e1e4e8': 'var(--shiki-fg)',\n                },\n              },\n              defaultColor: 'light-dark()',\n            });\n          } catch {\n            return `<pre><code>${sanitizer(code)}</code></pre>`;\n          }\n        },\n      })\n    );\n  }\n\n  return async (message: IgcChatMessage): Promise<unknown> => {\n    return message.text\n      ? unsafeHTML(sanitizer(await markdown.parse(message.text)))\n      : '';\n  };\n}\n"]}

package/extras/index.d.ts

@@ -1 +1 @@
-export { createMarkdownRenderer } from '../components/chat/extras/markdown-renderer.js';
+export * from './chat-markdown-renderer.js';

package/extras/index.js

@@ -1,2 +1,2 @@
-export { createMarkdownRenderer } from '../components/chat/extras/markdown-renderer.js';
+export * from './chat-markdown-renderer.js';
 //# sourceMappingURL=index.js.map

package/extras/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/extras/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gDAAgD,CAAC","sourcesContent":["export { createMarkdownRenderer } from '../components/chat/extras/markdown-renderer.js';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/extras/index.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC","sourcesContent":["export * from './chat-markdown-renderer.js';\n"]}