Update AGENTS.md. Start fixing old weird errors

packages/ui/src/input-otp.tsx

@@ -6,47 +6,46 @@ import { MinusIcon } from 'lucide-react';
 
 import { cn } from '@gib/ui';
 
-function InputOTP({
+const InputOTP = ({
   className,
   containerClassName,
   ...props
 }: React.ComponentProps<typeof OTPInput> & {
   containerClassName?: string;
-}) {
-  return (
-    <OTPInput
-      data-slot='input-otp'
-      containerClassName={cn(
-        'cn-input-otp flex items-center has-disabled:opacity-50',
-        containerClassName,
-      )}
-      spellCheck={false}
-      className={cn('disabled:cursor-not-allowed', className)}
-      {...props}
-    />
-  );
-}
+}) => (
+  <OTPInput
+    data-slot='input-otp'
+    containerClassName={cn(
+      'cn-input-otp flex items-center has-disabled:opacity-50',
+      containerClassName,
+    )}
+    spellCheck={false}
+    className={cn('disabled:cursor-not-allowed', className)}
+    {...props}
+  />
+);
 
-function InputOTPGroup({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot='input-otp-group'
-      className={cn(
-        'has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40 has-aria-invalid:border-destructive flex items-center rounded-lg has-aria-invalid:ring-3',
-        className,
-      )}
-      {...props}
-    />
-  );
-}
+const InputOTPGroup = ({
+  className,
+  ...props
+}: React.ComponentProps<'div'>) => (
+  <div
+    data-slot='input-otp-group'
+    className={cn(
+      'has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40 has-aria-invalid:border-destructive flex items-center rounded-lg has-aria-invalid:ring-3',
+      className,
+    )}
+    {...props}
+  />
+);
 
-function InputOTPSlot({
+const InputOTPSlot = ({
   index,
   className,
   ...props
 }: React.ComponentProps<'div'> & {
   index: number;
-}) {
+}) => {
   const inputOTPContext = React.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
 
@@ -68,19 +67,17 @@ function InputOTPSlot({
       )}
     </div>
   );
-}
+};
 
-function InputOTPSeparator({ ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot='input-otp-separator'
-      className="flex items-center [&_svg:not([class*='size-'])]:size-4"
-      role='separator'
-      {...props}
-    >
-      <MinusIcon />
-    </div>
-  );
-}
+const InputOTPSeparator = ({ ...props }: React.ComponentProps<'div'>) => (
+  <div
+    data-slot='input-otp-separator'
+    className="flex items-center [&_svg:not([class*='size-'])]:size-4"
+    role='separator'
+    {...props}
+  >
+    <MinusIcon />
+  </div>
+);
 
 export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator };