mirror of
				https://github.com/massbug/judge4c.git
				synced 2025-10-30 23:23:34 +00:00 
			
		
		
		
	feat(core-editor): Add CoreEditor component with Monaco Editor integration
This commit is contained in:
		
							parent
							
								
									8ab8892388
								
							
						
					
					
						commit
						24b5d96913
					
				
							
								
								
									
										64
									
								
								src/components/core-editor.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										64
									
								
								src/components/core-editor.tsx
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,64 @@ | ||||
| "use client"; | ||||
| 
 | ||||
| import { cn } from "@/lib/utils"; | ||||
| import dynamic from "next/dynamic"; | ||||
| import type { ReactNode } from "react"; | ||||
| import type { editor } from "monaco-editor"; | ||||
| import { Loading } from "@/components/loading"; | ||||
| import type { BeforeMount, OnChange, OnMount } from "@monaco-editor/react"; | ||||
| 
 | ||||
| // Dynamically import Monaco Editor with SSR disabled
 | ||||
| const Editor = dynamic( | ||||
|   async () => { | ||||
|     await import("vscode"); | ||||
|     const monaco = await import("monaco-editor"); | ||||
|     const { loader } = await import("@monaco-editor/react"); | ||||
|     loader.config({ monaco }); | ||||
|     return (await import("@monaco-editor/react")).Editor; | ||||
|   }, | ||||
|   { | ||||
|     ssr: false, | ||||
|     loading: () => <Loading />, | ||||
|   } | ||||
| ); | ||||
| 
 | ||||
| interface CoreEditorProps { | ||||
|   language?: string; | ||||
|   theme?: string; | ||||
|   path?: string; | ||||
|   value?: string; | ||||
|   beforeMount?: BeforeMount; | ||||
|   onMount?: OnMount; | ||||
|   onChange?: OnChange; | ||||
|   options?: editor.IStandaloneEditorConstructionOptions; | ||||
|   loading?: ReactNode; | ||||
|   className?: string; | ||||
| } | ||||
| 
 | ||||
| export function CoreEditor({ | ||||
|   language, | ||||
|   theme, | ||||
|   path, | ||||
|   value, | ||||
|   beforeMount, | ||||
|   onMount, | ||||
|   onChange, | ||||
|   options, | ||||
|   loading, | ||||
|   className, | ||||
| }: CoreEditorProps) { | ||||
|   return ( | ||||
|     <Editor | ||||
|       language={language} | ||||
|       theme={theme} | ||||
|       path={path} | ||||
|       value={value} | ||||
|       beforeMount={beforeMount} | ||||
|       onMount={onMount} | ||||
|       onChange={onChange} | ||||
|       options={options} | ||||
|       loading={loading} | ||||
|       className={cn("h-full w-full py-2", className)} | ||||
|     /> | ||||
|   ); | ||||
| } | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user