Phone Formats

A dead-simple and easy-to-use package to format inputted phone numbers strings into pretty, readable, presentable, and useful strings. No bloat.

Available Formats

| Format Key | Preview | | --------------- | ----------------- | | LOCAL | 832-3096 | | DOMESTIC | (239) 832-3096 | | INTERNATIONAL | +1 (239) 832-3096 | | E.164 | +12398323096 |

Pro-tip: If the key is misspelled, left blank, or invalid, it defaults to DOMESTIC.

1. Install

npm

npm install phone-formats

yarn

yarn add phone-formats

<link /> (Not Recommended)

<script src="https://unpkg.com/phone-formats" />

2. Import

import { format as phoneFormat } from "phone-formats";

var { format: phoneFormat } = require("phone-formats");

Pro-tip: You can replace phoneFormat with any word/variable of your choosing, or omit it entirely and use format .

3. Use

phoneFormat(phone, key);

Basic Examples

var formatted = phoneFormat(2398323096);
console.log(formatted);

// > (239) 832-3096

var formatted = phoneFormat(8323096, `LOCAL`);
console.log(formatted);

// > 832-3096

var formatted = phoneFormat(2398323096, `DOMESTIC`);
console.log(formatted);

// > (239) 832-3096

var formatted = phoneFormat(`+12398323096`, `INTERNATIONAL`);
console.log(formatted);

// > +1 (239) 832-3096

var formatted = phoneFormat(`random-+1239-word-83230-test-96`, `INTERNATIONAL`);
console.log(formatted);

// > +1 (239) 832-3096

With React

import { useState } from `react`
import { format as phoneFormat } from `phone-formats`

export default function Example() {
  var [phone, setPhone] = useState()

  return (
    <>
      <input
        type='text'
        value={phone}
        onChange={(e) => setPhone(e.target.value)}
      />

      <p> {phoneFormat(phone)} </p>
    </>
  )
}

Useful Links

• GitHub
• npm
• Discord
• Sebastian Alsina

Need help?

Join us on Discord!