lac-mat-tel-input

lac-mat-tel-input is an Angular telephone input component included in this monorepo to simplify maintenance and keep versioning aligned with other Lacuna UI libraries.

This package was originally developed and maintained as a standalone project:
https://github.com/LacunaSoftware/lac-mat-tel-input
It began as a partial rewrite of tanansatpal's ngx-mat-intl-tel-input — the best Angular Material solution our team found at the time — but required extensive structural changes to meet our needs.

Main Features

• Country selector with flag
• Automatic formatting while typing
• Enforces max length based on selected country
• Outputs formatted number (digits-only mode coming soon)
• Built-in phone validator for Reactive Forms
• Automatically detects the country when pasting a number containing the dial code

The component offers a clean, customizable Angular Material input with international phone support, validation helpers, and consistent UX across applications.

For more examples and usage instructions, refer to the docs project in this repository.

Installation

npm install lac-mat-tel-input

Getting started

Import LacMatTelInputModule in your root application module:

@NgModule({
	imports: [
		LacMatTelInputModule,
	],
})
export class AppModule {}

Building

To build the library, run:

npm run build:tel-input:prod

This command will compile your project, and the build artifacts will be placed in the dist/ directory.

Publishing the Library

Once the project is built, you can publish your library by following these steps:

1. Navigate to the dist directory:

   cd dist/lacuna-material

2. Run the npm publish command to publish your library to the npm registry:

   npm publish