"use client";

interface PriceFieldProps {
  label: string;
  value: string;
  onChange: (v: string) => void;
  placeholder?: string;
}

export function PriceField({ label, value, onChange, placeholder = "0" }: PriceFieldProps) {
  const raw = value.replace(/\s*BYN\s*$/i, "").trim();

  return (
    <div>
      <label className="block text-sm text-neutral-500 mb-1.5 dark:text-neutral-400">{label}</label>
      <div className="flex rounded-lg border border-neutral-200 bg-neutral-100 focus-within:border-gold transition-colors dark:border-white/10 dark:bg-neutral-800">
        <input
          type="text"
          inputMode="decimal"
          value={raw}
          onChange={(e) => {
            const v = e.target.value.replace(/[^\d.,\s]/g, "");
            onChange(v ? `${v} BYN` : "");
          }}
          placeholder={placeholder}
          className="flex-1 bg-transparent px-4 py-2.5 text-neutral-900 placeholder-neutral-400 outline-none min-w-0 dark:text-white dark:placeholder-neutral-500"
        />
        <span className="flex items-center pr-4 text-sm font-medium text-gold select-none">
          BYN
        </span>
      </div>
    </div>
  );
}