Skip to content

Commit 8e9d797

Browse files
code editor changes 2
1 parent c1a4d68 commit 8e9d797

File tree

4 files changed

+80
-33
lines changed

4 files changed

+80
-33
lines changed
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,7 @@
11
import React from 'react';
2-
import { CodeEditor, Language } from '@patternfly/react-code-editor';
3-
import yml from "./yml.png"
2+
import { CodeEditor } from '@patternfly/react-code-editor';
43

5-
const CodeEditorWithActions: React.FunctionComponent = () => {
6-
// const onEditorDidMount = (editor, monaco) => {
7-
// // eslint-disable-next-line no-console
8-
// console.log(editor.getValue());
9-
// editor.layout();
10-
// editor.focus();
11-
// monaco.editor.getModels()[0].updateOptions({ tabSize: 5 });
12-
// };
4+
export const CodeEditorWithActions: React.FunctionComponent = () => (
5+
<CodeEditor isUploadEnabled isDownloadEnabled isCopyEnabled isLanguageLabelVisible height="400px" />
6+
);
137

14-
// const onChange = value => {
15-
// // eslint-disable-next-line no-console
16-
// console.log(value);
17-
// };
18-
19-
return (
20-
// <CodeEditor
21-
// code="Some example content"
22-
// onChange={onChange}
23-
// language={Language.javascript}
24-
// onEditorDidMount={onEditorDidMount}
25-
// height="sizeToFit"
26-
// />
27-
<div><img src={yml}/>
28-
</div>
29-
30-
);
31-
};
32-
33-
export {CodeEditorWithActions};

stylePaths.js

+65-1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,70 @@ module.exports = {
99
path.resolve(__dirname, 'node_modules/@patternfly/react-core/dist/esm/@patternfly/patternfly'),
1010
path.resolve(__dirname, 'node_modules/@patternfly/react-core/node_modules/@patternfly/react-styles/css'),
1111
path.resolve(__dirname, 'node_modules/@patternfly/react-table/node_modules/@patternfly/react-styles/css'),
12-
path.resolve(__dirname, 'node_modules/@patternfly/react-inline-edit-extension/node_modules/@patternfly/react-styles/css')
12+
path.resolve(__dirname, 'node_modules/@patternfly/react-inline-edit-extension/node_modules/@patternfly/react-styles/css'),
13+
path.resolve(__dirname, 'node_modules/monaco-editor/dev/vs/base/browser/ui/codicons/codicon/codicon.ttf'),
14+
path.resolve(__dirname, 'node_modules/monaco-editor/dev/vs/editor/editor.main.css'),
15+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/actionbar/actionbar.css'),
16+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/aria/aria.css'),
17+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/button/button.css'),
18+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/checkbox/checkbox.css'),
19+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon-animations.css'),
20+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon-modifications.css'),
21+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon.css'),
22+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/contextview/contextview.css'),
23+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/countBadge/countBadge.css'),
24+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/dropdown/dropdown.css'),
25+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/findinput/findInput.css'),
26+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/hover/hover.css'),
27+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/iconLabel/iconlabel.css'),
28+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/inputbox/inputBox.css'),
29+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/keybindingLabel/keybindingLabel.css'),
30+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/list/list.css'),
31+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/mouseCursor/mouseCursor.css'),
32+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/progressbar/progressbar.css'),
33+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/sash/sash.css'),
34+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/scrollbar/media/scrollbars.css'),
35+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/splitview/splitview.css'),
36+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/browser/ui/tree/media/tree.css'),
37+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/base/parts/quickinput/browser/media/quickInput.css'),
38+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/controller/textAreaHandler.css'),
39+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/widget/media/diffEditor.css'),
40+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/widget/media/diffReview.css'),
41+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/widget/media/editor.css'),
42+
path.resolve(__dirname, 'node_modules/monaco-editor/min/vs/editor/editor.main.css'),
43+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/currentLineHighlight/currentLineHighlight.css'),
44+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/decorations/decorations.css'),
45+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/glyphMargin/glyphMargin.css'),
46+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/indentGuides/indentGuides.css'),
47+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/lineNumbers/lineNumbers.css'),
48+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/lines/viewLines.css'),
49+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/linesDecorations/linesDecorations.css'),
50+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/marginDecorations/marginDecorations.css'),
51+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/minimap/minimap.css'),
52+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/overlayWidgets/overlayWidgets.css'),
53+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/rulers/rulers.css'),
54+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/scrollDecoration/scrollDecoration.css'),
55+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/selections/selections.css'),
56+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/browser/viewParts/viewCursors/viewCursors.css'),
57+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/anchorSelect/anchorSelect.css'),
58+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/bracketMatching/bracketMatching.css'),
59+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/codeAction/lightBulbWidget.css'),
60+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/codelens/codelensWidget.css'),
61+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/colorPicker/colorPicker.css'),
62+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/dnd/dnd.css'),
63+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/documentSymbols/media/outlineTree.css'),
64+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/documentSymbols/media/symbol-icons.css'),
65+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/find/findWidget.css'),
66+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/folding/folding.css'),
67+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/gotoError/media/gotoErrorWidget.css'),
68+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/gotoSymbol/link/goToDefinitionAtPosition.css'),
69+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/gotoSymbol/peek/referencesWidget.css'),
70+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/links/links.css'),
71+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/message/messageController.css'),
72+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/parameterHints/parameterHints.css'),
73+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/contrib/peekView/media/peekViewWidget.css'),
74+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/standalone/browser/quickInput/standaloneQuickInput.css'),
75+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/editor/standalone/browser/standalone-tokens.css'),
76+
path.resolve(__dirname, 'node_modules/monaco-editor/esm/vs/platform/contextview/browser/contextMenuHandler.css')
1377
]
1478
}

webpack.common.js

+4
Original file line numberDiff line numberDiff line change
@@ -222,6 +222,10 @@ module.exports = env => {
222222

223223
module: {
224224
rules: [
225+
{
226+
test: /\.ttf$/,
227+
use: ['file-loader'],
228+
},
225229
{
226230
test: /\.ya?ml$/,
227231
use: 'yaml-loader'

webpack.config.js

+7-2
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,9 @@ const MONACO_DIR = path.resolve(__dirname, './node_modules/monaco-editor');
88
// Monaco Editor uses CSS imports internally,
99
// so we need a separate css-loader for app and monaco-editor packages
1010

11-
module.exports = {
11+
module.exports = {
1212
resolve: {
13-
extensions: ['.tsx', '.ts', '.js', '.jsx', '.css'],
13+
extensions: ['.tsx', '.ts', '.js', '.jsx', '.css', '.json', '.ttf'],
1414
mainFields: ['main', 'module', 'browser'],
1515
},
1616
entry: './src/index.js',
@@ -29,10 +29,15 @@ module.exports = {
2929
// }
3030
// }
3131
// },
32+
{
33+
test: /\.ttf$/,
34+
use: ['file-loader'],
35+
},
3236
{
3337
test: /\.css$/i,
3438
use: ['file-loader', 'style-loader', 'css-loader']
3539
},
40+
3641
{
3742
test: /\css$/i, include: MONACO_DIR, use: ['file-loader','style-loader', 'css-loader'],
3843
},

0 commit comments

Comments
 (0)