select2-component - npm Package Compare versions

Comparing version 3.0.1 to 3.1.0

angular-variables.js

 "use strict";
-export var angularTemplateHtml = "<div [class]=\"containerStyle\"><div class=\"selection\" (click)=\"toggleOpenAndClose()\"><div [class]=\"selectionStyle\" role=\"combobox\"><span *ngIf=\"!multiple\" class=\"select2-selection__rendered\" [title]=\"option ? option.label : ''\"><ng-container *ngIf=\"option\">{{option.label}}</ng-container><span *ngIf=\"!option\" class=\"select2-selection__placeholder\">{{placeholder}}</span></span><span *ngIf=\"!multiple\" class=\"select2-selection__arrow\" role=\"presentation\"><b role=\"presentation\"></b></span><ul *ngIf=\"multiple\" class=\"select2-selection__rendered\"><li *ngFor=\"let op of option\" class=\"select2-selection__choice\" [title]=\"op.label\"><span (click)=\"removeSelection($event, op)\" class=\"select2-selection__choice__remove\" role=\"presentation\">\u00D7</span>{{op.label}}</li></ul></div></div><div [class]=\"dropdownStyle\"><div class=\"select2-dropdown select2-dropdown--below\"><div [class]=\"searchStyle\"><input #searchInput [(ngModel)]=\"searchText\" (keydown)=\"keyDown($event)\" (focusout)=\"focusout()\" class=\"select2-search__field\" type=\"search\" role=\"textbox\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\"></div><div class=\"select2-results\"><ul #results class=\"select2-results__options\" role=\"tree\" tabindex=\"-1\" (keydown)=\"keyDown($event)\" (focusout)=\"focusout()\"><ng-container *ngFor=\"let groupOrOption of filteredData\"><li *ngIf=\"groupOrOption.options\" class=\"select2-results__option\" role=\"group\"><strong class=\"select2-results__group\">{{groupOrOption.label}}</strong><ul class=\"select2-results__options select2-results__options--nested\"><li *ngFor=\"let option of groupOrOption.options\" [class]=\"getOptionStyle(option.value)\" role=\"treeitem\" [attr.aria-selected]=\"isSelected(option)\" [attr.aria-disabled]=\"isDisabled(option)\" (mouseenter)=\"mouseenter(option)\" (click)=\"click(option)\">{{option.label}}</li></ul></li><li *ngIf=\"!groupOrOption.options\" [class]=\"getOptionStyle(groupOrOption.value)\" role=\"treeitem\" [attr.aria-selected]=\"isSelected(groupOrOption)\" [attr.aria-disabled]=\"isDisabled(groupOrOption)\" (mouseenter)=\"mouseenter(groupOrOption)\" (click)=\"click(groupOrOption)\">{{groupOrOption.label}}</li></ng-container></ul></div></div></div></div>";
+export var angularTemplateHtml = "<div [class]=\"containerStyle\"><div class=\"selection\" #selection [attr.tabindex]=\"!this.isOpen ? tabIndex : '-1'\" (click)=\"toggleOpenAndClose()\" (focus)=\"focusin()\" (blur)=\"focusout()\" (keydown)=\"openKey($event)\" [class.select2-focused]=\"focused\"><div [class]=\"selectionStyle\" role=\"combobox\"><span *ngIf=\"!multiple\" class=\"select2-selection__rendered\" [title]=\"option ? option.label : ''\"><span *ngIf=\"!option\">&nbsp;</span><ng-container *ngIf=\"option\">{{option.label}}</ng-container><span [class.select2-selection__placeholder__option]=\"option\" class=\"select2-selection__placeholder\">{{placeholder}}</span></span><span *ngIf=\"!multiple\" class=\"select2-selection__arrow\" role=\"presentation\"><b role=\"presentation\"></b></span><ul *ngIf=\"multiple\" class=\"select2-selection__rendered\"><span [class.select2-selection__placeholder__option]=\"option?.length > 0\" class=\"select2-selection__placeholder\">{{placeholder}}</span><li *ngFor=\"let op of option\" class=\"select2-selection__choice\" [title]=\"op.label\"><span (click)=\"removeSelection($event, op)\" class=\"select2-selection__choice__remove\" role=\"presentation\">\u00D7</span>{{op.label}}</li></ul></div><div class=\"select2-subscript-wrapper\"><ng-content select=\"select2-hint\"></ng-content></div></div><div [class]=\"dropdownStyle\"><div class=\"select2-dropdown select2-dropdown--below\"><div [class]=\"searchStyle\"><input #searchInput [id]=\"id + '-search-field'\" [(value)]=\"searchText\" (keydown)=\"keyDown($event)\" (keyup)=\"searchUpdate($event)\" class=\"select2-search__field\" type=\"search\" role=\"textbox\" autocomplete=\"off\" autocorrect=\"off\" autocapitalize=\"off\" spellcheck=\"false\" [attr.tabindex]=\"this.isOpen ? tabIndex : '-1'\"></div><div class=\"select2-results\"><ul #results class=\"select2-results__options\" role=\"tree\" tabindex=\"-1\" (keydown)=\"keyDown($event)\"><ng-template ngFor [ngForOf]=\"filteredData\" let-groupOrOption><li *ngIf=\"groupOrOption.options\" class=\"select2-results__option\" role=\"group\"><strong [attr.class]=\"'select2-results__group' + (groupOrOption.classes ? ' ' + groupOrOption.classes : '')\">{{groupOrOption.label}}</strong><ul class=\"select2-results__options select2-results__options--nested\"><li *ngFor=\"let option of groupOrOption.options\" [class]=\"getOptionStyle(option)\" role=\"treeitem\" [attr.aria-selected]=\"isSelected(option)\" [attr.aria-disabled]=\"isDisabled(option)\" (mouseenter)=\"mouseenter(option)\" (click)=\"click(option)\">{{option.label}}</li></ul></li><li *ngIf=\"!groupOrOption.options\" [class]=\"getOptionStyle(groupOrOption)\" role=\"treeitem\" [attr.aria-selected]=\"isSelected(groupOrOption)\" [attr.aria-disabled]=\"isDisabled(groupOrOption)\" (mouseenter)=\"mouseenter(groupOrOption)\" (click)=\"click(groupOrOption)\">{{groupOrOption.label}}</li></ng-template></ul></div></div></div></div>";

