feat(renderers): add code block

src/components/MessageRenderer/CodeBlock/CodeBlockLightTheme.ts

@@ -0,0 +1,102 @@
+import type { CSSProperties } from 'react';
+
+const lightTheme = {
+  'hljs-comment': {
+    color: '#6e7781',
+  },
+  'hljs-quote': {
+    color: '#6e7781',
+  },
+  'hljs-variable': {
+    color: '#d73a49',
+  },
+  'hljs-template-variable': {
+    color: '#d73a49',
+  },
+  'hljs-tag': {
+    color: '#d73a49',
+  },
+  'hljs-name': {
+    color: '#d73a49',
+  },
+  'hljs-selector-id': {
+    color: '#d73a49',
+  },
+  'hljs-selector-class': {
+    color: '#d73a49',
+  },
+  'hljs-regexp': {
+    color: '#d73a49',
+  },
+  'hljs-deletion': {
+    color: '#d73a49',
+  },
+  'hljs-number': {
+    color: '#b08800',
+  },
+  'hljs-built_in': {
+    color: '#b08800',
+  },
+  'hljs-builtin-name': {
+    color: '#b08800',
+  },
+  'hljs-literal': {
+    color: '#b08800',
+  },
+  'hljs-type': {
+    color: '#b08800',
+  },
+  'hljs-params': {
+    color: '#b08800',
+  },
+  'hljs-meta': {
+    color: '#b08800',
+  },
+  'hljs-link': {
+    color: '#b08800',
+  },
+  'hljs-attribute': {
+    color: '#0a64ae',
+  },
+  'hljs-string': {
+    color: '#22863a',
+  },
+  'hljs-symbol': {
+    color: '#22863a',
+  },
+  'hljs-bullet': {
+    color: '#22863a',
+  },
+  'hljs-addition': {
+    color: '#22863a',
+  },
+  'hljs-title': {
+    color: '#005cc5',
+  },
+  'hljs-section': {
+    color: '#005cc5',
+  },
+  'hljs-keyword': {
+    color: '#6f42c1',
+  },
+  'hljs-selector-tag': {
+    color: '#6f42c1',
+  },
+  hljs: {
+    display: 'block',
+    overflowX: 'auto',
+    background: '#ffffff',
+    color: '#24292f',
+    padding: '0.75em',
+    border: '1px solid #e8edf1',
+    borderRadius: '10px',
+  },
+  'hljs-emphasis': {
+    fontStyle: 'italic',
+  },
+  'hljs-strong': {
+    fontWeight: 'bold',
+  },
+} satisfies Record<string, CSSProperties>;
+
+export default lightTheme;