Error in Cleave phone form

[ItaloCobains]

i'm trying use Cleave in my rails project with stumulus and i have this error.

how to fix this ?

My code:

import { Controller } from "@hotwired/stimulus"
import Cleave from "cleave.js"

// Connects to data-controller="cleave"
export default class extends Controller {
  static values = {
    delimiter: String,
    uppercase: Boolean,
    blocks: String,
    type: String
  }

  connect() {
    this.setOptions()
    this.cleave = new Cleave(this.element, this.options)
    console.log(this.cleave)
  }

  disconnect() {
    if (this.cleave) {
      this.cleave.destroy()
    }
  }

  setOptions() {
    this.options = {}
    if (this.hasDelimiterValue) { this.options["delimiter"] = this.delimiterValue }
    if (this.hasBlocksValue) { this.options["blocks"] = this.blocksValue.split(",").map(Number) }
    if (this.hasUppercaseValue) { this.options["uppercase"] = this.uppercaseValue }
    switch(this.hasTypeValue && this.typeValue) {
      case "credit-card":
        this.options["creditCard"] = true
        break;
      case "date":
        this.options["date"] = true
        this.options["datePattern"] = ["d", "m", "Y"]
        break;
      case "number":
        this.options["numeral"] = true
        this.options["numeralThousandsGroupStyle"] = "thousand"
        break;
      case "phone":
        this.options["phone"] = true
        this.options["phoneRegionCode"] = "BR";
        this.options["prefix"] = "+55"
        this.options["delimiter"] = "-"
        break;
      case "time":
        this.options["time"] = true
        this.options["timePattern"] = ["h", "m", "s"]
        break;
    }
  }
}

[halitak]

hi, this is what you need. You can also look at the link below.

import 'cleave.js/dist/addons/cleave-phone.br';

https://github.com/nosir/cleave.js/blob/master/doc/phone-lib-addon.md