angular.d.ts

@@ -1,50 +0,4 @@
-/// <reference types="node" />
-import { EventEmitter, ElementRef, ChangeDetectorRef } from "@angular/core";
-import * as common from "./common";
+export declare class Select2Module {
+}
+export * from "./angular.component";
 export * from "./common";
-export declare class Select2Component {
-    private cdr;
-    data: common.Select2Data;
-    value?: common.Select2UpdateValue;
-    disabled?: boolean;
-    minCountForSearch?: number;
-    placeholder?: string;
-    customSearchEnabled?: boolean;
-    multiple?: boolean;
-    update: EventEmitter<{}>;
-    open: EventEmitter<{}>;
-    search: EventEmitter<{}>;
-    hoveringValue: common.Select2Value | null | undefined;
-    option: common.Select2Option | common.Select2Option[] | null;
-    isOpen: boolean;
-    focusoutTimer?: NodeJS.Timer;
-    innerSearchText: string;
-    lastScrollTopIndex: number;
-    isSearchboxHidden: boolean;
-    searchStyle: string;
-    searchInputElement: HTMLElement;
-    resultsElement: HTMLElement;
-    searchInput: ElementRef;
-    results: ElementRef;
-    constructor(cdr: ChangeDetectorRef);
-    searchText: string;
-    readonly dropdownStyle: string;
-    readonly filteredData: (common.Select2Option | common.Select2Group)[];
-    readonly containerStyle: string;
-    readonly selectionStyle: string;
-    ngOnInit(): void;
-    ngAfterViewInit(): void;
-    getOptionStyle(value: string): "select2-results__option select2-results__option--highlighted" | "select2-results__option";
-    mouseenter(option: common.Select2Option): void;
-    click(option: common.Select2Option): void;
-    toggleOpenAndClose(): void;
-    focusout(): void;
-    moveUp(): void;
-    moveDown(): void;
-    selectByEnter(): void;
-    select(option: common.Select2Option | null): void;
-    keyDown(e: KeyboardEvent): void;
-    isSelected(option: common.Select2Option): "true" | "false";
-    isDisabled(option: common.Select2Option): "true" | "false";
-    removeSelection(e: MouseEvent, option: common.Select2Option): void;
-}

