rn-shiki 0.0.37-20 → 0.0.37-22

Sign up to get free protection for your applications and to get access to all the features.
Files changed (75) hide show
  1. package/lib/commonjs/components/syntax/SyntaxHighlighter.js +69 -61
  2. package/lib/commonjs/components/syntax/SyntaxHighlighter.js.map +1 -1
  3. package/lib/commonjs/hooks/useSyntaxHighlighter.js +18 -10
  4. package/lib/commonjs/hooks/useSyntaxHighlighter.js.map +1 -1
  5. package/lib/commonjs/index.js +0 -23
  6. package/lib/commonjs/index.js.map +1 -1
  7. package/lib/commonjs/syntax/{highlighter/index.js → highlighter.js} +20 -10
  8. package/lib/commonjs/syntax/highlighter.js.map +1 -0
  9. package/lib/commonjs/utils/style-transformer.js +97 -0
  10. package/lib/commonjs/utils/style-transformer.js.map +1 -0
  11. package/lib/module/components/syntax/SyntaxHighlighter.js +69 -62
  12. package/lib/module/components/syntax/SyntaxHighlighter.js.map +1 -1
  13. package/lib/module/hooks/useSyntaxHighlighter.js +17 -9
  14. package/lib/module/hooks/useSyntaxHighlighter.js.map +1 -1
  15. package/lib/module/index.js +1 -3
  16. package/lib/module/index.js.map +1 -1
  17. package/lib/module/syntax/highlighter.js +44 -0
  18. package/lib/module/syntax/highlighter.js.map +1 -0
  19. package/lib/module/utils/style-transformer.js +91 -0
  20. package/lib/module/utils/style-transformer.js.map +1 -0
  21. package/lib/typescript/components/syntax/SyntaxHighlighter.d.ts +2 -10
  22. package/lib/typescript/components/syntax/SyntaxHighlighter.d.ts.map +1 -1
  23. package/lib/typescript/hooks/useSyntaxHighlighter.d.ts +3 -2
  24. package/lib/typescript/hooks/useSyntaxHighlighter.d.ts.map +1 -1
  25. package/lib/typescript/index.d.ts +1 -3
  26. package/lib/typescript/index.d.ts.map +1 -1
  27. package/lib/typescript/syntax/{highlighter/index.d.ts → highlighter.d.ts} +3 -4
  28. package/lib/typescript/syntax/highlighter.d.ts.map +1 -0
  29. package/lib/typescript/types/shiki.d.ts +10 -8
  30. package/lib/typescript/types/shiki.d.ts.map +1 -1
  31. package/lib/typescript/utils/string.d.ts +1 -1
  32. package/lib/typescript/utils/string.d.ts.map +1 -1
  33. package/lib/typescript/utils/style-transformer.d.ts +8 -0
  34. package/lib/typescript/utils/style-transformer.d.ts.map +1 -0
  35. package/package.json +1 -1
  36. package/src/components/syntax/SyntaxHighlighter.tsx +62 -28
  37. package/src/utils/string.ts +1 -1
  38. package/lib/commonjs/components/syntax/SyntaxLine.js +0 -36
  39. package/lib/commonjs/components/syntax/SyntaxLine.js.map +0 -1
  40. package/lib/commonjs/components/syntax/index.js +0 -21
  41. package/lib/commonjs/components/syntax/index.js.map +0 -1
  42. package/lib/commonjs/syntax/highlighter/index.js.map +0 -1
  43. package/lib/commonjs/syntax/index.js +0 -19
  44. package/lib/commonjs/syntax/index.js.map +0 -1
  45. package/lib/commonjs/types/index.js +0 -2
  46. package/lib/commonjs/types/index.js.map +0 -1
  47. package/lib/commonjs/types/shiki.d.js +0 -6
  48. package/lib/commonjs/types/shiki.d.js.map +0 -1
  49. package/lib/commonjs/utils/index.js +0 -17
  50. package/lib/commonjs/utils/index.js.map +0 -1
  51. package/lib/module/components/syntax/SyntaxLine.js +0 -31
  52. package/lib/module/components/syntax/SyntaxLine.js.map +0 -1
  53. package/lib/module/components/syntax/index.js +0 -5
  54. package/lib/module/components/syntax/index.js.map +0 -1
  55. package/lib/module/syntax/highlighter/index.js +0 -34
  56. package/lib/module/syntax/highlighter/index.js.map +0 -1
  57. package/lib/module/syntax/index.js +0 -4
  58. package/lib/module/syntax/index.js.map +0 -1
  59. package/lib/module/types/index.js +0 -2
  60. package/lib/module/types/index.js.map +0 -1
  61. package/lib/module/types/shiki.d.js +0 -4
  62. package/lib/module/types/shiki.d.js.map +0 -1
  63. package/lib/module/utils/index.js +0 -4
  64. package/lib/module/utils/index.js.map +0 -1
  65. package/lib/typescript/components/syntax/SyntaxLine.d.ts +0 -9
  66. package/lib/typescript/components/syntax/SyntaxLine.d.ts.map +0 -1
  67. package/lib/typescript/components/syntax/index.d.ts +0 -3
  68. package/lib/typescript/components/syntax/index.d.ts.map +0 -1
  69. package/lib/typescript/syntax/highlighter/index.d.ts.map +0 -1
  70. package/lib/typescript/syntax/index.d.ts +0 -2
  71. package/lib/typescript/syntax/index.d.ts.map +0 -1
  72. package/lib/typescript/types/index.d.ts +0 -7
  73. package/lib/typescript/types/index.d.ts.map +0 -1
  74. package/lib/typescript/utils/index.d.ts +0 -2
  75. package/lib/typescript/utils/index.d.ts.map +0 -1
