Feat(Editor): Support autoload Native API

src/components/Playground/CodeEditor/Editor/_NativeApi.d.ts

@@ -0,0 +1,33 @@
+interface NativeApi {
+    /**
+     * Copy text to clipboard
+     *
+     * @param {string} text Text to be copied to clipboard
+     * @returns {boolean} Result
+     */
+    copyToClipboard: (text: string) => boolean
+
+    /**
+     * Read text from clipboard
+     *
+     * @returns {string} Result
+     */
+    readClipboard: () => string
+
+    /**
+     * Save file to download directory
+     *
+     * @param {string} dataBase64 Base64 encoded data
+     * @param {string} fileName File name to be saved
+     * @returns {boolean} Result
+     *
+     * @example
+     * // From Unit8Array:
+     * NativeApi.saveToDownloads(btoa(String.fromCharCode(...data)))
+     * // From string:
+     * NativeApi.saveToDownloads(btoa(String.fromCharCode(...new TextEncoder().encode(text))))
+     */
+    saveToDownloads: (dataBase64: string, fileName: string) => boolean
+}
+
+declare const NativeApi: NativeApi

src/components/Playground/CodeEditor/Editor/index.tsx

@@ -6,6 +6,7 @@ import { IEditorOptions, IFiles, ITheme, ITsconfig } from '@/components/Playgrou
 import { fileNameToLanguage, tsconfigJsonDiagnosticsOptions } from '@/components/Playground/files'
 import { useEditor, useTypesProgress } from '@/components/Playground/CodeEditor/Editor/hooks'
 import { MonacoEditorConfig } from '@/components/Playground/CodeEditor/Editor/monacoConfig'
+import nativeApiDTS from '@/components/Playground/CodeEditor/Editor/_NativeApi.d.ts?raw'
 
 interface EditorProps {
     tsconfig?: ITsconfig
@@ -85,6 +86,10 @@ const Editor = ({
         }
 
         jsxSyntaxHighlightRef.current = loadJsxSyntaxHighlight(editor, monaco)
+        monaco.languages.typescript.typescriptDefaults.addExtraLib(
+            nativeApiDTS,
+            'file:///node_modules/_NativeApi.d.ts'
+        )
 
         void autoLoadExtraLib(editor, monaco, file.value, onWatch)
     }