@cyclone-ui/shiki 0.0.5 → 0.0.7
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.
- package/CHANGELOG.md +7 -0
- package/dist/dark/theme.json +7 -7
- package/dist/dark-dimmed/theme.json +7 -7
- package/dist/dark-high-contrast/theme.json +3 -3
- package/dist/light/theme.json +5 -5
- package/dist/light-dimmed/theme.json +5 -5
- package/dist/light-high-contrast/theme.json +1 -1
- package/package.json +2 -2
- package/src/dark/theme.json +7 -7
- package/src/dark-dimmed/theme.json +7 -7
- package/src/dark-high-contrast/theme.json +3 -3
- package/src/light/theme.json +5 -5
- package/src/light-dimmed/theme.json +5 -5
- package/src/light-high-contrast/theme.json +1 -1
- package/dist/src/dark/INSTALL.md +0 -45
- package/dist/src/dark/theme.json +0 -125
- package/dist/src/dark-dimmed/INSTALL.md +0 -45
- package/dist/src/dark-dimmed/theme.json +0 -125
- package/dist/src/dark-high-contrast/INSTALL.md +0 -45
- package/dist/src/dark-high-contrast/theme.json +0 -125
- package/dist/src/light/INSTALL.md +0 -45
- package/dist/src/light/theme.json +0 -125
- package/dist/src/light-dimmed/INSTALL.md +0 -45
- package/dist/src/light-dimmed/theme.json +0 -125
- package/dist/src/light-high-contrast/INSTALL.md +0 -45
- package/dist/src/light-high-contrast/theme.json +0 -125
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
# Installing Cyclone UI (Dark High Contrast)
|
|
2
|
-
|
|
3
|
-
Generated by `@razorwind/shiki`.
|
|
4
|
-
|
|
5
|
-
## Files
|
|
6
|
-
|
|
7
|
-
- `theme.json` — Cyclone Light (theme id: `cyclone-dark-high-contrast`)
|
|
8
|
-
|
|
9
|
-
## Setup
|
|
10
|
-
|
|
11
|
-
1. Copy or import the generated JSON into your app (paths depend on your bundler).
|
|
12
|
-
|
|
13
|
-
2. Register themes when creating a Shiki highlighter:
|
|
14
|
-
|
|
15
|
-
```ts
|
|
16
|
-
import { createHighlighter } from "shiki";
|
|
17
|
-
import theme from "./theme.json";
|
|
18
|
-
|
|
19
|
-
const highlighter = await createHighlighter({
|
|
20
|
-
themes: [theme],
|
|
21
|
-
langs: ["javascript"]
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const html = highlighter.codeToHtml("const x = 1", {
|
|
25
|
-
lang: "javascript",
|
|
26
|
-
theme: "cyclone-dark-high-contrast"
|
|
27
|
-
});
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
Or load at runtime:
|
|
31
|
-
|
|
32
|
-
```ts
|
|
33
|
-
import { readFile } from "node:fs/promises";
|
|
34
|
-
|
|
35
|
-
const theme = JSON.parse(
|
|
36
|
-
await readFile("./theme.json", "utf8")
|
|
37
|
-
);
|
|
38
|
-
await highlighter.loadTheme(theme);
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
## Select / load theme
|
|
42
|
-
|
|
43
|
-
Pass the theme id to `codeToHtml`, `codeToTokens`, or `getTokenStyle`:
|
|
44
|
-
|
|
45
|
-
- `cyclone-dark-high-contrast` — Cyclone Light
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "cyclone-dark-high-contrast",
|
|
3
|
-
"settings": [
|
|
4
|
-
{
|
|
5
|
-
"scope": [
|
|
6
|
-
"comment",
|
|
7
|
-
"punctuation.definition.comment"
|
|
8
|
-
],
|
|
9
|
-
"settings": {
|
|
10
|
-
"foreground": "#9a9fa7",
|
|
11
|
-
"fontStyle": "italic"
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"scope": [
|
|
16
|
-
"string",
|
|
17
|
-
"constant.other.symbol"
|
|
18
|
-
],
|
|
19
|
-
"settings": {
|
|
20
|
-
"foreground": "#2de498"
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
"scope": [
|
|
25
|
-
"constant",
|
|
26
|
-
"constant.numeric",
|
|
27
|
-
"constant.language"
|
|
28
|
-
],
|
|
29
|
-
"settings": {
|
|
30
|
-
"foreground": "#ffb327"
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
"scope": [
|
|
35
|
-
"keyword",
|
|
36
|
-
"storage",
|
|
37
|
-
"storage.type"
|
|
38
|
-
],
|
|
39
|
-
"settings": {
|
|
40
|
-
"foreground": "#70a4ff"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"scope": [
|
|
45
|
-
"entity.name.function",
|
|
46
|
-
"support.function"
|
|
47
|
-
],
|
|
48
|
-
"settings": {
|
|
49
|
-
"foreground": "#70a4ff"
|
|
50
|
-
}
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
"scope": [
|
|
54
|
-
"entity.name.type",
|
|
55
|
-
"entity.other.inherited-class",
|
|
56
|
-
"support.type"
|
|
57
|
-
],
|
|
58
|
-
"settings": {
|
|
59
|
-
"foreground": "#a283f3"
|
|
60
|
-
}
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"scope": [
|
|
64
|
-
"entity.name.tag",
|
|
65
|
-
"meta.tag"
|
|
66
|
-
],
|
|
67
|
-
"settings": {
|
|
68
|
-
"foreground": "#70a4ff"
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
"scope": [
|
|
73
|
-
"entity.other.attribute-name",
|
|
74
|
-
"support.constant"
|
|
75
|
-
],
|
|
76
|
-
"settings": {
|
|
77
|
-
"foreground": "#70a4ff"
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
"scope": [
|
|
82
|
-
"variable",
|
|
83
|
-
"identifier"
|
|
84
|
-
],
|
|
85
|
-
"settings": {
|
|
86
|
-
"foreground": "#ebebed"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"scope": [
|
|
91
|
-
"punctuation",
|
|
92
|
-
"meta.brace"
|
|
93
|
-
],
|
|
94
|
-
"settings": {
|
|
95
|
-
"foreground": "#9a9fa7"
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"scope": [
|
|
100
|
-
"invalid",
|
|
101
|
-
"invalid.illegal"
|
|
102
|
-
],
|
|
103
|
-
"settings": {
|
|
104
|
-
"foreground": "#f00a45"
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
],
|
|
108
|
-
"displayName": "Cyclone Light",
|
|
109
|
-
"type": "darkHighContrast",
|
|
110
|
-
"fg": "#ffffff",
|
|
111
|
-
"bg": "#000000",
|
|
112
|
-
"colors": {
|
|
113
|
-
"editor.background": "#000000",
|
|
114
|
-
"editor.foreground": "#ffffff",
|
|
115
|
-
"editorCursor.foreground": "#70a4ff",
|
|
116
|
-
"editor.selectionBackground": "#ffffff",
|
|
117
|
-
"editor.selectionForeground": "#000000",
|
|
118
|
-
"editor.inactiveSelectionBackground": "#000000",
|
|
119
|
-
"editorLineNumber.foreground": "#9a9fa7",
|
|
120
|
-
"editorLineNumber.activeForeground": "#ebebed",
|
|
121
|
-
"editorIndentGuide.background1": "#2b2b33",
|
|
122
|
-
"editorIndentGuide.activeBackground1": "#9a9fa7",
|
|
123
|
-
"editorWhitespace.foreground": "#9a9fa7"
|
|
124
|
-
}
|
|
125
|
-
}
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
# Installing Cyclone UI (Light)
|
|
2
|
-
|
|
3
|
-
Generated by `@razorwind/shiki`.
|
|
4
|
-
|
|
5
|
-
## Files
|
|
6
|
-
|
|
7
|
-
- `theme.json` — Cyclone Light (theme id: `cyclone-light`)
|
|
8
|
-
|
|
9
|
-
## Setup
|
|
10
|
-
|
|
11
|
-
1. Copy or import the generated JSON into your app (paths depend on your bundler).
|
|
12
|
-
|
|
13
|
-
2. Register themes when creating a Shiki highlighter:
|
|
14
|
-
|
|
15
|
-
```ts
|
|
16
|
-
import { createHighlighter } from "shiki";
|
|
17
|
-
import theme from "./theme.json";
|
|
18
|
-
|
|
19
|
-
const highlighter = await createHighlighter({
|
|
20
|
-
themes: [theme],
|
|
21
|
-
langs: ["javascript"]
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const html = highlighter.codeToHtml("const x = 1", {
|
|
25
|
-
lang: "javascript",
|
|
26
|
-
theme: "cyclone-light"
|
|
27
|
-
});
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
Or load at runtime:
|
|
31
|
-
|
|
32
|
-
```ts
|
|
33
|
-
import { readFile } from "node:fs/promises";
|
|
34
|
-
|
|
35
|
-
const theme = JSON.parse(
|
|
36
|
-
await readFile("./theme.json", "utf8")
|
|
37
|
-
);
|
|
38
|
-
await highlighter.loadTheme(theme);
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
## Select / load theme
|
|
42
|
-
|
|
43
|
-
Pass the theme id to `codeToHtml`, `codeToTokens`, or `getTokenStyle`:
|
|
44
|
-
|
|
45
|
-
- `cyclone-light` — Cyclone Light
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "cyclone-light",
|
|
3
|
-
"settings": [
|
|
4
|
-
{
|
|
5
|
-
"scope": [
|
|
6
|
-
"comment",
|
|
7
|
-
"punctuation.definition.comment"
|
|
8
|
-
],
|
|
9
|
-
"settings": {
|
|
10
|
-
"foreground": "#959698",
|
|
11
|
-
"fontStyle": "italic"
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"scope": [
|
|
16
|
-
"string",
|
|
17
|
-
"constant.other.symbol"
|
|
18
|
-
],
|
|
19
|
-
"settings": {
|
|
20
|
-
"foreground": "#216b53"
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
"scope": [
|
|
25
|
-
"constant",
|
|
26
|
-
"constant.numeric",
|
|
27
|
-
"constant.language"
|
|
28
|
-
],
|
|
29
|
-
"settings": {
|
|
30
|
-
"foreground": "#765417"
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
"scope": [
|
|
35
|
-
"keyword",
|
|
36
|
-
"storage",
|
|
37
|
-
"storage.type"
|
|
38
|
-
],
|
|
39
|
-
"settings": {
|
|
40
|
-
"foreground": "#2055b3"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"scope": [
|
|
45
|
-
"entity.name.function",
|
|
46
|
-
"support.function"
|
|
47
|
-
],
|
|
48
|
-
"settings": {
|
|
49
|
-
"foreground": "#2055b3"
|
|
50
|
-
}
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
"scope": [
|
|
54
|
-
"entity.name.type",
|
|
55
|
-
"entity.other.inherited-class",
|
|
56
|
-
"support.type"
|
|
57
|
-
],
|
|
58
|
-
"settings": {
|
|
59
|
-
"foreground": "#594395"
|
|
60
|
-
}
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"scope": [
|
|
64
|
-
"entity.name.tag",
|
|
65
|
-
"meta.tag"
|
|
66
|
-
],
|
|
67
|
-
"settings": {
|
|
68
|
-
"foreground": "#2055b3"
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
"scope": [
|
|
73
|
-
"entity.other.attribute-name",
|
|
74
|
-
"support.constant"
|
|
75
|
-
],
|
|
76
|
-
"settings": {
|
|
77
|
-
"foreground": "#2055b3"
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
"scope": [
|
|
82
|
-
"variable",
|
|
83
|
-
"identifier"
|
|
84
|
-
],
|
|
85
|
-
"settings": {
|
|
86
|
-
"foreground": "#555659"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"scope": [
|
|
91
|
-
"punctuation",
|
|
92
|
-
"meta.brace"
|
|
93
|
-
],
|
|
94
|
-
"settings": {
|
|
95
|
-
"foreground": "#959698"
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"scope": [
|
|
100
|
-
"invalid",
|
|
101
|
-
"invalid.illegal"
|
|
102
|
-
],
|
|
103
|
-
"settings": {
|
|
104
|
-
"foreground": "#8e223e"
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
],
|
|
108
|
-
"displayName": "Cyclone Light",
|
|
109
|
-
"type": "light",
|
|
110
|
-
"fg": "#1f1f21",
|
|
111
|
-
"bg": "#eaeaea",
|
|
112
|
-
"colors": {
|
|
113
|
-
"editor.background": "#eaeaea",
|
|
114
|
-
"editor.foreground": "#1f1f21",
|
|
115
|
-
"editorCursor.foreground": "#2055b3",
|
|
116
|
-
"editor.selectionBackground": "#1f1f21",
|
|
117
|
-
"editor.selectionForeground": "#eaeaea",
|
|
118
|
-
"editor.inactiveSelectionBackground": "#e1e1e1",
|
|
119
|
-
"editorLineNumber.foreground": "#959698",
|
|
120
|
-
"editorLineNumber.activeForeground": "#555659",
|
|
121
|
-
"editorIndentGuide.background1": "#e1e1e1",
|
|
122
|
-
"editorIndentGuide.activeBackground1": "#959698",
|
|
123
|
-
"editorWhitespace.foreground": "#959698"
|
|
124
|
-
}
|
|
125
|
-
}
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
# Installing Cyclone UI (Light Dimmed)
|
|
2
|
-
|
|
3
|
-
Generated by `@razorwind/shiki`.
|
|
4
|
-
|
|
5
|
-
## Files
|
|
6
|
-
|
|
7
|
-
- `theme.json` — Cyclone Light (theme id: `cyclone-light-dimmed`)
|
|
8
|
-
|
|
9
|
-
## Setup
|
|
10
|
-
|
|
11
|
-
1. Copy or import the generated JSON into your app (paths depend on your bundler).
|
|
12
|
-
|
|
13
|
-
2. Register themes when creating a Shiki highlighter:
|
|
14
|
-
|
|
15
|
-
```ts
|
|
16
|
-
import { createHighlighter } from "shiki";
|
|
17
|
-
import theme from "./theme.json";
|
|
18
|
-
|
|
19
|
-
const highlighter = await createHighlighter({
|
|
20
|
-
themes: [theme],
|
|
21
|
-
langs: ["javascript"]
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const html = highlighter.codeToHtml("const x = 1", {
|
|
25
|
-
lang: "javascript",
|
|
26
|
-
theme: "cyclone-light-dimmed"
|
|
27
|
-
});
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
Or load at runtime:
|
|
31
|
-
|
|
32
|
-
```ts
|
|
33
|
-
import { readFile } from "node:fs/promises";
|
|
34
|
-
|
|
35
|
-
const theme = JSON.parse(
|
|
36
|
-
await readFile("./theme.json", "utf8")
|
|
37
|
-
);
|
|
38
|
-
await highlighter.loadTheme(theme);
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
## Select / load theme
|
|
42
|
-
|
|
43
|
-
Pass the theme id to `codeToHtml`, `codeToTokens`, or `getTokenStyle`:
|
|
44
|
-
|
|
45
|
-
- `cyclone-light-dimmed` — Cyclone Light
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "cyclone-light-dimmed",
|
|
3
|
-
"settings": [
|
|
4
|
-
{
|
|
5
|
-
"scope": [
|
|
6
|
-
"comment",
|
|
7
|
-
"punctuation.definition.comment"
|
|
8
|
-
],
|
|
9
|
-
"settings": {
|
|
10
|
-
"foreground": "#8f8f90",
|
|
11
|
-
"fontStyle": "italic"
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"scope": [
|
|
16
|
-
"string",
|
|
17
|
-
"constant.other.symbol"
|
|
18
|
-
],
|
|
19
|
-
"settings": {
|
|
20
|
-
"foreground": "#3e7160"
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
"scope": [
|
|
25
|
-
"constant",
|
|
26
|
-
"constant.numeric",
|
|
27
|
-
"constant.language"
|
|
28
|
-
],
|
|
29
|
-
"settings": {
|
|
30
|
-
"foreground": "#786137"
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
"scope": [
|
|
35
|
-
"keyword",
|
|
36
|
-
"storage",
|
|
37
|
-
"storage.type"
|
|
38
|
-
],
|
|
39
|
-
"settings": {
|
|
40
|
-
"foreground": "#45649b"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"scope": [
|
|
45
|
-
"entity.name.function",
|
|
46
|
-
"support.function"
|
|
47
|
-
],
|
|
48
|
-
"settings": {
|
|
49
|
-
"foreground": "#45649b"
|
|
50
|
-
}
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
"scope": [
|
|
54
|
-
"entity.name.type",
|
|
55
|
-
"entity.other.inherited-class",
|
|
56
|
-
"support.type"
|
|
57
|
-
],
|
|
58
|
-
"settings": {
|
|
59
|
-
"foreground": "#675a8a"
|
|
60
|
-
}
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"scope": [
|
|
64
|
-
"entity.name.tag",
|
|
65
|
-
"meta.tag"
|
|
66
|
-
],
|
|
67
|
-
"settings": {
|
|
68
|
-
"foreground": "#45649b"
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
"scope": [
|
|
73
|
-
"entity.other.attribute-name",
|
|
74
|
-
"support.constant"
|
|
75
|
-
],
|
|
76
|
-
"settings": {
|
|
77
|
-
"foreground": "#45649b"
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
"scope": [
|
|
82
|
-
"variable",
|
|
83
|
-
"identifier"
|
|
84
|
-
],
|
|
85
|
-
"settings": {
|
|
86
|
-
"foreground": "#626364"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"scope": [
|
|
91
|
-
"punctuation",
|
|
92
|
-
"meta.brace"
|
|
93
|
-
],
|
|
94
|
-
"settings": {
|
|
95
|
-
"foreground": "#8f8f90"
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"scope": [
|
|
100
|
-
"invalid",
|
|
101
|
-
"invalid.illegal"
|
|
102
|
-
],
|
|
103
|
-
"settings": {
|
|
104
|
-
"foreground": "#864254"
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
],
|
|
108
|
-
"displayName": "Cyclone Light",
|
|
109
|
-
"type": "lightDimmed",
|
|
110
|
-
"fg": "#3c3c3e",
|
|
111
|
-
"bg": "#cacaca",
|
|
112
|
-
"colors": {
|
|
113
|
-
"editor.background": "#cacaca",
|
|
114
|
-
"editor.foreground": "#3c3c3e",
|
|
115
|
-
"editorCursor.foreground": "#45649b",
|
|
116
|
-
"editor.selectionBackground": "#3c3c3e",
|
|
117
|
-
"editor.selectionForeground": "#cacaca",
|
|
118
|
-
"editor.inactiveSelectionBackground": "#c4c4c4",
|
|
119
|
-
"editorLineNumber.foreground": "#8f8f90",
|
|
120
|
-
"editorLineNumber.activeForeground": "#626364",
|
|
121
|
-
"editorIndentGuide.background1": "#c4c4c4",
|
|
122
|
-
"editorIndentGuide.activeBackground1": "#8f8f90",
|
|
123
|
-
"editorWhitespace.foreground": "#8f8f90"
|
|
124
|
-
}
|
|
125
|
-
}
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
# Installing Cyclone UI (Light High Contrast)
|
|
2
|
-
|
|
3
|
-
Generated by `@razorwind/shiki`.
|
|
4
|
-
|
|
5
|
-
## Files
|
|
6
|
-
|
|
7
|
-
- `theme.json` — Cyclone Light (theme id: `cyclone-light-high-contrast`)
|
|
8
|
-
|
|
9
|
-
## Setup
|
|
10
|
-
|
|
11
|
-
1. Copy or import the generated JSON into your app (paths depend on your bundler).
|
|
12
|
-
|
|
13
|
-
2. Register themes when creating a Shiki highlighter:
|
|
14
|
-
|
|
15
|
-
```ts
|
|
16
|
-
import { createHighlighter } from "shiki";
|
|
17
|
-
import theme from "./theme.json";
|
|
18
|
-
|
|
19
|
-
const highlighter = await createHighlighter({
|
|
20
|
-
themes: [theme],
|
|
21
|
-
langs: ["javascript"]
|
|
22
|
-
});
|
|
23
|
-
|
|
24
|
-
const html = highlighter.codeToHtml("const x = 1", {
|
|
25
|
-
lang: "javascript",
|
|
26
|
-
theme: "cyclone-light-high-contrast"
|
|
27
|
-
});
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
Or load at runtime:
|
|
31
|
-
|
|
32
|
-
```ts
|
|
33
|
-
import { readFile } from "node:fs/promises";
|
|
34
|
-
|
|
35
|
-
const theme = JSON.parse(
|
|
36
|
-
await readFile("./theme.json", "utf8")
|
|
37
|
-
);
|
|
38
|
-
await highlighter.loadTheme(theme);
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
## Select / load theme
|
|
42
|
-
|
|
43
|
-
Pass the theme id to `codeToHtml`, `codeToTokens`, or `getTokenStyle`:
|
|
44
|
-
|
|
45
|
-
- `cyclone-light-high-contrast` — Cyclone Light
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "cyclone-light-high-contrast",
|
|
3
|
-
"settings": [
|
|
4
|
-
{
|
|
5
|
-
"scope": [
|
|
6
|
-
"comment",
|
|
7
|
-
"punctuation.definition.comment"
|
|
8
|
-
],
|
|
9
|
-
"settings": {
|
|
10
|
-
"foreground": "#9a9fa7",
|
|
11
|
-
"fontStyle": "italic"
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
{
|
|
15
|
-
"scope": [
|
|
16
|
-
"string",
|
|
17
|
-
"constant.other.symbol"
|
|
18
|
-
],
|
|
19
|
-
"settings": {
|
|
20
|
-
"foreground": "#0a4e38"
|
|
21
|
-
}
|
|
22
|
-
},
|
|
23
|
-
{
|
|
24
|
-
"scope": [
|
|
25
|
-
"constant",
|
|
26
|
-
"constant.numeric",
|
|
27
|
-
"constant.language"
|
|
28
|
-
],
|
|
29
|
-
"settings": {
|
|
30
|
-
"foreground": "#583902"
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
"scope": [
|
|
35
|
-
"keyword",
|
|
36
|
-
"storage",
|
|
37
|
-
"storage.type"
|
|
38
|
-
],
|
|
39
|
-
"settings": {
|
|
40
|
-
"foreground": "#0145be"
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"scope": [
|
|
45
|
-
"entity.name.function",
|
|
46
|
-
"support.function"
|
|
47
|
-
],
|
|
48
|
-
"settings": {
|
|
49
|
-
"foreground": "#0145be"
|
|
50
|
-
}
|
|
51
|
-
},
|
|
52
|
-
{
|
|
53
|
-
"scope": [
|
|
54
|
-
"entity.name.type",
|
|
55
|
-
"entity.other.inherited-class",
|
|
56
|
-
"support.type"
|
|
57
|
-
],
|
|
58
|
-
"settings": {
|
|
59
|
-
"foreground": "#492b9b"
|
|
60
|
-
}
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"scope": [
|
|
64
|
-
"entity.name.tag",
|
|
65
|
-
"meta.tag"
|
|
66
|
-
],
|
|
67
|
-
"settings": {
|
|
68
|
-
"foreground": "#0145be"
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
{
|
|
72
|
-
"scope": [
|
|
73
|
-
"entity.other.attribute-name",
|
|
74
|
-
"support.constant"
|
|
75
|
-
],
|
|
76
|
-
"settings": {
|
|
77
|
-
"foreground": "#0145be"
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
{
|
|
81
|
-
"scope": [
|
|
82
|
-
"variable",
|
|
83
|
-
"identifier"
|
|
84
|
-
],
|
|
85
|
-
"settings": {
|
|
86
|
-
"foreground": "#3f424a"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"scope": [
|
|
91
|
-
"punctuation",
|
|
92
|
-
"meta.brace"
|
|
93
|
-
],
|
|
94
|
-
"settings": {
|
|
95
|
-
"foreground": "#9a9fa7"
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
{
|
|
99
|
-
"scope": [
|
|
100
|
-
"invalid",
|
|
101
|
-
"invalid.illegal"
|
|
102
|
-
],
|
|
103
|
-
"settings": {
|
|
104
|
-
"foreground": "#840929"
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
],
|
|
108
|
-
"displayName": "Cyclone Light",
|
|
109
|
-
"type": "lightHighContrast",
|
|
110
|
-
"fg": "#000000",
|
|
111
|
-
"bg": "#ffffff",
|
|
112
|
-
"colors": {
|
|
113
|
-
"editor.background": "#ffffff",
|
|
114
|
-
"editor.foreground": "#000000",
|
|
115
|
-
"editorCursor.foreground": "#0145be",
|
|
116
|
-
"editor.selectionBackground": "#000000",
|
|
117
|
-
"editor.selectionForeground": "#ffffff",
|
|
118
|
-
"editor.inactiveSelectionBackground": "#ffffff",
|
|
119
|
-
"editorLineNumber.foreground": "#9a9fa7",
|
|
120
|
-
"editorLineNumber.activeForeground": "#3f424a",
|
|
121
|
-
"editorIndentGuide.background1": "#ffffff",
|
|
122
|
-
"editorIndentGuide.activeBackground1": "#9a9fa7",
|
|
123
|
-
"editorWhitespace.foreground": "#9a9fa7"
|
|
124
|
-
}
|
|
125
|
-
}
|