{"version":3,"file":"CodeSpellChecker-B99cVTPn.js","sources":["../../components/features/CodeSpellChecker.tsx"],"sourcesContent":["import React, { useState, useMemo } from 'react';\nimport { BeakerIcon } from '../icons/FeatureIcons.tsx';\n\nconst commonTypos = [\n 'funtion', 'functoin', 'funciton', 'contructor', 'cosntructor',\n 'consle', 'conosle', 'cosnole', 'varable', 'varaible', 'vairable',\n 'docment', 'docuemnt', 'docmunet', 'componnet', 'componenet', 'compnent',\n 'retunr', 'retrun', 'asnyc', 'asycn', 'awai', 'awiat', 'promse',\n 'resolv', 'rejct', 'catach', 'thne', 'lenght', 'lengt', 'prperty',\n 'undefinded', 'nul', 'booleon', 'numbar', 'srtring', 'arrya', 'objcet',\n 'elemnt', 'attriubte', 'eveent', 'listner', 'handeler', 'clieck',\n 'submitt', 'resposne', 'requset', 'stauts', 'eror', 'sucess',\n 'implemnt', 'overide', 'extned', 'pbulic', 'prvate', 'procted',\n 'statci', 'abstact', 'interace', 'enmu', 'moduel', 'packge',\n 'importt', 'exprot', 'defualt', 'namspace', 'tyep', 'clsas',\n 'whiel', 'swich', 'cse', 'brek', 'contiune', 'thrwo', 'finnaly'\n];\n\nconst typoRegex = new RegExp(`\\\\b(${commonTypos.join('|')})\\\\b`, 'gi');\n\nconst HighlightedText: React.FC<{ text: string }> = React.memo(({ text }) => {\n const parts = useMemo(() => {\n return text.split(typoRegex).map((part, i) => {\n if (typoRegex.test(part)) {\n return {part};\n }\n return part;\n });\n }, [text]);\n\n return <>{parts}>;\n});\n\nexport const CodeSpellChecker: React.FC = () => {\n const [code, setCode] = useState('funtion myFunction() {\\n consle.log(\"Hello World\");\\n const myVarable = docment.getElementById(\"root\");\\n // This is a React componnet\\n}');\n\n return (\n
A simple tool that finds and highlights common typos in code.
\nThis checker uses a predefined list of common typos and does not use AI.
\n