From a75239f4a4f5f76bd1d902d3c2c7523b4f3d8249 Mon Sep 17 00:00:00 2001
From: SrJuggernaut <jugger@srjuggernaut.dev>
Date: Fri, 20 Mar 2026 13:11:13 -0600
Subject: [PATCH] feat: integrate @base-ui/react

---
 package.json                 |  1 +
 src/components/ui/Button.tsx | 29 +++++++++++------------------
 tsconfig.json                |  2 +-
 3 files changed, 13 insertions(+), 19 deletions(-)

diff --git a/package.json b/package.json
index b7af052..e45f553 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
     "typescript": "^5.9.3"
   },
   "dependencies": {
+    "@base-ui/react": "^1.3.0",
     "@fontsource-variable/roboto": "^5.2.10",
     "@fontsource/orbitron": "^5.2.8",
     "@fortawesome/fontawesome-svg-core": "^7.2.0",
diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx
index cd27a83..68236fb 100644
--- a/src/components/ui/Button.tsx
+++ b/src/components/ui/Button.tsx
@@ -1,29 +1,22 @@
+import { useRender } from '@base-ui/react/use-render'
 import { cx } from '@styled-system/css'
 import { type ButtonVariantProps, button } from '@styled-system/recipes/button'
-import type { ButtonHTMLAttributes, DetailedHTMLProps, FC } from 'react'
+import type { FC } from 'react'
 import type { MergeOmitting } from '@/types/helpers'
 
 export type ButtonProps = MergeOmitting<
-  DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>,
+  useRender.ComponentProps<'button'>,
   ButtonVariantProps
 >
 
-const Button: FC<ButtonProps> = ({
-  className,
-  type = 'button',
-  children,
-  ...props
-}) => {
-  const [buttonArgs, restProps] = button.splitVariantProps(props)
-  return (
-    <button
-      type={type}
-      {...restProps}
-      className={cx(button(buttonArgs), className)}
-    >
-      {children}
-    </button>
-  )
+const Button: FC<ButtonProps> = ({ render, className, ...props }) => {
+  const [buttonArgs, otherProps] = button.splitVariantProps(props)
+
+  return useRender({
+    defaultTagName: 'button',
+    render,
+    props: { className: cx(button(buttonArgs), className), ...otherProps }
+  })
 }
 
 export default Button
diff --git a/tsconfig.json b/tsconfig.json
index cfedeae..4823e32 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     // Environment setup & latest features
-    "lib": ["ESNext"],
+    "lib": ["ESNext", "DOM"],
     "target": "ES2022",
     "module": "ESNext",
     "moduleDetection": "force",