@@ -1,13 +1,12 @@
1
1
  "use strict";
2
2
 
3
3
  import { useEffect, useState } from 'react';
4
- import { createHighlighter } from '../syntax';
4
+ import { createHighlighter } from '../syntax/highlighter';
5
5
  export function useSyntaxHighlighter({
6
6
  text,
7
- lang,
8
- langName,
9
- theme,
10
- themeName
7
+ language,
8
+ languageId,
9
+ theme
11
10
  }) {
12
11
  const [tokens, setTokens] = useState([]);
13
12
  const [error, setError] = useState();
@@ -22,13 +21,22 @@ export function useSyntaxHighlighter({
22
21
  return;
23
22
  }
24
23
  try {
24
+ // First create the highlighter
25
25
  const highlighter = await createHighlighter({
26
- langs: [lang],
26
+ langs: [language],
27
27
  themes: [theme]
28
28
  });
29
+
30
+ // Get resolved theme name
31
+ const themeResolved = highlighter.getLoadedThemes()?.[0];
32
+ if (!themeResolved) {
33
+ throw new Error('Failed to resolve theme');
34
+ }
35
+
36
+ // Use resolved theme for tokenization
29
37
  const result = highlighter.codeToTokens(text, {
30
- lang: langName,
31
- theme: themeName
38
+ lang: languageId,
39
+ theme: themeResolved
32
40
  });
33
41
  if (mounted && result.tokens) {
34
42
  setTokens(result.tokens);
@@ -50,7 +58,7 @@ export function useSyntaxHighlighter({
50
58
  return () => {
51
59
  mounted = false;
52
60
  };
53
- }, [text, lang, langName, theme, themeName]);
61
+ }, [text, language, languageId, theme]);
54
62
  return {
55
63
  tokens,
56
64
  error,
@@ -1 +1 @@
1
- {"version":3,"names":["useEffect","useState","createHighlighter","useSyntaxHighlighter","text","lang","langName","theme","themeName","tokens","setTokens","error","setError","isLoading","setIsLoading","mounted","highlight","highlighter","langs","themes","result","codeToTokens","undefined","err","console","Error","message"],"sourceRoot":"../../../src","sources":["hooks/useSyntaxHighlighter.ts"],"mappings":";;AACA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,iBAAiB,QAAQ,WAAW;AAE7C,OAAO,SAASC,oBAAoBA,CAAC;EAAEC,IAAI;EAAEC,IAAI;EAAEC,QAAQ;EAAEC,KAAK;EAAEC;AAAkC,CAAC,EAAE;EACvG,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGT,QAAQ,CAAkB,EAAE,CAAC;EACzD,MAAM,CAACU,KAAK,EAAEC,QAAQ,CAAC,GAAGX,QAAQ,CAAS,CAAC;EAC5C,MAAM,CAACY,SAAS,EAAEC,YAAY,CAAC,GAAGb,QAAQ,CAAC,IAAI,CAAC;EAEhDD,SAAS,CAAC,MAAM;IACd,IAAIe,OAAO,GAAG,IAAI;IAClBD,YAAY,CAAC,IAAI,CAAC;IAElB,eAAeE,SAASA,CAAA,EAAG;MACzB,IAAI,CAACZ,IAAI,EAAE;QACTU,YAAY,CAAC,KAAK,CAAC;QACnBJ,SAAS,CAAC,EAAE,CAAC;QACb;MACF;MAEA,IAAI;QACF,MAAMO,WAAW,GAAG,MAAMf,iBAAiB,CAAC;UAC1CgB,KAAK,EAAE,CAACb,IAAI,CAAC;UACbc,MAAM,EAAE,CAACZ,KAAK;QAChB,CAAC,CAAC;QAEF,MAAMa,MAAM,GAAGH,WAAW,CAACI,YAAY,CAACjB,IAAI,EAAE;UAC5CC,IAAI,EAAEC,QAAQ;UACdC,KAAK,EAAEC;QACT,CAAC,CAAgB;QAEjB,IAAIO,OAAO,IAAIK,MAAM,CAACX,MAAM,EAAE;UAC5BC,SAAS,CAACU,MAAM,CAACX,MAAM,CAAC;UACxBG,QAAQ,CAACU,SAAS,CAAC;QACrB;MACF,CAAC,CACD,OAAOC,GAAG,EAAE;QACVC,OAAO,CAACb,KAAK,CAAC,qBAAqB,EAAEY,GAAG,CAAC;QACzC,IAAIR,OAAO,EAAE;UACXH,QAAQ,CAACW,GAAG,YAAYE,KAAK,GAAGF,GAAG,CAACG,OAAO,GAAG,4BAA4B,CAAC;UAC3EhB,SAAS,CAAC,EAAE,CAAC;QACf;MACF,CAAC,SACO;QACN,IAAIK,OAAO,EAAE;UACXD,YAAY,CAAC,KAAK,CAAC;QACrB;MACF;IACF;IAEAE,SAAS,CAAC,CAAC;IACX,OAAO,MAAM;MACXD,OAAO,GAAG,KAAK;IACjB,CAAC;EACH,CAAC,EAAE,CAACX,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,SAAS,CAAC,CAAC;EAE5C,OAAO;IAAEC,MAAM;IAAEE,KAAK;IAAEE;EAAU,CAAC;AACrC","ignoreList":[]}
1
+ {"version":3,"names":["useEffect","useState","createHighlighter","useSyntaxHighlighter","text","language","languageId","theme","tokens","setTokens","error","setError","isLoading","setIsLoading","mounted","highlight","highlighter","langs","themes","themeResolved","getLoadedThemes","Error","result","codeToTokens","lang","undefined","err","console","message"],"sourceRoot":"../../../src","sources":["hooks/useSyntaxHighlighter.ts"],"mappings":";;AAEA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,iBAAiB,QAAQ,uBAAuB;AAEzD,OAAO,SAASC,oBAAoBA,CAAC;EAAEC,IAAI;EAAEC,QAAQ;EAAEC,UAAU;EAAEC;AAA8B,CAAC,EAAE;EAClG,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGR,QAAQ,CAAkB,EAAE,CAAC;EACzD,MAAM,CAACS,KAAK,EAAEC,QAAQ,CAAC,GAAGV,QAAQ,CAAS,CAAC;EAC5C,MAAM,CAACW,SAAS,EAAEC,YAAY,CAAC,GAAGZ,QAAQ,CAAC,IAAI,CAAC;EAEhDD,SAAS,CAAC,MAAM;IACd,IAAIc,OAAO,GAAG,IAAI;IAClBD,YAAY,CAAC,IAAI,CAAC;IAElB,eAAeE,SAASA,CAAA,EAAG;MACzB,IAAI,CAACX,IAAI,EAAE;QACTS,YAAY,CAAC,KAAK,CAAC;QACnBJ,SAAS,CAAC,EAAE,CAAC;QACb;MACF;MAEA,IAAI;QACF;QACA,MAAMO,WAAW,GAAG,MAAMd,iBAAiB,CAAC;UAC1Ce,KAAK,EAAE,CAACZ,QAAQ,CAAC;UACjBa,MAAM,EAAE,CAACX,KAAK;QAChB,CAAC,CAAC;;QAEF;QACA,MAAMY,aAAa,GAAGH,WAAW,CAACI,eAAe,CAAC,CAAC,GAAG,CAAC,CAAC;QACxD,IAAI,CAACD,aAAa,EAAE;UAClB,MAAM,IAAIE,KAAK,CAAC,yBAAyB,CAAC;QAC5C;;QAEA;QACA,MAAMC,MAAM,GAAGN,WAAW,CAACO,YAAY,CAACnB,IAAI,EAAE;UAC5CoB,IAAI,EAAElB,UAAU;UAChBC,KAAK,EAAEY;QACT,CAAC,CAAiB;QAElB,IAAIL,OAAO,IAAIQ,MAAM,CAACd,MAAM,EAAE;UAC5BC,SAAS,CAACa,MAAM,CAACd,MAAM,CAAC;UACxBG,QAAQ,CAACc,SAAS,CAAC;QACrB;MACF,CAAC,CACD,OAAOC,GAAG,EAAE;QACVC,OAAO,CAACjB,KAAK,CAAC,qBAAqB,EAAEgB,GAAG,CAAC;QACzC,IAAIZ,OAAO,EAAE;UACXH,QAAQ,CAACe,GAAG,YAAYL,KAAK,GAAGK,GAAG,CAACE,OAAO,GAAG,4BAA4B,CAAC;UAC3EnB,SAAS,CAAC,EAAE,CAAC;QACf;MACF,CAAC,SACO;QACN,IAAIK,OAAO,EAAE;UACXD,YAAY,CAAC,KAAK,CAAC;QACrB;MACF;IACF;IAEAE,SAAS,CAAC,CAAC;IACX,OAAO,MAAM;MACXD,OAAO,GAAG,KAAK;IACjB,CAAC;EACH,CAAC,EAAE,CAACV,IAAI,EAAEC,QAAQ,EAAEC,UAAU,EAAEC,KAAK,CAAC,CAAC;EAEvC,OAAO;IAAEC,MAAM;IAAEE,KAAK;IAAEE;EAAU,CAAC;AACrC","ignoreList":[]}
@@ -1,7 +1,5 @@
1
1
  "use strict";
2
2
 
3
3
  import SyntaxHighlighter from './components/syntax/SyntaxHighlighter';
4
- import SyntaxLine from './components/syntax/SyntaxLine';
5
- export * from './types/shiki';
6
- export { SyntaxHighlighter, SyntaxLine };
4
+ export { SyntaxHighlighter };
7
5
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["SyntaxHighlighter","SyntaxLine"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,OAAOA,iBAAiB,MAAM,uCAAuC;AACrE,OAAOC,UAAU,MAAM,gCAAgC;AAEvD,cAAc,eAAe;AAE7B,SAASD,iBAAiB,EAAEC,UAAU","ignoreList":[]}
1
+ {"version":3,"names":["SyntaxHighlighter"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,OAAOA,iBAAiB,MAAM,uCAAuC;AAErE,SAASA,iBAAiB","ignoreList":[]}
@@ -0,0 +1,44 @@
1
+ "use strict";
2
+
3
+ import { createHighlighterCore } from 'shiki/dist/core.mjs';
4
+ import { createJavaScriptRegexEngine } from 'shiki/dist/engine-javascript.mjs';
5
+ const engine = createJavaScriptRegexEngine({
6
+ forgiving: true,
7
+ simulation: true,
8
+ cache: new Map()
9
+ });
10
+ async function initializeHighlighter(langs, themes) {
11
+ try {
12
+ return await createHighlighterCore({
13
+ langs,
14
+ themes,
15
+ engine
16
+ });
17
+ } catch (err) {
18
+ console.error('Error initializing highlighter:', err);
19
+ throw err;
20
+ }
21
+ }
22
+ export async function createHighlighter({
23
+ langs,
24
+ themes
25
+ }) {
26
+ if (!langs?.length) {
27
+ throw new Error('Please provide languages when creating a highlighter.');
28
+ }
29
+ try {
30
+ const highlighter = await initializeHighlighter(langs, themes);
31
+ return highlighter;
32
+ } catch (error) {
33
+ console.error('Failed to create highlighter:', error);
34
+ throw error;
35
+ }
36
+ }
37
+ export function processTokens(tokens) {
38
+ return tokens.map(token => ({
39
+ content: token.content,
40
+ color: token.color || '#000000',
41
+ fontStyle: token.fontStyle?.toString()
42
+ }));
43
+ }
44
+ //# sourceMappingURL=highlighter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["createHighlighterCore","createJavaScriptRegexEngine","engine","forgiving","simulation","cache","Map","initializeHighlighter","langs","themes","err","console","error","createHighlighter","length","Error","highlighter","processTokens","tokens","map","token","content","color","fontStyle","toString"],"sourceRoot":"../../../src","sources":["syntax/highlighter.ts"],"mappings":";;AAEA,SAASA,qBAAqB,QAAQ,qBAAqB;AAC3D,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,MAAMC,MAAM,GAAGD,2BAA2B,CAAC;EACzCE,SAAS,EAAE,IAAI;EACfC,UAAU,EAAE,IAAI;EAChBC,KAAK,EAAE,IAAIC,GAAG,CAAC;AACjB,CAAC,CAAC;AAEF,eAAeC,qBAAqBA,CAACC,KAAsB,EAAEC,MAAoB,EAAE;EACjF,IAAI;IACF,OAAO,MAAMT,qBAAqB,CAAC;MACjCQ,KAAK;MACLC,MAAM;MACNP;IACF,CAAC,CAAC;EACJ,CAAC,CACD,OAAOQ,GAAG,EAAE;IACVC,OAAO,CAACC,KAAK,CAAC,iCAAiC,EAAEF,GAAG,CAAC;IACrD,MAAMA,GAAG;EACX;AACF;AAEA,OAAO,eAAeG,iBAAiBA,CAAC;EAAEL,KAAK;EAAEC;AAAyD,CAAC,EAAE;EAC3G,IAAI,CAACD,KAAK,EAAEM,MAAM,EAAE;IAClB,MAAM,IAAIC,KAAK,CAAC,uDAAuD,CAAC;EAC1E;EAEA,IAAI;IACF,MAAMC,WAAW,GAAG,MAAMT,qBAAqB,CAACC,KAAK,EAAEC,MAAM,CAAC;IAC9D,OAAOO,WAAW;EACpB,CAAC,CACD,OAAOJ,KAAK,EAAE;IACZD,OAAO,CAACC,KAAK,CAAC,+BAA+B,EAAEA,KAAK,CAAC;IACrD,MAAMA,KAAK;EACb;AACF;AAEA,OAAO,SAASK,aAAaA,CAACC,MAAqB,EAAe;EAChE,OAAOA,MAAM,CAACC,GAAG,CAACC,KAAK,KAAK;IAC1BC,OAAO,EAAED,KAAK,CAACC,OAAO;IACtBC,KAAK,EAAEF,KAAK,CAACE,KAAK,IAAI,SAAS;IAC/BC,SAAS,EAAEH,KAAK,CAACG,SAAS,EAAEC,QAAQ,CAAC;EACvC,CAAC,CAAC,CAAC;AACL","ignoreList":[]}
@@ -0,0 +1,91 @@
1
+ "use strict";
2
+
3
+ import transform from 'css-to-react-native';
4
+ // Helper function to convert hex color to RGB
5
+ function hexToRgb(hex) {
6
+ const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
7
+ return result ? {
8
+ r: Number.parseInt(result[1], 16),
9
+ g: Number.parseInt(result[2], 16),
10
+ b: Number.parseInt(result[3], 16)
11
+ } : null;
12
+ }
13
+
14
+ // Helper function to normalize color values
15
+ function normalizeColor(color) {
16
+ if (!color) return 'transparent';
17
+
18
+ // Type guard to ensure color is string before we call string methods
19
+ if (typeof color === 'string' && color.startsWith('#')) {
20
+ const rgb = hexToRgb(color);
21
+ if (rgb) {
22
+ return `rgb(${rgb.r}, ${rgb.g}, ${rgb.b})`;
23
+ }
24
+ }
25
+ return color;
26
+ }
27
+ export function convertTokenColorsToReactStyle(tokenColors) {
28
+ const styleMap = {};
29
+
30
+ // Add default styles
31
+ styleMap.default = {
32
+ color: '#e1e4e8',
33
+ backgroundColor: 'transparent'
34
+ };
35
+ tokenColors.forEach(token => {
36
+ if (!token.settings || !token.scope) return;
37
+ const scopes = Array.isArray(token.scope) ? token.scope : [token.scope];
38
+ const styleEntries = [];
39
+
40
+ // Only add styles if they exist
41
+ if (token.settings.foreground) {
42
+ styleEntries.push(['color', normalizeColor(token.settings.foreground)]);
43
+ }
44
+ if (token.settings.background) {
45
+ styleEntries.push(['backgroundColor', normalizeColor(token.settings.background)]);
46
+ }
47
+ if (token.settings.fontStyle) {
48
+ if (token.settings.fontStyle.includes('italic')) {
49
+ styleEntries.push(['fontStyle', 'italic']);
50
+ }
51
+ if (token.settings.fontStyle.includes('bold')) {
52
+ styleEntries.push(['fontWeight', 'bold']);
53
+ }
54
+ }
55
+ if (styleEntries.length > 0) {
56
+ const transformedStyle = transform(styleEntries);
57
+ scopes.forEach(scope => {
58
+ if (typeof scope === 'string') {
59
+ styleMap[scope] = {
60
+ ...(styleMap[scope] || {}),
61
+ ...transformedStyle
62
+ };
63
+ }
64
+ });
65
+ }
66
+ });
67
+ return styleMap;
68
+ }
69
+ export function getRNStylesFromShikiStyle(theme) {
70
+ if (!theme || !theme.tokenColors) {
71
+ console.error('Provided theme does not contain \'tokenColors\'.');
72
+ return {};
73
+ }
74
+ try {
75
+ // Convert theme colors to React Native styles
76
+ const styles = convertTokenColorsToReactStyle(theme.tokenColors);
77
+
78
+ // Add theme-specific base styles if they exist
79
+ if (theme.colors) {
80
+ styles.base = {
81
+ color: normalizeColor(theme.colors['editor.foreground']),
82
+ backgroundColor: normalizeColor(theme.colors['editor.background'])
83
+ };
84
+ }
85
+ return styles;
86
+ } catch {
87
+ console.error('Error converting theme styles');
88
+ return {};
89
+ }
90
+ }
91
+ //# sourceMappingURL=style-transformer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["transform","hexToRgb","hex","result","exec","r","Number","parseInt","g","b","normalizeColor","color","startsWith","rgb","convertTokenColorsToReactStyle","tokenColors","styleMap","default","backgroundColor","forEach","token","settings","scope","scopes","Array","isArray","styleEntries","foreground","push","background","fontStyle","includes","length","transformedStyle","getRNStylesFromShikiStyle","theme","console","error","styles","colors","base"],"sourceRoot":"../../../src","sources":["utils/style-transformer.ts"],"mappings":"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","ignoreList":[]}
@@ -1,13 +1,5 @@
1
- import type { LanguageInput, ThemeInput } from 'shiki';
1
+ import type { SyntaxHighlighterProps } from 'src/types/shiki';
2
2
  import React from 'react';
3
- interface SyntaxHighlighterProps {
4
- text: string;
5
- lang?: LanguageInput;
6
- langName?: string;
7
- theme?: ThemeInput;
8
- themeName?: string;
9
- fontSize?: number;
10
- }
11
- declare function SyntaxHighlighter({ text, lang, langName, theme, themeName, fontSize }: SyntaxHighlighterProps): React.JSX.Element;
3
+ declare const SyntaxHighlighter: React.FC<SyntaxHighlighterProps>;
12
4
  export default SyntaxHighlighter;
13
5
  //# sourceMappingURL=SyntaxHighlighter.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../../src/components/syntax/SyntaxHighlighter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,UAAU,sBAAsB;IAC9B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,iBAAS,iBAAiB,CAAC,EAAE,IAAI,EAAE,IAAiB,EAAE,QAAuB,EAAE,KAAkB,EAAE,SAAyB,EAAE,QAAQ,EAAE,EAAE,sBAAsB,qBA4C/J;AAED,eAAe,iBAAiB,CAAA"}
1
+ {"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../../src/components/syntax/SyntaxHighlighter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAE7D,OAAO,KAAkB,MAAM,OAAO,CAAA;AAsBtC,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAqDvD,CAAA;AAED,eAAe,iBAAiB,CAAA"}
@@ -1,5 +1,6 @@
1
- import type { SyntaxHighlighterProps, ThemedToken } from '../types/shiki';
2
- export declare function useSyntaxHighlighter({ text, lang, langName, theme, themeName }: SyntaxHighlighterProps): {
1
+ import type { ThemedToken } from 'shiki';
2
+ import type { SyntaxHighlighterProps } from '../types/shiki';
3
+ export declare function useSyntaxHighlighter({ text, language, languageId, theme }: SyntaxHighlighterProps): {
3
4
  tokens: ThemedToken[][];
4
5
  error: string | undefined;
5
6
  isLoading: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"useSyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSyntaxHighlighter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAe,sBAAsB,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAItF,wBAAgB,oBAAoB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,sBAAsB;;;;EAqDtG"}
1
+ {"version":3,"file":"useSyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSyntaxHighlighter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,KAAK,EAAE,sBAAsB,EAAgB,MAAM,gBAAgB,CAAA;AAI1E,wBAAgB,oBAAoB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,sBAAsB;;;;EA6DjG"}
@@ -1,5 +1,3 @@
1
1
  import SyntaxHighlighter from './components/syntax/SyntaxHighlighter';
2
- import SyntaxLine from './components/syntax/SyntaxLine';
3
- export * from './types/shiki';
4
- export { SyntaxHighlighter, SyntaxLine };
2
+ export { SyntaxHighlighter };
5
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,iBAAiB,MAAM,uCAAuC,CAAA;AACrE,OAAO,UAAU,MAAM,gCAAgC,CAAA;AAEvD,cAAc,eAAe,CAAA;AAE7B,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,iBAAiB,MAAM,uCAAuC,CAAA;AAErE,OAAO,EAAE,iBAAiB,EAAE,CAAA"}
@@ -1,9 +1,8 @@
1
1
  import type { LanguageInput, ThemedToken, ThemeInput } from 'shiki';
2
- import type { TokenType } from '../../types';
3
- import { createHighlighterCore } from 'shiki/core';
2
+ import type { TokenType } from '../types/shiki';
4
3
  export declare function createHighlighter({ langs, themes }: {
5
4
  langs: LanguageInput[];
6
5
  themes: ThemeInput[];
7
- }): Promise<Awaited<ReturnType<typeof createHighlighterCore>>>;
6
+ }): Promise<import("shiki").HighlighterCore>;
8
7
  export declare function processTokens(tokens: ThemedToken[]): TokenType[];
9
- //# sourceMappingURL=index.d.ts.map
8
+ //# sourceMappingURL=highlighter.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"highlighter.d.ts","sourceRoot":"","sources":["../../../src/syntax/highlighter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAwB/C,wBAAsB,iBAAiB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE;IAAE,KAAK,EAAE,aAAa,EAAE,CAAC;IAAC,MAAM,EAAE,UAAU,EAAE,CAAA;CAAE,4CAa1G;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,WAAW,EAAE,GAAG,SAAS,EAAE,CAMhE"}
@@ -1,15 +1,17 @@
1
1
  import type { LanguageInput, ThemedToken, ThemeInput } from 'shiki';
2
- export type { LanguageInput, ThemedToken, ThemeInput };
3
- export interface ShikiResult {
4
- tokens: ThemedToken[][];
5
- bg: string;
6
- fg: string;
2
+ export interface TokenType {
3
+ content: string;
4
+ color?: string;
5
+ fontStyle?: string;
7
6
  }
8
7
  export interface SyntaxHighlighterProps {
9
8
  text: string;
10
- lang: LanguageInput;
11
- langName: string;
9
+ language: LanguageInput;
10
+ languageId: string;
12
11
  theme: ThemeInput;
13
- themeName: string;
12
+ fontSize?: number;
13
+ }
14
+ export interface TokensResult {
15
+ tokens: ThemedToken[][];
14
16
  }
15
17
  //# sourceMappingURL=shiki.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"shiki.d.ts","sourceRoot":"","sources":["../../../src/types/shiki.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEnE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,CAAA;AAEtD,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,WAAW,EAAE,EAAE,CAAA;IACvB,EAAE,EAAE,MAAM,CAAA;IACV,EAAE,EAAE,MAAM,CAAA;CACX;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,aAAa,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,EAAE,UAAU,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;CAClB"}
1
+ {"version":3,"file":"shiki.d.ts","sourceRoot":"","sources":["../../../src/types/shiki.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEnE,MAAM,WAAW,SAAS;IACxB,OAAO,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,aAAa,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,UAAU,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,WAAW,EAAE,EAAE,CAAA;CACxB"}
@@ -1,4 +1,4 @@
1
- import type { TokenType } from '../types';
1
+ import type { TokenType } from '../types/shiki';
2
2
  export declare function createContentPreview(tokens: TokenType[], maxLength?: number): string;
3
3
  export declare function createLineKey(line: TokenType[], index: number): string;
4
4
  export declare function removeExtraIndentation(text: string): string;
@@ -1 +1 @@
1
- {"version":3,"file":"string.d.ts","sourceRoot":"","sources":["../../../src/utils/string.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEzC,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE,SAAS,GAAE,MAAW,GAAG,MAAM,CAMxF;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,UAG7D;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAqB3D"}
1
+ {"version":3,"file":"string.d.ts","sourceRoot":"","sources":["../../../src/utils/string.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE/C,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,SAAS,EAAE,EAAE,SAAS,GAAE,MAAW,GAAG,MAAM,CAMxF;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,UAG7D;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAqB3D"}
@@ -0,0 +1,8 @@
1
+ import type { TextStyle } from 'react-native';
2
+ export interface HighlighterStyleSheet {
3
+ [key: string]: TextStyle;
4
+ }
5
+ export type ReactStyle = Record<string, TextStyle>;
6
+ export declare function convertTokenColorsToReactStyle(tokenColors: any[]): ReactStyle;
7
+ export declare function getRNStylesFromShikiStyle(theme: any): HighlighterStyleSheet;
8
+ //# sourceMappingURL=style-transformer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"style-transformer.d.ts","sourceRoot":"","sources":["../../../src/utils/style-transformer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAG7C,MAAM,WAAW,qBAAqB;IACpC,CAAC,GAAG,EAAE,MAAM,GAAG,SAAS,CAAA;CACzB;AAED,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAA;AA6BlD,wBAAgB,8BAA8B,CAAC,WAAW,EAAE,GAAG,EAAE,GAAG,UAAU,CA4C7E;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,GAAG,GAAG,qBAAqB,CAwB3E"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "rn-shiki",
3
3
  "type": "module",
4
- "version": "0.0.37-20",
4
+ "version": "0.0.37-22",
5
5
  "description": "Shiki syntax highlighter for React Native.",
6
6
  "author": "Ryan Skinner <hello@ryanskinner.com>",
7
7
  "license": "MIT",
@@ -1,3 +1,4 @@
1
+ import type { ColorValue, StyleProp, TextStyle, ViewStyle } from 'react-native'
1
2
  import type { SyntaxHighlighterProps } from 'src/types/shiki'
2
3
  import type { ReactStyle } from '../../utils/style-transformer'
3
4
  import React, { useMemo } from 'react'
@@ -11,7 +12,14 @@ const monospaceFont = Platform.select({
11
12
  default: 'monospace',
12
13
  })
13
14
 
14
- const styles = StyleSheet.create({
15
+ interface Styles {
16
+ scrollView: ViewStyle
17
+ lineContainer: ViewStyle
18
+ token: TextStyle
19
+ container: ViewStyle
20
+ }
21
+
22
+ const baseStyles = StyleSheet.create<Styles>({
15
23
  scrollView: {
16
24
  flex: 1,
17
25
  minHeight: 20,
@@ -20,14 +28,27 @@ const styles = StyleSheet.create({
20
28
  flexDirection: 'row',
21
29
  flexWrap: 'wrap',
22
30
  },
31
+ token: {
32
+ fontFamily: monospaceFont,
33
+ },
34
+ container: {
35
+ flex: 1,
36
+ },
23
37
  })
24
38
 
39
+ type FontWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900'
40
+
41
+ interface TokenStyle extends Omit<TextStyle, 'color' | 'fontWeight'> {
42
+ color?: ColorValue
43
+ fontStyle?: 'normal' | 'italic'
44
+ fontWeight?: FontWeight
45
+ fontFamily?: string
46
+ }
47
+
25
48
  const SyntaxHighlighter: React.FC<SyntaxHighlighterProps> = ({ text, language, languageId, theme }) => {
26
- console.log('theme:', theme)
27
49
  const stylesheet = useMemo(() => {
28
50
  const styles = getRNStylesFromShikiStyle(theme as ReactStyle)
29
- console.log('Generated stylesheet:', styles)
30
- return styles
51
+ return StyleSheet.create(styles)
31
52
  }, [theme])
32
53
 
33
54
  const { tokens } = useSyntaxHighlighter({
@@ -38,20 +59,35 @@ const SyntaxHighlighter: React.FC<SyntaxHighlighterProps> = ({ text, language, l
38
59
  })
39
60
 
40
61
  const renderToken = (token: any, index: number, lineIndex: number) => {
41
- // Ensure to collect all styles associated with the token's scopes
62
+ const styles: StyleProp<TokenStyle>[] = [baseStyles.token]
63
+
64
+ if (stylesheet.base) {
65
+ styles.push(stylesheet.base as unknown as TokenStyle)
66
+ }
67
+
42
68
  const tokenScopes = Array.isArray(token.scope) ? token.scope : [token.scope]
43
- const tokenStylesArray = tokenScopes.map((scope: string) => stylesheet[scope] || {})
44
- const combinedStyles = StyleSheet.flatten([
45
- ...tokenStylesArray,
46
- {
47
- fontFamily: monospaceFont,
48
- ...(token.color && { color: token.color }),
49
- ...(token.fontStyle === 'italic' && stylesheet.italic),
50
- ...(token.fontWeight === 'bold' && stylesheet.bold),
51
- },
52
- ])
53
-
54
- console.log(`Rendering token: ${token.content}, styles:`, combinedStyles)
69
+ tokenScopes.forEach((scope: string) => {
70
+ if (stylesheet[scope]) {
71
+ styles.push(stylesheet[scope] as unknown as TokenStyle)
72
+ }
73
+ })
74
+
75
+ const tokenStyles: TokenStyle = {}
76
+ if (token.color) {
77
+ tokenStyles.color = token.color
78
+ }
79
+ if (token.fontStyle === 'italic') {
80
+ tokenStyles.fontStyle = 'italic'
81
+ }
82
+ if (token.fontWeight === 'bold') {
83
+ tokenStyles.fontWeight = 'bold'
84
+ }
85
+
86
+ if (Object.keys(tokenStyles).length > 0) {
87
+ styles.push(tokenStyles)
88
+ }
89
+
90
+ const combinedStyles = StyleSheet.flatten(styles)
55
91
 
56
92
  return (
57
93
  <Text key={`${lineIndex}-${index}`} style={combinedStyles}>
@@ -60,19 +96,17 @@ const SyntaxHighlighter: React.FC<SyntaxHighlighterProps> = ({ text, language, l
60
96
  )
61
97
  }
62
98
 
63
- // In the renderLine and renderToken flow
64
- const renderLine = (line: any[], lineIndex: number) => {
65
- console.log(`Rendering line ${lineIndex}:`, line)
66
- return (
67
- <View key={lineIndex} style={styles.lineContainer}>
68
- {line.map((token, tokenIndex) => renderToken(token, tokenIndex, lineIndex))}
69
- </View>
70
- )
71
- }
99
+ const renderLine = (line: any[], lineIndex: number) => (
100
+ <View key={lineIndex} style={baseStyles.lineContainer}>
101
+ {line.map((token, tokenIndex) => renderToken(token, tokenIndex, lineIndex))}
102
+ </View>
103
+ )
72
104
 
73
105
  return (
74
- <ScrollView horizontal showsHorizontalScrollIndicator={Platform.OS !== 'web'} style={styles.scrollView}>
75
- <View onStartShouldSetResponder={() => true}>{tokens.map((line, index) => renderLine(line, index))}</View>
106
+ <ScrollView horizontal showsHorizontalScrollIndicator={Platform.OS !== 'web'} style={[baseStyles.scrollView, stylesheet.base as unknown as TokenStyle]}>
107
+ <View style={baseStyles.container} onStartShouldSetResponder={() => true}>
108
+ {tokens.map((line, index) => renderLine(line, index))}
109
+ </View>
76
110
  </ScrollView>
77
111
  )
78
112
  }
@@ -1,4 +1,4 @@
1
- import type { TokenType } from '../types'
1
+ import type { TokenType } from '../types/shiki'
2
2
 
3
3
  export function createContentPreview(tokens: TokenType[], maxLength: number = 20): string {
4
4
  return tokens
@@ -1,36 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _reactNative = require("react-native");
9
- var _jsxRuntime = require("react/jsx-runtime");
10
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
- function SyntaxLine({
12
- line,
13
- fontSize
14
- }) {
15
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
16
- style: {
17
- flexDirection: 'row',
18
- flexWrap: 'wrap'
19
- },
20
- children: line.map((token, tokenIndex) => {
21
- // Preserve whitespace
22
- const content = token.content.replace(/ /g, '\u00A0');
23
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
24
- style: {
25
- color: token.color,
26
- fontFamily: 'monospace',
27
- fontSize,
28
- fontStyle: token.fontStyle
29
- },
30
- children: content
31
- }, `${content}-${tokenIndex}`);
32
- })
33
- });
34
- }
35
- var _default = exports.default = SyntaxLine;
36
- //# sourceMappingURL=SyntaxLine.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_jsxRuntime","e","__esModule","default","SyntaxLine","line","fontSize","jsx","View","style","flexDirection","flexWrap","children","map","token","tokenIndex","content","replace","Text","color","fontFamily","fontStyle","_default","exports"],"sourceRoot":"../../../../src","sources":["components/syntax/SyntaxLine.tsx"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAAyC,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAOzC,SAASG,UAAUA,CAAC;EAAEC,IAAI;EAAEC;AAA0B,CAAC,EAAE;EACvD,oBACE,IAAAN,WAAA,CAAAO,GAAA,EAACR,YAAA,CAAAS,IAAI;IAACC,KAAK,EAAE;MAAEC,aAAa,EAAE,KAAK;MAAEC,QAAQ,EAAE;IAAO,CAAE;IAAAC,QAAA,EACrDP,IAAI,CAACQ,GAAG,CAAC,CAACC,KAAK,EAAEC,UAAU,KAAK;MAC/B;MACA,MAAMC,OAAO,GAAGF,KAAK,CAACE,OAAO,CAACC,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC;MACrD,oBACE,IAAAjB,WAAA,CAAAO,GAAA,EAACR,YAAA,CAAAmB,IAAI;QAEHT,KAAK,EAAE;UACLU,KAAK,EAAEL,KAAK,CAACK,KAAK;UAClBC,UAAU,EAAE,WAAW;UACvBd,QAAQ;UACRe,SAAS,EAAEP,KAAK,CAACO;QACnB,CAAE;QAAAT,QAAA,EAEDI;MAAO,GARH,GAAGA,OAAO,IAAID,UAAU,EASzB,CAAC;IAEX,CAAC;EAAC,CACE,CAAC;AAEX;AAAC,IAAAO,QAAA,GAAAC,OAAA,CAAApB,OAAA,GAEcC,UAAU","ignoreList":[]}
@@ -1,21 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "SyntaxHighlighter", {
7
- enumerable: true,
8
- get: function () {
9
- return _SyntaxHighlighter.default;
10
- }
11
- });
12
- Object.defineProperty(exports, "SyntaxLine", {
13
- enumerable: true,
14
- get: function () {
15
- return _SyntaxLine.default;
16
- }
17
- });
18
- var _SyntaxHighlighter = _interopRequireDefault(require("./SyntaxHighlighter"));
19
- var _SyntaxLine = _interopRequireDefault(require("./SyntaxLine"));
20
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
21
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_SyntaxHighlighter","_interopRequireDefault","require","_SyntaxLine","e","__esModule","default"],"sourceRoot":"../../../../src","sources":["components/syntax/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AAAA,IAAAA,kBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAoD,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["_core","require","_javascript","initializeHighlighter","langs","themes","createHighlighterCore","engine","createJavaScriptRegexEngine","createHighlighter","length","Error","highlighter","error","console","processTokens","tokens","map","token","content","color","fontStyle","toString"],"sourceRoot":"../../../../src","sources":["syntax/highlighter/index.ts"],"mappings":";;;;;;;AAEA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAEA,eAAeE,qBAAqBA,CAACC,KAAsB,EAAEC,MAAoB,EAA8D;EAC7I,OAAO,IAAAC,2BAAqB,EAAC;IAC3BC,MAAM,EAAE,IAAAC,uCAA2B,EAAC,CAAC;IACrCJ,KAAK;IACLC;EACF,CAAC,CAAC;AACJ;AAEO,eAAeI,iBAAiBA,CAAC;EAAEL,KAAK;EAAEC;AAAyD,CAAC,EAA8D;EACvK,IAAI,CAACD,KAAK,EAAEM,MAAM,IAAI,CAACL,MAAM,EAAEK,MAAM,EAAE;IACrC,MAAM,IAAIC,KAAK,CAAC,uEAAuE,CAAC;EAC1F;EAEA,IAAI;IACF,MAAMC,WAAW,GAAG,MAAMT,qBAAqB,CAACC,KAAK,EAAEC,MAAM,CAAC;IAC9D,OAAOO,WAAW;EACpB,CAAC,CACD,OAAOC,KAAK,EAAE;IACZC,OAAO,CAACD,KAAK,CAAC,+BAA+B,EAAEA,KAAK,CAAC;IACrD,MAAMA,KAAK;EACb;AACF;AAEO,SAASE,aAAaA,CAACC,MAAqB,EAAe;EAChE,OAAOA,MAAM,CAACC,GAAG,CAACC,KAAK,KAAK;IAC1BC,OAAO,EAAED,KAAK,CAACC,OAAO;IACtBC,KAAK,EAAEF,KAAK,CAACE,KAAK,IAAI,SAAS;IAC/BC,SAAS,EAAEH,KAAK,CAACG,SAAS,EAAEC,QAAQ,CAAC;EACvC,CAAC,CAAC,CAAC;AACL","ignoreList":[]}
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "createHighlighter", {
7
- enumerable: true,
8
- get: function () {
9
- return _highlighter.createHighlighter;
10
- }
11
- });
12
- Object.defineProperty(exports, "processTokens", {
13
- enumerable: true,
14
- get: function () {
15
- return _highlighter.processTokens;
16
- }
17
- });
18
- var _highlighter = require("./highlighter");
19
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["_highlighter","require"],"sourceRoot":"../../../src","sources":["syntax/index.ts"],"mappings":";;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- "use strict";
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":[],"sourceRoot":"../../../src","sources":["types/index.ts"],"mappings":"","ignoreList":[]}
@@ -1,6 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- //# sourceMappingURL=shiki.d.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":[],"sourceRoot":"../../../src","sources":["types/shiki.d.ts"],"mappings":"","ignoreList":[]}