ESLINT is holy crap

src/primitive-components/radio/radio.tsx

@@ -0,0 +1,38 @@
+'use client';
+
+import { RippleArea } from '../ripple/ripple-area';
+import { IRippleProps } from '../ripple/ripple.types';
+import useRippleEffect from '../ripple/hooks/useRippleEffect';
+import { CheckBoxLayout } from '../checkbox-layout/check-box-layout';
+import { forwardRef, PropsWithChildren, useRef, useState } from 'react';
+
+/**
+ * Radio component
+ ** description
+ */
+
+export const Radio = forwardRef<
+    HTMLInputElement,
+    PropsWithChildren<HTMLElement> & IRippleProps
+>(({ centralRipple, ...props }, ref) => {
+    const [isActive, setIsActive] = useState<boolean>(false),
+        ripplesRef = useRef(null),
+        events = useRippleEffect(ripplesRef, setIsActive);
+
+    const classes =
+        `m3 m3-radio-label ${isActive === true ? 'visible' : ''}`.trimEnd();
+
+    return (
+        <label {...events} className={classes}>
+            <CheckBoxLayout {...props} ref={ref} type={'radio'} />
+            <span className={'m3 m3-radio-state-layer'} />
+            <RippleArea
+                callback={setIsActive}
+                central={centralRipple}
+                className={'m3-checkbox-ripple-layer'}
+                ref={ripplesRef}
+            />
+            {props.children}
+        </label>
+    );
+});