@particle-academy/fancy-code 0.3.1 → 0.4.1

package/README.md

@@ -201,10 +201,12 @@ function RunButton() {
 | TypeScript | `ts`, `typescript`, `tsx` |
 | HTML | `html`, `htm` |
 | PHP | `php` |
+| Python | `py`, `python` |
+| Go | `go`, `golang` |
 
 ## Custom Language Registration
 
-Add languages beyond the four built-ins using `registerLanguage`:
+Add languages beyond the built-ins using `registerLanguage`:
 
 ```tsx
 import { registerLanguage } from "@particle-academy/fancy-code";

package/dist/index.cjs

@@ -110,10 +110,11 @@ function CodeEditorPanel({ className }) {
             "textarea",
             {
               ref: textareaRef,
-              className: "relative m-0 block w-full resize-none overflow-hidden border-none bg-transparent p-2.5 text-[13px] leading-[1.5] text-transparent outline-none",
+              className: "relative m-0 block w-full resize-none border-none bg-transparent p-2.5 text-[13px] leading-[1.5] text-transparent outline-none",
               style: {
                 caretColor: themeColors.cursorColor,
                 minHeight: _minHeight ? _minHeight - 40 : 80,
+                overflow: "hidden",
                 whiteSpace: wordWrap ? "pre-wrap" : "pre",
                 overflowWrap: wordWrap ? "break-word" : "normal"
               },
@@ -662,6 +663,377 @@ var tokenizePhp = (source) => {
   return tokens;
 };
 
+// src/engine/tokenizers/python.ts
+var KEYWORDS2 = /* @__PURE__ */ new Set([
+  "and",
+  "as",
+  "assert",
+  "async",
+  "await",
+  "break",
+  "class",
+  "continue",
+  "def",
+  "del",
+  "elif",
+  "else",
+  "except",
+  "finally",
+  "for",
+  "from",
+  "global",
+  "if",
+  "import",
+  "in",
+  "is",
+  "lambda",
+  "nonlocal",
+  "not",
+  "or",
+  "pass",
+  "raise",
+  "return",
+  "try",
+  "while",
+  "with",
+  "yield",
+  "True",
+  "False",
+  "None"
+]);
+var TYPES = /* @__PURE__ */ new Set([
+  "int",
+  "str",
+  "float",
+  "bool",
+  "list",
+  "dict",
+  "tuple",
+  "set",
+  "bytes",
+  "bytearray",
+  "memoryview",
+  "range",
+  "frozenset",
+  "complex",
+  "type",
+  "object",
+  "property",
+  "classmethod",
+  "staticmethod",
+  "Any",
+  "Optional",
+  "Union",
+  "Callable",
+  "List",
+  "Dict",
+  "Tuple",
+  "Set",
+  "Sequence",
+  "Mapping",
+  "Iterator",
+  "Generator",
+  "Coroutine"
+]);
+var tokenizePython = (source) => {
+  const tokens = [];
+  const len = source.length;
+  let i = 0;
+  while (i < len) {
+    const ch = source[i];
+    if (ch === " " || ch === "	" || ch === "\n" || ch === "\r") {
+      i++;
+      continue;
+    }
+    if (ch === "#") {
+      const pos = i;
+      i++;
+      while (i < len && source[i] !== "\n") i++;
+      tokens.push({ type: "comment", start: pos, end: i });
+      continue;
+    }
+    if (ch === "@" && i + 1 < len && /[a-zA-Z_]/.test(source[i + 1])) {
+      const pos = i;
+      i++;
+      while (i < len && /[a-zA-Z0-9_.]/.test(source[i])) i++;
+      tokens.push({ type: "keyword", start: pos, end: i });
+      continue;
+    }
+    if (ch === '"' || ch === "'" || (ch === "f" || ch === "r" || ch === "b" || ch === "F" || ch === "R" || ch === "B") && (source[i + 1] === '"' || source[i + 1] === "'")) {
+      const pos = i;
+      if (ch !== '"' && ch !== "'") i++;
+      const quote = source[i];
+      if (source[i + 1] === quote && source[i + 2] === quote) {
+        const triple = quote + quote + quote;
+        i += 3;
+        while (i < len && source.slice(i, i + 3) !== triple) {
+          if (source[i] === "\\") i++;
+          i++;
+        }
+        i += 3;
+        tokens.push({ type: "string", start: pos, end: i });
+        continue;
+      }
+      i++;
+      while (i < len && source[i] !== quote && source[i] !== "\n") {
+        if (source[i] === "\\") i++;
+        i++;
+      }
+      if (i < len && source[i] === quote) i++;
+      tokens.push({ type: "string", start: pos, end: i });
+      continue;
+    }
+    if (ch >= "0" && ch <= "9" || ch === "." && i + 1 < len && source[i + 1] >= "0" && source[i + 1] <= "9") {
+      const pos = i;
+      if (ch === "0" && (source[i + 1] === "x" || source[i + 1] === "X")) {
+        i += 2;
+        while (i < len && /[0-9a-fA-F_]/.test(source[i])) i++;
+      } else if (ch === "0" && (source[i + 1] === "b" || source[i + 1] === "B")) {
+        i += 2;
+        while (i < len && /[01_]/.test(source[i])) i++;
+      } else if (ch === "0" && (source[i + 1] === "o" || source[i + 1] === "O")) {
+        i += 2;
+        while (i < len && /[0-7_]/.test(source[i])) i++;
+      } else {
+        while (i < len && /[0-9_.]/.test(source[i])) i++;
+        if (i < len && (source[i] === "e" || source[i] === "E")) {
+          i++;
+          if (i < len && (source[i] === "+" || source[i] === "-")) i++;
+          while (i < len && source[i] >= "0" && source[i] <= "9") i++;
+        }
+      }
+      if (i < len && source[i] === "j") i++;
+      tokens.push({ type: "number", start: pos, end: i });
+      continue;
+    }
+    if (/[a-zA-Z_]/.test(ch)) {
+      const pos = i;
+      i++;
+      while (i < len && /[a-zA-Z0-9_]/.test(source[i])) i++;
+      const word = source.slice(pos, i);
+      let j = i;
+      while (j < len && (source[j] === " " || source[j] === "	")) j++;
+      if (KEYWORDS2.has(word)) {
+        tokens.push({ type: "keyword", start: pos, end: i });
+      } else if (TYPES.has(word)) {
+        tokens.push({ type: "type", start: pos, end: i });
+      } else if (source[j] === "(") {
+        tokens.push({ type: "function", start: pos, end: i });
+      } else if (word[0] >= "A" && word[0] <= "Z") {
+        tokens.push({ type: "type", start: pos, end: i });
+      } else {
+        tokens.push({ type: "variable", start: pos, end: i });
+      }
+      continue;
+    }
+    if ("+-*/%=<>!&|^~:@".includes(ch)) {
+      const pos = i;
+      i++;
+      while (i < len && "+-*/%=<>!&|^~:".includes(source[i])) i++;
+      tokens.push({ type: "operator", start: pos, end: i });
+      continue;
+    }
+    if ("()[]{},.;\\".includes(ch)) {
+      tokens.push({ type: "punctuation", start: i, end: i + 1 });
+      i++;
+      continue;
+    }
+    tokens.push({ type: "plain", start: i, end: i + 1 });
+    i++;
+  }
+  return tokens;
+};
+
+// src/engine/tokenizers/go.ts
+var KEYWORDS3 = /* @__PURE__ */ new Set([
+  "break",
+  "case",
+  "chan",
+  "const",
+  "continue",
+  "default",
+  "defer",
+  "else",
+  "fallthrough",
+  "for",
+  "func",
+  "go",
+  "goto",
+  "if",
+  "import",
+  "interface",
+  "map",
+  "package",
+  "range",
+  "return",
+  "select",
+  "struct",
+  "switch",
+  "type",
+  "var",
+  "nil",
+  "true",
+  "false",
+  "iota"
+]);
+var TYPES2 = /* @__PURE__ */ new Set([
+  "bool",
+  "byte",
+  "complex64",
+  "complex128",
+  "error",
+  "float32",
+  "float64",
+  "int",
+  "int8",
+  "int16",
+  "int32",
+  "int64",
+  "rune",
+  "string",
+  "uint",
+  "uint8",
+  "uint16",
+  "uint32",
+  "uint64",
+  "uintptr",
+  "any"
+]);
+var BUILTINS = /* @__PURE__ */ new Set([
+  "make",
+  "len",
+  "cap",
+  "new",
+  "append",
+  "copy",
+  "close",
+  "delete",
+  "complex",
+  "real",
+  "imag",
+  "panic",
+  "recover",
+  "print",
+  "println"
+]);
+var tokenizeGo = (source) => {
+  const tokens = [];
+  const len = source.length;
+  let i = 0;
+  while (i < len) {
+    const ch = source[i];
+    if (ch === " " || ch === "	" || ch === "\n" || ch === "\r") {
+      i++;
+      continue;
+    }
+    if (ch === "/" && source[i + 1] === "/") {
+      const pos = i;
+      i += 2;
+      while (i < len && source[i] !== "\n") i++;
+      tokens.push({ type: "comment", start: pos, end: i });
+      continue;
+    }
+    if (ch === "/" && source[i + 1] === "*") {
+      const pos = i;
+      i += 2;
+      while (i < len && !(source[i] === "*" && source[i + 1] === "/")) i++;
+      i += 2;
+      tokens.push({ type: "comment", start: pos, end: i });
+      continue;
+    }
+    if (ch === "`") {
+      const pos = i;
+      i++;
+      while (i < len && source[i] !== "`") i++;
+      i++;
+      tokens.push({ type: "string", start: pos, end: i });
+      continue;
+    }
+    if (ch === '"') {
+      const pos = i;
+      i++;
+      while (i < len && source[i] !== '"' && source[i] !== "\n") {
+        if (source[i] === "\\") i++;
+        i++;
+      }
+      if (i < len && source[i] === '"') i++;
+      tokens.push({ type: "string", start: pos, end: i });
+      continue;
+    }
+    if (ch === "'") {
+      const pos = i;
+      i++;
+      while (i < len && source[i] !== "'" && source[i] !== "\n") {
+        if (source[i] === "\\") i++;
+        i++;
+      }
+      if (i < len && source[i] === "'") i++;
+      tokens.push({ type: "string", start: pos, end: i });
+      continue;
+    }
+    if (ch >= "0" && ch <= "9" || ch === "." && i + 1 < len && source[i + 1] >= "0" && source[i + 1] <= "9") {
+      const pos = i;
+      if (ch === "0" && (source[i + 1] === "x" || source[i + 1] === "X")) {
+        i += 2;
+        while (i < len && /[0-9a-fA-F_]/.test(source[i])) i++;
+      } else if (ch === "0" && (source[i + 1] === "b" || source[i + 1] === "B")) {
+        i += 2;
+        while (i < len && /[01_]/.test(source[i])) i++;
+      } else if (ch === "0" && (source[i + 1] === "o" || source[i + 1] === "O")) {
+        i += 2;
+        while (i < len && /[0-7_]/.test(source[i])) i++;
+      } else {
+        while (i < len && /[0-9_.]/.test(source[i])) i++;
+        if (i < len && (source[i] === "e" || source[i] === "E")) {
+          i++;
+          if (i < len && (source[i] === "+" || source[i] === "-")) i++;
+          while (i < len && source[i] >= "0" && source[i] <= "9") i++;
+        }
+      }
+      if (i < len && source[i] === "i") i++;
+      tokens.push({ type: "number", start: pos, end: i });
+      continue;
+    }
+    if (/[a-zA-Z_]/.test(ch)) {
+      const pos = i;
+      i++;
+      while (i < len && /[a-zA-Z0-9_]/.test(source[i])) i++;
+      const word = source.slice(pos, i);
+      let j = i;
+      while (j < len && (source[j] === " " || source[j] === "	")) j++;
+      if (KEYWORDS3.has(word)) {
+        tokens.push({ type: "keyword", start: pos, end: i });
+      } else if (TYPES2.has(word)) {
+        tokens.push({ type: "type", start: pos, end: i });
+      } else if (BUILTINS.has(word) && source[j] === "(") {
+        tokens.push({ type: "function", start: pos, end: i });
+      } else if (source[j] === "(") {
+        tokens.push({ type: "function", start: pos, end: i });
+      } else if (word[0] >= "A" && word[0] <= "Z") {
+        tokens.push({ type: "type", start: pos, end: i });
+      } else {
+        tokens.push({ type: "variable", start: pos, end: i });
+      }
+      continue;
+    }
+    if ("+-*/%=<>!&|^~:".includes(ch)) {
+      const pos = i;
+      i++;
+      while (i < len && "+-*/%=<>!&|^~:".includes(source[i])) i++;
+      tokens.push({ type: "operator", start: pos, end: i });
+      continue;
+    }
+    if ("(){}[];,.".includes(ch)) {
+      tokens.push({ type: "punctuation", start: i, end: i + 1 });
+      i++;
+      continue;
+    }
+    tokens.push({ type: "plain", start: i, end: i + 1 });
+    i++;
+  }
+  return tokens;
+};
+
 // src/languages/builtin.ts
 registerLanguage({
   name: "JavaScript",
@@ -684,6 +1056,16 @@ registerLanguage({
   aliases: ["php"],
   tokenize: tokenizePhp
 });
+registerLanguage({
+  name: "Python",
+  aliases: ["py", "python"],
+  tokenize: tokenizePython
+});
+registerLanguage({
+  name: "Go",
+  aliases: ["go", "golang"],
+  tokenize: tokenizeGo
+});
 var iconBtnClass = "inline-flex items-center justify-center rounded-md p-1 text-zinc-500 transition-colors hover:bg-zinc-100 hover:text-zinc-700 dark:text-zinc-400 dark:hover:bg-zinc-800 dark:hover:text-zinc-200";
 function LanguageSelector() {
   const { language, setLanguage } = useCodeEditor();
@@ -946,14 +1328,23 @@ function useEditorEngine({
     }
     return count;
   }, [value]);
+  const autoResize = react.useCallback(() => {
+    const ta = textareaRef.current;
+    if (!ta) return;
+    ta.style.height = "auto";
+    ta.style.height = ta.scrollHeight + "px";
+  }, []);
   react.useEffect(() => {
     const ta = textareaRef.current;
-    if (!ta || ta.value === value) return;
-    const { selectionStart, selectionEnd } = ta;
-    ta.value = value;
-    ta.selectionStart = selectionStart;
-    ta.selectionEnd = selectionEnd;
-  }, [value]);
+    if (!ta) return;
+    if (ta.value !== value) {
+      const { selectionStart, selectionEnd } = ta;
+      ta.value = value;
+      ta.selectionStart = selectionStart;
+      ta.selectionEnd = selectionEnd;
+    }
+    autoResize();
+  }, [value, autoResize]);
   const updateCursorInfo = react.useCallback(() => {
     const ta = textareaRef.current;
     if (!ta) return;
@@ -970,8 +1361,9 @@ function useEditorEngine({
     const ta = textareaRef.current;
     if (!ta) return;
     onChangeRef.current?.(ta.value);
+    autoResize();
     updateCursorInfo();
-  }, [updateCursorInfo]);
+  }, [autoResize, updateCursorInfo]);
   const handleSelect = react.useCallback(() => {
     updateCursorInfo();
   }, [updateCursorInfo]);
@@ -1031,6 +1423,7 @@ function useEditorEngine({
           ta.selectionStart = ta.selectionEnd = start + tabSize;
           onChangeRef.current?.(ta.value);
         }
+        autoResize();
         updateCursorInfo();
         return;
       }
@@ -1049,11 +1442,12 @@ function useEditorEngine({
         ta.value = before + insertion + after;
         ta.selectionStart = ta.selectionEnd = start + insertion.length;
         onChangeRef.current?.(ta.value);
+        autoResize();
         updateCursorInfo();
         return;
       }
     },
-    [readOnly, tabSize, updateCursorInfo]
+    [readOnly, tabSize, autoResize, updateCursorInfo]
   );
   return {
     textareaRef,