@uiw/codemirror-themes 4.19.6 → 4.19.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/cjs/index.d.ts +2 -2
- package/cjs/index.js +14 -6
- package/cjs/index.js.map +5 -4
- package/esm/index.d.ts +2 -2
- package/esm/index.js +12 -6
- package/esm/index.js.map +5 -4
- package/package.json +1 -1
- package/src/index.tsx +13 -7
package/cjs/index.d.ts
CHANGED
|
@@ -15,9 +15,9 @@ export interface CreateThemeOptions {
|
|
|
15
15
|
declare type Theme = 'light' | 'dark';
|
|
16
16
|
export interface Settings {
|
|
17
17
|
/** Editor background. */
|
|
18
|
-
background
|
|
18
|
+
background?: string;
|
|
19
19
|
/** Default text color. */
|
|
20
|
-
foreground
|
|
20
|
+
foreground?: string;
|
|
21
21
|
/** Caret color. */
|
|
22
22
|
caret?: string;
|
|
23
23
|
/** Selection background. */
|
package/cjs/index.js
CHANGED
|
@@ -8,15 +8,23 @@ var _view = require("@codemirror/view");
|
|
|
8
8
|
var _language = require("@codemirror/language");
|
|
9
9
|
var createTheme = function createTheme(_ref) {
|
|
10
10
|
var theme = _ref.theme,
|
|
11
|
-
settings = _ref.settings,
|
|
12
|
-
|
|
11
|
+
_ref$settings = _ref.settings,
|
|
12
|
+
settings = _ref$settings === void 0 ? {} : _ref$settings,
|
|
13
|
+
_ref$styles = _ref.styles,
|
|
14
|
+
styles = _ref$styles === void 0 ? [] : _ref$styles;
|
|
13
15
|
var themeOptions = {
|
|
14
|
-
'&': {
|
|
15
|
-
backgroundColor: settings.background,
|
|
16
|
-
color: settings.foreground
|
|
17
|
-
},
|
|
18
16
|
'.cm-gutters': {}
|
|
19
17
|
};
|
|
18
|
+
var baseStyle = {};
|
|
19
|
+
if (settings.background) {
|
|
20
|
+
baseStyle.backgroundColor = settings.background;
|
|
21
|
+
}
|
|
22
|
+
if (settings.foreground) {
|
|
23
|
+
baseStyle.color = settings.foreground;
|
|
24
|
+
}
|
|
25
|
+
if (settings.background || settings.foreground) {
|
|
26
|
+
themeOptions['&'] = baseStyle;
|
|
27
|
+
}
|
|
20
28
|
if (settings.fontFamily) {
|
|
21
29
|
themeOptions['&.cm-editor .cm-scroller'] = {
|
|
22
30
|
fontFamily: settings.fontFamily
|
package/cjs/index.js.map
CHANGED
|
@@ -6,10 +6,11 @@
|
|
|
6
6
|
"settings",
|
|
7
7
|
"styles",
|
|
8
8
|
"themeOptions",
|
|
9
|
-
"
|
|
9
|
+
"baseStyle",
|
|
10
10
|
"background",
|
|
11
|
-
"
|
|
11
|
+
"backgroundColor",
|
|
12
12
|
"foreground",
|
|
13
|
+
"color",
|
|
13
14
|
"fontFamily",
|
|
14
15
|
"gutterBackground",
|
|
15
16
|
"gutterForeground",
|
|
@@ -36,7 +37,7 @@
|
|
|
36
37
|
"../src/index.tsx"
|
|
37
38
|
],
|
|
38
39
|
"sourcesContent": [
|
|
39
|
-
"import { EditorView } from '@codemirror/view';\nimport { Extension } from '@codemirror/state';\nimport { HighlightStyle, TagStyle, syntaxHighlighting } from '@codemirror/language';\nimport { StyleSpec } from 'style-mod';\n\nexport interface CreateThemeOptions {\n /**\n * Theme inheritance. Determines which styles CodeMirror will apply by default.\n */\n theme: Theme;\n /**\n * Settings to customize the look of the editor, like background, gutter, selection and others.\n */\n settings: Settings;\n /** Syntax highlighting styles. */\n styles: TagStyle[];\n}\n\ntype Theme = 'light' | 'dark';\n\nexport interface Settings {\n /** Editor background. */\n background
|
|
40
|
+
"import { EditorView } from '@codemirror/view';\nimport { Extension } from '@codemirror/state';\nimport { HighlightStyle, TagStyle, syntaxHighlighting } from '@codemirror/language';\nimport { StyleSpec } from 'style-mod';\n\nexport interface CreateThemeOptions {\n /**\n * Theme inheritance. Determines which styles CodeMirror will apply by default.\n */\n theme: Theme;\n /**\n * Settings to customize the look of the editor, like background, gutter, selection and others.\n */\n settings: Settings;\n /** Syntax highlighting styles. */\n styles: TagStyle[];\n}\n\ntype Theme = 'light' | 'dark';\n\nexport interface Settings {\n /** Editor background. */\n background?: string;\n /** Default text color. */\n foreground?: string;\n /** Caret color. */\n caret?: string;\n /** Selection background. */\n selection?: string;\n /** Selection match background. */\n selectionMatch?: string;\n /** Background of highlighted lines. */\n lineHighlight?: string;\n /** Gutter background. */\n gutterBackground?: string;\n /** Text color inside gutter. */\n gutterForeground?: string;\n /** Text active color inside gutter. */\n gutterActiveForeground?: string;\n /** Gutter right border color. */\n gutterBorder?: string;\n /** set editor font */\n fontFamily?: string;\n}\n\nexport const createTheme = ({ theme, settings = {}, styles = [] }: CreateThemeOptions): Extension => {\n const themeOptions: Record<string, StyleSpec> = {\n '.cm-gutters': {},\n };\n const baseStyle: StyleSpec = {};\n if (settings.background) {\n baseStyle.backgroundColor = settings.background;\n }\n if (settings.foreground) {\n baseStyle.color = settings.foreground;\n }\n if (settings.background || settings.foreground) {\n themeOptions['&'] = baseStyle;\n }\n\n if (settings.fontFamily) {\n themeOptions['&.cm-editor .cm-scroller'] = {\n fontFamily: settings.fontFamily,\n };\n }\n if (settings.gutterBackground) {\n themeOptions['.cm-gutters'].backgroundColor = settings.gutterBackground;\n }\n if (settings.gutterForeground) {\n themeOptions['.cm-gutters'].color = settings.gutterForeground;\n }\n if (settings.gutterBorder) {\n themeOptions['.cm-gutters'].borderRightColor = settings.gutterBorder;\n }\n\n if (settings.caret) {\n themeOptions['.cm-content'] = {\n caretColor: settings.caret,\n };\n themeOptions['.cm-cursor, .cm-dropCursor'] = {\n borderLeftColor: settings.caret,\n };\n }\n let activeLineGutterStyle: StyleSpec = {};\n if (settings.gutterActiveForeground) {\n activeLineGutterStyle.color = settings.gutterActiveForeground;\n }\n if (settings.lineHighlight) {\n themeOptions['.cm-activeLine'] = {\n backgroundColor: settings.lineHighlight,\n };\n activeLineGutterStyle.backgroundColor = settings.lineHighlight;\n }\n themeOptions['.cm-activeLineGutter'] = activeLineGutterStyle;\n\n if (settings.selection) {\n themeOptions[\n '&.cm-focused .cm-selectionBackground, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection'\n ] = {\n backgroundColor: settings.selection,\n };\n }\n if (settings.selectionMatch) {\n themeOptions['& .cm-selectionMatch'] = {\n backgroundColor: settings.selectionMatch,\n };\n }\n const themeExtension = EditorView.theme(themeOptions, {\n dark: theme === 'dark',\n });\n\n const highlightStyle = HighlightStyle.define(styles);\n const extension = [themeExtension, syntaxHighlighting(highlightStyle)];\n\n return extension;\n};\n\nexport default createTheme;\n"
|
|
40
41
|
],
|
|
41
|
-
"mappings": ";;;;;;AAAA;AAEA;AA2CO,IAAMA,WAAW,GAAG,SAAdA,WAAW,
|
|
42
|
+
"mappings": ";;;;;;AAAA;AAEA;AA2CO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAA6E;EAAA,IAAvEC,KAAK,QAALA,KAAK;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,CAAC,CAAC;IAAA,mBAAEC,MAAM;IAANA,MAAM,4BAAG,EAAE;EAC7D,IAAMC,YAAuC,GAAG;IAC9C,aAAa,EAAE,CAAC;EAClB,CAAC;EACD,IAAMC,SAAoB,GAAG,CAAC,CAAC;EAC/B,IAAIH,QAAQ,CAACI,UAAU,EAAE;IACvBD,SAAS,CAACE,eAAe,GAAGL,QAAQ,CAACI,UAAU;EACjD;EACA,IAAIJ,QAAQ,CAACM,UAAU,EAAE;IACvBH,SAAS,CAACI,KAAK,GAAGP,QAAQ,CAACM,UAAU;EACvC;EACA,IAAIN,QAAQ,CAACI,UAAU,IAAIJ,QAAQ,CAACM,UAAU,EAAE;IAC9CJ,YAAY,CAAC,GAAG,CAAC,GAAGC,SAAS;EAC/B;EAEA,IAAIH,QAAQ,CAACQ,UAAU,EAAE;IACvBN,YAAY,CAAC,0BAA0B,CAAC,GAAG;MACzCM,UAAU,EAAER,QAAQ,CAACQ;IACvB,CAAC;EACH;EACA,IAAIR,QAAQ,CAACS,gBAAgB,EAAE;IAC7BP,YAAY,CAAC,aAAa,CAAC,CAACG,eAAe,GAAGL,QAAQ,CAACS,gBAAgB;EACzE;EACA,IAAIT,QAAQ,CAACU,gBAAgB,EAAE;IAC7BR,YAAY,CAAC,aAAa,CAAC,CAACK,KAAK,GAAGP,QAAQ,CAACU,gBAAgB;EAC/D;EACA,IAAIV,QAAQ,CAACW,YAAY,EAAE;IACzBT,YAAY,CAAC,aAAa,CAAC,CAACU,gBAAgB,GAAGZ,QAAQ,CAACW,YAAY;EACtE;EAEA,IAAIX,QAAQ,CAACa,KAAK,EAAE;IAClBX,YAAY,CAAC,aAAa,CAAC,GAAG;MAC5BY,UAAU,EAAEd,QAAQ,CAACa;IACvB,CAAC;IACDX,YAAY,CAAC,4BAA4B,CAAC,GAAG;MAC3Ca,eAAe,EAAEf,QAAQ,CAACa;IAC5B,CAAC;EACH;EACA,IAAIG,qBAAgC,GAAG,CAAC,CAAC;EACzC,IAAIhB,QAAQ,CAACiB,sBAAsB,EAAE;IACnCD,qBAAqB,CAACT,KAAK,GAAGP,QAAQ,CAACiB,sBAAsB;EAC/D;EACA,IAAIjB,QAAQ,CAACkB,aAAa,EAAE;IAC1BhB,YAAY,CAAC,gBAAgB,CAAC,GAAG;MAC/BG,eAAe,EAAEL,QAAQ,CAACkB;IAC5B,CAAC;IACDF,qBAAqB,CAACX,eAAe,GAAGL,QAAQ,CAACkB,aAAa;EAChE;EACAhB,YAAY,CAAC,sBAAsB,CAAC,GAAGc,qBAAqB;EAE5D,IAAIhB,QAAQ,CAACmB,SAAS,EAAE;IACtBjB,YAAY,CACV,6GAA6G,CAC9G,GAAG;MACFG,eAAe,EAAEL,QAAQ,CAACmB;IAC5B,CAAC;EACH;EACA,IAAInB,QAAQ,CAACoB,cAAc,EAAE;IAC3BlB,YAAY,CAAC,sBAAsB,CAAC,GAAG;MACrCG,eAAe,EAAEL,QAAQ,CAACoB;IAC5B,CAAC;EACH;EACA,IAAMC,cAAc,GAAGC,gBAAU,CAACvB,KAAK,CAACG,YAAY,EAAE;IACpDqB,IAAI,EAAExB,KAAK,KAAK;EAClB,CAAC,CAAC;EAEF,IAAMyB,cAAc,GAAGC,wBAAc,CAACC,MAAM,CAACzB,MAAM,CAAC;EACpD,IAAM0B,SAAS,GAAG,CAACN,cAAc,EAAE,IAAAO,4BAAkB,EAACJ,cAAc,CAAC,CAAC;EAEtE,OAAOG,SAAS;AAClB,CAAC;AAAC;AAAA,eAEa7B,WAAW;AAAA"
|
|
42
43
|
}
|
package/esm/index.d.ts
CHANGED
|
@@ -15,9 +15,9 @@ export interface CreateThemeOptions {
|
|
|
15
15
|
declare type Theme = 'light' | 'dark';
|
|
16
16
|
export interface Settings {
|
|
17
17
|
/** Editor background. */
|
|
18
|
-
background
|
|
18
|
+
background?: string;
|
|
19
19
|
/** Default text color. */
|
|
20
|
-
foreground
|
|
20
|
+
foreground?: string;
|
|
21
21
|
/** Caret color. */
|
|
22
22
|
caret?: string;
|
|
23
23
|
/** Selection background. */
|
package/esm/index.js
CHANGED
|
@@ -3,16 +3,22 @@ import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
|
|
|
3
3
|
export var createTheme = _ref => {
|
|
4
4
|
var {
|
|
5
5
|
theme,
|
|
6
|
-
settings,
|
|
7
|
-
styles
|
|
6
|
+
settings = {},
|
|
7
|
+
styles = []
|
|
8
8
|
} = _ref;
|
|
9
9
|
var themeOptions = {
|
|
10
|
-
'&': {
|
|
11
|
-
backgroundColor: settings.background,
|
|
12
|
-
color: settings.foreground
|
|
13
|
-
},
|
|
14
10
|
'.cm-gutters': {}
|
|
15
11
|
};
|
|
12
|
+
var baseStyle = {};
|
|
13
|
+
if (settings.background) {
|
|
14
|
+
baseStyle.backgroundColor = settings.background;
|
|
15
|
+
}
|
|
16
|
+
if (settings.foreground) {
|
|
17
|
+
baseStyle.color = settings.foreground;
|
|
18
|
+
}
|
|
19
|
+
if (settings.background || settings.foreground) {
|
|
20
|
+
themeOptions['&'] = baseStyle;
|
|
21
|
+
}
|
|
16
22
|
if (settings.fontFamily) {
|
|
17
23
|
themeOptions['&.cm-editor .cm-scroller'] = {
|
|
18
24
|
fontFamily: settings.fontFamily
|
package/esm/index.js.map
CHANGED
|
@@ -9,10 +9,11 @@
|
|
|
9
9
|
"settings",
|
|
10
10
|
"styles",
|
|
11
11
|
"themeOptions",
|
|
12
|
-
"
|
|
12
|
+
"baseStyle",
|
|
13
13
|
"background",
|
|
14
|
-
"
|
|
14
|
+
"backgroundColor",
|
|
15
15
|
"foreground",
|
|
16
|
+
"color",
|
|
16
17
|
"fontFamily",
|
|
17
18
|
"gutterBackground",
|
|
18
19
|
"gutterForeground",
|
|
@@ -36,7 +37,7 @@
|
|
|
36
37
|
"../src/index.tsx"
|
|
37
38
|
],
|
|
38
39
|
"sourcesContent": [
|
|
39
|
-
"import { EditorView } from '@codemirror/view';\nimport { Extension } from '@codemirror/state';\nimport { HighlightStyle, TagStyle, syntaxHighlighting } from '@codemirror/language';\nimport { StyleSpec } from 'style-mod';\n\nexport interface CreateThemeOptions {\n /**\n * Theme inheritance. Determines which styles CodeMirror will apply by default.\n */\n theme: Theme;\n /**\n * Settings to customize the look of the editor, like background, gutter, selection and others.\n */\n settings: Settings;\n /** Syntax highlighting styles. */\n styles: TagStyle[];\n}\n\ntype Theme = 'light' | 'dark';\n\nexport interface Settings {\n /** Editor background. */\n background
|
|
40
|
+
"import { EditorView } from '@codemirror/view';\nimport { Extension } from '@codemirror/state';\nimport { HighlightStyle, TagStyle, syntaxHighlighting } from '@codemirror/language';\nimport { StyleSpec } from 'style-mod';\n\nexport interface CreateThemeOptions {\n /**\n * Theme inheritance. Determines which styles CodeMirror will apply by default.\n */\n theme: Theme;\n /**\n * Settings to customize the look of the editor, like background, gutter, selection and others.\n */\n settings: Settings;\n /** Syntax highlighting styles. */\n styles: TagStyle[];\n}\n\ntype Theme = 'light' | 'dark';\n\nexport interface Settings {\n /** Editor background. */\n background?: string;\n /** Default text color. */\n foreground?: string;\n /** Caret color. */\n caret?: string;\n /** Selection background. */\n selection?: string;\n /** Selection match background. */\n selectionMatch?: string;\n /** Background of highlighted lines. */\n lineHighlight?: string;\n /** Gutter background. */\n gutterBackground?: string;\n /** Text color inside gutter. */\n gutterForeground?: string;\n /** Text active color inside gutter. */\n gutterActiveForeground?: string;\n /** Gutter right border color. */\n gutterBorder?: string;\n /** set editor font */\n fontFamily?: string;\n}\n\nexport const createTheme = ({ theme, settings = {}, styles = [] }: CreateThemeOptions): Extension => {\n const themeOptions: Record<string, StyleSpec> = {\n '.cm-gutters': {},\n };\n const baseStyle: StyleSpec = {};\n if (settings.background) {\n baseStyle.backgroundColor = settings.background;\n }\n if (settings.foreground) {\n baseStyle.color = settings.foreground;\n }\n if (settings.background || settings.foreground) {\n themeOptions['&'] = baseStyle;\n }\n\n if (settings.fontFamily) {\n themeOptions['&.cm-editor .cm-scroller'] = {\n fontFamily: settings.fontFamily,\n };\n }\n if (settings.gutterBackground) {\n themeOptions['.cm-gutters'].backgroundColor = settings.gutterBackground;\n }\n if (settings.gutterForeground) {\n themeOptions['.cm-gutters'].color = settings.gutterForeground;\n }\n if (settings.gutterBorder) {\n themeOptions['.cm-gutters'].borderRightColor = settings.gutterBorder;\n }\n\n if (settings.caret) {\n themeOptions['.cm-content'] = {\n caretColor: settings.caret,\n };\n themeOptions['.cm-cursor, .cm-dropCursor'] = {\n borderLeftColor: settings.caret,\n };\n }\n let activeLineGutterStyle: StyleSpec = {};\n if (settings.gutterActiveForeground) {\n activeLineGutterStyle.color = settings.gutterActiveForeground;\n }\n if (settings.lineHighlight) {\n themeOptions['.cm-activeLine'] = {\n backgroundColor: settings.lineHighlight,\n };\n activeLineGutterStyle.backgroundColor = settings.lineHighlight;\n }\n themeOptions['.cm-activeLineGutter'] = activeLineGutterStyle;\n\n if (settings.selection) {\n themeOptions[\n '&.cm-focused .cm-selectionBackground, & .cm-selectionLayer .cm-selectionBackground, .cm-content ::selection'\n ] = {\n backgroundColor: settings.selection,\n };\n }\n if (settings.selectionMatch) {\n themeOptions['& .cm-selectionMatch'] = {\n backgroundColor: settings.selectionMatch,\n };\n }\n const themeExtension = EditorView.theme(themeOptions, {\n dark: theme === 'dark',\n });\n\n const highlightStyle = HighlightStyle.define(styles);\n const extension = [themeExtension, syntaxHighlighting(highlightStyle)];\n\n return extension;\n};\n\nexport default createTheme;\n"
|
|
40
41
|
],
|
|
41
|
-
"mappings": "AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,cAAc,EAAYC,kBAAkB,QAAQ,sBAAsB;AA2CnF,OAAO,IAAMC,WAAW,GAAG,
|
|
42
|
+
"mappings": "AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,cAAc,EAAYC,kBAAkB,QAAQ,sBAAsB;AA2CnF,OAAO,IAAMC,WAAW,GAAG,QAA0E;EAAA,IAAzE;IAAEC,KAAK;IAAEC,QAAQ,GAAG,CAAC,CAAC;IAAEC,MAAM,GAAG;EAAuB,CAAC;EACnF,IAAMC,YAAuC,GAAG;IAC9C,aAAa,EAAE,CAAC;EAClB,CAAC;EACD,IAAMC,SAAoB,GAAG,CAAC,CAAC;EAC/B,IAAIH,QAAQ,CAACI,UAAU,EAAE;IACvBD,SAAS,CAACE,eAAe,GAAGL,QAAQ,CAACI,UAAU;EACjD;EACA,IAAIJ,QAAQ,CAACM,UAAU,EAAE;IACvBH,SAAS,CAACI,KAAK,GAAGP,QAAQ,CAACM,UAAU;EACvC;EACA,IAAIN,QAAQ,CAACI,UAAU,IAAIJ,QAAQ,CAACM,UAAU,EAAE;IAC9CJ,YAAY,CAAC,GAAG,CAAC,GAAGC,SAAS;EAC/B;EAEA,IAAIH,QAAQ,CAACQ,UAAU,EAAE;IACvBN,YAAY,CAAC,0BAA0B,CAAC,GAAG;MACzCM,UAAU,EAAER,QAAQ,CAACQ;IACvB,CAAC;EACH;EACA,IAAIR,QAAQ,CAACS,gBAAgB,EAAE;IAC7BP,YAAY,CAAC,aAAa,CAAC,CAACG,eAAe,GAAGL,QAAQ,CAACS,gBAAgB;EACzE;EACA,IAAIT,QAAQ,CAACU,gBAAgB,EAAE;IAC7BR,YAAY,CAAC,aAAa,CAAC,CAACK,KAAK,GAAGP,QAAQ,CAACU,gBAAgB;EAC/D;EACA,IAAIV,QAAQ,CAACW,YAAY,EAAE;IACzBT,YAAY,CAAC,aAAa,CAAC,CAACU,gBAAgB,GAAGZ,QAAQ,CAACW,YAAY;EACtE;EAEA,IAAIX,QAAQ,CAACa,KAAK,EAAE;IAClBX,YAAY,CAAC,aAAa,CAAC,GAAG;MAC5BY,UAAU,EAAEd,QAAQ,CAACa;IACvB,CAAC;IACDX,YAAY,CAAC,4BAA4B,CAAC,GAAG;MAC3Ca,eAAe,EAAEf,QAAQ,CAACa;IAC5B,CAAC;EACH;EACA,IAAIG,qBAAgC,GAAG,CAAC,CAAC;EACzC,IAAIhB,QAAQ,CAACiB,sBAAsB,EAAE;IACnCD,qBAAqB,CAACT,KAAK,GAAGP,QAAQ,CAACiB,sBAAsB;EAC/D;EACA,IAAIjB,QAAQ,CAACkB,aAAa,EAAE;IAC1BhB,YAAY,CAAC,gBAAgB,CAAC,GAAG;MAC/BG,eAAe,EAAEL,QAAQ,CAACkB;IAC5B,CAAC;IACDF,qBAAqB,CAACX,eAAe,GAAGL,QAAQ,CAACkB,aAAa;EAChE;EACAhB,YAAY,CAAC,sBAAsB,CAAC,GAAGc,qBAAqB;EAE5D,IAAIhB,QAAQ,CAACmB,SAAS,EAAE;IACtBjB,YAAY,CACV,6GAA6G,CAC9G,GAAG;MACFG,eAAe,EAAEL,QAAQ,CAACmB;IAC5B,CAAC;EACH;EACA,IAAInB,QAAQ,CAACoB,cAAc,EAAE;IAC3BlB,YAAY,CAAC,sBAAsB,CAAC,GAAG;MACrCG,eAAe,EAAEL,QAAQ,CAACoB;IAC5B,CAAC;EACH;EACA,IAAMC,cAAc,GAAG1B,UAAU,CAACI,KAAK,CAACG,YAAY,EAAE;IACpDoB,IAAI,EAAEvB,KAAK,KAAK;EAClB,CAAC,CAAC;EAEF,IAAMwB,cAAc,GAAG3B,cAAc,CAAC4B,MAAM,CAACvB,MAAM,CAAC;EACpD,IAAMwB,SAAS,GAAG,CAACJ,cAAc,EAAExB,kBAAkB,CAAC0B,cAAc,CAAC,CAAC;EAEtE,OAAOE,SAAS;AAClB,CAAC;AAED,eAAe3B,WAAW"
|
|
42
43
|
}
|
package/package.json
CHANGED
package/src/index.tsx
CHANGED
|
@@ -20,9 +20,9 @@ type Theme = 'light' | 'dark';
|
|
|
20
20
|
|
|
21
21
|
export interface Settings {
|
|
22
22
|
/** Editor background. */
|
|
23
|
-
background
|
|
23
|
+
background?: string;
|
|
24
24
|
/** Default text color. */
|
|
25
|
-
foreground
|
|
25
|
+
foreground?: string;
|
|
26
26
|
/** Caret color. */
|
|
27
27
|
caret?: string;
|
|
28
28
|
/** Selection background. */
|
|
@@ -43,14 +43,20 @@ export interface Settings {
|
|
|
43
43
|
fontFamily?: string;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
export const createTheme = ({ theme, settings, styles }: CreateThemeOptions): Extension => {
|
|
46
|
+
export const createTheme = ({ theme, settings = {}, styles = [] }: CreateThemeOptions): Extension => {
|
|
47
47
|
const themeOptions: Record<string, StyleSpec> = {
|
|
48
|
-
'&': {
|
|
49
|
-
backgroundColor: settings.background,
|
|
50
|
-
color: settings.foreground,
|
|
51
|
-
},
|
|
52
48
|
'.cm-gutters': {},
|
|
53
49
|
};
|
|
50
|
+
const baseStyle: StyleSpec = {};
|
|
51
|
+
if (settings.background) {
|
|
52
|
+
baseStyle.backgroundColor = settings.background;
|
|
53
|
+
}
|
|
54
|
+
if (settings.foreground) {
|
|
55
|
+
baseStyle.color = settings.foreground;
|
|
56
|
+
}
|
|
57
|
+
if (settings.background || settings.foreground) {
|
|
58
|
+
themeOptions['&'] = baseStyle;
|
|
59
|
+
}
|
|
54
60
|
|
|
55
61
|
if (settings.fontFamily) {
|
|
56
62
|
themeOptions['&.cm-editor .cm-scroller'] = {
|