@stonecrop/code-editor 0.30.0 → 0.32.0

package/dist/src/theme/code_editor/agritheory.js

@@ -1,350 +0,0 @@
-// picked from https://bitwiser.in/monaco-themes/
-// currently set to: Github Light
-export const theme = {
-    base: 'vs',
-    inherit: true,
-    colors: {
-        'editor.foreground': '#24292e',
-        'editor.background': '#ffffff',
-        'editor.selectionBackground': '#c8c8fa',
-        'editor.inactiveSelectionBackground': '#fafbfc',
-        'editor.lineHighlightBackground': '#fafbfc',
-        'editorCursor.foreground': '#24292e',
-        'editorWhitespace.foreground': '#959da5',
-        'editorIndentGuide.background': '#959da5',
-        'editorIndentGuide.activeBackground': '#24292e',
-        'editor.selectionHighlightBorder': '#fafbfc',
-    },
-    rules: [
-        {
-            background: 'ffffff',
-            token: '',
-        },
-        {
-            foreground: '6a737d',
-            token: 'comment',
-        },
-        {
-            foreground: '6a737d',
-            token: 'punctuation.definition.comment',
-        },
-        {
-            foreground: '6a737d',
-            token: 'string.comment',
-        },
-        {
-            foreground: '005cc5',
-            token: 'constant',
-        },
-        {
-            foreground: '005cc5',
-            token: 'entity.name.constant',
-        },
-        {
-            foreground: '005cc5',
-            token: 'variable.other.constant',
-        },
-        {
-            foreground: '005cc5',
-            token: 'variable.language',
-        },
-        {
-            foreground: '6f42c1',
-            token: 'entity',
-        },
-        {
-            foreground: '6f42c1',
-            token: 'entity.name',
-        },
-        {
-            foreground: '24292e',
-            token: 'variable.parameter.function',
-        },
-        {
-            foreground: '22863a',
-            token: 'entity.name.tag',
-        },
-        {
-            foreground: 'd73a49',
-            token: 'keyword',
-        },
-        {
-            foreground: 'd73a49',
-            token: 'storage',
-        },
-        {
-            foreground: 'd73a49',
-            token: 'storage.type',
-        },
-        {
-            foreground: '24292e',
-            token: 'storage.modifier.package',
-        },
-        {
-            foreground: '24292e',
-            token: 'storage.modifier.import',
-        },
-        {
-            foreground: '24292e',
-            token: 'storage.type.java',
-        },
-        {
-            foreground: '032f62',
-            token: 'string',
-        },
-        {
-            foreground: '032f62',
-            token: 'punctuation.definition.string',
-        },
-        {
-            foreground: '032f62',
-            token: 'string punctuation.section.embedded source',
-        },
-        {
-            foreground: '005cc5',
-            token: 'support',
-        },
-        {
-            foreground: '005cc5',
-            token: 'meta.property-name',
-        },
-        {
-            foreground: 'e36209',
-            token: 'variable',
-        },
-        {
-            foreground: '24292e',
-            token: 'variable.other',
-        },
-        {
-            foreground: 'b31d28',
-            fontStyle: 'bold italic underline',
-            token: 'invalid.broken',
-        },
-        {
-            foreground: 'b31d28',
-            fontStyle: 'bold italic underline',
-            token: 'invalid.deprecated',
-        },
-        {
-            foreground: 'fafbfc',
-            background: 'b31d28',
-            fontStyle: 'italic underline',
-            token: 'invalid.illegal',
-        },
-        {
-            foreground: 'fafbfc',
-            background: 'd73a49',
-            fontStyle: 'italic underline',
-            token: 'carriage-return',
-        },
-        {
-            foreground: 'b31d28',
-            fontStyle: 'bold italic underline',
-            token: 'invalid.unimplemented',
-        },
-        {
-            foreground: 'b31d28',
-            token: 'message.error',
-        },
-        {
-            foreground: '24292e',
-            token: 'string source',
-        },
-        {
-            foreground: '005cc5',
-            token: 'string variable',
-        },
-        {
-            foreground: '032f62',
-            token: 'source.regexp',
-        },
-        {
-            foreground: '032f62',
-            token: 'string.regexp',
-        },
-        {
-            foreground: '032f62',
-            token: 'string.regexp.character-class',
-        },
-        {
-            foreground: '032f62',
-            token: 'string.regexp constant.character.escape',
-        },
-        {
-            foreground: '032f62',
-            token: 'string.regexp source.ruby.embedded',
-        },
-        {
-            foreground: '032f62',
-            token: 'string.regexp string.regexp.arbitrary-repitition',
-        },
-        {
-            foreground: '22863a',
-            fontStyle: 'bold',
-            token: 'string.regexp constant.character.escape',
-        },
-        {
-            foreground: '005cc5',
-            token: 'support.constant',
-        },
-        {
-            foreground: '005cc5',
-            token: 'support.variable',
-        },
-        {
-            foreground: '005cc5',
-            token: 'meta.module-reference',
-        },
-        {
-            foreground: '735c0f',
-            token: 'markup.list',
-        },
-        {
-            foreground: '005cc5',
-            fontStyle: 'bold',
-            token: 'markup.heading',
-        },
-        {
-            foreground: '005cc5',
-            fontStyle: 'bold',
-            token: 'markup.heading entity.name',
-        },
-        {
-            foreground: '22863a',
-            token: 'markup.quote',
-        },
-        {
-            foreground: '24292e',
-            fontStyle: 'italic',
-            token: 'markup.italic',
-        },
-        {
-            foreground: '24292e',
-            fontStyle: 'bold',
-            token: 'markup.bold',
-        },
-        {
-            foreground: '005cc5',
-            token: 'markup.raw',
-        },
-        {
-            foreground: 'b31d28',
-            background: 'ffeef0',
-            token: 'markup.deleted',
-        },
-        {
-            foreground: 'b31d28',
-            background: 'ffeef0',
-            token: 'meta.diff.header.from-file',
-        },
-        {
-            foreground: 'b31d28',
-            background: 'ffeef0',
-            token: 'punctuation.definition.deleted',
-        },
-        {
-            foreground: '22863a',
-            background: 'f0fff4',
-            token: 'markup.inserted',
-        },
-        {
-            foreground: '22863a',
-            background: 'f0fff4',
-            token: 'meta.diff.header.to-file',
-        },
-        {
-            foreground: '22863a',
-            background: 'f0fff4',
-            token: 'punctuation.definition.inserted',
-        },
-        {
-            foreground: 'e36209',
-            background: 'ffebda',
-            token: 'markup.changed',
-        },
-        {
-            foreground: 'e36209',
-            background: 'ffebda',
-            token: 'punctuation.definition.changed',
-        },
-        {
-            foreground: 'f6f8fa',
-            background: '005cc5',
-            token: 'markup.ignored',
-        },
-        {
-            foreground: 'f6f8fa',
-            background: '005cc5',
-            token: 'markup.untracked',
-        },
-        {
-            foreground: '6f42c1',
-            fontStyle: 'bold',
-            token: 'meta.diff.range',
-        },
-        {
-            foreground: '005cc5',
-            token: 'meta.diff.header',
-        },
-        {
-            foreground: '005cc5',
-            fontStyle: 'bold',
-            token: 'meta.separator',
-        },
-        {
-            foreground: '005cc5',
-            token: 'meta.output',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.tag',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.curly',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.round',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.square',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.angle',
-        },
-        {
-            foreground: '586069',
-            token: 'brackethighlighter.quote',
-        },
-        {
-            foreground: 'b31d28',
-            token: 'brackethighlighter.unmatched',
-        },
-        {
-            foreground: 'b31d28',
-            token: 'sublimelinter.mark.error',
-        },
-        {
-            foreground: 'e36209',
-            token: 'sublimelinter.mark.warning',
-        },
-        {
-            foreground: '959da5',
-            token: 'sublimelinter.gutter-mark',
-        },
-        {
-            foreground: '032f62',
-            fontStyle: 'underline',
-            token: 'constant.other.reference.link',
-        },
-        {
-            foreground: '032f62',
-            fontStyle: 'underline',
-            token: 'string.other.link',
-        },
-    ],
-};

