feat(package): added countries list

README.md

@@ -1,27 +1,214 @@
-# SelectCounty
+<p align="center">
+  <img alt="angular-material-extensions's logo"
+   height="256px" width="256px" style="text-align: center;" 
+   src="https://cdn.rawgit.com/angular-material-extensions/select-country/master/assets/angular-material-extensions-logo.svg">
+</p>
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.17.
+# @angular-material-extensions/select-country - Material password strength meter to indicate how secure is the provided password - Angular V8 supported incl. schematics
 
-## Development server
+[![npm version](https://badge.fury.io/js/%40angular-material-extensions%2Fselect-country.svg)](https://badge.fury.io/js/%40angular-material-extensions%2Fselect-country)
+[![npm demo](https://img.shields.io/badge/demo-online-ed1c46.svg)](https://angular-material-extensions.github.io/select-country)
+[![docs: typedoc](https://img.shields.io/badge/docs-typedoc-4D0080.svg)](https://angular-material-extensions.github.io/select-country/doc/index.html)
+[![Join the chat at https://gitter.im/angular-material-extensions/Lobby](https://badges.gitter.im/angular-material-extensions/Lobby.svg)](https://gitter.im/angular-material-extensions/Lobby?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
+[![CircleCI branch](https://img.shields.io/circleci/project/github/angular-material-extensions/select-country/master.svg?label=circleci)](https://circleci.com/gh/angular-material-extensions/select-country)
+[![Build Status](https://travis-ci.org/angular-material-extensions/select-country.svg?branch=master)](https://travis-ci.org/angular-material-extensions/select-country)
+[![codecov](https://codecov.io/gh/angular-material-extensions/select-country/branch/master/graph/badge.svg)](https://codecov.io/gh/angular-material-extensions/select-country)
+[![dependency Status](https://david-dm.org/angular-material-extensions/select-country/status.svg)](https://david-dm.org/angular-material-extensions/select-country)
+[![devDependency Status](https://david-dm.org/angular-material-extensions/select-country/dev-status.svg?branch=master)](https://david-dm.org/angular-material-extensions/select-country#info=devDependencies)
+[![Greenkeeper Badge](https://badges.greenkeeper.io/angular-material-extensions/select-country.svg)](https://greenkeeper.io/)
+[![license](https://img.shields.io/github/license/angular-material-extensions/select-country.svg?style=flat-square)](https://github.com/angular-material-extensions/select-country/blob/master/LICENSE)
+[![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/gdi2290/awesome-angular)
 
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
 
-## Code scaffolding
+<p align="center">
+  <img alt="@angular-material-extensions/select-country demonstration" style="text-align: center;"
+   src="https://raw.githubusercontent.com/angular-material-extensions/select-country/HEAD/assets/v3.2.0/demo.gif">
+</p>
 
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+## Built by and for developers :heart:
+Do you have any question or suggestion ? Please do not hesitate to contact us!
+Alternatively, provide a PR | open an appropriate issue [here](https://github.com/angular-material-extensions/select-country/issues)
 
-## Build
+If you like this project, support [angular-material-extensions](https://github.com/angular-material-extensions) 
+by starring :star: and sharing it :loudspeaker:
 
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
+## Table of Contents
+- [Demo](#demo)
+- [Components](#components)
+- [Dependencies](#dependencies)
+- [Installation](#installation)
+- [API](#api)
+- [Usage](#usage)
+- [Run Demo App Locally](#run-demo-app-locally)
+- [Development](#development)
+- [Other Angular Libraries](#other-angular-libraries)
+- [Support](#support)
+- [License](#license)
 
-## Running unit tests
+<a name="demo"/>
 
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+## [Demo](https://angular-material-extensions.github.io/select-country)
 
-## Running end-to-end tests
+View all the directives and components in action at [https://angular-material-extensions.github.io/select-country](https://angular-material-extensions.github.io/select-country)
 
-Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+<a name="components"/>
 
-## Further help
+## Library's components
+- `<mat-select-country>` used to display the main component
+
+
+---
+
+<a name="dependencies"/>
+
+## Dependencies
+* [Angular](https://angular.io) developed and tested with `8.x`
+
+---
+
+<a name="installation"/>
+
+##  [Installation](https://angular-material-extensions.github.io/select-country/getting-started)
+
+## 1. Install via *ng add*. (Recommended)
+
+If Angular Material Design is not setup, just run `ng add @angular/material` [learn more](https://material.angular.io/guide/getting-started)
+
+Now add the library via the `angular schematics`
+```shell
+ng add @angular-material-extensions/select-country
+```
+
+## 2. Install via *npm*. (Alternative) 
+
+Install peer dependencies 
+```shell
+npm i svg-country-flags -s
+```
+
+then update your `angular.json` like below (svg-country-flags)
+
+```json
+"assets": [
+              "src/favicon.ico",
+              "src/assets",
+              {
+                "glob": "**/*",
+                "input": "./node_modules/svg-country-flags/svg",
+                "output": "src/assets/svg-country-flags/svg"
+              }
+            ],
+```
+
+Now install `@angular-material-extensions/select-country` via:
+```shell
+npm install --save @angular-material-extensions/select-country
+```
+
+
+## Import the library
+
+Once installed you need to import the main module:
+```js
+import { MatSelectCountryModule } from '@angular-material-extensions/select-country';
+```
+The only remaining part is to list the imported module in your application module. The exact method will be slightly
+different for the root (top-level) module for which you should end up with the code similar to (notice ` MatSelectCountryModule.forRoot()`):
+```js
+import { MatSelectCountryModule } from '@angular-material-extensions/select-country';
+
+@NgModule({
+  declarations: [AppComponent, ...],
+  imports: [MatSelectCountryModule.forRoot(), ...],  
+  bootstrap: [AppComponent]
+})
+export class AppModule {
+}
+```
+
+Other modules in your application can simply import ` MatSelectCountryModule `:
+
+```js
+import { MatSelectCountryModule } from '@angular-material-extensions/select-country';
+
+@NgModule({
+  declarations: [OtherComponent, ...],
+  imports: [MatSelectCountryModule, ...], 
+})
+export class OtherModule {
+}
+```
+
+<a name="api"/>
+
+## API
+
+### `<mat-select-country>`  used to display the main component - [see the demo examples](https://angular-material-extensions.github.io/select-country/examples)
+
+| option | bind  |  type  |   default    | description  |
+|:-------------------|:--------:|:------:|:------------:|:-------------------------------------------------------------------------------------------------|    
+| password           | `Input() `  | string    | - |  the password to calculate its strength
+
+| onStrengthChanged  | Output() | `number`    | - | emits the strength of the provided password in % e.g: 20%, 40%, 60%, 80% or 100%
+
+
+
+<a name="usage"/>
+
+## [Usage](https://angular-material-extensions.github.io/select-country/getting-started)
+
+add the `<mat-select-country>` element to your template:
+
+```html
+<mat-select-country>
+</mat-select-country>
+```
+
+
+<a name="run-demo-app-locally"/>
+
+### [ Run Demo App Locally](https://github.com/angular-material-extensions/select-country/tree/master/docs/INSTRUCTIONS_DEMO.md)
+
+
+<a name="development"/>
+
+### [Development](https://github.com/angular-material-extensions/select-country/tree/master/docs/INSTRUCTIONS_DEV.md)
+
+
+## Other Angular Libraries
+- [ngx-auth-firebaseui](https://github.com/AnthonyNahas/ngx-auth-firebaseui)
+- [ngx-linkifyjs](https://github.com/AnthonyNahas/ngx-linkifyjs)
+- [@firebaseui/ng-bootstrap](https://github.com/firebaseui/ng-bootstrap)
+- [@angular-material-extensions/password-strength](https://github.com/angular-material-extensions/password-strength)
+- [@angular-material-extensions/link-preview](https://github.com/angular-material-extensions/link-preview)
+- [@angular-material-extensions/google-maps-autocomplete](https://github.com/angular-material-extensions/google-maps-autocomplete)
+- [@angular-material-extensions/pages](https://github.com/angular-material-extensions/pages)
+- [@angular-material-extensions/contacts](https://github.com/angular-material-extensions/contacts)
+- [@angular-material-extensions/faq](https://github.com/angular-material-extensions/faq)
+- [@angular-material-extensions/combination-generator](https://github.com/angular-material-extensions/combination-generator)
+
+---
+
+<a name="support"/>
+
+## Support
++ Drop an email to: [Anthony Nahas](mailto:[email protected])
++ or open an appropriate [issue](https://github.com/angular-material-extensions/select-country/issues)
++ let us chat on [Gitter](https://gitter.im/angular-material-extensions/Lobby)
+
+ Built by and for developers :heart: we will help you :punch:
+
+---
+
+![jetbrains logo](https://raw.githubusercontent.com/angular-material-extensions/select-country/HEAD/assets/jetbrains-variant-4_logos/jetbrains-variant-4.png)
+
+This project is supported by [jetbrains](https://www.jetbrains.com/) with 1 ALL PRODUCTS PACK OS LICENSE incl. [webstorm](https://www.jetbrains.com/webstorm)
+
+---
+
+<a name="license"/>
+
+## License
+
+Copyright (c) 2019 [Anthony Nahas](https://github.com/AnthonyNahas). Licensed under the MIT License (MIT)
 
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

angular.json

@@ -25,7 +25,12 @@
             "aot": false,
             "assets": [
               "src/favicon.ico",
-              "src/assets"
+              "src/assets",
+              {
+                "glob": "**/*",
+                "input": "./node_modules/svg-country-flags/svg",
+                "output": "/assets/svg-country-flags/svg"
+              }
             ],
             "styles": [
               "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
@@ -164,4 +169,4 @@
     }
   },
   "defaultProject": "select-county"
-}
+}

package.json

@@ -5,6 +5,8 @@
     "ng": "ng",
     "start": "ng serve",
     "build": "ng build",
+    "build:lib": "ng build @angular-material-extensions/select-country",
+    "build:lib:Watch": "ng build @angular-material-extensions/select-country --watch",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e"
@@ -23,6 +25,7 @@
     "@angular/router": "~8.2.13",
     "hammerjs": "^2.0.8",
     "rxjs": "~6.4.0",
+    "svg-country-flags": "^1.2.6",
     "tslib": "^1.10.0",
     "zone.js": "~0.9.1"
   },

projects/angular-material-extensions/select-country/package.json

@@ -1,8 +1,26 @@
 {
   "name": "@angular-material-extensions/select-country",
+  "description": "Angular Material component that allow users to select a county or nationality ",
   "version": "0.0.1",
+  "author": {
+    "name": "anthonynahas",
+    "url": "https://github.com/anthonynahas"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/angular-material-extensions/select-country.git"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build" : ""
+  },
   "peerDependencies": {
     "@angular/common": "^8.2.13",
-    "@angular/core": "^8.2.13"
+    "@angular/core": "^8.2.13",
+    "@angular/cdk": "~8.2.3",
+    "@angular/material": "~8.2.3"
+  },
+  "engines": {
+    "node": ">=10.0.0"
   }
-}
+}