diff --git a/.angular-cli.json b/.angular-cli.json new file mode 100644 index 0000000..d6d9e79 --- /dev/null +++ b/.angular-cli.json @@ -0,0 +1,60 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "project": { + "name": "ng-select" + }, + "apps": [ + { + "root": "src", + "outDir": "dist", + "assets": [ + "assets", + "favicon.ico" + ], + "index": "index.html", + "main": "main.ts", + "polyfills": "polyfills.ts", + "test": "test.ts", + "tsconfig": "tsconfig.app.json", + "testTsconfig": "tsconfig.spec.json", + "prefix": "app", + "styles": [ + "styles.css" + ], + "scripts": [], + "environmentSource": "environments/environment.ts", + "environments": { + "dev": "environments/environment.ts", + "prod": "environments/environment.prod.ts" + } + } + ], + "e2e": { + "protractor": { + "config": "./protractor.conf.js" + } + }, + "lint": [ + { + "project": "src/tsconfig.app.json", + "exclude": "**/node_modules/**" + }, + { + "project": "src/tsconfig.spec.json", + "exclude": "**/node_modules/**" + }, + { + "project": "e2e/tsconfig.e2e.json", + "exclude": "**/node_modules/**" + } + ], + "test": { + "karma": { + "config": "./karma.conf.js" + } + }, + "defaults": { + "styleExt": "css", + "component": {} + } +} diff --git a/.editorconfig b/.editorconfig index 48a18f1..72bfd34 100644 --- a/.editorconfig +++ b/.editorconfig @@ -1,5 +1,4 @@ # http://editorconfig.org - root = true [*] @@ -9,3 +8,7 @@ indent_size = 4 end_of_line = lf insert_final_newline = true trim_trailing_whitespace = true + +[*.md] +max_line_length = off +trim_trailing_whitespace = false diff --git a/.gitignore b/.gitignore index 4a9e647..629626a 100644 --- a/.gitignore +++ b/.gitignore @@ -1,12 +1,46 @@ +# See http://help.github.com/ignore-files/ for more about ignoring files. + +# compiled output /dist -/node_modules -/docs/*.map +/tmp +/out-tsc -npm-debug.log -yarn-error.log -.vscode +# dependencies +/node_modules +# IDEs and editors +/.idea +.project +.classpath +.c9/ +*.launch +.settings/ +*.sublime-workspace *.orig *.swp *.tgz -*.idea + +# IDE - VSCode +.vscode/* +!.vscode/settings.json +!.vscode/tasks.json +!.vscode/launch.json +!.vscode/extensions.json + +# misc +/.sass-cache +/connect.lock +/coverage +/libpeerconnection.log +npm-debug.log +yarn-error.log +testem.log +/typings + +# e2e +/e2e/*.js +/e2e/*.map + +# System Files +.DS_Store +Thumbs.db diff --git a/.npmignore b/.npmignore deleted file mode 100644 index 04ff0ac..0000000 --- a/.npmignore +++ /dev/null @@ -1,32 +0,0 @@ -/.git -/demo -/docs -/node_modules -/src - -/dist/src/ng-select.js -/dist/src/ng-select.d.ts -/dist/src/ng-select.metadata.json -/dist/src/ng-select.ngfactory.js -/dist/src/ng-select.ngfactory.d.ts -/dist/src/ng-select.ngsummary.json -/dist/node_modules - -yarn.lock -gulpfile.js -tslint.json -.editorconfig -.npmignore -.travis.yml -.vscode - -npm-debug.log -yarn-error.log - -*.spec.d.ts -*.spec.js - -*.orig -*.swp -*.tgz -*.sh diff --git a/.travis.yml b/.travis.yml index 4e3300c..504bbfb 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,7 +1,7 @@ language: node_js node_js: - - "6" + - "8" cache: yarn before_script: - - yarn global add gulp -script: gulp + - yarn global add angular-cli +script: ng build --prod diff --git a/README.md b/README.md index 317c31d..8a0f105 100644 --- a/README.md +++ b/README.md @@ -7,26 +7,26 @@ A select component for angular, based on the [select2] JQuery plugin. See the ## Develop -Make sure that `gulp` and `yarn` are installed. +Make sure that `yarn` is installed. -Clone the repository and run: +After clone the repository, run the test app with: ```bash $ yarn install -$ gulp build +$ ng serve ``` -To install and run the ng-select web site on your local machine, run the following in the demo -folder: +To build the ng-select module, run: ```bash -$ yarn install -$ ng serve +$ yarn run build-lib ``` -For manual testing, pack and install a modified version of the ng-select component to ng-select web -site with the script: +To install and run the ng-select demo/documentation web site on your local +machine, enter the demo folder and run: ```bash -$ ./copy_to_demo.sh +$ yarn install +$ ng serve ``` + [ng-select]: https://basvandenberg.github.io/ng-select [select2]: https://select2.github.io [plunker]: https://plnkr.co/edit/vxwV6zxEwZGVUVR5V6tg?p=preview diff --git a/copy_to_demo.sh b/copy_to_demo.sh index 3febc72..2b92e24 100755 --- a/copy_to_demo.sh +++ b/copy_to_demo.sh @@ -1,8 +1,8 @@ #!/bin/bash -rm -v ng-select-*.tgz +rm -v src/app/ng-select/dist/ng-select-*.tgz rm -rv demo/node_modules/ng-select/* -npm pack +npm pack src/app/ng-select/dist tar -xzvf ng-select-*.tgz mv -v package/* demo/node_modules/ng-select/ diff --git a/e2e/app.e2e-spec.ts b/e2e/app.e2e-spec.ts new file mode 100644 index 0000000..e91da42 --- /dev/null +++ b/e2e/app.e2e-spec.ts @@ -0,0 +1,14 @@ +import { AppPage } from './app.po'; + +describe('ng-select App', () => { + let page: AppPage; + + beforeEach(() => { + page = new AppPage(); + }); + + it('should display welcome message', () => { + page.navigateTo(); + expect(page.getParagraphText()).toEqual('Welcome to app!'); + }); +}); diff --git a/e2e/app.po.ts b/e2e/app.po.ts new file mode 100644 index 0000000..82ea75b --- /dev/null +++ b/e2e/app.po.ts @@ -0,0 +1,11 @@ +import { browser, by, element } from 'protractor'; + +export class AppPage { + navigateTo() { + return browser.get('/'); + } + + getParagraphText() { + return element(by.css('app-root h1')).getText(); + } +} diff --git a/e2e/tsconfig.e2e.json b/e2e/tsconfig.e2e.json new file mode 100644 index 0000000..1d9e5ed --- /dev/null +++ b/e2e/tsconfig.e2e.json @@ -0,0 +1,14 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "outDir": "../out-tsc/e2e", + "baseUrl": "./", + "module": "commonjs", + "target": "es5", + "types": [ + "jasmine", + "jasminewd2", + "node" + ] + } +} diff --git a/gulpfile.js b/gulpfile.js deleted file mode 100644 index 2c244fe..0000000 --- a/gulpfile.js +++ /dev/null @@ -1,103 +0,0 @@ -"use strict"; - -const del = require('del'); -const exec = require('child_process').exec; -const fs = require('fs'); -const gulp = require('gulp'); -const jasmine = require('gulp-jasmine'); -const os = require('os'); -const sass = require('gulp-sass'); -const tslint = require('gulp-tslint'); - -gulp.task('default', ['build']); - -// Build. - -gulp.task('build', ['transpile:ts'], function() { - return del([ - './aot', - './src/select.component.html.ts', - './src/select.component.css', - './src/select.component.css.ts', - './src/select-dropdown.component.html.ts', - './src/select-dropdown.component.css', - './src/select-dropdown.component.css.ts' - ]); -}); - -gulp.task('watch', function() { - gulp.watch(['./src/**/*'], ['build']); -}); - -gulp.task('clean', function() { - return del(['./aot', './dist/**/*']); -}); - -// Test. - -gulp.task('test', function() { - gulp.src('./dist/**/*.spec.js') - .pipe(jasmine()); -}); - -// Typescript --> Javascript. - -gulp.task('lint:ts', function() { - return gulp.src(['./src/*.ts']) - .pipe(tslint({ - formatter: "verbose" - })) - .pipe(tslint.report()); -}); - -gulp.task('transpile:ts', ['clean', 'templates', 'styles'], function (cb) { - - var cmd = os.platform() === 'win32' ? - 'node_modules\\.bin\\ngc -p src/tsconfig.json' : - './node_modules/.bin/ngc -p src/tsconfig.json'; - - exec(cmd, function (err, stdout, stderr) { - console.log(stdout); - console.log(stderr); - cb(err); - }); -}); - -// HTML template --> Typescript. - -gulp.task('templates', ['lint:ts'], function() { - - var t1 = fs.readFileSync('./src/select.component.html', 'utf8'); - var t2 = fs.readFileSync('./src/select-dropdown.component.html', 'utf8'); - - t1 = 'export const TEMPLATE = `' + t1 + '`;'; - t2 = 'export const TEMPLATE = `' + t2 + '`;'; - - fs.writeFileSync('./src/select.component.html.ts', t1); - fs.writeFileSync('./src/select-dropdown.component.html.ts', t2); - - return; -}); - -// Sass --> CSS -> Typescript. - -gulp.task('styles', ['transpile:sass'], function() { - - var s1 = fs.readFileSync('./src/select.component.css', 'utf8'); - var s2 = fs.readFileSync('./src/select-dropdown.component.css', 'utf8'); - - s1 = 'export const STYLE = `' + s1 + '`;'; - s2 = 'export const STYLE = `' + s2 + '`;'; - - fs.writeFileSync('./src/select.component.css.ts', s1); - fs.writeFileSync('./src/select-dropdown.component.css.ts', s2); - - return; -}); - - -gulp.task('transpile:sass', function() { - return gulp.src('./src/**/*.scss') - .pipe(sass().on('error', sass.logError)) - .pipe(gulp.dest('./src/')) -}); diff --git a/index.d.ts b/index.d.ts deleted file mode 100644 index 6f92535..0000000 --- a/index.d.ts +++ /dev/null @@ -1,4 +0,0 @@ -export * from './dist/src/option.interface'; -export * from './dist/src/select.component'; -export declare class SelectModule { -} diff --git a/index.js b/index.js deleted file mode 100644 index 1ebdf4c..0000000 --- a/index.js +++ /dev/null @@ -1,34 +0,0 @@ -"use strict"; -function __export(m) { - for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; -} -Object.defineProperty(exports, "__esModule", { value: true }); -var core_1 = require('@angular/core'); -var common_1 = require('@angular/common'); -var forms_1 = require('@angular/forms'); -var select_component_1 = require('./dist/src/select.component'); -var select_dropdown_component_1 = require('./dist/src/select-dropdown.component'); -__export(require('./dist/src/select.component')); -var SelectModule = (function () { - function SelectModule() { - } - SelectModule.decorators = [ - { type: core_1.NgModule, args: [{ - declarations: [ - select_component_1.SelectComponent, - select_dropdown_component_1.SelectDropdownComponent - ], - exports: [ - select_component_1.SelectComponent - ], - imports: [ - common_1.CommonModule, - forms_1.FormsModule - ] - },] }, - ]; - /** @nocollapse */ - SelectModule.ctorParameters = function () { return []; }; - return SelectModule; -}()); -exports.SelectModule = SelectModule; diff --git a/index.metadata.json b/index.metadata.json deleted file mode 100644 index b24d6be..0000000 --- a/index.metadata.json +++ /dev/null @@ -1 +0,0 @@ -[{"__symbolic":"module","version":4,"metadata":{"SelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"declarations":[{"__symbolic":"reference","module":"./dist/src/select.component","name":"SelectComponent"},{"__symbolic":"reference","module":"./dist/src/select-dropdown.component","name":"SelectDropdownComponent"}],"exports":[{"__symbolic":"reference","module":"./dist/src/select.component","name":"SelectComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}]}]}]}},"exports":[{"from":"./dist/src/option.interface"},{"from":"./dist/src/select.component"}]},{"__symbolic":"module","version":1,"metadata":{"SelectModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"declarations":[{"__symbolic":"reference","module":"./dist/src/select.component","name":"SelectComponent"},{"__symbolic":"reference","module":"./dist/src/select-dropdown.component","name":"SelectDropdownComponent"}],"exports":[{"__symbolic":"reference","module":"./dist/src/select.component","name":"SelectComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule"}]}]}]}},"exports":[{"from":"./dist/src/option.interface"},{"from":"./dist/src/select.component"}]}] diff --git a/karma.conf.js b/karma.conf.js new file mode 100644 index 0000000..af139fa --- /dev/null +++ b/karma.conf.js @@ -0,0 +1,33 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/1.0/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '', + frameworks: ['jasmine', '@angular/cli'], + plugins: [ + require('karma-jasmine'), + require('karma-chrome-launcher'), + require('karma-jasmine-html-reporter'), + require('karma-coverage-istanbul-reporter'), + require('@angular/cli/plugins/karma') + ], + client:{ + clearContext: false // leave Jasmine Spec Runner output visible in browser + }, + coverageIstanbulReporter: { + reports: [ 'html', 'lcovonly' ], + fixWebpackSourcePaths: true + }, + angularCli: { + environment: 'dev' + }, + reporters: ['progress', 'kjhtml'], + port: 9876, + colors: true, + logLevel: config.LOG_INFO, + autoWatch: true, + browsers: ['Chrome'], + singleRun: false + }); +}; diff --git a/ng-package.json b/ng-package.json new file mode 100644 index 0000000..45d9025 --- /dev/null +++ b/ng-package.json @@ -0,0 +1,7 @@ +{ + "$schema": "./node_modules/ng-packagr/ng-package.schema.json", + "src": "src/app/ng-select", + "lib": { + "entryFile": "public_api.ts" + } +} diff --git a/package.json b/package.json index 2591baa..c4ef892 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,7 @@ { - "name": "ng-select", + "name": "ng-select-app", "version": "1.0.0-rc.2", "description": "Select component for angular.", - "main": "index.js", "repository": "git@github.com:basvandenberg/ng-select.git", "keywords": [ "angular", @@ -17,30 +16,43 @@ "url": "https://github.com/basvandenberg/ng-select/issues" }, "homepage": "https://basvandenberg.github.io/ng-select", - "dependencies": {}, - "devDependencies": { + "scripts": { + "build-lib": "ng-packagr -p ng-package.json" + }, + "dependencies": { "@angular/animations": "^5.0.0", "@angular/common": "^5.0.0", "@angular/compiler": "^5.0.0", - "@angular/compiler-cli": "^5.0.0", "@angular/core": "^5.0.0", "@angular/forms": "^5.0.0", + "@angular/http": "^5.0.0", "@angular/platform-browser": "^5.0.0", "@angular/platform-browser-dynamic": "^5.0.0", - "@angular/platform-server": "^5.0.0", - "@types/jasmine": "^2.6.2", - "@types/node": "^8.0.47", + "@angular/router": "^5.0.0", "core-js": "^2.4.1", - "del": "^3.0.0", - "fs": "^0.0.1-security", - "gulp": "^3.9.1", - "gulp-jasmine": "^2.4.2", - "gulp-sass": "^3.0.0", - "gulp-tslint": "^8.1.1", - "reflect-metadata": "^0.1.9", "rxjs": "^5.5.2", - "tslint": "^5.8.0", - "typescript": "~2.4.0", - "zone.js": "^0.8.18" + "zone.js": "^0.8.14" + }, + "devDependencies": { + "@angular/cli": "1.5.0", + "@angular/compiler-cli": "^5.0.0", + "@angular/language-service": "^5.0.0", + "@types/jasmine": "~2.5.53", + "@types/jasminewd2": "~2.0.2", + "@types/node": "~6.0.60", + "codelyzer": "~3.2.0", + "jasmine-core": "~2.6.2", + "jasmine-spec-reporter": "~4.1.0", + "karma": "~1.7.0", + "karma-chrome-launcher": "~2.1.1", + "karma-cli": "~1.0.1", + "karma-coverage-istanbul-reporter": "^1.2.1", + "karma-jasmine": "~1.1.0", + "karma-jasmine-html-reporter": "^0.2.2", + "ng-packagr": "^1.5.0-rc.1", + "protractor": "~5.1.2", + "ts-node": "~3.2.0", + "tslint": "~5.7.0", + "typescript": "~2.4.2" } } diff --git a/protractor.conf.js b/protractor.conf.js new file mode 100644 index 0000000..7ee3b5e --- /dev/null +++ b/protractor.conf.js @@ -0,0 +1,28 @@ +// Protractor configuration file, see link for more information +// https://github.com/angular/protractor/blob/master/lib/config.ts + +const { SpecReporter } = require('jasmine-spec-reporter'); + +exports.config = { + allScriptsTimeout: 11000, + specs: [ + './e2e/**/*.e2e-spec.ts' + ], + capabilities: { + 'browserName': 'chrome' + }, + directConnect: true, + baseUrl: 'http://localhost:4200/', + framework: 'jasmine', + jasmineNodeOpts: { + showColors: true, + defaultTimeoutInterval: 30000, + print: function() {} + }, + onPrepare() { + require('ts-node').register({ + project: 'e2e/tsconfig.e2e.json' + }); + jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); + } +}; diff --git a/src/app/app.component.html b/src/app/app.component.html new file mode 100644 index 0000000..069a549 --- /dev/null +++ b/src/app/app.component.html @@ -0,0 +1,5 @@ + + + diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts new file mode 100644 index 0000000..31b3907 --- /dev/null +++ b/src/app/app.component.spec.ts @@ -0,0 +1,16 @@ +import { TestBed, async } from '@angular/core/testing'; +import { AppComponent } from './app.component'; +describe('AppComponent', () => { + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ + AppComponent + ], + }).compileComponents(); + })); + it('should create the app', async(() => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app).toBeTruthy(); + })); +}); diff --git a/src/app/app.component.ts b/src/app/app.component.ts new file mode 100644 index 0000000..09c5407 --- /dev/null +++ b/src/app/app.component.ts @@ -0,0 +1,13 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html' +}) +export class AppComponent { + myOptions = [ + {value: 'a', label: 'A'}, + {value: 'b', label: 'B'}, + {value: 'c', label: 'C'}, + ] +} diff --git a/src/app/app.module.ts b/src/app/app.module.ts new file mode 100644 index 0000000..0d81e89 --- /dev/null +++ b/src/app/app.module.ts @@ -0,0 +1,19 @@ +import { BrowserModule } from '@angular/platform-browser'; +import { NgModule } from '@angular/core'; + +import { SelectModule } from './ng-select/ng-select.module'; + +import { AppComponent } from './app.component'; + +@NgModule({ + declarations: [ + AppComponent + ], + imports: [ + BrowserModule, + SelectModule + ], + providers: [], + bootstrap: [AppComponent] +}) +export class AppModule { } diff --git a/src/diacritics.ts b/src/app/ng-select/diacritics.ts similarity index 100% rename from src/diacritics.ts rename to src/app/ng-select/diacritics.ts diff --git a/src/app/ng-select/dist/bundles/ng-select.umd.js b/src/app/ng-select/dist/bundles/ng-select.umd.js new file mode 100644 index 0000000..a7d3d23 --- /dev/null +++ b/src/app/ng-select/dist/bundles/ng-select.umd.js @@ -0,0 +1,2084 @@ +(function (global, factory) { + typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms')) : + typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@angular/forms'], factory) : + (factory((global['ng-select'] = {}),global.ng.core,global.ng.common,global.ng.forms)); +}(this, (function (exports,core,common,forms) { 'use strict'; + +var Option = /** @class */ (function () { + /** + * @param {?} option + */ + function Option(option) { + this.wrappedOption = option; + this.disabled = false; + this.highlighted = false; + this.selected = false; + this.shown = true; + } + Object.defineProperty(Option.prototype, "value", { + /** + * @return {?} + */ + get: function () { + return this.wrappedOption.value; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(Option.prototype, "label", { + /** + * @return {?} + */ + get: function () { + return this.wrappedOption.label; + }, + enumerable: true, + configurable: true + }); + return Option; +}()); +var Diacritics = /** @class */ (function () { + function Diacritics() { + } + /** + * @param {?} text + * @return {?} + */ + Diacritics.strip = function (text) { + var _this = this; + var /** @type {?} */ match = function (a) { + return _this.DIACRITICS[a] || a; + }; + return text.replace(/[^\u0000-\u007E]/g, match); + }; + return Diacritics; +}()); +Diacritics.DIACRITICS = { + '\u24B6': 'A', + '\uFF21': 'A', + '\u00C0': 'A', + '\u00C1': 'A', + '\u00C2': 'A', + '\u1EA6': 'A', + '\u1EA4': 'A', + '\u1EAA': 'A', + '\u1EA8': 'A', + '\u00C3': 'A', + '\u0100': 'A', + '\u0102': 'A', + '\u1EB0': 'A', + '\u1EAE': 'A', + '\u1EB4': 'A', + '\u1EB2': 'A', + '\u0226': 'A', + '\u01E0': 'A', + '\u00C4': 'A', + '\u01DE': 'A', + '\u1EA2': 'A', + '\u00C5': 'A', + '\u01FA': 'A', + '\u01CD': 'A', + '\u0200': 'A', + '\u0202': 'A', + '\u1EA0': 'A', + '\u1EAC': 'A', + '\u1EB6': 'A', + '\u1E00': 'A', + '\u0104': 'A', + '\u023A': 'A', + '\u2C6F': 'A', + '\uA732': 'AA', + '\u00C6': 'AE', + '\u01FC': 'AE', + '\u01E2': 'AE', + '\uA734': 'AO', + '\uA736': 'AU', + '\uA738': 'AV', + '\uA73A': 'AV', + '\uA73C': 'AY', + '\u24B7': 'B', + '\uFF22': 'B', + '\u1E02': 'B', + '\u1E04': 'B', + '\u1E06': 'B', + '\u0243': 'B', + '\u0182': 'B', + '\u0181': 'B', + '\u24B8': 'C', + '\uFF23': 'C', + '\u0106': 'C', + '\u0108': 'C', + '\u010A': 'C', + '\u010C': 'C', + '\u00C7': 'C', + '\u1E08': 'C', + '\u0187': 'C', + '\u023B': 'C', + '\uA73E': 'C', + '\u24B9': 'D', + '\uFF24': 'D', + '\u1E0A': 'D', + '\u010E': 'D', + '\u1E0C': 'D', + '\u1E10': 'D', + '\u1E12': 'D', + '\u1E0E': 'D', + '\u0110': 'D', + '\u018B': 'D', + '\u018A': 'D', + '\u0189': 'D', + '\uA779': 'D', + '\u01F1': 'DZ', + '\u01C4': 'DZ', + '\u01F2': 'Dz', + '\u01C5': 'Dz', + '\u24BA': 'E', + '\uFF25': 'E', + '\u00C8': 'E', + '\u00C9': 'E', + '\u00CA': 'E', + '\u1EC0': 'E', + '\u1EBE': 'E', + '\u1EC4': 'E', + '\u1EC2': 'E', + '\u1EBC': 'E', + '\u0112': 'E', + '\u1E14': 'E', + '\u1E16': 'E', + '\u0114': 'E', + '\u0116': 'E', + '\u00CB': 'E', + '\u1EBA': 'E', + '\u011A': 'E', + '\u0204': 'E', + '\u0206': 'E', + '\u1EB8': 'E', + '\u1EC6': 'E', + '\u0228': 'E', + '\u1E1C': 'E', + '\u0118': 'E', + '\u1E18': 'E', + '\u1E1A': 'E', + '\u0190': 'E', + '\u018E': 'E', + '\u24BB': 'F', + '\uFF26': 'F', + '\u1E1E': 'F', + '\u0191': 'F', + '\uA77B': 'F', + '\u24BC': 'G', + '\uFF27': 'G', + '\u01F4': 'G', + '\u011C': 'G', + '\u1E20': 'G', + '\u011E': 'G', + '\u0120': 'G', + '\u01E6': 'G', + '\u0122': 'G', + '\u01E4': 'G', + '\u0193': 'G', + '\uA7A0': 'G', + '\uA77D': 'G', + '\uA77E': 'G', + '\u24BD': 'H', + '\uFF28': 'H', + '\u0124': 'H', + '\u1E22': 'H', + '\u1E26': 'H', + '\u021E': 'H', + '\u1E24': 'H', + '\u1E28': 'H', + '\u1E2A': 'H', + '\u0126': 'H', + '\u2C67': 'H', + '\u2C75': 'H', + '\uA78D': 'H', + '\u24BE': 'I', + '\uFF29': 'I', + '\u00CC': 'I', + '\u00CD': 'I', + '\u00CE': 'I', + '\u0128': 'I', + '\u012A': 'I', + '\u012C': 'I', + '\u0130': 'I', + '\u00CF': 'I', + '\u1E2E': 'I', + '\u1EC8': 'I', + '\u01CF': 'I', + '\u0208': 'I', + '\u020A': 'I', + '\u1ECA': 'I', + '\u012E': 'I', + '\u1E2C': 'I', + '\u0197': 'I', + '\u24BF': 'J', + '\uFF2A': 'J', + '\u0134': 'J', + '\u0248': 'J', + '\u24C0': 'K', + '\uFF2B': 'K', + '\u1E30': 'K', + '\u01E8': 'K', + '\u1E32': 'K', + '\u0136': 'K', + '\u1E34': 'K', + '\u0198': 'K', + '\u2C69': 'K', + '\uA740': 'K', + '\uA742': 'K', + '\uA744': 'K', + '\uA7A2': 'K', + '\u24C1': 'L', + '\uFF2C': 'L', + '\u013F': 'L', + '\u0139': 'L', + '\u013D': 'L', + '\u1E36': 'L', + '\u1E38': 'L', + '\u013B': 'L', + '\u1E3C': 'L', + '\u1E3A': 'L', + '\u0141': 'L', + '\u023D': 'L', + '\u2C62': 'L', + '\u2C60': 'L', + '\uA748': 'L', + '\uA746': 'L', + '\uA780': 'L', + '\u01C7': 'LJ', + '\u01C8': 'Lj', + '\u24C2': 'M', + '\uFF2D': 'M', + '\u1E3E': 'M', + '\u1E40': 'M', + '\u1E42': 'M', + '\u2C6E': 'M', + '\u019C': 'M', + '\u24C3': 'N', + '\uFF2E': 'N', + '\u01F8': 'N', + '\u0143': 'N', + '\u00D1': 'N', + '\u1E44': 'N', + '\u0147': 'N', + '\u1E46': 'N', + '\u0145': 'N', + '\u1E4A': 'N', + '\u1E48': 'N', + '\u0220': 'N', + '\u019D': 'N', + '\uA790': 'N', + '\uA7A4': 'N', + '\u01CA': 'NJ', + '\u01CB': 'Nj', + '\u24C4': 'O', + '\uFF2F': 'O', + '\u00D2': 'O', + '\u00D3': 'O', + '\u00D4': 'O', + '\u1ED2': 'O', + '\u1ED0': 'O', + '\u1ED6': 'O', + '\u1ED4': 'O', + '\u00D5': 'O', + '\u1E4C': 'O', + '\u022C': 'O', + '\u1E4E': 'O', + '\u014C': 'O', + '\u1E50': 'O', + '\u1E52': 'O', + '\u014E': 'O', + '\u022E': 'O', + '\u0230': 'O', + '\u00D6': 'O', + '\u022A': 'O', + '\u1ECE': 'O', + '\u0150': 'O', + '\u01D1': 'O', + '\u020C': 'O', + '\u020E': 'O', + '\u01A0': 'O', + '\u1EDC': 'O', + '\u1EDA': 'O', + '\u1EE0': 'O', + '\u1EDE': 'O', + '\u1EE2': 'O', + '\u1ECC': 'O', + '\u1ED8': 'O', + '\u01EA': 'O', + '\u01EC': 'O', + '\u00D8': 'O', + '\u01FE': 'O', + '\u0186': 'O', + '\u019F': 'O', + '\uA74A': 'O', + '\uA74C': 'O', + '\u01A2': 'OI', + '\uA74E': 'OO', + '\u0222': 'OU', + '\u24C5': 'P', + '\uFF30': 'P', + '\u1E54': 'P', + '\u1E56': 'P', + '\u01A4': 'P', + '\u2C63': 'P', + '\uA750': 'P', + '\uA752': 'P', + '\uA754': 'P', + '\u24C6': 'Q', + '\uFF31': 'Q', + '\uA756': 'Q', + '\uA758': 'Q', + '\u024A': 'Q', + '\u24C7': 'R', + '\uFF32': 'R', + '\u0154': 'R', + '\u1E58': 'R', + '\u0158': 'R', + '\u0210': 'R', + '\u0212': 'R', + '\u1E5A': 'R', + '\u1E5C': 'R', + '\u0156': 'R', + '\u1E5E': 'R', + '\u024C': 'R', + '\u2C64': 'R', + '\uA75A': 'R', + '\uA7A6': 'R', + '\uA782': 'R', + '\u24C8': 'S', + '\uFF33': 'S', + '\u1E9E': 'S', + '\u015A': 'S', + '\u1E64': 'S', + '\u015C': 'S', + '\u1E60': 'S', + '\u0160': 'S', + '\u1E66': 'S', + '\u1E62': 'S', + '\u1E68': 'S', + '\u0218': 'S', + '\u015E': 'S', + '\u2C7E': 'S', + '\uA7A8': 'S', + '\uA784': 'S', + '\u24C9': 'T', + '\uFF34': 'T', + '\u1E6A': 'T', + '\u0164': 'T', + '\u1E6C': 'T', + '\u021A': 'T', + '\u0162': 'T', + '\u1E70': 'T', + '\u1E6E': 'T', + '\u0166': 'T', + '\u01AC': 'T', + '\u01AE': 'T', + '\u023E': 'T', + '\uA786': 'T', + '\uA728': 'TZ', + '\u24CA': 'U', + '\uFF35': 'U', + '\u00D9': 'U', + '\u00DA': 'U', + '\u00DB': 'U', + '\u0168': 'U', + '\u1E78': 'U', + '\u016A': 'U', + '\u1E7A': 'U', + '\u016C': 'U', + '\u00DC': 'U', + '\u01DB': 'U', + '\u01D7': 'U', + '\u01D5': 'U', + '\u01D9': 'U', + '\u1EE6': 'U', + '\u016E': 'U', + '\u0170': 'U', + '\u01D3': 'U', + '\u0214': 'U', + '\u0216': 'U', + '\u01AF': 'U', + '\u1EEA': 'U', + '\u1EE8': 'U', + '\u1EEE': 'U', + '\u1EEC': 'U', + '\u1EF0': 'U', + '\u1EE4': 'U', + '\u1E72': 'U', + '\u0172': 'U', + '\u1E76': 'U', + '\u1E74': 'U', + '\u0244': 'U', + '\u24CB': 'V', + '\uFF36': 'V', + '\u1E7C': 'V', + '\u1E7E': 'V', + '\u01B2': 'V', + '\uA75E': 'V', + '\u0245': 'V', + '\uA760': 'VY', + '\u24CC': 'W', + '\uFF37': 'W', + '\u1E80': 'W', + '\u1E82': 'W', + '\u0174': 'W', + '\u1E86': 'W', + '\u1E84': 'W', + '\u1E88': 'W', + '\u2C72': 'W', + '\u24CD': 'X', + '\uFF38': 'X', + '\u1E8A': 'X', + '\u1E8C': 'X', + '\u24CE': 'Y', + '\uFF39': 'Y', + '\u1EF2': 'Y', + '\u00DD': 'Y', + '\u0176': 'Y', + '\u1EF8': 'Y', + '\u0232': 'Y', + '\u1E8E': 'Y', + '\u0178': 'Y', + '\u1EF6': 'Y', + '\u1EF4': 'Y', + '\u01B3': 'Y', + '\u024E': 'Y', + '\u1EFE': 'Y', + '\u24CF': 'Z', + '\uFF3A': 'Z', + '\u0179': 'Z', + '\u1E90': 'Z', + '\u017B': 'Z', + '\u017D': 'Z', + '\u1E92': 'Z', + '\u1E94': 'Z', + '\u01B5': 'Z', + '\u0224': 'Z', + '\u2C7F': 'Z', + '\u2C6B': 'Z', + '\uA762': 'Z', + '\u24D0': 'a', + '\uFF41': 'a', + '\u1E9A': 'a', + '\u00E0': 'a', + '\u00E1': 'a', + '\u00E2': 'a', + '\u1EA7': 'a', + '\u1EA5': 'a', + '\u1EAB': 'a', + '\u1EA9': 'a', + '\u00E3': 'a', + '\u0101': 'a', + '\u0103': 'a', + '\u1EB1': 'a', + '\u1EAF': 'a', + '\u1EB5': 'a', + '\u1EB3': 'a', + '\u0227': 'a', + '\u01E1': 'a', + '\u00E4': 'a', + '\u01DF': 'a', + '\u1EA3': 'a', + '\u00E5': 'a', + '\u01FB': 'a', + '\u01CE': 'a', + '\u0201': 'a', + '\u0203': 'a', + '\u1EA1': 'a', + '\u1EAD': 'a', + '\u1EB7': 'a', + '\u1E01': 'a', + '\u0105': 'a', + '\u2C65': 'a', + '\u0250': 'a', + '\uA733': 'aa', + '\u00E6': 'ae', + '\u01FD': 'ae', + '\u01E3': 'ae', + '\uA735': 'ao', + '\uA737': 'au', + '\uA739': 'av', + '\uA73B': 'av', + '\uA73D': 'ay', + '\u24D1': 'b', + '\uFF42': 'b', + '\u1E03': 'b', + '\u1E05': 'b', + '\u1E07': 'b', + '\u0180': 'b', + '\u0183': 'b', + '\u0253': 'b', + '\u24D2': 'c', + '\uFF43': 'c', + '\u0107': 'c', + '\u0109': 'c', + '\u010B': 'c', + '\u010D': 'c', + '\u00E7': 'c', + '\u1E09': 'c', + '\u0188': 'c', + '\u023C': 'c', + '\uA73F': 'c', + '\u2184': 'c', + '\u24D3': 'd', + '\uFF44': 'd', + '\u1E0B': 'd', + '\u010F': 'd', + '\u1E0D': 'd', + '\u1E11': 'd', + '\u1E13': 'd', + '\u1E0F': 'd', + '\u0111': 'd', + '\u018C': 'd', + '\u0256': 'd', + '\u0257': 'd', + '\uA77A': 'd', + '\u01F3': 'dz', + '\u01C6': 'dz', + '\u24D4': 'e', + '\uFF45': 'e', + '\u00E8': 'e', + '\u00E9': 'e', + '\u00EA': 'e', + '\u1EC1': 'e', + '\u1EBF': 'e', + '\u1EC5': 'e', + '\u1EC3': 'e', + '\u1EBD': 'e', + '\u0113': 'e', + '\u1E15': 'e', + '\u1E17': 'e', + '\u0115': 'e', + '\u0117': 'e', + '\u00EB': 'e', + '\u1EBB': 'e', + '\u011B': 'e', + '\u0205': 'e', + '\u0207': 'e', + '\u1EB9': 'e', + '\u1EC7': 'e', + '\u0229': 'e', + '\u1E1D': 'e', + '\u0119': 'e', + '\u1E19': 'e', + '\u1E1B': 'e', + '\u0247': 'e', + '\u025B': 'e', + '\u01DD': 'e', + '\u24D5': 'f', + '\uFF46': 'f', + '\u1E1F': 'f', + '\u0192': 'f', + '\uA77C': 'f', + '\u24D6': 'g', + '\uFF47': 'g', + '\u01F5': 'g', + '\u011D': 'g', + '\u1E21': 'g', + '\u011F': 'g', + '\u0121': 'g', + '\u01E7': 'g', + '\u0123': 'g', + '\u01E5': 'g', + '\u0260': 'g', + '\uA7A1': 'g', + '\u1D79': 'g', + '\uA77F': 'g', + '\u24D7': 'h', + '\uFF48': 'h', + '\u0125': 'h', + '\u1E23': 'h', + '\u1E27': 'h', + '\u021F': 'h', + '\u1E25': 'h', + '\u1E29': 'h', + '\u1E2B': 'h', + '\u1E96': 'h', + '\u0127': 'h', + '\u2C68': 'h', + '\u2C76': 'h', + '\u0265': 'h', + '\u0195': 'hv', + '\u24D8': 'i', + '\uFF49': 'i', + '\u00EC': 'i', + '\u00ED': 'i', + '\u00EE': 'i', + '\u0129': 'i', + '\u012B': 'i', + '\u012D': 'i', + '\u00EF': 'i', + '\u1E2F': 'i', + '\u1EC9': 'i', + '\u01D0': 'i', + '\u0209': 'i', + '\u020B': 'i', + '\u1ECB': 'i', + '\u012F': 'i', + '\u1E2D': 'i', + '\u0268': 'i', + '\u0131': 'i', + '\u24D9': 'j', + '\uFF4A': 'j', + '\u0135': 'j', + '\u01F0': 'j', + '\u0249': 'j', + '\u24DA': 'k', + '\uFF4B': 'k', + '\u1E31': 'k', + '\u01E9': 'k', + '\u1E33': 'k', + '\u0137': 'k', + '\u1E35': 'k', + '\u0199': 'k', + '\u2C6A': 'k', + '\uA741': 'k', + '\uA743': 'k', + '\uA745': 'k', + '\uA7A3': 'k', + '\u24DB': 'l', + '\uFF4C': 'l', + '\u0140': 'l', + '\u013A': 'l', + '\u013E': 'l', + '\u1E37': 'l', + '\u1E39': 'l', + '\u013C': 'l', + '\u1E3D': 'l', + '\u1E3B': 'l', + '\u017F': 'l', + '\u0142': 'l', + '\u019A': 'l', + '\u026B': 'l', + '\u2C61': 'l', + '\uA749': 'l', + '\uA781': 'l', + '\uA747': 'l', + '\u01C9': 'lj', + '\u24DC': 'm', + '\uFF4D': 'm', + '\u1E3F': 'm', + '\u1E41': 'm', + '\u1E43': 'm', + '\u0271': 'm', + '\u026F': 'm', + '\u24DD': 'n', + '\uFF4E': 'n', + '\u01F9': 'n', + '\u0144': 'n', + '\u00F1': 'n', + '\u1E45': 'n', + '\u0148': 'n', + '\u1E47': 'n', + '\u0146': 'n', + '\u1E4B': 'n', + '\u1E49': 'n', + '\u019E': 'n', + '\u0272': 'n', + '\u0149': 'n', + '\uA791': 'n', + '\uA7A5': 'n', + '\u01CC': 'nj', + '\u24DE': 'o', + '\uFF4F': 'o', + '\u00F2': 'o', + '\u00F3': 'o', + '\u00F4': 'o', + '\u1ED3': 'o', + '\u1ED1': 'o', + '\u1ED7': 'o', + '\u1ED5': 'o', + '\u00F5': 'o', + '\u1E4D': 'o', + '\u022D': 'o', + '\u1E4F': 'o', + '\u014D': 'o', + '\u1E51': 'o', + '\u1E53': 'o', + '\u014F': 'o', + '\u022F': 'o', + '\u0231': 'o', + '\u00F6': 'o', + '\u022B': 'o', + '\u1ECF': 'o', + '\u0151': 'o', + '\u01D2': 'o', + '\u020D': 'o', + '\u020F': 'o', + '\u01A1': 'o', + '\u1EDD': 'o', + '\u1EDB': 'o', + '\u1EE1': 'o', + '\u1EDF': 'o', + '\u1EE3': 'o', + '\u1ECD': 'o', + '\u1ED9': 'o', + '\u01EB': 'o', + '\u01ED': 'o', + '\u00F8': 'o', + '\u01FF': 'o', + '\u0254': 'o', + '\uA74B': 'o', + '\uA74D': 'o', + '\u0275': 'o', + '\u01A3': 'oi', + '\u0223': 'ou', + '\uA74F': 'oo', + '\u24DF': 'p', + '\uFF50': 'p', + '\u1E55': 'p', + '\u1E57': 'p', + '\u01A5': 'p', + '\u1D7D': 'p', + '\uA751': 'p', + '\uA753': 'p', + '\uA755': 'p', + '\u24E0': 'q', + '\uFF51': 'q', + '\u024B': 'q', + '\uA757': 'q', + '\uA759': 'q', + '\u24E1': 'r', + '\uFF52': 'r', + '\u0155': 'r', + '\u1E59': 'r', + '\u0159': 'r', + '\u0211': 'r', + '\u0213': 'r', + '\u1E5B': 'r', + '\u1E5D': 'r', + '\u0157': 'r', + '\u1E5F': 'r', + '\u024D': 'r', + '\u027D': 'r', + '\uA75B': 'r', + '\uA7A7': 'r', + '\uA783': 'r', + '\u24E2': 's', + '\uFF53': 's', + '\u00DF': 's', + '\u015B': 's', + '\u1E65': 's', + '\u015D': 's', + '\u1E61': 's', + '\u0161': 's', + '\u1E67': 's', + '\u1E63': 's', + '\u1E69': 's', + '\u0219': 's', + '\u015F': 's', + '\u023F': 's', + '\uA7A9': 's', + '\uA785': 's', + '\u1E9B': 's', + '\u24E3': 't', + '\uFF54': 't', + '\u1E6B': 't', + '\u1E97': 't', + '\u0165': 't', + '\u1E6D': 't', + '\u021B': 't', + '\u0163': 't', + '\u1E71': 't', + '\u1E6F': 't', + '\u0167': 't', + '\u01AD': 't', + '\u0288': 't', + '\u2C66': 't', + '\uA787': 't', + '\uA729': 'tz', + '\u24E4': 'u', + '\uFF55': 'u', + '\u00F9': 'u', + '\u00FA': 'u', + '\u00FB': 'u', + '\u0169': 'u', + '\u1E79': 'u', + '\u016B': 'u', + '\u1E7B': 'u', + '\u016D': 'u', + '\u00FC': 'u', + '\u01DC': 'u', + '\u01D8': 'u', + '\u01D6': 'u', + '\u01DA': 'u', + '\u1EE7': 'u', + '\u016F': 'u', + '\u0171': 'u', + '\u01D4': 'u', + '\u0215': 'u', + '\u0217': 'u', + '\u01B0': 'u', + '\u1EEB': 'u', + '\u1EE9': 'u', + '\u1EEF': 'u', + '\u1EED': 'u', + '\u1EF1': 'u', + '\u1EE5': 'u', + '\u1E73': 'u', + '\u0173': 'u', + '\u1E77': 'u', + '\u1E75': 'u', + '\u0289': 'u', + '\u24E5': 'v', + '\uFF56': 'v', + '\u1E7D': 'v', + '\u1E7F': 'v', + '\u028B': 'v', + '\uA75F': 'v', + '\u028C': 'v', + '\uA761': 'vy', + '\u24E6': 'w', + '\uFF57': 'w', + '\u1E81': 'w', + '\u1E83': 'w', + '\u0175': 'w', + '\u1E87': 'w', + '\u1E85': 'w', + '\u1E98': 'w', + '\u1E89': 'w', + '\u2C73': 'w', + '\u24E7': 'x', + '\uFF58': 'x', + '\u1E8B': 'x', + '\u1E8D': 'x', + '\u24E8': 'y', + '\uFF59': 'y', + '\u1EF3': 'y', + '\u00FD': 'y', + '\u0177': 'y', + '\u1EF9': 'y', + '\u0233': 'y', + '\u1E8F': 'y', + '\u00FF': 'y', + '\u1EF7': 'y', + '\u1E99': 'y', + '\u1EF5': 'y', + '\u01B4': 'y', + '\u024F': 'y', + '\u1EFF': 'y', + '\u24E9': 'z', + '\uFF5A': 'z', + '\u017A': 'z', + '\u1E91': 'z', + '\u017C': 'z', + '\u017E': 'z', + '\u1E93': 'z', + '\u1E95': 'z', + '\u01B6': 'z', + '\u0225': 'z', + '\u0240': 'z', + '\u2C6C': 'z', + '\uA763': 'z', + '\u0386': '\u0391', + '\u0388': '\u0395', + '\u0389': '\u0397', + '\u038A': '\u0399', + '\u03AA': '\u0399', + '\u038C': '\u039F', + '\u038E': '\u03A5', + '\u03AB': '\u03A5', + '\u038F': '\u03A9', + '\u03AC': '\u03B1', + '\u03AD': '\u03B5', + '\u03AE': '\u03B7', + '\u03AF': '\u03B9', + '\u03CA': '\u03B9', + '\u0390': '\u03B9', + '\u03CC': '\u03BF', + '\u03CD': '\u03C5', + '\u03CB': '\u03C5', + '\u03B0': '\u03C5', + '\u03C9': '\u03C9', + '\u03C2': '\u03C3' +}; +var OptionList = /** @class */ (function () { + /** + * @param {?} options + */ + function OptionList(options) { + this._highlightedOption = null; + if (typeof options === 'undefined' || options === null) { + options = []; + } + this._options = options.map(function (option) { + var o = new Option(option); + if (option.disabled) { + o.disabled = true; + } + return o; + }); + this._hasShown = this._options.length > 0; + this.highlight(); + } + Object.defineProperty(OptionList.prototype, "hasShown", { + /** + * @return {?} + */ + get: function () { + return this._hasShown; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(OptionList.prototype, "hasSelected", { + /** + * @return {?} + */ + get: function () { + return this._hasSelected; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(OptionList.prototype, "options", { + /** + * Options. * + * @return {?} + */ + get: function () { + return this._options; + }, + enumerable: true, + configurable: true + }); + /** + * @param {?} value + * @return {?} + */ + OptionList.prototype.getOptionsByValue = function (value) { + return this.options.filter(function (option) { + return option.value === value; + }); + }; + Object.defineProperty(OptionList.prototype, "value", { + /** + * Value. * + * @return {?} + */ + get: function () { + return this.selection.map(function (option) { return option.value; }); + }, + /** + * @param {?} v + * @return {?} + */ + set: function (v) { + v = typeof v === 'undefined' || v === null ? [] : v; + this.options.forEach(function (option) { + option.selected = v.indexOf(option.value) > -1; + }); + this.updateHasSelected(); + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(OptionList.prototype, "selection", { + /** + * Selection. * + * @return {?} + */ + get: function () { + return this.options.filter(function (option) { return option.selected; }); + }, + enumerable: true, + configurable: true + }); + /** + * @param {?} option + * @param {?} multiple + * @return {?} + */ + OptionList.prototype.select = function (option, multiple) { + if (!multiple) { + this.clearSelection(); + } + option.selected = true; + this.updateHasSelected(); + }; + /** + * @param {?} option + * @return {?} + */ + OptionList.prototype.deselect = function (option) { + option.selected = false; + this.updateHasSelected(); + }; + /** + * @return {?} + */ + OptionList.prototype.clearSelection = function () { + this.options.forEach(function (option) { + option.selected = false; + }); + this._hasSelected = false; + }; + /** + * @return {?} + */ + OptionList.prototype.updateHasSelected = function () { + this._hasSelected = this.options.some(function (option) { return option.selected; }); + }; + Object.defineProperty(OptionList.prototype, "filtered", { + /** + * Filter. * + * @return {?} + */ + get: function () { + return this.options.filter(function (option) { return option.shown; }); + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(OptionList.prototype, "filteredEnabled", { + /** + * @return {?} + */ + get: function () { + return this.options.filter(function (option) { return option.shown && !option.disabled; }); + }, + enumerable: true, + configurable: true + }); + /** + * @param {?} term + * @return {?} + */ + OptionList.prototype.filter = function (term) { + var /** @type {?} */ anyShown = false; + if (term.trim() === '') { + this.resetFilter(); + anyShown = this.options.length > 0; + } + else { + this.options.forEach(function (option) { + var /** @type {?} */ l = Diacritics.strip(option.label).toUpperCase(); + var /** @type {?} */ t = Diacritics.strip(term).toUpperCase(); + option.shown = l.indexOf(t) > -1; + if (option.shown) { + anyShown = true; + } + }); + } + this.highlight(); + this._hasShown = anyShown; + return anyShown; + }; + /** + * @return {?} + */ + OptionList.prototype.resetFilter = function () { + this.options.forEach(function (option) { + option.shown = true; + }); + }; + Object.defineProperty(OptionList.prototype, "highlightedOption", { + /** + * Highlight. * + * @return {?} + */ + get: function () { + return this._highlightedOption; + }, + enumerable: true, + configurable: true + }); + /** + * @return {?} + */ + OptionList.prototype.highlight = function () { + var /** @type {?} */ option = this.hasShownSelected() ? + this.getFirstShownSelected() : this.getFirstShown(); + this.highlightOption(option); + }; + /** + * @param {?} option + * @return {?} + */ + OptionList.prototype.highlightOption = function (option) { + this.clearHighlightedOption(); + if (option !== null) { + option.highlighted = true; + this._highlightedOption = option; + } + }; + /** + * @return {?} + */ + OptionList.prototype.highlightNextOption = function () { + var /** @type {?} */ shownEnabledOptions = this.filteredEnabled; + var /** @type {?} */ index = this.getHighlightedIndexFromList(shownEnabledOptions); + if (index > -1 && index < shownEnabledOptions.length - 1) { + this.highlightOption(shownEnabledOptions[index + 1]); + } + }; + /** + * @return {?} + */ + OptionList.prototype.highlightPreviousOption = function () { + var /** @type {?} */ shownEnabledOptions = this.filteredEnabled; + var /** @type {?} */ index = this.getHighlightedIndexFromList(shownEnabledOptions); + if (index > 0) { + this.highlightOption(shownEnabledOptions[index - 1]); + } + }; + /** + * @return {?} + */ + OptionList.prototype.clearHighlightedOption = function () { + if (this.highlightedOption !== null) { + this.highlightedOption.highlighted = false; + this._highlightedOption = null; + } + }; + /** + * @param {?} options + * @return {?} + */ + OptionList.prototype.getHighlightedIndexFromList = function (options) { + for (var /** @type {?} */ i = 0; i < options.length; i++) { + if (options[i].highlighted) { + return i; + } + } + return -1; + }; + /** + * @return {?} + */ + OptionList.prototype.getHighlightedIndex = function () { + return this.getHighlightedIndexFromList(this.filtered); + }; + /** + * Util. * + * @return {?} + */ + OptionList.prototype.hasShownSelected = function () { + return this.options.some(function (option) { + return option.shown && option.selected; + }); + }; + /** + * @return {?} + */ + OptionList.prototype.getFirstShown = function () { + for (var _i = 0, _a = this.options; _i < _a.length; _i++) { + var option = _a[_i]; + if (option.shown) { + return option; + } + } + return null; + }; + /** + * @return {?} + */ + OptionList.prototype.getFirstShownSelected = function () { + for (var _i = 0, _a = this.options; _i < _a.length; _i++) { + var option = _a[_i]; + if (option.shown && option.selected) { + return option; + } + } + return null; + }; + /** + * @param {?} v0 + * @param {?} v1 + * @return {?} + */ + OptionList.equalValues = function (v0, v1) { + if (v0.length !== v1.length) { + return false; + } + var /** @type {?} */ a = v0.slice().sort(); + var /** @type {?} */ b = v1.slice().sort(); + return a.every(function (v, i) { + return v === b[i]; + }); + }; + return OptionList; +}()); +var SELECT_VALUE_ACCESSOR = { + provide: forms.NG_VALUE_ACCESSOR, + useExisting: core.forwardRef(function () { return SelectComponent; }), + multi: true +}; +var SelectComponent = /** @class */ (function () { + /** + * @param {?} hostElement + */ + function SelectComponent(hostElement) { + this.hostElement = hostElement; + // Data input. + this.options = []; + // Functionality settings. + this.allowClear = false; + this.disabled = false; + this.multiple = false; + this.noFilter = 0; + // Text settings. + this.notFoundMsg = 'No results found'; + this.placeholder = ''; + this.filterPlaceholder = ''; + this.label = ''; + // Output events. + this.opened = new core.EventEmitter(); + this.closed = new core.EventEmitter(); + this.selected = new core.EventEmitter(); + this.deselected = new core.EventEmitter(); + this.focus = new core.EventEmitter(); + this.blur = new core.EventEmitter(); + this.noOptionsFound = new core.EventEmitter(); + this._value = []; + this.optionList = new OptionList([]); + // View state variables. + this.hasFocus = false; + this.isOpen = false; + this.isBelow = true; + this.filterEnabled = true; + this.filterInputWidth = 1; + this.isDisabled = false; + this.placeholderView = ''; + this.clearClicked = false; + this.selectContainerClicked = false; + this.optionListClicked = false; + this.optionClicked = false; + this.onChange = function (_) { }; + this.onTouched = function () { }; + /** + * Keys. * + */ + this.KEYS = { + BACKSPACE: 8, + TAB: 9, + ENTER: 13, + ESC: 27, + SPACE: 32, + UP: 38, + DOWN: 40 + }; + } + /** + * Event handlers. * + * @return {?} + */ + SelectComponent.prototype.ngOnInit = function () { + this.placeholderView = this.placeholder; + }; + /** + * @param {?} changes + * @return {?} + */ + SelectComponent.prototype.ngOnChanges = function (changes) { + this.handleInputChanges(changes); + }; + /** + * @return {?} + */ + SelectComponent.prototype.ngAfterViewInit = function () { + this.updateState(); + }; + /** + * @return {?} + */ + SelectComponent.prototype.onWindowBlur = function () { + this._blur(); + }; + /** + * @return {?} + */ + SelectComponent.prototype.onWindowClick = function () { + if (!this.selectContainerClicked && + (!this.optionListClicked || (this.optionListClicked && this.optionClicked))) { + this.closeDropdown(this.optionClicked); + if (!this.optionClicked) { + this._blur(); + } + } + this.clearClicked = false; + this.selectContainerClicked = false; + this.optionListClicked = false; + this.optionClicked = false; + }; + /** + * @return {?} + */ + SelectComponent.prototype.onWindowResize = function () { + this.updateWidth(); + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.onSelectContainerClick = function (event) { + this.selectContainerClicked = true; + if (!this.clearClicked) { + this.toggleDropdown(); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype.onSelectContainerFocus = function () { + this._focus(); + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.onSelectContainerKeydown = function (event) { + this.handleSelectContainerKeydown(event); + }; + /** + * @return {?} + */ + SelectComponent.prototype.onOptionsListClick = function () { + this.optionListClicked = true; + }; + /** + * @param {?} option + * @return {?} + */ + SelectComponent.prototype.onDropdownOptionClicked = function (option) { + this.optionClicked = true; + this.multiple ? this.toggleSelectOption(option) : this.selectOption(option); + }; + /** + * @return {?} + */ + SelectComponent.prototype.onSingleFilterClick = function () { + this.selectContainerClicked = true; + }; + /** + * @return {?} + */ + SelectComponent.prototype.onSingleFilterFocus = function () { + this._focus(); + }; + /** + * @param {?} term + * @return {?} + */ + SelectComponent.prototype.onFilterInput = function (term) { + this.filter(term); + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.onSingleFilterKeydown = function (event) { + this.handleSingleFilterKeydown(event); + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.onMultipleFilterKeydown = function (event) { + this.handleMultipleFilterKeydown(event); + }; + /** + * @return {?} + */ + SelectComponent.prototype.onMultipleFilterFocus = function () { + this._focus(); + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.onClearSelectionClick = function (event) { + this.clearClicked = true; + this.clearSelection(); + this.closeDropdown(true); + }; + /** + * @param {?} option + * @return {?} + */ + SelectComponent.prototype.onDeselectOptionClick = function (option) { + this.clearClicked = true; + this.deselectOption(option); + }; + /** + * @return {?} + */ + SelectComponent.prototype.open = function () { + this.openDropdown(); + }; + /** + * @return {?} + */ + SelectComponent.prototype.close = function () { + this.closeDropdown(false); + }; + /** + * @return {?} + */ + SelectComponent.prototype.clear = function () { + this.clearSelection(); + }; + /** + * @param {?} value + * @return {?} + */ + SelectComponent.prototype.select = function (value) { + this.writeValue(value); + }; + /** + * ControlValueAccessor interface methods. * + * @param {?} value + * @return {?} + */ + SelectComponent.prototype.writeValue = function (value) { + this.value = value; + }; + /** + * @param {?} fn + * @return {?} + */ + SelectComponent.prototype.registerOnChange = function (fn) { + this.onChange = fn; + }; + /** + * @param {?} fn + * @return {?} + */ + SelectComponent.prototype.registerOnTouched = function (fn) { + this.onTouched = fn; + }; + /** + * @param {?} isDisabled + * @return {?} + */ + SelectComponent.prototype.setDisabledState = function (isDisabled) { + this.disabled = isDisabled; + }; + /** + * Input change handling. * + * @param {?} changes + * @return {?} + */ + SelectComponent.prototype.handleInputChanges = function (changes) { + var /** @type {?} */ optionsChanged = changes.hasOwnProperty('options'); + var /** @type {?} */ noFilterChanged = changes.hasOwnProperty('noFilter'); + var /** @type {?} */ placeholderChanged = changes.hasOwnProperty('placeholder'); + if (optionsChanged) { + this.updateOptionList(changes.options.currentValue); + this.updateState(); + } + if (optionsChanged || noFilterChanged) { + this.updateFilterEnabled(); + } + if (placeholderChanged) { + this.updateState(); + } + }; + /** + * @param {?} options + * @return {?} + */ + SelectComponent.prototype.updateOptionList = function (options) { + this.optionList = new OptionList(options); + this.optionList.value = this._value; + }; + /** + * @return {?} + */ + SelectComponent.prototype.updateFilterEnabled = function () { + this.filterEnabled = this.optionList.options.length >= this.noFilter; + }; + Object.defineProperty(SelectComponent.prototype, "value", { + /** + * Value. * + * @return {?} + */ + get: function () { + return this.multiple ? this._value : this._value[0]; + }, + /** + * @param {?} v + * @return {?} + */ + set: function (v) { + if (typeof v === 'undefined' || v === null || v === '') { + v = []; + } + else if (typeof v === 'string') { + v = [v]; + } + else if (!Array.isArray(v)) { + throw new TypeError('Value must be a string or an array.'); + } + this.optionList.value = v; + this._value = v; + this.updateState(); + }, + enumerable: true, + configurable: true + }); + /** + * @return {?} + */ + SelectComponent.prototype.valueChanged = function () { + this._value = this.optionList.value; + this.updateState(); + this.onChange(this.value); + }; + /** + * @return {?} + */ + SelectComponent.prototype.updateState = function () { + var _this = this; + this.placeholderView = this.optionList.hasSelected ? '' : this.placeholder; + setTimeout(function () { + _this.updateFilterWidth(); + }); + }; + /** + * Select. * + * @param {?} option + * @return {?} + */ + SelectComponent.prototype.selectOption = function (option) { + if (!option.selected && !option.disabled) { + this.optionList.select(option, this.multiple); + this.valueChanged(); + this.selected.emit(option.wrappedOption); + } + }; + /** + * @param {?} option + * @return {?} + */ + SelectComponent.prototype.deselectOption = function (option) { + var _this = this; + if (option.selected) { + this.optionList.deselect(option); + this.valueChanged(); + this.deselected.emit(option.wrappedOption); + setTimeout(function () { + if (_this.multiple) { + _this.updatePosition(); + _this.optionList.highlight(); + if (_this.isOpen) { + _this.dropdown.moveHighlightedIntoView(); + } + } + }); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype.clearSelection = function () { + var /** @type {?} */ selection = this.optionList.selection; + if (selection.length > 0) { + this.optionList.clearSelection(); + this.valueChanged(); + if (selection.length === 1) { + this.deselected.emit(selection[0].wrappedOption); + } + else { + this.deselected.emit(selection.map(function (option) { return option.wrappedOption; })); + } + } + }; + /** + * @param {?} option + * @return {?} + */ + SelectComponent.prototype.toggleSelectOption = function (option) { + option.selected ? this.deselectOption(option) : this.selectOption(option); + }; + /** + * @return {?} + */ + SelectComponent.prototype.selectHighlightedOption = function () { + var /** @type {?} */ option = this.optionList.highlightedOption; + if (option !== null) { + this.selectOption(option); + this.closeDropdown(true); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype.deselectLast = function () { + var /** @type {?} */ sel = this.optionList.selection; + if (sel.length > 0) { + var /** @type {?} */ option = sel[sel.length - 1]; + this.deselectOption(option); + this.setMultipleFilterInput(option.label + ' '); + } + }; + /** + * Dropdown. * + * @return {?} + */ + SelectComponent.prototype.toggleDropdown = function () { + if (!this.isDisabled) { + this.isOpen ? this.closeDropdown(true) : this.openDropdown(); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype.openDropdown = function () { + if (!this.isOpen) { + this.updateWidth(); + this.updatePosition(); + this.isOpen = true; + if (this.multiple && this.filterEnabled) { + this.filterInput.nativeElement.focus(); + } + this.opened.emit(null); + } + }; + /** + * @param {?} focus + * @return {?} + */ + SelectComponent.prototype.closeDropdown = function (focus) { + if (this.isOpen) { + this.clearFilterInput(); + this.updateFilterWidth(); + this.isOpen = false; + if (focus) { + this._focusSelectContainer(); + } + this.closed.emit(null); + } + }; + /** + * Filter. * + * @param {?} term + * @return {?} + */ + SelectComponent.prototype.filter = function (term) { + var _this = this; + if (this.multiple) { + if (!this.isOpen) { + this.openDropdown(); + } + this.updateFilterWidth(); + } + setTimeout(function () { + var /** @type {?} */ hasShown = _this.optionList.filter(term); + if (!hasShown) { + _this.noOptionsFound.emit(term); + } + }); + }; + /** + * @return {?} + */ + SelectComponent.prototype.clearFilterInput = function () { + if (this.multiple && this.filterEnabled) { + this.filterInput.nativeElement.value = ''; + } + }; + /** + * @param {?} value + * @return {?} + */ + SelectComponent.prototype.setMultipleFilterInput = function (value) { + if (this.filterEnabled) { + this.filterInput.nativeElement.value = value; + } + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.handleSelectContainerKeydown = function (event) { + var _this = this; + var /** @type {?} */ key = event.which; + if (this.isOpen) { + if (key === this.KEYS.ESC || (key === this.KEYS.UP && event.altKey)) { + this.closeDropdown(true); + } + else if (key === this.KEYS.TAB) { + this.closeDropdown(event.shiftKey); + this._blur(); + } + else if (key === this.KEYS.ENTER) { + this.selectHighlightedOption(); + } + else if (key === this.KEYS.UP) { + this.optionList.highlightPreviousOption(); + this.dropdown.moveHighlightedIntoView(); + if (!this.filterEnabled) { + event.preventDefault(); + } + } + else if (key === this.KEYS.DOWN) { + this.optionList.highlightNextOption(); + this.dropdown.moveHighlightedIntoView(); + if (!this.filterEnabled) { + event.preventDefault(); + } + } + } + else { + // DEPRICATED --> SPACE + if (key === this.KEYS.ENTER || key === this.KEYS.SPACE || + (key === this.KEYS.DOWN && event.altKey)) { + /* FIREFOX HACK: + * + * The setTimeout is added to prevent the enter keydown event + * to be triggered for the filter input field, which causes + * the dropdown to be closed again. + */ + setTimeout(function () { _this.openDropdown(); }); + } + else if (key === this.KEYS.TAB) { + this._blur(); + } + } + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.handleMultipleFilterKeydown = function (event) { + var /** @type {?} */ key = event.which; + if (key === this.KEYS.BACKSPACE) { + if (this.optionList.hasSelected && this.filterEnabled && + this.filterInput.nativeElement.value === '') { + this.deselectLast(); + } + } + }; + /** + * @param {?} event + * @return {?} + */ + SelectComponent.prototype.handleSingleFilterKeydown = function (event) { + var /** @type {?} */ key = event.which; + if (key === this.KEYS.ESC || key === this.KEYS.TAB + || key === this.KEYS.UP || key === this.KEYS.DOWN + || key === this.KEYS.ENTER) { + this.handleSelectContainerKeydown(event); + } + }; + /** + * View. * + * @return {?} + */ + SelectComponent.prototype._blur = function () { + if (this.hasFocus) { + this.hasFocus = false; + this.onTouched(); + this.blur.emit(null); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype._focus = function () { + if (!this.hasFocus) { + this.hasFocus = true; + this.focus.emit(null); + } + }; + /** + * @return {?} + */ + SelectComponent.prototype._focusSelectContainer = function () { + this.selectionSpan.nativeElement.focus(); + }; + /** + * @return {?} + */ + SelectComponent.prototype.updateWidth = function () { + this.width = this.selectionSpan.nativeElement.getBoundingClientRect().width; + }; + /** + * @return {?} + */ + SelectComponent.prototype.updatePosition = function () { + var /** @type {?} */ hostRect = this.hostElement.nativeElement.getBoundingClientRect(); + var /** @type {?} */ spanRect = this.selectionSpan.nativeElement.getBoundingClientRect(); + this.left = spanRect.left - hostRect.left; + this.top = (spanRect.top - hostRect.top) + spanRect.height; + }; + /** + * @return {?} + */ + SelectComponent.prototype.updateFilterWidth = function () { + if (typeof this.filterInput !== 'undefined') { + var /** @type {?} */ value = this.filterInput.nativeElement.value; + this.filterInputWidth = value.length === 0 ? + 1 + this.placeholderView.length * 10 : 1 + value.length * 10; + } + }; + return SelectComponent; +}()); +SelectComponent.decorators = [ + { type: core.Component, args: [{ + selector: 'ng-select', + template: "\n \n {{label}}\n \n \n\n
\n
\n \n {{optionList.selection[0].label}}\n
\n
\n {{placeholderView}}\n
\n
\n ✕\n
\n
\n ▲\n
\n
\n ▼\n
\n
\n\n
\n
\n \n ✕\n \n {{option.label}}\n
\n
\n {{placeholderView}}\n
\n \n
\n\n \n \n \n ", + styles: ["\n ng-select {\n display: inline-block;\n margin: 0;\n position: relative;\n vertical-align: middle;\n width: 100%; }\n ng-select * {\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n ng-select > div {\n border: 1px solid #ddd;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n width: 100%; }\n ng-select > div.disabled {\n background-color: #eee;\n color: #aaa;\n cursor: default;\n pointer-events: none; }\n ng-select > div > div.single {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n height: 30px;\n width: 100%; }\n ng-select > div > div.single > div.value,\n ng-select > div > div.single > div.placeholder {\n -webkit-box-flex: 1;\n -ms-flex: 1;\n flex: 1;\n line-height: 30px;\n overflow: hidden;\n padding: 0 10px;\n white-space: nowrap; }\n ng-select > div > div.single > div.placeholder {\n color: #757575; }\n ng-select > div > div.single > div.clear,\n ng-select > div > div.single > div.toggle {\n color: #aaa;\n line-height: 30px;\n text-align: center;\n width: 30px; }\n ng-select > div > div.single > div.clear:hover,\n ng-select > div > div.single > div.toggle:hover {\n background-color: #ececec; }\n ng-select > div > div.single > div.clear {\n font-size: 18px; }\n ng-select > div > div.single > div.toggle {\n font-size: 14px; }\n ng-select > div > div.multiple {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-flow: row wrap;\n flex-flow: row wrap;\n height: 100%;\n min-height: 30px;\n padding: 0 10px;\n width: 100%; }\n ng-select > div > div.multiple > div.option {\n background-color: #eee;\n border: 1px solid #aaa;\n border-radius: 4px;\n color: #333;\n cursor: default;\n display: inline-block;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n font-size: 14px;\n line-height: 22px;\n margin: 3px 5px 3px 0;\n padding: 0 4px; }\n ng-select > div > div.multiple > div.option span.deselect-option {\n color: #aaa;\n cursor: pointer;\n font-size: 14px;\n height: 20px;\n line-height: 20px; }\n ng-select > div > div.multiple > div.option span.deselect-option:hover {\n color: #555; }\n ng-select > div > div.multiple input {\n background-color: transparent;\n border: none;\n cursor: pointer;\n height: 30px;\n line-height: 30px;\n padding: 0; }\n ng-select > div > div.multiple input:focus {\n outline: none; }\n ng-select label {\n color: rgba(0, 0, 0, 0.38);\n display: block;\n font-size: 13px;\n padding: 4px 0; }\n "], + providers: [SELECT_VALUE_ACCESSOR], + encapsulation: core.ViewEncapsulation.None + },] }, +]; +/** + * @nocollapse + */ +SelectComponent.ctorParameters = function () { return [ + { type: core.ElementRef, }, +]; }; +SelectComponent.propDecorators = { + 'options': [{ type: core.Input },], + 'allowClear': [{ type: core.Input },], + 'disabled': [{ type: core.Input },], + 'multiple': [{ type: core.Input },], + 'noFilter': [{ type: core.Input },], + 'highlightColor': [{ type: core.Input },], + 'highlightTextColor': [{ type: core.Input },], + 'notFoundMsg': [{ type: core.Input },], + 'placeholder': [{ type: core.Input },], + 'filterPlaceholder': [{ type: core.Input },], + 'label': [{ type: core.Input },], + 'opened': [{ type: core.Output },], + 'closed': [{ type: core.Output },], + 'selected': [{ type: core.Output },], + 'deselected': [{ type: core.Output },], + 'focus': [{ type: core.Output },], + 'blur': [{ type: core.Output },], + 'noOptionsFound': [{ type: core.Output },], + 'selectionSpan': [{ type: core.ViewChild, args: ['selection',] },], + 'dropdown': [{ type: core.ViewChild, args: ['dropdown',] },], + 'filterInput': [{ type: core.ViewChild, args: ['filterInput',] },], + 'optionTemplate': [{ type: core.ContentChild, args: ['optionTemplate',] },], + 'onWindowBlur': [{ type: core.HostListener, args: ['window:blur',] },], + 'onWindowClick': [{ type: core.HostListener, args: ['window:click',] },], + 'onWindowResize': [{ type: core.HostListener, args: ['window:resize',] },], +}; +var SelectDropdownComponent = /** @class */ (function () { + function SelectDropdownComponent() { + this.optionClicked = new core.EventEmitter(); + this.optionsListClick = new core.EventEmitter(); + this.singleFilterClick = new core.EventEmitter(); + this.singleFilterFocus = new core.EventEmitter(); + this.singleFilterInput = new core.EventEmitter(); + this.singleFilterKeydown = new core.EventEmitter(); + this.disabledColor = '#fff'; + this.disabledTextColor = '9e9e9e'; + } + /** + * Event handlers. * + * @return {?} + */ + SelectDropdownComponent.prototype.ngOnInit = function () { + this.optionsReset(); + }; + /** + * @param {?} changes + * @return {?} + */ + SelectDropdownComponent.prototype.ngOnChanges = function (changes) { + if (changes.hasOwnProperty('optionList')) { + this.optionsReset(); + } + }; + /** + * @return {?} + */ + SelectDropdownComponent.prototype.ngAfterViewInit = function () { + this.moveHighlightedIntoView(); + if (!this.multiple && this.filterEnabled) { + this.filterInput.nativeElement.focus(); + } + }; + /** + * @return {?} + */ + SelectDropdownComponent.prototype.onOptionsListClick = function () { + this.optionsListClick.emit(null); + }; + /** + * @return {?} + */ + SelectDropdownComponent.prototype.onSingleFilterClick = function () { + this.singleFilterClick.emit(null); + }; + /** + * @param {?} event + * @return {?} + */ + SelectDropdownComponent.prototype.onSingleFilterInput = function (event) { + this.singleFilterInput.emit(event.target.value); + }; + /** + * @param {?} event + * @return {?} + */ + SelectDropdownComponent.prototype.onSingleFilterKeydown = function (event) { + this.singleFilterKeydown.emit(event); + }; + /** + * @return {?} + */ + SelectDropdownComponent.prototype.onSingleFilterFocus = function () { + this.singleFilterFocus.emit(null); + }; + /** + * @param {?} event + * @return {?} + */ + SelectDropdownComponent.prototype.onOptionsWheel = function (event) { + this.handleOptionsWheel(event); + }; + /** + * @param {?} option + * @return {?} + */ + SelectDropdownComponent.prototype.onOptionMouseover = function (option) { + this.optionList.highlightOption(option); + }; + /** + * @param {?} option + * @return {?} + */ + SelectDropdownComponent.prototype.onOptionClick = function (option) { + this.optionClicked.emit(option); + }; + /** + * Initialization. * + * @return {?} + */ + SelectDropdownComponent.prototype.optionsReset = function () { + this.optionList.filter(''); + this.optionList.highlight(); + }; + /** + * View. * + * @param {?} option + * @return {?} + */ + SelectDropdownComponent.prototype.getOptionStyle = function (option) { + if (option.highlighted) { + var /** @type {?} */ style = {}; + if (typeof this.highlightColor !== 'undefined') { + style['background-color'] = this.highlightColor; + } + if (typeof this.highlightTextColor !== 'undefined') { + style['color'] = this.highlightTextColor; + } + return style; + } + else { + return {}; + } + }; + /** + * @return {?} + */ + SelectDropdownComponent.prototype.moveHighlightedIntoView = function () { + var /** @type {?} */ list = this.optionsList.nativeElement; + var /** @type {?} */ listHeight = list.offsetHeight; + var /** @type {?} */ itemIndex = this.optionList.getHighlightedIndex(); + if (itemIndex > -1) { + var /** @type {?} */ item = list.children[0].children[itemIndex]; + var /** @type {?} */ itemHeight = item.offsetHeight; + var /** @type {?} */ itemTop = itemIndex * itemHeight; + var /** @type {?} */ itemBottom = itemTop + itemHeight; + var /** @type {?} */ viewTop = list.scrollTop; + var /** @type {?} */ viewBottom = viewTop + listHeight; + if (itemBottom > viewBottom) { + list.scrollTop = itemBottom - listHeight; + } + else if (itemTop < viewTop) { + list.scrollTop = itemTop; + } + } + }; + /** + * @param {?} e + * @return {?} + */ + SelectDropdownComponent.prototype.handleOptionsWheel = function (e) { + var /** @type {?} */ div = this.optionsList.nativeElement; + var /** @type {?} */ atTop = div.scrollTop === 0; + var /** @type {?} */ atBottom = div.offsetHeight + div.scrollTop === div.scrollHeight; + if (atTop && e.deltaY < 0) { + e.preventDefault(); + } + else if (atBottom && e.deltaY > 0) { + e.preventDefault(); + } + }; + return SelectDropdownComponent; +}()); +SelectDropdownComponent.decorators = [ + { type: core.Component, args: [{ + selector: 'select-dropdown', + template: "\n \n\n
\n \n
\n\n
\n \n
  • \n \n {{option.label}}\n
  • \n \n {{notFoundMsg}}\n \n \n
    \n \n ", + styles: ["\n select-dropdown {\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n select-dropdown * {\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n select-dropdown > div {\n background-color: #fff;\n border: 1px solid #ccc;\n border-top: none;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n position: absolute;\n z-index: 1; }\n select-dropdown > div .filter {\n padding: 3px;\n width: 100%; }\n select-dropdown > div .filter input {\n border: 1px solid #eee;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 4px;\n width: 100%; }\n select-dropdown > div .options {\n max-height: 200px;\n overflow-y: auto; }\n select-dropdown > div .options ul {\n list-style: none;\n margin: 0;\n padding: 0; }\n select-dropdown > div .options ul li {\n padding: 4px 8px;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n select-dropdown .selected {\n background-color: #e0e0e0; }\n select-dropdown .selected.highlighted {\n background-color: #2196F3;\n color: #fff; }\n select-dropdown .highlighted {\n background-color: #2196F3;\n color: #fff; }\n select-dropdown .disabled {\n background-color: #fff;\n color: #9e9e9e;\n cursor: default;\n pointer-events: none; }\n "], + encapsulation: core.ViewEncapsulation.None + },] }, +]; +/** + * @nocollapse + */ +SelectDropdownComponent.ctorParameters = function () { return []; }; +SelectDropdownComponent.propDecorators = { + 'filterEnabled': [{ type: core.Input },], + 'highlightColor': [{ type: core.Input },], + 'highlightTextColor': [{ type: core.Input },], + 'left': [{ type: core.Input },], + 'multiple': [{ type: core.Input },], + 'notFoundMsg': [{ type: core.Input },], + 'optionList': [{ type: core.Input },], + 'top': [{ type: core.Input },], + 'width': [{ type: core.Input },], + 'placeholder': [{ type: core.Input },], + 'optionTemplate': [{ type: core.Input },], + 'optionClicked': [{ type: core.Output },], + 'optionsListClick': [{ type: core.Output },], + 'singleFilterClick': [{ type: core.Output },], + 'singleFilterFocus': [{ type: core.Output },], + 'singleFilterInput': [{ type: core.Output },], + 'singleFilterKeydown': [{ type: core.Output },], + 'filterInput': [{ type: core.ViewChild, args: ['filterInput',] },], + 'optionsList': [{ type: core.ViewChild, args: ['optionsList',] },], +}; +var SelectModule = /** @class */ (function () { + function SelectModule() { + } + return SelectModule; +}()); +SelectModule.decorators = [ + { type: core.NgModule, args: [{ + declarations: [ + SelectComponent, + SelectDropdownComponent + ], + exports: [ + SelectComponent + ], + imports: [ + common.CommonModule, + forms.FormsModule + ] + },] }, +]; +/** + * @nocollapse + */ +SelectModule.ctorParameters = function () { return []; }; + +exports.SelectModule = SelectModule; +exports.SELECT_VALUE_ACCESSOR = SELECT_VALUE_ACCESSOR; +exports.SelectComponent = SelectComponent; +exports.ɵa = SelectDropdownComponent; + +Object.defineProperty(exports, '__esModule', { value: true }); + +}))); +//# sourceMappingURL=ng-select.umd.js.map diff --git a/src/app/ng-select/dist/bundles/ng-select.umd.js.map b/src/app/ng-select/dist/bundles/ng-select.umd.js.map new file mode 100644 index 0000000..8c01622 --- /dev/null +++ b/src/app/ng-select/dist/bundles/ng-select.umd.js.map @@ -0,0 +1 @@ +{"version":3,"file":"ng-select.umd.js","sources":["~/ng-select/ng-select.module.ts","~/ng-select/select-dropdown.component.ts","~/ng-select/select.component.ts","~/ng-select/option-list.ts","~/ng-select/diacritics.ts","~/ng-select/option.ts"],"sourcesContent":["import {NgModule} from '@angular/core';\nimport {CommonModule} from '@angular/common';\nimport {FormsModule} from '@angular/forms';\n\nimport {SelectComponent} from './select.component';\nimport {SelectDropdownComponent} from './select-dropdown.component';\n\nexport {IOption} from './option.interface';\nexport {SELECT_VALUE_ACCESSOR,SelectComponent} from './select.component';\nexport class SelectModule {static decorators: DecoratorInvocation[] = [\n{ type: NgModule, args: [{\n declarations: [\n SelectComponent,\n SelectDropdownComponent\n ],\n exports: [\n SelectComponent\n ],\n imports: [\n CommonModule,\n FormsModule\n ]\n}, ] },\n];\n/**\n * @nocollapse\n */\nstatic ctorParameters: () => ({type: any, decorators?: DecoratorInvocation[]}|null)[] = () => [\n];\n}\n\nfunction SelectModule_tsickle_Closure_declarations() {\n/** @type {?} */\nSelectModule.decorators;\n/**\n * @nocollapse\n * @type {?}\n */\nSelectModule.ctorParameters;\n}\n\n\ninterface DecoratorInvocation {\n type: Function;\n args?: any[];\n}\n","import {AfterViewInit, Component, EventEmitter, Input, OnChanges, OnInit, Output, ViewChild, TemplateRef, ViewEncapsulation} from '@angular/core';\nimport {Option} from './option';\nimport {OptionList} from './option-list';\nexport class SelectDropdownComponent\n implements AfterViewInit, OnChanges, OnInit {\n\n filterEnabled: boolean;\n highlightColor: string;\n highlightTextColor: string;\n left: number;\n multiple: boolean;\n notFoundMsg: string;\n optionList: OptionList;\n top: number;\n width: number;\n placeholder: string;\n optionTemplate: TemplateRef;\n\n optionClicked = new EventEmitter