mirror of https://github.com/abpframework/abp.git
8 changed files with 26412 additions and 5 deletions
@ -1,8 +1,6 @@ |
|||||
module.exports = { |
module.exports = { |
||||
mappings: { |
mappings: { |
||||
"@node_modules/codemirror/lib/*.*": "@libs/codemirror/", |
"@node_modules/@abp/codemirror/src/*.*": "@libs/codemirror/", |
||||
"@node_modules/codemirror/mode/**/*.*": "@libs/codemirror/mode/", |
"@node_modules/@abp/codemirror/src/mode/**/*.*": "@libs/codemirror/mode/" |
||||
"@node_modules/codemirror/theme/**/*.*": "@libs/codemirror/theme/", |
|
||||
"@node_modules/codemirror/addon/**/*.*": "@libs/codemirror/addon/" |
|
||||
} |
} |
||||
} |
} |
||||
@ -0,0 +1,21 @@ |
|||||
|
const { build } = require('esbuild'); |
||||
|
const path = require('path'); |
||||
|
|
||||
|
async function run() { |
||||
|
await build({ |
||||
|
entryPoints: [path.join(__dirname, 'entry.js')], |
||||
|
outfile: path.join(__dirname, '..', 'src', 'codemirror.js'), |
||||
|
bundle: true, |
||||
|
format: 'iife', |
||||
|
platform: 'browser', |
||||
|
target: ['es2019'], |
||||
|
sourcemap: false, |
||||
|
minify: false, |
||||
|
legalComments: 'none' |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
run().catch(error => { |
||||
|
console.error(error); |
||||
|
process.exit(1); |
||||
|
}); |
||||
@ -0,0 +1,141 @@ |
|||||
|
import { EditorState } from '@codemirror/state'; |
||||
|
import { EditorView } from '@codemirror/view'; |
||||
|
import { basicSetup } from 'codemirror'; |
||||
|
import { css } from '@codemirror/lang-css'; |
||||
|
import { javascript } from '@codemirror/lang-javascript'; |
||||
|
|
||||
|
const modeFactories = { |
||||
|
css: css, |
||||
|
javascript: javascript, |
||||
|
js: javascript |
||||
|
}; |
||||
|
|
||||
|
function getModeExtension(mode) { |
||||
|
if (!mode) { |
||||
|
return null; |
||||
|
} |
||||
|
|
||||
|
const modeName = typeof mode === 'string' |
||||
|
? mode |
||||
|
: (mode.name || mode.mode || mode.helperType || ''); |
||||
|
const factory = modeFactories[modeName.toLowerCase()]; |
||||
|
|
||||
|
return factory ? factory() : null; |
||||
|
} |
||||
|
|
||||
|
function normalizeWrapperClasses(textarea) { |
||||
|
return (textarea.className || '') |
||||
|
.split(/\s+/) |
||||
|
.filter(Boolean) |
||||
|
.filter(name => name !== 'form-control' && name !== 'valid' && name !== 'input-validation-error') |
||||
|
.join(' '); |
||||
|
} |
||||
|
|
||||
|
function syncTextarea(textarea, view) { |
||||
|
textarea.value = view.state.doc.toString(); |
||||
|
} |
||||
|
|
||||
|
function createWrapper(textarea) { |
||||
|
const wrapper = document.createElement('div'); |
||||
|
const extraClasses = normalizeWrapperClasses(textarea); |
||||
|
const style = window.getComputedStyle(textarea); |
||||
|
|
||||
|
wrapper.className = extraClasses |
||||
|
? 'abp-codemirror ' + extraClasses |
||||
|
: 'abp-codemirror'; |
||||
|
if (textarea.id) { |
||||
|
wrapper.id = textarea.id + '__codemirror'; |
||||
|
} |
||||
|
|
||||
|
wrapper.style.width = '100%'; |
||||
|
|
||||
|
if (style.height && style.height !== 'auto' && style.height !== '0px') { |
||||
|
wrapper.style.height = style.height; |
||||
|
} else { |
||||
|
wrapper.style.minHeight = '12rem'; |
||||
|
} |
||||
|
|
||||
|
return wrapper; |
||||
|
} |
||||
|
|
||||
|
function createState(textarea, options) { |
||||
|
const extensions = [ |
||||
|
basicSetup, |
||||
|
EditorView.updateListener.of(update => { |
||||
|
if (update.docChanged) { |
||||
|
syncTextarea(textarea, update.view); |
||||
|
} |
||||
|
}) |
||||
|
]; |
||||
|
|
||||
|
const modeExtension = getModeExtension(options.mode); |
||||
|
|
||||
|
if (modeExtension) { |
||||
|
extensions.push(modeExtension); |
||||
|
} |
||||
|
|
||||
|
if (options.readOnly) { |
||||
|
extensions.push(EditorState.readOnly.of(true)); |
||||
|
} |
||||
|
|
||||
|
return EditorState.create({ |
||||
|
doc: textarea.value || '', |
||||
|
extensions |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
function createCompatibilityEditor(textarea, options) { |
||||
|
const wrapper = createWrapper(textarea); |
||||
|
|
||||
|
textarea.parentNode.insertBefore(wrapper, textarea.nextSibling); |
||||
|
textarea.style.display = 'none'; |
||||
|
textarea.setAttribute('aria-hidden', 'true'); |
||||
|
|
||||
|
const view = new EditorView({ |
||||
|
state: createState(textarea, options || {}), |
||||
|
parent: wrapper |
||||
|
}); |
||||
|
|
||||
|
const save = function () { |
||||
|
syncTextarea(textarea, view); |
||||
|
}; |
||||
|
|
||||
|
if (textarea.form) { |
||||
|
textarea.form.addEventListener('submit', save); |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
getValue: function () { |
||||
|
return view.state.doc.toString(); |
||||
|
}, |
||||
|
setValue: function (value) { |
||||
|
view.dispatch({ |
||||
|
changes: { |
||||
|
from: 0, |
||||
|
to: view.state.doc.length, |
||||
|
insert: value || '' |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
save(); |
||||
|
}, |
||||
|
refresh: function () { |
||||
|
if (typeof view.requestMeasure === 'function') { |
||||
|
view.requestMeasure(); |
||||
|
} |
||||
|
}, |
||||
|
focus: function () { |
||||
|
view.focus(); |
||||
|
}, |
||||
|
save: save, |
||||
|
getWrapperElement: function () { |
||||
|
return wrapper; |
||||
|
} |
||||
|
}; |
||||
|
} |
||||
|
|
||||
|
window.CodeMirror = window.CodeMirror || {}; |
||||
|
window.CodeMirror.loadedModes = window.CodeMirror.loadedModes || {}; |
||||
|
window.CodeMirror.fromTextArea = function (textarea, options) { |
||||
|
return createCompatibilityEditor(textarea, options || {}); |
||||
|
}; |
||||
@ -0,0 +1,26 @@ |
|||||
|
.abp-codemirror { |
||||
|
border: 1px solid var(--bs-border-color, #dee2e6); |
||||
|
border-radius: var(--bs-border-radius, 0.375rem); |
||||
|
background: var(--bs-body-bg, #ffffff); |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
.abp-codemirror .cm-editor { |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.abp-codemirror .cm-scroller { |
||||
|
min-height: 100%; |
||||
|
height: 100%; |
||||
|
overflow: auto; |
||||
|
font-family: var(--bs-font-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace); |
||||
|
} |
||||
|
|
||||
|
.abp-codemirror .cm-content, |
||||
|
.abp-codemirror .cm-gutter { |
||||
|
min-height: 100%; |
||||
|
} |
||||
|
|
||||
|
.abp-codemirror .cm-focused { |
||||
|
outline: none; |
||||
|
} |
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,5 @@ |
|||||
|
(function () { |
||||
|
window.CodeMirror = window.CodeMirror || {}; |
||||
|
window.CodeMirror.loadedModes = window.CodeMirror.loadedModes || {}; |
||||
|
window.CodeMirror.loadedModes.css = true; |
||||
|
})(); |
||||
@ -0,0 +1,6 @@ |
|||||
|
(function () { |
||||
|
window.CodeMirror = window.CodeMirror || {}; |
||||
|
window.CodeMirror.loadedModes = window.CodeMirror.loadedModes || {}; |
||||
|
window.CodeMirror.loadedModes.javascript = true; |
||||
|
window.CodeMirror.loadedModes.js = true; |
||||
|
})(); |
||||
Loading…
Reference in new issue