Skip to content

Commit 561ecac

Browse files
tscktsck
committed
Allow search panel to be disabled
1 parent 25a3733 commit 561ecac

File tree

4 files changed

+33
-19
lines changed

4 files changed

+33
-19
lines changed

‎packages/code-editor/README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ console.log(greet('MongoDB user'));`;
5757
| `enableCodeFolding` _(optional)_ | Enables code folding arrows in the gutter. | `boolean` | `undefined` |
5858
| `enableLineNumbers` _(optional)_ | Enables line numbers in the editor’s gutter. | `boolean` | `true` |
5959
| `enableLineWrapping` _(optional)_ | Enables line wrapping when the text exceeds the editor’s width. | `boolean` | `true` |
60+
| `enableSearchPanel` \_(optional)) | Enables the find and replace search panel in the editor. | `boolean` | `true` |
6061
| `extensions` _(optional)_ | Additional CodeMirror extensions to apply to the editor. These will be applied with high precendence, meaning they can override extensions applied through built in props. See the [CodeMirror v6 System Guide](https://codemirror.net/docs/guide/) for more information. | `Array<CodeMirrorExtension>` | `[]` |
6162
| `forceParsing` _(optional)_ | _**This should be used with caution as it can significantly impact performance!**_<br><br>Forces the parsing of the complete document, even parts not currently visible.<br><br>By default, the editor optimizes performance by only parsing the code that is visible on the screen, which is especially beneficial when dealing with large amounts of code. Enabling this option overrides this behavior and forces the parsing of all code, visible or not. This should generally be reserved for exceptional circumstances. | `boolean` | `false` |
6263
| `height` _(optional)_ | Sets the editor's height. If not set, the editor will automatically adjust its height based on the content. | `string` | `undefined` |

‎packages/code-editor/src/CodeEditor.stories.tsx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,6 +76,7 @@ const meta: StoryMetaType<typeof CodeEditor> = {
7676
enableCodeFolding: true,
7777
enableLineNumbers: true,
7878
enableLineWrapping: true,
79+
enableSearchPanel: true,
7980
baseFontSize: BaseFontSize.Body1,
8081
forceParsing: false,
8182
placeholder: 'Type your code here...',
@@ -113,6 +114,9 @@ const meta: StoryMetaType<typeof CodeEditor> = {
113114
enableLineNumbers: {
114115
control: { type: 'boolean' },
115116
},
117+
enableSearchPanel: {
118+
control: { type: 'boolean' },
119+
},
116120
enableLineWrapping: {
117121
control: { type: 'boolean' },
118122
},

‎packages/code-editor/src/CodeEditor/CodeEditor.tsx‎

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
5555
enableCodeFolding,
5656
enableLineNumbers,
5757
enableLineWrapping,
58+
enableSearchPanel = true,
5859
extensions: consumerExtensions = [],
5960
forceParsing: forceParsingProp = false,
6061
height,
@@ -273,24 +274,27 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
273274
),
274275

275276
commands.history(),
276-
searchModule.search({
277-
createPanel: view => {
278-
const dom = document.createElement('div');
279-
dom.style.position = 'absolute';
280-
dom.style.top = '0';
281-
dom.style.right = '0';
282-
dom.style.left = '0';
283-
dom.style.display = 'flex';
284-
dom.style.justifyContent = 'flex-end';
285-
286-
createRoot(dom).render(
287-
React.createElement(SearchPanel, {
288-
view,
289-
}),
290-
);
291-
return { dom, top: true };
292-
},
293-
}),
277+
278+
enableSearchPanel
279+
? searchModule.search({
280+
createPanel: view => {
281+
const dom = document.createElement('div');
282+
dom.style.position = 'absolute';
283+
dom.style.top = '0';
284+
dom.style.right = '0';
285+
dom.style.left = '0';
286+
dom.style.display = 'flex';
287+
dom.style.justifyContent = 'flex-end';
288+
289+
createRoot(dom).render(
290+
React.createElement(SearchPanel, {
291+
view,
292+
}),
293+
);
294+
return { dom, top: true };
295+
},
296+
})
297+
: [],
294298

295299
EditorView.EditorView.updateListener.of((update: ViewUpdate) => {
296300
if (isControlled && update.docChanged) {
@@ -317,7 +321,7 @@ const BaseCodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(
317321
key: 'Shift-Tab',
318322
run: commands.indentLess,
319323
},
320-
...searchModule.searchKeymap,
324+
...(enableSearchPanel ? searchModule.searchKeymap : []),
321325
...commands.defaultKeymap,
322326
...commands.historyKeymap,
323327
]),

‎packages/code-editor/src/CodeEditor/CodeEditor.types.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -199,6 +199,11 @@ type BaseCodeEditorProps = DarkModeProps &
199199
*/
200200
enableLineWrapping?: boolean;
201201

202+
/**
203+
* Enables the search panel in the editor.
204+
*/
205+
enableSearchPanel?: boolean;
206+
202207
/**
203208
* Additional CodeMirror extensions to apply to the editor. These will be applied
204209
* with high precendence, meaning they can override extensions applied through

0 commit comments

Comments
 (0)