angular.js

 "use strict";
 import * as tslib_1 from "tslib";
-import { Component, Input, Output, EventEmitter, ElementRef, ViewChild, ChangeDetectorRef } from "@angular/core";
-import * as common from "./common";
-export * from "./common";
-import { angularTemplateHtml } from "./angular-variables";
-var Select2Component = (function () {
-    function Select2Component(cdr) {
-        this.cdr = cdr;
-        this.update = new EventEmitter();
-        this.open = new EventEmitter();
-        this.search = new EventEmitter();
-        this.hoveringValue = null;
-        this.option = null;
-        this.isOpen = false;
-        this.innerSearchText = "";
-        this.lastScrollTopIndex = 0;
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import { Select2, Select2Hint } from "./angular.component";
+var Select2Module = (function () {
+    function Select2Module() {
     }
-    Object.defineProperty(Select2Component.prototype, "searchText", {
-        get: function () {
-            return this.innerSearchText;
-        },
-        set: function (text) {
-            if (this.customSearchEnabled) {
-                this.search.emit(text);
-            }
-            this.innerSearchText = text;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(Select2Component.prototype, "dropdownStyle", {
-        get: function () {
-            return common.getDropdownStyle(this.isOpen);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(Select2Component.prototype, "filteredData", {
-        get: function () {
-            var result = this.customSearchEnabled
-                ? this.data
-                : common.getFilteredData(this.data, this.searchText);
-            if (common.valueIsNotInFilteredData(result, this.hoveringValue)) {
-                this.hoveringValue = common.getFirstAvailableOption(result);
-                if (this.resultsElement) {
-                    var lastScrollTopIndex = common.getLastScrollTopIndex(this.hoveringValue, this.resultsElement, result, this.lastScrollTopIndex);
-                    if (lastScrollTopIndex !== null) {
-                        this.lastScrollTopIndex = lastScrollTopIndex;
-                    }
-                }
-            }
-            return result;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(Select2Component.prototype, "containerStyle", {
-        get: function () {
-            return common.getContainerStyle(this.disabled, this.isOpen);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(Select2Component.prototype, "selectionStyle", {
-        get: function () {
-            return common.getSelectionStyle(this.multiple);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Select2Component.prototype.ngOnInit = function () {
-        var option = common.getOptionsByValue(this.data, this.value, this.multiple);
-        if (option !== null) {
-            this.option = option;
-        }
-        if (!Array.isArray(option)) {
-            this.hoveringValue = this.value;
-        }
-        this.isSearchboxHidden = this.customSearchEnabled
-            ? false
-            : common.isSearchboxHiddex(this.data, this.minCountForSearch);
-        this.searchStyle = common.getSearchStyle(this.isSearchboxHidden);
-    };
-    Select2Component.prototype.ngAfterViewInit = function () {
-        this.searchInputElement = this.searchInput.nativeElement;
-        this.resultsElement = this.results.nativeElement;
-    };
-    Select2Component.prototype.getOptionStyle = function (value) {
-        return common.getOptionStyle(value, this.hoveringValue);
-    };
-    Select2Component.prototype.mouseenter = function (option) {
-        if (!option.disabled) {
-            this.hoveringValue = option.value;
-        }
-    };
-    Select2Component.prototype.click = function (option) {
-        if (!option.disabled) {
-            this.select(option);
-        }
-        if (this.focusoutTimer) {
-            clearTimeout(this.focusoutTimer);
-        }
-    };
-    Select2Component.prototype.toggleOpenAndClose = function () {
-        if (this.disabled) {
-            return;
-        }
-        this.isOpen = !this.isOpen;
-        if (this.isOpen) {
-            this.innerSearchText = "";
-            if (!this.isSearchboxHidden) {
-                if (this.searchInputElement) {
-                    this.searchInputElement.focus();
-                }
-            }
-            else {
-                if (this.resultsElement) {
-                    this.resultsElement.focus();
-                }
-            }
-            if (this.resultsElement) {
-                var lastScrollTopIndex = common.getLastScrollTopIndex(this.hoveringValue, this.resultsElement, this.data, this.lastScrollTopIndex);
-                if (lastScrollTopIndex !== null) {
-                    this.lastScrollTopIndex = lastScrollTopIndex;
-                }
-            }
-            this.open.emit();
-        }
-        if (this.focusoutTimer) {
-            clearTimeout(this.focusoutTimer);
-        }
-    };
-    Select2Component.prototype.focusout = function () {
-        var _this = this;
-        this.focusoutTimer = setTimeout(function () {
-            _this.isOpen = false;
-            _this.focusoutTimer = undefined;
-            _this.cdr.markForCheck();
-        }, common.timeout);
-    };
-    Select2Component.prototype.moveUp = function () {
-        this.hoveringValue = common.getPreviousOption(this.filteredData, this.hoveringValue);
-        if (this.resultsElement) {
-            var lastScrollTopIndex = common.getLastScrollTopIndex(this.hoveringValue, this.resultsElement, this.filteredData, this.lastScrollTopIndex);
-            if (lastScrollTopIndex !== null) {
-                this.lastScrollTopIndex = lastScrollTopIndex;
-            }
-        }
-    };
-    Select2Component.prototype.moveDown = function () {
-        this.hoveringValue = common.getNextOption(this.filteredData, this.hoveringValue);
-        if (this.resultsElement) {
-            var lastScrollTopIndex = common.getLastScrollTopIndex(this.hoveringValue, this.resultsElement, this.filteredData, this.lastScrollTopIndex);
-            if (lastScrollTopIndex !== null) {
-                this.lastScrollTopIndex = lastScrollTopIndex;
-            }
-        }
-    };
-    Select2Component.prototype.selectByEnter = function () {
-        if (this.hoveringValue) {
-            var option = common.getOptionByValue(this.data, this.hoveringValue);
-            this.select(option);
-        }
-    };
-    Select2Component.prototype.select = function (option) {
-        if (option !== null) {
-            if (this.multiple) {
-                var options = this.option;
-                var index = -1;
-                for (var i = 0; i < options.length; i++) {
-                    if (options[i].value === option.value) {
-                        index = i;
-                        break;
-                    }
-                }
-                if (index === -1) {
-                    options.push(option);
-                }
-                else {
-                    options.splice(index, 1);
-                }
-            }
-            else {
-                this.option = option;
-                this.isOpen = false;
-            }
-        }
-        this.update.emit(this.multiple ? this.option.map(function (op) { return op.value; }) : this.option.value);
-    };
-    Select2Component.prototype.keyDown = function (e) {
-        if (e.keyCode === 40) {
-            this.moveDown();
-            e.preventDefault();
-        }
-        else if (e.keyCode === 38) {
-            this.moveUp();
-            e.preventDefault();
-        }
-        else if (e.keyCode === 13) {
-            this.selectByEnter();
-            e.preventDefault();
-        }
-    };
-    Select2Component.prototype.isSelected = function (option) {
-        return common.isSelected(this.option, option, this.multiple);
-    };
-    Select2Component.prototype.isDisabled = function (option) {
-        return option.disabled ? "true" : "false";
-    };
-    Select2Component.prototype.removeSelection = function (e, option) {
-        common.removeSelection(this.option, option);
-        this.update.emit(this.option.map(function (op) { return op.value; }));
-        e.preventDefault();
-        e.stopPropagation();
-        if (this.isOpen) {
-            if (!this.isSearchboxHidden) {
-                if (this.searchInputElement) {
-                    this.searchInputElement.focus();
-                }
-            }
-            else {
-                if (this.resultsElement) {
-                    this.resultsElement.focus();
-                }
-            }
-        }
-        if (this.focusoutTimer) {
-            clearTimeout(this.focusoutTimer);
-        }
-    };
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Array)
-    ], Select2Component.prototype, "data", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], Select2Component.prototype, "value", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], Select2Component.prototype, "disabled", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Number)
-    ], Select2Component.prototype, "minCountForSearch", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", String)
-    ], Select2Component.prototype, "placeholder", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], Select2Component.prototype, "customSearchEnabled", void 0);
-    tslib_1.__decorate([
-        Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], Select2Component.prototype, "multiple", void 0);
-    tslib_1.__decorate([
-        Output(),
-        tslib_1.__metadata("design:type", Object)
-    ], Select2Component.prototype, "update", void 0);
-    tslib_1.__decorate([
-        Output(),
-        tslib_1.__metadata("design:type", Object)
-    ], Select2Component.prototype, "open", void 0);
-    tslib_1.__decorate([
-        Output(),
-        tslib_1.__metadata("design:type", Object)
-    ], Select2Component.prototype, "search", void 0);
-    tslib_1.__decorate([
-        ViewChild("searchInput"),
-        tslib_1.__metadata("design:type", ElementRef)
-    ], Select2Component.prototype, "searchInput", void 0);
-    tslib_1.__decorate([
-        ViewChild("results"),
-        tslib_1.__metadata("design:type", ElementRef)
-    ], Select2Component.prototype, "results", void 0);
-    Select2Component = tslib_1.__decorate([
-        Component({
-            selector: "select2",
-            template: angularTemplateHtml,
-        }),
-        tslib_1.__metadata("design:paramtypes", [ChangeDetectorRef])
-    ], Select2Component);
-    return Select2Component;
+    Select2Module = tslib_1.__decorate([
+        NgModule({
+            declarations: [
+                Select2Hint,
+                Select2,
+            ],
+            imports: [
+                CommonModule,
+            ],
+            exports: [
+                Select2Hint,
+                Select2,
+            ],
+        })
+    ], Select2Module);
+    return Select2Module;
 }());
-export { Select2Component };
+export { Select2Module };
+export * from "./angular.component";
+export * from "./common";

common.d.ts

 export declare type Select2Group = {
     label: string;
     options: Select2Option[];
+    classes?: string;
 };
@@ -10,2 +11,3 @@ export declare type Select2Option = {
     component?: string | Function;
+    classes?: string;
 };
@@ -17,2 +19,6 @@ export declare type Select2Value = string | number;
 export declare const height = 28;
+export declare const unicodePatterns: {
+    l: string;
+    s: RegExp;
+}[];
 export declare function getOptionByValue(data: Select2Data, value: Select2Value | null | undefined): Select2Option | null;
@@ -25,3 +31,6 @@ export declare function getOptionsByValue(data: Select2Data, value: Select2UpdateValue | null | undefined, multiple: boolean | null | undefined): Select2Option | Select2Option[] | null;
 export declare function getLastScrollTopIndex(hoveringValue: Select2Value | null | undefined, results: HTMLElement, filteredData: Select2Data, lastScrollTopIndex: number): number | null;
-export declare function getFilteredData(data: Select2Data, searchText: string | null): (Select2Option | Select2Group)[];
+export declare function protectPattern(str: string): string;
+export declare function formatSansUnicode(str: string): string;
+export declare function formatPattern(str: string, editPattern: ((str: string) => string) | undefined): string;
+export declare function getFilteredData(data: Select2Data, searchText: string | null, editPattern?: (str: string) => string): (Select2Option | Select2Group)[];
 export declare function getOptionStyle(value: Select2Value, hoveringValue: Select2Value | null | undefined): "select2-results__option select2-results__option--highlighted" | "select2-results__option";
@@ -28,0 +37,0 @@ export declare function getDropdownStyle(isOpen: boolean): "select2-container select2-container--default select2-container-dropdown select2-container--open" | "select2-container select2-container--default select2-container-dropdown";

common.js

 "use strict";
 export var timeout = 200;
 export var height = 28;
+export var unicodePatterns = [
+    { l: "a", s: /[ⓐａẚàáâầấẫẩãāăằắẵẳȧǡäǟảåǻǎȁȃạậặḁąⱥɐ]/gi },
+    { l: "aa", s: /ꜳ/gi },
+    { l: "ae", s: /[æǽǣ]/gi },
+    { l: "ao", s: /ꜵ/gi },
+    { l: "au", s: /ꜷ/gi },
+    { l: "av", s: /[ꜹꜻ]/gi },
+    { l: "ay", s: /ꜽ/gi },
+    { l: "b", s: /[ⓑｂḃḅḇƀƃɓ]/gi },
+    { l: "c", s: /[ⓒｃćĉċčçḉƈȼꜿↄ]/gi },
+    { l: "d", s: /[ⓓｄḋďḍḑḓḏđƌɖɗꝺ]/gi },
+    { l: "dz", s: /[dzdž]/gi },
+    { l: "e", s: /[ⓔｅèéêềếễểẽēḕḗĕėëẻěȅȇẹệȩḝęḙḛɇɛǝ]/gi },
+    { l: "f", s: /[ⓕｆḟƒꝼ]/gi },
+    { l: "g", s: /[ⓖｇǵĝḡğġǧģǥɠꞡᵹꝿ]/gi },
+    { l: "h", s: /[ⓗｈĥḣḧȟḥḩḫẖħⱨⱶɥ]/gi },
+    { l: "hv", s: /ƕ/gi },
+    { l: "i", s: /[ⓘｉìíîĩīĭİïḯỉǐȉȋịįḭɨı]/gi },
+    { l: "j", s: /[ⓙｊĵǰɉ]/gi },
+    { l: "k", s: /[ⓚｋḱǩḳķḵƙⱪꝁꝃꝅꞣ]/gi },
+    { l: "l", s: /[ⓛｌŀĺľḷḹļḽḻſłƚɫⱡꝉꞁꝇꝆ]/gi },
+    { l: "lj", s: /lj/gi },
+    { l: "m", s: /[ⓜｍḿṁṃɱɯ]/gi },
+    { l: "n", s: /[ⓝｎǹńñṅňṇņṋṉƞɲʼnꞑꞥ]/gi },
+    { l: "nj", s: /nj/gi },
+    { l: "o", s: /[ⓞｏòóôồốỗổõṍȭṏōṑṓŏȯȱöȫỏőǒȍȏơờớỡởợọộǫǭøǿɔƟꝋꝍɵ]/gi },
+    { l: "oi", s: /ƣ/gi },
+    { l: "oe", s: /œ/gi },
+    { l: "oo", s: /ꝏ/gi },
+    { l: "ou", s: /ȣ/gi },
+    { l: "p", s: /[ⓟｐṕṗƥᵽꝑꝓꝕ]/gi },
+    { l: "q", s: /[ⓠｑɋꝗꝙ]/gi },
+    { l: "r", s: /[ⓡｒŕṙřȑȓṛṝŗṟɍɽꝛꞧꞃ]/gi },
+    { l: "s", s: /[ⓢｓßẞśṥŝṡšṧṣṩșşȿꞩꞅẛ]/gi },
+    { l: "t", s: /[ⓣｔṫẗťṭțţṱṯŧƭʈⱦꞇ]/gi },
+    { l: "tz", s: /ꜩ/gi },
+    { l: "u", s: /[ⓤｕùúûũṹūṻŭüǜǘǖǚủůűǔȕȗưừứữửựụṳųṷṵʉ]/gi },
+    { l: "v", s: /[ⓥｖṽṿʋꝟʌ]/gi },
+    { l: "vy", s: /ꝡ/gi },
+    { l: "w", s: /[ⓦｗẁẃŵẇẅẘẉⱳ]/gi },
+    { l: "x", s: /[ⓧｘẋẍ]/gi },
+    { l: "y", s: /[ⓨｙỳýŷỹȳẏÿỷẙỵƴɏỿ]/gi },
+    { l: "z", s: /[ⓩｚźẑżžẓẕƶȥɀⱬꝣ]/gi },
+];
 function getScrollUpIndex(data, value) {
@@ -205,6 +249,25 @@ var index = 0;
 }
-function containSearchText(label, searchText) {
-    return searchText ? label.toLowerCase().indexOf(searchText.toLowerCase()) > -1 : true;
+function containSearchText(label, searchText, editPattern) {
+    return searchText
+        ? formatSansUnicode(label).match(new RegExp(formatPattern(searchText, editPattern), "i")) !== null
+        : true;
 }
-export function getFilteredData(data, searchText) {
+export function protectPattern(str) {
+    return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
+}
+export function formatSansUnicode(str) {
+    for (var _i = 0, unicodePatterns_1 = unicodePatterns; _i < unicodePatterns_1.length; _i++) {
+        var unicodePattern = unicodePatterns_1[_i];
+        str = str.replace(unicodePattern.s, unicodePattern.l);
+    }
+    return str;
+}
+export function formatPattern(str, editPattern) {
+    str = formatSansUnicode(protectPattern(str));
+    if (editPattern && typeof editPattern === "function") {
+        str = editPattern(str);
+    }
+    return str;
+}
+export function getFilteredData(data, searchText, editPattern) {
     if (searchText) {
@@ -216,4 +279,4 @@ var result = [];
             if (options) {
-                if (options.some(function (group) { return containSearchText(group.label, searchText); })) {
-                    var filteredOptions = options.filter(function (group) { return containSearchText(group.label, searchText); });
+                if (options.some(function (group) { return containSearchText(group.label, searchText, editPattern); })) {
+                    var filteredOptions = options.filter(function (group) { return containSearchText(group.label, searchText, editPattern); });
                     result.push({
@@ -225,3 +288,3 @@ label: groupOrOption.label,
             }
-            else if (containSearchText(groupOrOption.label, searchText)) {
+            else if (containSearchText(groupOrOption.label, searchText, editPattern)) {
                 result.push(groupOrOption);
@@ -247,3 +310,4 @@ }
 export function getContainerStyle(disabled, isOpen) {
-    return "select2 select2-container select2-container--default " + (disabled ? "select2-container--disabled" : "") + " " + (isOpen ? "select2-container--open" : "") + " select2-container--below select2-container--focus";
+    return "select2 select2-container select2-container--default " + (disabled ? "select2-container--disabled" : "") + " "
+        + ((isOpen ? "select2-container--open" : "") + " select2-container--below select2-container--focus");
 }
@@ -250,0 +314,0 @@ export function getSelectionStyle(multiple) {

package.json

 {
   "name": "select2-component",
-  "version": "3.0.1",
+  "version": "3.1.0",
   "description": "A vuejs, reactjs and angular select component.",
@@ -24,8 +24,8 @@ "main": "index.js",
   "devDependencies": {
-    "@angular/common": "4.3.2",
-    "@angular/compiler": "4.3.2",
-    "@angular/core": "4.3.2",
-    "@angular/forms": "4.3.2",
-    "@angular/platform-browser": "4.3.2",
-    "@angular/platform-browser-dynamic": "4.3.2",
+    "@angular/common": "4.3.3",
+    "@angular/compiler": "4.3.3",
+    "@angular/core": "4.3.3",
+    "@angular/forms": "4.3.3",
+    "@angular/platform-browser": "4.3.3",
+    "@angular/platform-browser-dynamic": "4.3.3",
     "@types/jasmine": "2.5.53",
@@ -32,0 +32,0 @@ "@types/react": "15.6.0",

README.md

@@ -27,2 +27,4 @@ [![Dependency Status](https://david-dm.org/plantain-00/select2-component.svg)](https://david-dm.org/plantain-00/select2-component)
 + multiple selection
++ material style(angular only)
++ form binding(angular only)
 
@@ -104,2 +106,5 @@ #### install
 multiple | boolean? | select multiple options
+material | `""` or `true` | enable material style(angular only)
+editPattern | (str: string) => string | use it for change the pattern of the filter search(angular only)
+ngModel/id/required/disabled/readonly/tabIndex | just like a `select` control | (angular only)
 update | (value: [Select2UpdateValue](#select2-data-structure)) => void | triggered when user select an option
@@ -117,2 +122,3 @@ open | () => void | triggered when user open the options
     options: Select2Option[];
+    classes?: string;
 };
@@ -125,2 +131,3 @@
     component?: string | Function; // the component
+    classes?: string;
 };
@@ -127,0 +134,0 @@

No alert changes

Improved metrics

Total package byte prevSize

110686

39.03%

Number of package files

19

11.76%

Lines of code

2245

40.05%

Number of lines in readme file

165

4.43%

No dependency changes