@m4l/components 9.24.0-beta-feature-731-m4l-components-code-editor.4 → 9.24.0-beta-feature-731-m4l-components-code-editor.6
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/components/extended/ReactSimpleCodeEditor/CodeEditor.d.ts.map +1 -1
- package/components/extended/ReactSimpleCodeEditor/CodeEditor.js +104 -100
- package/components/extended/ReactSimpleCodeEditor/CodeEditor.styles.d.ts.map +1 -1
- package/components/extended/ReactSimpleCodeEditor/CodeEditor.styles.js +105 -93
- package/components/extended/ReactSimpleCodeEditor/constants.d.ts +2 -2
- package/components/extended/ReactSimpleCodeEditor/constants.d.ts.map +1 -1
- package/components/extended/ReactSimpleCodeEditor/constants.js +28 -29
- package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.d.ts +1 -2
- package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.d.ts.map +1 -1
- package/components/extended/ReactSimpleCodeEditor/helpers/highlighting.js +51 -51
- package/components/extended/ReactSimpleCodeEditor/types.d.ts +325 -0
- package/components/extended/ReactSimpleCodeEditor/types.d.ts.map +1 -1
- package/package.json +4 -4
|
@@ -1,54 +1,54 @@
|
|
|
1
1
|
import { getTypographyStyles as d } from "../../../utils/getTypographyStyles.js";
|
|
2
|
-
import { getCodeEditorVSCodeModernPalette as
|
|
2
|
+
import { getCodeEditorVSCodeModernPalette as l, CODE_EDITOR_LINE_HEIGHT_BY_SIZE as n, CODE_EDITOR_MONO_FONT_FAMILY as s, CODE_EDITOR_PADDING_PX as i } from "./constants.js";
|
|
3
3
|
import { getSizeStyles as p } from "../../../utils/getSizeStyles/getSizeStyles.js";
|
|
4
4
|
const b = {
|
|
5
5
|
/** Resolve the interactive shell colors and focus treatment for the editor root. */
|
|
6
|
-
root: ({ theme:
|
|
7
|
-
const o = !
|
|
6
|
+
root: ({ theme: e, ownerState: r }) => {
|
|
7
|
+
const o = !r?.disabled && !r?.readOnly, a = r?.disabled ? e.vars.palette.border.disabled : e.vars.palette.border.secondary;
|
|
8
8
|
return {
|
|
9
9
|
width: "100%",
|
|
10
10
|
display: "flex",
|
|
11
11
|
flexDirection: "column",
|
|
12
12
|
minHeight: 0,
|
|
13
13
|
gap: 0,
|
|
14
|
-
border:
|
|
15
|
-
borderColor:
|
|
16
|
-
borderRadius:
|
|
17
|
-
...
|
|
18
|
-
borderColor:
|
|
14
|
+
border: e.vars.size.borderStroke.container,
|
|
15
|
+
borderColor: r?.variant === "outlined" || r?.error ? a : "transparent",
|
|
16
|
+
borderRadius: e.vars.size.borderRadius["r1-5"],
|
|
17
|
+
...r?.error && {
|
|
18
|
+
borderColor: e.vars.palette.error.focus
|
|
19
19
|
},
|
|
20
|
-
...
|
|
21
|
-
backgroundColor:
|
|
20
|
+
...r?.variant === "contained" && {
|
|
21
|
+
backgroundColor: e.vars.palette.default.enabledOpacity
|
|
22
22
|
},
|
|
23
|
-
...
|
|
24
|
-
backgroundColor:
|
|
23
|
+
...r?.variant === "outlined" && {
|
|
24
|
+
backgroundColor: e.vars.palette.background.default
|
|
25
25
|
},
|
|
26
|
-
...
|
|
27
|
-
backgroundColor: `${
|
|
26
|
+
...r?.readOnly && {
|
|
27
|
+
backgroundColor: `${e.vars.palette.default.enabledOpacity}!important`
|
|
28
28
|
},
|
|
29
29
|
overflow: "hidden",
|
|
30
|
-
opacity:
|
|
30
|
+
opacity: r?.disabled ? 0.72 : 1,
|
|
31
31
|
outline: "3px solid",
|
|
32
32
|
outlineColor: "transparent",
|
|
33
33
|
transition: "border-color 120ms ease, outline 120ms ease, opacity 120ms ease, background-color 120ms ease",
|
|
34
34
|
...o && {
|
|
35
35
|
"&:hover": {
|
|
36
|
-
backgroundColor:
|
|
37
|
-
...
|
|
38
|
-
borderColor:
|
|
36
|
+
backgroundColor: e.vars.palette.default.hoverOpacity,
|
|
37
|
+
...r?.error && {
|
|
38
|
+
borderColor: e.vars.palette.error.active
|
|
39
39
|
}
|
|
40
40
|
},
|
|
41
41
|
"&:focus-within": {
|
|
42
|
-
borderColor:
|
|
42
|
+
borderColor: e.vars.palette.primary.enabled,
|
|
43
43
|
outline: "3px solid",
|
|
44
|
-
outlineColor:
|
|
45
|
-
...
|
|
46
|
-
borderColor:
|
|
44
|
+
outlineColor: r?.error ? e.vars.palette.error.focusOpacity : e.vars.palette.primary.hoverOpacity,
|
|
45
|
+
...r?.error && {
|
|
46
|
+
borderColor: e.vars.palette.error.enabled
|
|
47
47
|
},
|
|
48
|
-
...
|
|
49
|
-
backgroundColor:
|
|
48
|
+
...r?.variant === "contained" && {
|
|
49
|
+
backgroundColor: e.vars.palette.background.default,
|
|
50
50
|
"&&& .M4LCodeEditor-header": {
|
|
51
|
-
backgroundColor:
|
|
51
|
+
backgroundColor: e.vars.palette.default.enabledOpacity
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
}
|
|
@@ -56,46 +56,50 @@ const b = {
|
|
|
56
56
|
};
|
|
57
57
|
},
|
|
58
58
|
/** Layout the language badge row above the editing surface. */
|
|
59
|
-
header: ({ theme:
|
|
60
|
-
const o =
|
|
59
|
+
header: ({ theme: e, ownerState: r }) => {
|
|
60
|
+
const o = l(
|
|
61
|
+
r?.colorMode
|
|
62
|
+
);
|
|
61
63
|
return {
|
|
62
64
|
display: "flex",
|
|
63
65
|
alignItems: "center",
|
|
64
66
|
justifyContent: "space-between",
|
|
65
|
-
padding:
|
|
66
|
-
gap:
|
|
67
|
-
borderBottom:
|
|
68
|
-
borderColor:
|
|
69
|
-
...
|
|
67
|
+
padding: e.vars.size.baseSpacings.sp2,
|
|
68
|
+
gap: e.vars.size.baseSpacings.sp2,
|
|
69
|
+
borderBottom: e.vars.size.borderStroke.container,
|
|
70
|
+
borderColor: e.vars.palette.border.secondary,
|
|
71
|
+
...r?.variant === "contained" && {
|
|
70
72
|
backgroundColor: "transparent"
|
|
71
73
|
},
|
|
72
|
-
...
|
|
73
|
-
backgroundColor:
|
|
74
|
+
...r?.variant === "outlined" && {
|
|
75
|
+
backgroundColor: e.vars.palette.background.default
|
|
74
76
|
},
|
|
75
|
-
...
|
|
76
|
-
backgroundColor: `${
|
|
77
|
+
...r?.readOnly && {
|
|
78
|
+
backgroundColor: `${e.vars.palette.background.default}!important`
|
|
77
79
|
},
|
|
78
80
|
color: o.surface.headerForeground,
|
|
79
|
-
borderTopLeftRadius:
|
|
80
|
-
borderTopRightRadius:
|
|
81
|
+
borderTopLeftRadius: e.vars.size.borderRadius.r2,
|
|
82
|
+
borderTopRightRadius: e.vars.size.borderRadius.r2,
|
|
81
83
|
overflow: "hidden",
|
|
82
84
|
minHeight: "33px"
|
|
83
85
|
};
|
|
84
86
|
},
|
|
85
87
|
/** Align any trailing badges rendered in the header row. */
|
|
86
|
-
headerBadges: ({ theme:
|
|
88
|
+
headerBadges: ({ theme: e }) => ({
|
|
87
89
|
display: "flex",
|
|
88
90
|
alignItems: "center",
|
|
89
91
|
justifyContent: "flex-end",
|
|
90
|
-
gap:
|
|
92
|
+
gap: e.vars.size.baseSpacings.sp1,
|
|
91
93
|
minWidth: 0,
|
|
92
94
|
// Keep badges right-aligned even when the language chip is absent and the
|
|
93
95
|
// badges container is the only child of the header row.
|
|
94
96
|
marginLeft: "auto"
|
|
95
97
|
}),
|
|
96
98
|
/** Keep the leading language chip aligned with the editor header layout. */
|
|
97
|
-
languageChip: ({ theme:
|
|
98
|
-
const o =
|
|
99
|
+
languageChip: ({ theme: e, ownerState: r }) => {
|
|
100
|
+
const o = l(
|
|
101
|
+
r?.colorMode
|
|
102
|
+
);
|
|
99
103
|
return {
|
|
100
104
|
flexShrink: 0,
|
|
101
105
|
minWidth: 0,
|
|
@@ -104,16 +108,16 @@ const b = {
|
|
|
104
108
|
paddingTop: 0,
|
|
105
109
|
paddingBottom: 0,
|
|
106
110
|
backgroundColor: "transparent",
|
|
107
|
-
borderColor:
|
|
111
|
+
borderColor: e.vars.palette.chips.default.outlined.backgroundActive,
|
|
108
112
|
color: o.surface.languageChipForeground,
|
|
109
113
|
...p(
|
|
110
|
-
|
|
111
|
-
|
|
114
|
+
e,
|
|
115
|
+
r?.size || "medium",
|
|
112
116
|
"base",
|
|
113
117
|
(a) => ({ height: a })
|
|
114
118
|
),
|
|
115
119
|
"&&& .M4LTypography-root": {
|
|
116
|
-
...d(
|
|
120
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "microSlim"),
|
|
117
121
|
color: o.surface.languageChipForeground,
|
|
118
122
|
lineHeight: "normal",
|
|
119
123
|
textTransform: "uppercase"
|
|
@@ -135,66 +139,70 @@ const b = {
|
|
|
135
139
|
}
|
|
136
140
|
}),
|
|
137
141
|
/** Keep the read-only chip aligned with the trailing header actions. */
|
|
138
|
-
readOnlyChip: ({ theme:
|
|
142
|
+
readOnlyChip: ({ theme: e, ownerState: r }) => ({
|
|
139
143
|
"&&&": {
|
|
140
144
|
flexShrink: 0,
|
|
141
145
|
minWidth: 0,
|
|
142
146
|
whiteSpace: "nowrap",
|
|
143
147
|
...p(
|
|
144
|
-
|
|
145
|
-
|
|
148
|
+
e,
|
|
149
|
+
r?.size || "medium",
|
|
146
150
|
"base",
|
|
147
151
|
(o) => ({ height: o })
|
|
148
152
|
),
|
|
149
153
|
"&&& .M4LTypography-root": {
|
|
150
|
-
...d(
|
|
151
|
-
color:
|
|
154
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "microSlim"),
|
|
155
|
+
color: e.vars.palette.chips.info.contained.color
|
|
152
156
|
},
|
|
153
|
-
backgroundColor:
|
|
157
|
+
backgroundColor: e.vars.palette.chips.info.contained.backgroundColor,
|
|
154
158
|
borderColor: "transparent"
|
|
155
159
|
}
|
|
156
160
|
}),
|
|
157
161
|
/** Build the two-column layout used by the gutter and editor scroller. */
|
|
158
|
-
body: ({ theme:
|
|
159
|
-
const o =
|
|
162
|
+
body: ({ theme: e, ownerState: r }) => {
|
|
163
|
+
const o = r?.visibleLineCount || r?.minLines || 1, a = r?.lineHeight || n.medium, t = r?.isLineCapped ? i : i * 2;
|
|
160
164
|
return {
|
|
161
165
|
display: "grid",
|
|
162
|
-
gridTemplateColumns:
|
|
166
|
+
gridTemplateColumns: r?.showLineNumbers ? "auto minmax(0, 1fr)" : "minmax(0, 1fr)",
|
|
163
167
|
width: "100%",
|
|
164
168
|
alignItems: "start",
|
|
165
169
|
columnGap: 0,
|
|
166
170
|
maxHeight: `${o * a + t}px`,
|
|
167
171
|
minHeight: 0,
|
|
168
172
|
overflow: "auto",
|
|
169
|
-
pointerEvents:
|
|
170
|
-
userSelect:
|
|
171
|
-
gap:
|
|
173
|
+
pointerEvents: r?.disabled ? "none" : "auto",
|
|
174
|
+
userSelect: r?.disabled ? "none" : "auto",
|
|
175
|
+
gap: e.vars.size.baseSpacings.sp2
|
|
172
176
|
};
|
|
173
177
|
},
|
|
174
178
|
/** Style the optional line-number gutter. */
|
|
175
|
-
lineNumbers: ({ theme:
|
|
176
|
-
const o =
|
|
179
|
+
lineNumbers: ({ theme: e, ownerState: r }) => {
|
|
180
|
+
const o = l(
|
|
181
|
+
r?.colorMode
|
|
182
|
+
);
|
|
177
183
|
return {
|
|
178
184
|
display: "flex",
|
|
179
185
|
flexDirection: "column",
|
|
180
186
|
alignItems: "flex-end",
|
|
181
|
-
padding: `${i}px ${
|
|
187
|
+
padding: `${i}px ${e.vars.size.baseSpacings.sp1} ${r?.isLineCapped ? 0 : i}px ${e.vars.size.baseSpacings.sp2}`,
|
|
182
188
|
backgroundColor: "transparent",
|
|
183
|
-
color:
|
|
189
|
+
color: r?.disabled ? o.surface.placeholderForeground : o.surface.lineNumberForeground,
|
|
184
190
|
userSelect: "none",
|
|
185
|
-
...d(
|
|
186
|
-
fontFamily:
|
|
187
|
-
lineHeight: `${n[
|
|
191
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "bodyStandard"),
|
|
192
|
+
fontFamily: s,
|
|
193
|
+
lineHeight: `${n[r?.size || "medium"]}px`
|
|
188
194
|
};
|
|
189
195
|
},
|
|
190
196
|
/** Keep each rendered line number aligned with the code line height. */
|
|
191
|
-
lineNumber: ({ theme:
|
|
192
|
-
const o =
|
|
197
|
+
lineNumber: ({ theme: e, ownerState: r }) => {
|
|
198
|
+
const o = l(
|
|
199
|
+
r?.colorMode
|
|
200
|
+
);
|
|
193
201
|
return {
|
|
194
202
|
display: "block",
|
|
195
203
|
minWidth: "2ch",
|
|
196
|
-
height: `${
|
|
197
|
-
lineHeight: `${
|
|
204
|
+
height: `${r?.lineHeight || n.medium}px`,
|
|
205
|
+
lineHeight: `${r?.lineHeight || n.medium}px`,
|
|
198
206
|
textAlign: "right",
|
|
199
207
|
'&[data-code-editor-error-line="true"]': {
|
|
200
208
|
color: o.surface.errorBorderColor,
|
|
@@ -203,34 +211,36 @@ const b = {
|
|
|
203
211
|
};
|
|
204
212
|
},
|
|
205
213
|
/** Provide horizontal overflow for long code lines without wrapping them. */
|
|
206
|
-
editorScroller: ({ theme:
|
|
214
|
+
editorScroller: ({ theme: e }) => ({
|
|
207
215
|
position: "relative",
|
|
208
216
|
width: "fit-content",
|
|
209
217
|
minWidth: "100%",
|
|
210
|
-
paddingTop:
|
|
211
|
-
paddingBottom:
|
|
212
|
-
paddingRight:
|
|
213
|
-
paddingLeft:
|
|
218
|
+
paddingTop: e.vars.size.baseSpacings.sp3,
|
|
219
|
+
paddingBottom: e.vars.size.baseSpacings.sp3,
|
|
220
|
+
paddingRight: e.vars.size.baseSpacings.sp2,
|
|
221
|
+
paddingLeft: e.vars.size.baseSpacings.sp2,
|
|
214
222
|
backgroundColor: "transparent"
|
|
215
223
|
}),
|
|
216
224
|
/** Style the underlying react-simple-code-editor surface and its inner elements. */
|
|
217
|
-
editor: ({ theme:
|
|
218
|
-
const o =
|
|
225
|
+
editor: ({ theme: e, ownerState: r }) => {
|
|
226
|
+
const o = l(
|
|
227
|
+
r?.colorMode
|
|
228
|
+
), a = r?.isLineCapped ? 0 : i, t = i + a;
|
|
219
229
|
return {
|
|
220
230
|
position: "relative",
|
|
221
231
|
zIndex: 0,
|
|
222
232
|
width: "max-content",
|
|
223
233
|
minWidth: "100%",
|
|
224
|
-
minHeight: `calc(${
|
|
234
|
+
minHeight: `calc(${r?.minLines || 1} * ${r?.lineHeight || n.medium}px + ${t}px)`,
|
|
225
235
|
backgroundColor: "transparent",
|
|
226
|
-
fontFamily:
|
|
236
|
+
fontFamily: s,
|
|
227
237
|
fontSize: "11px",
|
|
228
|
-
lineHeight: `${
|
|
238
|
+
lineHeight: `${r?.lineHeight || n.medium}px`,
|
|
229
239
|
fontWeight: 400,
|
|
230
240
|
"& textarea, & pre": {
|
|
231
|
-
...d(
|
|
232
|
-
fontFamily:
|
|
233
|
-
lineHeight: `${
|
|
241
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "bodyStandard"),
|
|
242
|
+
fontFamily: s,
|
|
243
|
+
lineHeight: `${r?.lineHeight || n.medium}px`,
|
|
234
244
|
whiteSpace: "pre !important",
|
|
235
245
|
wordBreak: "normal",
|
|
236
246
|
overflowWrap: "normal",
|
|
@@ -244,17 +254,17 @@ const b = {
|
|
|
244
254
|
backgroundColor: "transparent"
|
|
245
255
|
},
|
|
246
256
|
"&&& textarea": {
|
|
247
|
-
...d(
|
|
257
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "microSlim"),
|
|
248
258
|
outline: "none",
|
|
249
259
|
backgroundColor: "transparent",
|
|
250
|
-
caretColor:
|
|
251
|
-
cursor:
|
|
260
|
+
caretColor: r?.disabled ? "transparent" : o.surface.caretForeground,
|
|
261
|
+
cursor: r?.disabled ? "not-allowed" : r?.readOnly ? "default" : "text",
|
|
252
262
|
"&::selection": {
|
|
253
263
|
backgroundColor: o.surface.selectionBackground
|
|
254
264
|
}
|
|
255
265
|
},
|
|
256
266
|
"& pre": {
|
|
257
|
-
color:
|
|
267
|
+
color: r?.disabled ? o.surface.placeholderForeground : o.surface.editorForeground
|
|
258
268
|
},
|
|
259
269
|
"& .token-line": {
|
|
260
270
|
display: "block",
|
|
@@ -270,8 +280,10 @@ const b = {
|
|
|
270
280
|
};
|
|
271
281
|
},
|
|
272
282
|
/** Position the empty-state placeholder above the editor surface. */
|
|
273
|
-
placeholder: ({ theme:
|
|
274
|
-
const o =
|
|
283
|
+
placeholder: ({ theme: e, ownerState: r }) => {
|
|
284
|
+
const o = l(
|
|
285
|
+
r?.colorMode
|
|
286
|
+
);
|
|
275
287
|
return {
|
|
276
288
|
position: "absolute",
|
|
277
289
|
zIndex: 1,
|
|
@@ -279,16 +291,16 @@ const b = {
|
|
|
279
291
|
left: `${i}px`,
|
|
280
292
|
pointerEvents: "none",
|
|
281
293
|
color: o.surface.placeholderForeground,
|
|
282
|
-
...d(
|
|
283
|
-
fontFamily:
|
|
284
|
-
lineHeight: `${
|
|
294
|
+
...d(e.generalSettings.isMobile, r?.size || "medium", "bodyStandard"),
|
|
295
|
+
fontFamily: s,
|
|
296
|
+
lineHeight: `${r?.lineHeight || n.medium}px`,
|
|
285
297
|
whiteSpace: "pre-wrap"
|
|
286
298
|
};
|
|
287
299
|
},
|
|
288
300
|
/** Size the skeleton block to the same footprint as the live editor. */
|
|
289
|
-
skeleton: ({ theme:
|
|
301
|
+
skeleton: ({ theme: e }) => ({
|
|
290
302
|
"&&&": {
|
|
291
|
-
borderRadius:
|
|
303
|
+
borderRadius: e.vars.size.borderRadius.r1,
|
|
292
304
|
width: "100%",
|
|
293
305
|
height: "100px"
|
|
294
306
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
type CodeEditorVSCodeModernMode = 'dark' | 'light';
|
|
2
2
|
type CodeEditorVSCodeModernSurfacePalette = {
|
|
3
3
|
activeIndentGuideForeground: string;
|
|
4
4
|
borderColor: string;
|
|
@@ -76,7 +76,7 @@ export declare const CODE_EDITOR_FALLBACK_LANGUAGE_ICON: import('@mui/material/O
|
|
|
76
76
|
muiName: string;
|
|
77
77
|
};
|
|
78
78
|
/** Resolve the exact VS Code Modern palette for the current light or dark theme mode. */
|
|
79
|
-
export declare function getCodeEditorVSCodeModernPalette(
|
|
79
|
+
export declare function getCodeEditorVSCodeModernPalette(mode?: CodeEditorVSCodeModernMode): CodeEditorVSCodeModernPalette;
|
|
80
80
|
export declare const CODE_EDITOR_CLASSES: Record<"root" | "skeleton" | "body" | "header" | "pre" | "textarea" | "placeholder" | "headerBadges" | "languageChip" | "languageChipIcon" | "readOnlyChip" | "lineNumbers" | "lineNumber" | "editorScroller" | "editor", string>;
|
|
81
81
|
export {};
|
|
82
82
|
//# sourceMappingURL=constants.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/constants.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/constants.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { FileFolderFileOutlined as
|
|
2
|
-
import { getComponentClasses as
|
|
3
|
-
import { CodeEditorSlots as
|
|
4
|
-
const
|
|
1
|
+
import { FileFolderFileOutlined as e } from "@m4l/icons";
|
|
2
|
+
import { getComponentClasses as n } from "../../../utils/getComponentSlotRoot.js";
|
|
3
|
+
import { CodeEditorSlots as a } from "./slots/CodeEditorEnum.js";
|
|
4
|
+
const t = {
|
|
5
5
|
dark: {
|
|
6
6
|
bracketPalette: ["#FFD700", "#DA70D6", "#179FFF"],
|
|
7
7
|
surface: {
|
|
@@ -100,15 +100,15 @@ const d = {
|
|
|
100
100
|
variable: "#001080"
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
|
-
},
|
|
103
|
+
}, C = "M4LCodeEditor", c = "text", i = 4, g = 10, u = 12, D = {
|
|
104
104
|
small: 18,
|
|
105
105
|
medium: 20
|
|
106
|
-
},
|
|
106
|
+
}, _ = '"Geist Mono", "JetBrains Mono", "Cascadia Code", "Liberation Mono", monospace', B = "Read Only", r = "at-commands", s = "at-basic", l = "AT Commands", A = "CodeEditorLanguageChipIcon", O = {
|
|
107
107
|
commandPrefixes: ["AT+", "+"],
|
|
108
108
|
concatenationSeparators: [";"],
|
|
109
109
|
argumentSeparators: [","],
|
|
110
110
|
reservedWords: ["SET", "INFO", "SAVE", "CLEAR"]
|
|
111
|
-
},
|
|
111
|
+
}, T = {
|
|
112
112
|
js: "javascript",
|
|
113
113
|
jsx: "jsx",
|
|
114
114
|
ts: "typescript",
|
|
@@ -119,31 +119,30 @@ const d = {
|
|
|
119
119
|
yml: "yaml",
|
|
120
120
|
at: r,
|
|
121
121
|
"telemetry-at": r
|
|
122
|
-
}, I =
|
|
123
|
-
function
|
|
124
|
-
|
|
125
|
-
return d[n];
|
|
122
|
+
}, I = e;
|
|
123
|
+
function p(o = "light") {
|
|
124
|
+
return t[o];
|
|
126
125
|
}
|
|
127
|
-
const
|
|
128
|
-
|
|
129
|
-
|
|
126
|
+
const m = n(
|
|
127
|
+
C,
|
|
128
|
+
a
|
|
130
129
|
);
|
|
131
130
|
export {
|
|
132
131
|
r as CODE_EDITOR_AT_LANGUAGE,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
132
|
+
l as CODE_EDITOR_AT_TEMPLATE_LANGUAGE_LABEL,
|
|
133
|
+
s as CODE_EDITOR_AT_TEMPLATE_NAME,
|
|
134
|
+
O as CODE_EDITOR_AT_TEMPLATE_TOKENS,
|
|
135
|
+
m as CODE_EDITOR_CLASSES,
|
|
136
|
+
c as CODE_EDITOR_DEFAULT_LANGUAGE,
|
|
137
|
+
g as CODE_EDITOR_DEFAULT_MAX_LINES,
|
|
138
|
+
i as CODE_EDITOR_DEFAULT_MIN_LINES,
|
|
140
139
|
I as CODE_EDITOR_FALLBACK_LANGUAGE_ICON,
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
140
|
+
C as CODE_EDITOR_KEY_COMPONENT,
|
|
141
|
+
T as CODE_EDITOR_LANGUAGE_ALIASES,
|
|
142
|
+
A as CODE_EDITOR_LANGUAGE_CHIP_ICON_INSTANCE_ID,
|
|
143
|
+
D as CODE_EDITOR_LINE_HEIGHT_BY_SIZE,
|
|
144
|
+
_ as CODE_EDITOR_MONO_FONT_FAMILY,
|
|
145
|
+
u as CODE_EDITOR_PADDING_PX,
|
|
146
|
+
B as CODE_EDITOR_READ_ONLY_LABEL,
|
|
147
|
+
p as getCodeEditorVSCodeModernPalette
|
|
149
148
|
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { ReactElement } from 'react';
|
|
2
|
-
import { Theme } from '@mui/material';
|
|
3
2
|
import { default as Prism } from 'prismjs';
|
|
4
3
|
import { PrismTheme } from 'prism-react-renderer';
|
|
5
4
|
import { CodeEditorCustomLanguages, CodeEditorLezerSyntaxValidatorOptions, CodeEditorLanguageTemplate, CodeEditorLanguageTemplateInput, CodeEditorRuntimeDependency, HighlightCodeOptions, CodeEditorSyntaxValidationContext, CodeEditorSyntaxValidator, CodeEditorSyntaxValidationResult } from '../types';
|
|
@@ -51,7 +50,7 @@ export declare function getCodeEditorLineCount(value: string): number;
|
|
|
51
50
|
/**
|
|
52
51
|
* Build the Prism theme used by CodeEditor from the exact VS Code Modern palettes.
|
|
53
52
|
*/
|
|
54
|
-
export declare function createCodeEditorPrismTheme(
|
|
53
|
+
export declare function createCodeEditorPrismTheme(colorMode?: 'dark' | 'light'): PrismTheme;
|
|
55
54
|
/**
|
|
56
55
|
* Render the highlighted code tree consumed by react-simple-code-editor.
|
|
57
56
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"highlighting.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/helpers/highlighting.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"highlighting.d.ts","sourceRoot":"","sources":["../../../../../../../../packages/components/src/components/extended/ReactSimpleCodeEditor/helpers/highlighting.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,EAA4B,KAAK,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAUjF,OAAO,KAAK,EACV,yBAAyB,EAEzB,qCAAqC,EACrC,0BAA0B,EAC1B,+BAA+B,EAC/B,2BAA2B,EAC3B,oBAAoB,EAGpB,iCAAiC,EACjC,yBAAyB,EACzB,gCAAgC,EACjC,MAAM,UAAU,CAAC;AA2GlB,eAAO,MAAM,wCAAwC,EAAE,0BAWtD,CAAC;AA8RF,2EAA2E;AAC3E,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEvD;AAED,0EAA0E;AAC1E,wBAAgB,sBAAsB,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,GAAG,SAAS,CAU5E;AAED,uFAAuF;AACvF,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAmDf;AAED,gFAAgF;AAChF,wBAAgB,+BAA+B,CAC7C,QAAQ,EAAE,0BAA0B,GACnC,KAAK,CAAC,OAAO,CAOf;AAED;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,YAAY,EAAE,MAAM,EACpB,OAAO,EAAE,KAAK,CAAC,OAAO,GACrB,IAAI,CAMN;AAED,uFAAuF;AACvF,wBAAgB,kCAAkC,CAChD,QAAQ,EAAE,0BAA0B,GACnC,IAAI,CAQN;AAED,kFAAkF;AAClF,wBAAgB,iCAAiC,CAC/C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAUxC;AAED,uFAAuF;AACvF,wBAAgB,gCAAgC,CAC9C,QAAQ,CAAC,EAAE,+BAA+B,GACzC,0BAA0B,GAAG,SAAS,CAExC;AAED;;GAEG;AACH,wBAAgB,iCAAiC,CAC/C,YAAY,EAAE,MAAM,EACpB,eAAe,EAAE,yBAAyB,GACzC,IAAI,CAMN;AAED;;GAEG;AACH,wBAAgB,oCAAoC,CAClD,OAAO,EAAE,qCAAqC,GAC7C,yBAAyB,CAG3B;AAeD;;GAEG;AACH,wBAAsB,mCAAmC,CACvD,mBAAmB,CAAC,EAAE,2BAA2B,GAAG,2BAA2B,EAAE,GAChF,OAAO,CAAC,IAAI,CAAC,CAsBf;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,eAAe,CAAC,EAAE,yBAAyB,GAC1C,IAAI,CAQN;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CACvC,YAAY,CAAC,EAAE,MAAM,GACpB,MAAM,CAKR;AAmqBD,qGAAqG;AACrG,wBAAgB,wBAAwB,CAAC,EACvC,IAAI,EACJ,gBAAgB,EAChB,YAAY,GACb,EAAE,iCAAiC,GAAG,gCAAgC,CAkBtE;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAE5D;AA+HD;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,SAAS,GAAE,MAAM,GAAG,OAAiB,GACpC,UAAU,CAiIZ;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,eAAe,EACf,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,gBAAgB,GACjB,EAAE,oBAAoB,GAAG,YAAY,CA6QrC"}
|