import React, { forwardRef } from "react";
import dynamic from "next/dynamic";
import { InputNumberProps } from "antd";
import { cn } from "@/lib/utils";

// Dynamically import InputNumber to ensure compatibility with SSR
const InputNumber = dynamic(() => import("antd/es/input-number"), {
  ssr: false,
});

type AppInputNumberProps = InputNumberProps & {
  size?: "large" | "middle" | "small";
};

const AppInputNumber = forwardRef<HTMLInputElement, AppInputNumberProps>(
  ({ size = "middle", ...props }, ref) => {
    return <InputNumber ref={ref} size={size} className={cn("!w-full")} {...props} />;
  },
);

AppInputNumber.displayName = "AppInputNumber";

export default AppInputNumber;