lion/docs/components/input-tel-dropdown/overview.md

Input Tel Dropdown >> Overview ||10

Extension of Input Tel that prefixes a dropdown list that shows all possible regions / countries.

import { html } from '@mdjs/mdjs-preview';
import '@lion/input-tel-dropdown/define';
import { loadDefaultFeedbackMessages } from '@lion/validate-messages';

export const main = () => {
  loadDefaultFeedbackMessages();
  return html`
    <lion-input-tel-dropdown label="Telephone number" name="phoneNumber"></lion-input-tel-dropdown>
  `;
};

Features

• Extends our input-tel
• Shows dropdown list with all possible regions
• Shows only allowed regions in dropdown list when .allowedRegions is configured
• Highlights regions on top of dropdown list when .preferredRegions is configured
• Generates template meta data for advanced

Installation

npm i --save @lion/input-tel-dropdown

import { LionInputTelDropdown } from '@lion/input-tel-dropdown';
// or
import '@lion/input-tel-dropdown/define';