package/dist/src/utils/serialization.js

@@ -1,14 +0,0 @@
-/**
- * Coerces an unknown value to a string suitable for Monaco's initial content.
- * Objects are JSON-stringified with 2-space indentation.
- * Null and undefined become empty string.
- * Strings pass through unchanged.
- * @public
- */
-export function toEditorString(value) {
-    if (value === null || value === undefined)
-        return '';
-    if (typeof value === 'string')
-        return value;
-    return JSON.stringify(value, null, 2);
-}

package/src/components/ACodeEditor.vue

@@ -1,139 +0,0 @@
-<template>
-	<div ref="aCodeEditor" class="a-code-editor" :style="{ height }" />
-</template>
-
-<script lang="ts">
-// Module-scoped (shared across all instances) so each Monaco model gets a unique URI. This MUST
-// live in a plain <script>, not <script setup>: inside <script setup> it is re-created per instance
-// and always increments to 1, so two editors mounted at once both build
-// `file:///stonecrop-editor-1.js` and the second throws "ModelService: Cannot add model because it
-// already exists!" — its mounted hook aborts and only one editor loads.
-let editorModelCounter = 0
-</script>
-
-<script setup lang="ts">
-import loader from '@monaco-editor/loader'
-import type * as Monaco from 'monaco-editor'
-import type { editor } from 'monaco-editor'
-import { onMounted, onUnmounted, shallowRef, watch } from 'vue'
-import { useTemplateRef } from 'vue'
-
-import { theme } from '../theme/code_editor/agritheory'
-import { toEditorString } from '../utils/serialization'
-
-type EditorSchema = { language?: string; [key: string]: unknown }
-
-const modelValue = defineModel<string>()
-const {
-	height = '300px',
-	mode = 'edit',
-	schema = undefined,
-	language = undefined,
-	options = undefined,
-	vsPath = undefined,
-	extraLibs = undefined,
-	libs = undefined,
-} = defineProps<{
-	height?: string
-	mode?: 'edit' | 'read' | 'display'
-	schema?: EditorSchema
-	language?: string
-	options?: editor.IStandaloneEditorConstructionOptions
-	/** Override the Monaco AMD loader path (e.g. for offline/local serving) */
-	vsPath?: string
-	/** TypeScript declaration string added as extra libs for JS type checking */
-	extraLibs?: string
-	/**
-	 * Restrict the JS/TS language service to these lib files (e.g. `['es2020']` to keep
-	 * the JS built-ins but drop the DOM/browser globals from type-checking and autocomplete).
-	 * When omitted, Monaco's default libs apply — which include `dom`.
-	 */
-	libs?: string[]
-}>()
-
-const editorRef = useTemplateRef<HTMLDivElement>('aCodeEditor')
-const editorInstance = shallowRef<editor.IStandaloneCodeEditor | null>(null)
-
-watch(modelValue, val => {
-	const inst = editorInstance.value
-	if (inst && val !== inst.getValue()) inst.setValue(val ?? '')
-})
-
-watch(
-	() => mode,
-	m => {
-		editorInstance.value?.updateOptions({ readOnly: m !== 'edit' })
-	}
-)
-
-onMounted(async () => {
-	if (vsPath) loader.config({ paths: { vs: vsPath } })
-
-	const monacoInstance: typeof Monaco = await loader.init()
-	// The field declares its own language; without one, highlight nothing rather than guess.
-	const lang = schema?.language ?? language ?? 'plaintext'
-
-	// `monaco.languages.typescript` is deprecated in favour of this top-level namespace; both name
-	// the same object at runtime, but only this one is typed (the old path is a `{ deprecated: true }`
-	// tombstone). Needs monaco >= 0.53, so a `vsPath` override must serve a matching version.
-	const ts = monacoInstance.typescript
-	if (extraLibs) {
-		ts.javascriptDefaults.addExtraLib(extraLibs, 'ts:stonecrop.d.ts')
-	}
-	if (extraLibs || libs) {
-		ts.javascriptDefaults.setCompilerOptions({
-			checkJs: true,
-			noImplicitAny: false,
-			// `lib` is authoritative — it replaces Monaco's default set, so passing e.g.
-			// ['es2020'] retains the JS built-ins (Promise/Array/JSON/…) while removing the
-			// DOM/browser globals. `target` is matched so ES2020 syntax isn't flagged.
-			...(libs && {
-				target: ts.ScriptTarget.ES2020,
-				lib: libs,
-			}),
-		})
-	}
-
-	monacoInstance.editor.defineTheme('agritheory', theme)
-	monacoInstance.editor.setTheme('agritheory')
-
-	// Give the model a file:// URI so the TS worker recognises it as JS/TS and can
-	// run getSyntacticDiagnostics without throwing "Could not find source file".
-	const ext = lang === 'typescript' ? 'ts' : lang === 'json' ? 'json' : lang === 'python' ? 'py' : 'js'
-	const modelUri = monacoInstance.Uri.parse(`file:///stonecrop-editor-${++editorModelCounter}.${ext}`)
-	const editorModel = monacoInstance.editor.createModel(toEditorString(modelValue.value), lang, modelUri)
-
-	const inst = monacoInstance.editor.create(editorRef.value!, {
-		automaticLayout: true,
-		colorDecorators: true,
-		lineHeight: 24,
-		scrollBeyondLastLine: false,
-		...options,
-		model: editorModel,
-		readOnly: mode !== 'edit',
-	})
-
-	inst.onDidChangeModelContent(() => {
-		modelValue.value = inst.getValue()
-	})
-
-	editorInstance.value = inst
-
-	// Sync any modelValue change that arrived during the async CDN load
-	const current = modelValue.value ?? ''
-	if (current !== inst.getValue()) inst.setValue(current)
-})
-
-onUnmounted(() => {
-	editorInstance.value?.getModel()?.dispose()
-	editorInstance.value?.dispose()
-	editorInstance.value = null
-})
-</script>
-
-<style scoped>
-.a-code-editor {
-	width: 100%;
-	overflow: hidden;
-}
-</style>

package/src/index.ts

@@ -1,14 +0,0 @@
-import { App } from 'vue'
-
-import ACodeEditor from './components/ACodeEditor.vue'
-
-/**
- * Install all Code Editor components
- * @param app - Vue app instance
- * @public
- */
-function install(app: App /* options */) {
-	app.component('ACodeEditor', ACodeEditor)
-}
-
-export { install, ACodeEditor }

package/src/shims-vue.d.ts

@@ -1,5 +0,0 @@
-declare module '*.vue' {
-	import { ComponentOptions } from 'vue'
-	const Component: ComponentOptions
-	export default Component
-}