@becrafter/prompt-manager 0.0.18 → 0.1.1

package/packages/admin-ui/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@becrafter/admin-ui",
+  "version": "0.0.1",
+  "description": "Admin UI for Prompt Manager",
+  "scripts": {
+    "dev": "npx webpack serve --mode development",
+    "build": "npx webpack --mode production"
+  },
+  "keywords": [
+    "admin",
+    "ui",
+    "prompt-manager"
+  ],
+  "author": "BeCrafter",
+  "license": "MIT",
+  "devDependencies": {
+    "@babel/core": "^7.28.5",
+    "@babel/preset-env": "^7.28.5",
+    "babel-loader": "^10.0.0",
+    "copy-webpack-plugin": "^11.0.0",
+    "css-loader": "^6.8.0",
+    "file-loader": "^6.2.0",
+    "html-webpack-plugin": "^5.5.0",
+    "mini-css-extract-plugin": "^2.9.4",
+    "source-map-loader": "^5.0.0",
+    "style-loader": "^3.3.0",
+    "terser-webpack-plugin": "^5.3.0",
+    "webpack": "^5.88.0",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^4.15.0"
+  },
+  "dependencies": {
+    "codemirror": "5.65.2",
+    "js-yaml": "^4.1.0"
+  }
+}

package/packages/admin-ui/src/codemirror.js

@@ -0,0 +1,53 @@
+// src/codemirror.js - CodeMirror 初始化和配置
+
+import CodeMirror from "codemirror"
+import "codemirror/mode/markdown/markdown"
+import "codemirror/addon/edit/closebrackets"
+import "codemirror/addon/edit/matchbrackets"
+import yaml from "js-yaml"
+
+// 将 js-yaml 挂载到 window 对象上，以便其他地方可以访问
+window.jsyaml = yaml
+
+// 初始化 CodeMirror 编辑器
+function initCodeMirror() {
+  const editorElement = document.getElementById('editor')
+  const initialValue = editorElement.value || '' // 改为空字符串，使编辑器初始化时为空白
+  
+  const editor = CodeMirror.fromTextArea(editorElement, {
+    mode: 'markdown',
+    theme: 'xq-light',
+    lineNumbers: false,
+    lineWrapping: true,
+    autoCloseBrackets: true,
+    matchBrackets: true,
+    indentUnit: 2,
+    tabSize: 2,
+    fontSize: '14px',
+    height: '100%',
+    viewportMargin: Infinity
+  })
+  
+  // 设置初始值
+  editor.setValue(initialValue)
+  
+  // 监听内容变化以更新预览
+  editor.on('change', function() {
+    // 延迟更新预览以避免过于频繁的更新
+    clearTimeout(window.previewUpdateTimer)
+    window.previewUpdateTimer = setTimeout(() => {
+      if (typeof updatePreview === 'function') {
+        updatePreview()
+      }
+    }, 300)
+  })
+
+  // 将 editor 对象暴露出去，以便可以获取内容
+  // 不需要重写 getValue 和 setValue 方法，因为 CodeMirror 已经提供了它们
+  // editor.getValue = () => editor.getValue()
+  // editor.setValue = (value) => editor.setValue(value)
+
+  return editor
+}
+
+export { initCodeMirror }