From ae7d3103fb52fc7cdd3f30ff54be14cfd123daa5 Mon Sep 17 00:00:00 2001
From: faridreaming <97384053+faridreaming@users.noreply.github.com>
Date: Mon, 16 Feb 2026 18:11:30 +0700
Subject: [PATCH] refactor: output idiomatic boolean attributes in JSX

---
 constants/jsxAttributes.ts | 29 +++++++++++++++++++++++++++++
 pages/html-to-jsx.tsx      |  2 ++
 2 files changed, 31 insertions(+)
 create mode 100644 constants/jsxAttributes.ts

diff --git a/constants/jsxAttributes.ts b/constants/jsxAttributes.ts
new file mode 100644
index 00000000..0c685e19
--- /dev/null
+++ b/constants/jsxAttributes.ts
@@ -0,0 +1,29 @@
+export const JSX_BOOLEAN_ATTRIBUTES = [
+  "async",
+  "autoFocus",
+  "autoPlay",
+  "checked",
+  "controls",
+  "default",
+  "defer",
+  "disabled",
+  "formNoValidate",
+  "hidden",
+  "loop",
+  "multiple",
+  "muted",
+  "noValidate",
+  "open",
+  "readOnly",
+  "required",
+  "reversed",
+  "scoped",
+  "selected"
+] as const;
+
+export type JsxBooleanAttribute = typeof JSX_BOOLEAN_ATTRIBUTES[number];
+
+export const BOOLEAN_ATTRIBUTES_REGEX = new RegExp(
+  `\\b(${JSX_BOOLEAN_ATTRIBUTES.join("|")})=""`,
+  "g"
+);
diff --git a/pages/html-to-jsx.tsx b/pages/html-to-jsx.tsx
index d4e4d7f8..cae1a55c 100644
--- a/pages/html-to-jsx.tsx
+++ b/pages/html-to-jsx.tsx
@@ -8,6 +8,7 @@ import { useSettings } from "@hooks/useSettings";
 import isSvg from "is-svg";
 import { Alert, Heading } from "evergreen-ui";
 import Router from "next/router";
+import { BOOLEAN_ATTRIBUTES_REGEX } from "@constants/jsxAttributes";
 
 interface Settings {
   createFunction: boolean;
@@ -39,6 +40,7 @@ export default function HtmlToJsxComponent() {
         createClass: false
       });
       let result = converter.convert(value);
+      result = result.replace(BOOLEAN_ATTRIBUTES_REGEX, "$1");
 
       if (settings.createFunction) {
         result = `export const Foo = () => (${result})`;