🐍 Python Black Formatter

\n Black-compatible formatting powered by ruff (WASM). Paste code, hit Format.\n

\n view source\n

\n\n

\n \n \n \n Line length\n \n \n \n

\n\n

Input

\n \n

Formatted

\n \n

\n\n

\n API: POST /format with JSON\n {\"code\": \"...\"} or raw text body.\n

\n \n\n\n",[131],"199b4a3f-1122-4206-9f42-9eb86380ec15","formatter.ts","1a5c28de-84bf-11f1-9398-1607ee4eb77e",8,["D",1784609247346],"script","// Python formatter backed by ruff's WASM build.\n// Ruff's formatter is designed as a drop-in replacement for Black.\nimport init, { format } from \"https://cdn.jsdelivr.net/npm/@wasm-fmt/ruff_fmt@0.15.20/ruff_fmt_web.js\";\n\nconst WASM_URL =\n \"https://cdn.jsdelivr.net/npm/@wasm-fmt/ruff_fmt@0.15.20/ruff_fmt_bg.wasm\";\nconst ready = init(WASM_URL);\n\nexport interface FormatOptions {\n line_width?: number; // Black default: 88\n indent_width?: number; // Black default: 4\n quote_style?: \"double\" | \"single\" | \"preserve\";\n}\n\nexport async function formatPython(\n code: string,\n opts: FormatOptions = {},\n): Promise {\n await ready;\n return format(code, \"main.py\", {\n line_width: 88,\n indent_width: 4,\n indent_style: \"space\",\n quote_style: \"double\",\n line_ending: \"lf\",\n magic_trailing_comma: \"respect\",\n ...opts,\n });\n}\n",[138],"2394d570-e2ba-4719-bfed-5e1cf8507253","app.js","24e9fcc2-84bf-11f1-853a-1607ee4eb77e",4,["D",1784609191802],"const input = document.getElementById(\"input\");\nconst output = document.getElementById(\"output\");\nconst status = document.getElementById(\"status\");\nconst lineWidth = document.getElementById(\"line-width\");\n\nasync function formatCode() {\n const code = input.value;\n if (!code.trim()) return;\n status.textContent = \"Formatting…\";\n try {\n const res = await fetch(\"/format\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({\n code,\n line_width: Number(lineWidth.value) || 88,\n }),\n });\n const data = await res.json();\n if (!res.ok) {\n status.textContent = \"❌ \" + (data.error || \"Format failed\");\n return;\n }\n output.value = data.formatted;\n status.textContent = \"✅ Formatted\";\n } catch (err) {\n status.textContent = \"❌ \" + err.message;\n }\n}\n\ndocument.getElementById(\"format-btn\").addEventListener(\"click\", formatCode);\n\ndocument.getElementById(\"copy-btn\").addEventListener(\"click\", async () => {\n if (!output.value) return;\n await navigator.clipboard.writeText(output.value);\n status.textContent = \"📋 Copied\";\n});\n\n// Ctrl/Cmd+Enter to format\ninput.addEventListener(\"keydown\", (e) => {\n if ((e.ctrlKey || e.metaKey) && e.key === \"Enter\") formatCode();\n});\n",[146],"54a82f15-15d4-41f5-824a-0b80222681c0","README.md","5d08ee10-84bf-11f1-a0d2-1607ee4eb77e",["D",1784609285956],"# 🐍 Python Black Formatter\n\nFormat Python code Black-style, right in the browser or via API. Powered by\n[ruff](https://docs.astral.sh/ruff/formatter/)'s WASM formatter — a drop-in\nreplacement for Black — so no Python runtime is needed.\n\n## Web UI\n\nOpen the val's endpoint, paste Python code, hit **Format** (or Ctrl/Cmd+Enter).\n\n## API\n\n`POST /format`\n\n- **JSON**: `{\"code\": \"def f( ):pass\", \"line_width\": 88}` → `{\"formatted\": \"...\"}`\n- **Raw text**: send Python source as the body → formatted Python comes back as text\n\n```sh\ncurl -X POST --data-binary @script.py /format\n```\n\n## Files\n\n```mermaid\ngraph LR\n main.ts[main.ts
HTTP routes] --> formatter.ts[formatter.ts
ruff WASM wrapper]\n main.ts --> index.html[index.html
UI]\n index.html --> app.js[app.js
frontend logic]\n```\n\nDefaults match Black: 88-char lines, 4-space indent, double quotes.\n",[153],"pulls","branches",1,"forks","envVars",{"_166":42,"_168":42},"connections",{"_166":42,"_167":42},"count","unfilledCount","emptyCount",{"_18":152,"_20":153,"_115":154,"_116":-5,"_117":68,"_118":66,"_120":38,"_22":187,"_65":42,"_123":97,"_125":156,"_127":26,"_128":-5,"_175":188,"_86":189},{"_18":145,"_20":146,"_115":147,"_116":-5,"_117":68,"_118":148,"_120":38,"_22":184,"_65":42,"_123":142,"_125":150,"_127":26,"_128":-5,"_175":185,"_86":186},{"_18":137,"_20":138,"_115":139,"_116":-5,"_117":68,"_118":140,"_120":38,"_22":181,"_65":133,"_123":142,"_125":143,"_127":26,"_128":-5,"_175":182,"_86":183},{"_18":130,"_20":131,"_115":132,"_116":-5,"_117":68,"_118":133,"_120":38,"_22":178,"_65":42,"_123":97,"_125":135,"_127":26,"_128":-5,"_175":179,"_86":180},{"_18":113,"_20":114,"_115":36,"_116":-5,"_117":68,"_118":119,"_120":38,"_22":174,"_65":122,"_123":124,"_125":126,"_127":26,"_128":-5,"_175":176,"_86":177},["D",1784609276351],"children",[],[114],["D",1784609184487],[],[131],["D",1784609247346],[],[138],["D",1784609191802],[],[146],["D",1784609285956],[],[153],["D",1784609150828],{"_16":17,"_84":80},{"_16":17,"_77":78,"_79":80,"_33":34,"_81":82,"_83":26},{"_65":66,"_20":67,"_18":68,"_69":19,"_70":-5,"_71":-5,"_72":-5,"_73":-5,"_74":-5,"_75":21,"_76":17},"ctx",{"_58":-5,"_105":227,"_228":229,"_230":231,"_232":26,"_233":26,"_234":26,"_235":38,"_236":-5,"_237":-7,"_238":-7,"_239":42,"_240":26,"_241":26,"_242":-5,"_243":26,"_244":26,"_245":26,"_246":-5},"ENV",{"_198":199,"_200":201,"_202":67,"_203":204,"_205":206,"_207":208,"_209":210,"_211":212,"_213":214,"_215":216,"_217":218,"_219":220,"_221":222,"_223":224,"_225":226},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Search