smart-code-editor 1.0.0

package/src/types/question.ts

@@ -0,0 +1,98 @@
+import type { UITestCase } from "./index";
+
+/**
+ * 题目难度级别
+ */
+export type QuestionDifficulty = "easy" | "medium" | "hard";
+
+/**
+ * 题目配置
+ * 由外部调用者传入，包含题目信息、语言限制、代码模板等
+ */
+export interface QuestionConfig {
+  // ===== 题目信息 =====
+
+  /** 题目标题 */
+  title?: string;
+
+  /** 题目描述（支持 HTML） */
+  description?: string;
+
+  /** 题目描述 Markdown（可选） */
+  descriptionMarkdown?: string;
+
+  /** 题目难度（可选） */
+  difficulty?: QuestionDifficulty;
+
+  // ===== 语言配置 =====
+
+  /**
+   * 支持的语言 ID 列表（可选）
+   * 如果不传，则显示所有语言
+   * @example ["python", "java", "cpp"]
+   */
+  supportedLanguages?: string[];
+
+  /**
+   * 每种语言的代码模板
+   * key: 语言 ID
+   * value: 代码模板字符串
+   *
+   * @example
+   * {
+   *   python: "def twoSum(nums, target):\n    pass",
+   *   java: "class Solution { ... }"
+   * }
+   */
+  languageTemplates: Record<string, string>;
+
+  /** 默认选中的语言（可选） */
+  defaultLanguage?: string;
+
+  // ===== 测试配置 =====
+
+  /** 测试用例列表（可选） */
+  testCases?: UITestCase[];
+
+  // ===== 函数结构（可选） =====
+
+  /**
+   * 题目函数结构（用于根据参数名生成输入框）
+   */
+  functionStructure?: {
+    args: Array<{
+      name: string;
+      type?: string;
+    }>;
+    returnType?: string;
+  };
+}
+
+/**
+ * Markdown 题目配置（用于左侧题目区的编辑 + 预览）
+ */
+export interface QuestionMarkdownOptions {
+  /** 初始内容 */
+  value?: string;
+
+  /** 是否显示编辑区（默认 true） */
+  showEditor?: boolean;
+
+  /** 是否可编辑（默认 true） */
+  editable?: boolean;
+
+  /** 是否显示预览区（默认 true） */
+  showPreview?: boolean;
+
+  /** 编辑区占位文案 */
+  placeholder?: string;
+
+  /** 内容变化回调 */
+  onChange?: (value: string) => void;
+}
+
+/**
+ * 语言模板映射
+ * 简化版配置，只包含语言到模板的映射
+ */
+export type LanguageTemplates = Record<string, string>;

package/src/utils/loader.ts

@@ -0,0 +1,69 @@
+/**
+ * Monaco Editor Loader configuration
+ */
+export function loadMonaco(): Promise<any> {
+  if (typeof (window as any).monaco !== "undefined") {
+    return Promise.resolve((window as any).monaco);
+  }
+
+  return new Promise((resolve, reject) => {
+    const globalAny = window as any;
+    const customLoaderUrl = globalAny.__SCE_MONACO_LOADER_URL__;
+    const customBasePath = globalAny.__SCE_MONACO_BASE_PATH__;
+    const fallbackUrls = ["/package/min/vs/loader.js", "/package/vs/loader.js"];
+
+    const loaderUrls = customLoaderUrl
+      ? [customLoaderUrl]
+      : customBasePath
+        ? [`${String(customBasePath).replace(/\/$/, "")}/loader.js`]
+        : fallbackUrls;
+
+    const tryLoad = (index: number) => {
+      if (index >= loaderUrls.length) {
+        reject(new Error("Monaco loader not found"));
+        return;
+      }
+
+      const loaderUrl = loaderUrls[index];
+      const loaderScript = document.createElement("script");
+      loaderScript.src = loaderUrl;
+
+      loaderScript.onload = () => {
+        const vsBase = loaderUrl.replace(/\/loader\.js(\?.*)?$/, "");
+        // @ts-ignore
+        window.require.config({
+          paths: {
+            vs: vsBase,
+          },
+        });
+
+        // @ts-ignore
+        window.require(["vs/editor/editor.main"], () => {
+          resolve((window as any).monaco);
+        });
+      };
+
+      loaderScript.onerror = () => {
+        loaderScript.remove();
+        tryLoad(index + 1);
+      };
+
+      document.body.appendChild(loaderScript);
+    };
+
+    tryLoad(0);
+  });
+}
+
+/**
+ * 防抖函数
+ */
+export function debounce(func: Function, wait: number) {
+  let timeout: any;
+  return function (this: any, ...args: any[]) {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      func.apply(this, args);
+    }, wait);
+  };
+}

package/src/utils/markdown.ts

@@ -0,0 +1,89 @@
+function escapeHtml(input: string): string {
+  return input
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&#39;");
+}
+
+function formatInline(input: string): string {
+  let output = input;
+  output = output.replace(/`([^`]+)`/g, "<code>$1</code>");
+  output = output.replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>");
+  output = output.replace(/\*([^*]+)\*/g, "<em>$1</em>");
+  output = output.replace(/_([^_]+)_/g, "<em>$1</em>");
+  output = output.replace(
+    /\[([^\]]+)\]\(([^)]+)\)/g,
+    '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>',
+  );
+  return output;
+}
+
+export function renderMarkdown(markdown: string): string {
+  const source = markdown || "";
+  const codeBlocks: string[] = [];
+
+  let content = source.replace(
+    /```(?:[\w-]+)?\n([\s\S]*?)```/g,
+    (_match, code) => {
+      const escaped = escapeHtml(code.trimEnd());
+      const token = `@@CODEBLOCK_${codeBlocks.length}@@`;
+      codeBlocks.push(`<pre><code>${escaped}</code></pre>`);
+      return token;
+    },
+  );
+
+  content = escapeHtml(content);
+
+  const lines = content.split(/\r?\n/);
+  const blocks: string[] = [];
+  let inList = false;
+
+  const closeList = () => {
+    if (inList) {
+      blocks.push("</ul>");
+      inList = false;
+    }
+  };
+
+  for (const rawLine of lines) {
+    const line = rawLine.trim();
+    if (!line) {
+      closeList();
+      continue;
+    }
+
+    const headingMatch = line.match(/^(#{1,6})\s+(.*)$/);
+    if (headingMatch) {
+      closeList();
+      const level = headingMatch[1].length;
+      blocks.push(
+        `<h${level}>${formatInline(headingMatch[2])}</h${level}>`,
+      );
+      continue;
+    }
+
+    const listMatch = line.match(/^[-*+]\s+(.*)$/);
+    if (listMatch) {
+      if (!inList) {
+        blocks.push("<ul>");
+        inList = true;
+      }
+      blocks.push(`<li>${formatInline(listMatch[1])}</li>`);
+      continue;
+    }
+
+    closeList();
+    blocks.push(`<p>${formatInline(line)}</p>`);
+  }
+
+  closeList();
+
+  let html = blocks.join("\n");
+  codeBlocks.forEach((blockHtml, index) => {
+    html = html.replace(`@@CODEBLOCK_${index}@@`, blockHtml);
+  });
+
+  return html;
+}