@grapecity/inputman.angular/fesm2015/grapecity-inputman.angular.mjs.map

このパッケージには、Angular用の[InputManJS](https://developer.mescius.jp/inputmanjs)コンポーネントが含まれます。

{"version":3,"file":"grapecity-inputman.angular.mjs","sources":["../../common.ts","../../components/GcComponents.ts","../../components/GcCalculator.ts","../../components/GcCalendar.ts","../../components/GcComboBox.ts","../../components/GcInputManBase.ts","../../components/GcDateTime.ts","../../components/GcDateTimePicker.ts","../../components/GcFormPersistence.ts","../../components/GcFunctionKey.ts","../../components/GcIconNotifier.ts","../../components/GcListBox.ts","../../components/GcMask.ts","../../components/GcMutiLineTextBox.ts","../../components/GcNumber.ts","../../components/GcShortcut.ts","../../components/GcSoftKeyboard.ts","../../components/GcTextBox.ts","../../components/GcTipNotifier.ts","../../components/GcTagBox.ts","../../GcInputMan.module.ts","../../grapecity-inputman.angular.ts"],"sourcesContent":["export const IMCtrl = \"__imctrl\";\n\nexport function Property(setter?: string, getter?: string, isPramArr?: boolean, supportWithinConfig?: boolean, order?: number): Function {\n    var saveToTargetProDic = function (target: any, propertyName: string) {\n        var methods = <PropertyMethod>{\n            setter: setter,\n            getter: getter,\n            isPramArr: isPramArr,\n            supportWithinConfig: (typeof supportWithinConfig === \"boolean\") ? supportWithinConfig : true,\n            order: (typeof order === \"number\") ? order : -1\n        };\n        if (!target.propDic) {\n            target.propDic = {};\n        }\n        target.propDic[propertyName] = methods;\n    };\n    return saveToTargetProDic;\n}\n\nexport const isEmpty = function (value: any): boolean {\n    return value === undefined || value === null || value === \"\";\n}\n\nexport const getMethodPrefix = function (type: MethodType): string {\n    if (type === MethodType.getter) {\n        return \"get\";\n    } else if (type === MethodType.setter) {\n        return \"set\";\n    }\n}\n\nexport interface PropertyDictionary {\n    [propertyName: string]: PropertyMethod\n}\n\nexport interface PropertyMethod {\n    getter: string;\n    setter: string;\n    isPramArr: boolean;\n    supportWithinConfig: boolean;\n    order: number;\n}\n\nexport enum MethodType {\n    getter,\n    setter\n}\n\n","import { OnChanges, OnDestroy, AfterContentInit, ElementRef, SimpleChanges, Input, Output, forwardRef, EventEmitter, Component, Injectable } from '@angular/core';\nimport { PropertyDictionary, MethodType, getMethodPrefix, IMCtrl, isEmpty } from '../common';\n\nexport function provideParent(component: any) {\n    return { provide: GcComponents, useExisting: forwardRef(() => component) };\n}\n\n@Component({\n    template: ''\n})\nexport abstract class GcComponents<T extends object> implements OnChanges, AfterContentInit, OnDestroy {\n    protected _container: Element;\n    protected _imCtrl: T;\n    protected propDic: PropertyDictionary;\n\n    constructor(ref: ElementRef) {\n        this._container = ref.nativeElement;\n    }\n\n    public ngOnChanges(changes: SimpleChanges): void {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        Object.keys(changes).forEach((key: string) => {\n            var currentValue = changes[key].currentValue;\n            this.setValueToIMControl(key, currentValue);\n        });\n    }\n\n    protected setValueToIMControl(key: string, value: any): void {\n        if (value === undefined) {\n            return;\n        }\n\n        if (this.isSetAccessor(key)) {\n            this._imCtrl[key] = value;\n            return;\n        }\n\n        var setter = this.tryGetPropertyOperator(key, MethodType.setter);\n        if (this.hasRealMethod(setter)) {\n            if (this.propDic && this.propDic[key] && this.propDic[key].isPramArr === true) {\n                this._imCtrl[setter].apply(this._imCtrl, value);\n            } else {\n                this._imCtrl[setter](value);\n            }\n        }\n    }\n\n    private isSetAccessor(key: string, prototype: Object = Object.getPrototypeOf(this._imCtrl)) {\n\n        let descriptor = Object.getOwnPropertyDescriptor(prototype, key);\n        if (descriptor && descriptor.set) {\n            return true;\n        } else {\n            prototype = Object.getPrototypeOf(prototype);\n            if (prototype) {\n                return this.isSetAccessor(key, prototype);\n            }\n        }\n        return false;\n    }\n\n    public ngOnDestroy(): void {\n        if(this._container != null) {\n            if(((this._imCtrl) as any).destroy){\n                ((this._imCtrl) as any).destroy();\n            }\n            this._container.remove();\n        }\n    }\n\n    public ngAfterContentInit(): void {\n        this.initGcComponent();\n        if (typeof this._imCtrl === 'object') {\n            this.onInitialized.emit(this._imCtrl);\n        }\n        this.bindEvent();\n        if (this.propDic) {\n            var unSupportWithinConfigProps = Object.keys(this.propDic).filter(p => this.propDic[p] && this.propDic[p].supportWithinConfig === false);\n            unSupportWithinConfigProps.sort((p1, p2) => {\n                return this.propDic[p1].order - this.propDic[p2].order;\n            });\n\n            unSupportWithinConfigProps.forEach(p => {\n                this.setValueToIMControl(p, this[p]);\n            });\n        }\n        this._container[IMCtrl] = this._imCtrl;\n    }\n\n    protected abstract initGcComponent(): void;\n\n    protected abstract bindEvent(): void;\n\n    private tryGetPropertyOperator(propertyName: string, methodType: MethodType): string {\n        var method: string = \"\";\n        if (this.propDic && this.propDic[propertyName]) {\n            method = methodType === MethodType.getter ? this.propDic[propertyName].getter : this.propDic[propertyName].setter;\n            if (!isEmpty(method)) {\n                return method;\n            }\n        }\n        return getMethodPrefix(methodType) + propertyName[0].toUpperCase() + propertyName.slice(1);\n    }\n\n    private hasRealMethod(methodName: string): boolean {\n        return this._imCtrl && typeof this._imCtrl[methodName] === \"function\";\n    }\n\n    public getNestedIMControl(): T {\n        return this._imCtrl;\n    }\n\n    protected createTemplate(element: HTMLElement) {\n        this._container.appendChild(element);\n        if (element && this.name) {\n            element.setAttribute('name', this.name);\n        }\n    }\n\n    @Input()\n    public name: string;\n\n    @Output()\n    public onInitialized: EventEmitter<T> = new EventEmitter();\n}","import { Component, Input, ElementRef } from '@angular/core';\nimport { GC } from '../inputman';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-calculator',\n    template: ``\n})\nexport class GcCalculatorComponent extends GcComponents<GC.InputMan.GcCalculator> {\n    @Input() value: number;\n    @Input() showOutput: boolean;\n    @Input() visible: boolean;\n    @Input() enabled: boolean;\n    @Input() buttonText: object;\n\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    protected initGcComponent(): void {\n        var element = document.createElement('div');\n        this.createTemplate(element);\n\n        this._imCtrl = new GC.InputMan.GcCalculator(element, this as any);\n    }\n\n    protected bindEvent() { }\n\n}","import { Component, ElementRef, Input, Output, EventEmitter, forwardRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { GcComponents } from './GcComponents';\nimport { GcNumberComponent } from './GcNumber';\n\ninterface Dimensions {\n    width: number;\n    height: number;\n}\n\n@Component({\n    selector: 'gc-calendar',\n    template: ``,\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            multi: true,\n            useExisting: forwardRef(() => GcCalendarComponent),\n        }\n    ]\n})\nexport class GcCalendarComponent extends GcComponents<GC.InputMan.GcCalendar> implements ControlValueAccessor {\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    private onChange: Function = () => { };\n    private onTouched: Function = () => { };\n\n    writeValue(value: any): void {\n        if (this.selectionMode == undefined || this.selectionMode == GC.InputMan.CalendarSelectionMode.One) {\n            this.selectedDate = value;\n            if (this._imCtrl) {\n                this._imCtrl.selectedDate = this.selectedDate;\n            }\n        } else {\n            if (this._imCtrl) {\n                if (value instanceof Array) {\n                    this._imCtrl.setSelections(value);\n                } else {\n                    this._imCtrl.setSelections([value]);\n                }\n            }\n        }\n    }\n    registerOnChange(onChange: any): void {\n        this.onChange = onChange;\n    }\n    registerOnTouched(onTouched: any): void {\n        this.onTouched = onTouched;\n    }\n    setDisabledState(isDisabled: boolean): void {\n        this.enabled = !isDisabled;\n        if (this._imCtrl) {\n            this._imCtrl.enabled = this.enabled;\n        }\n    }\n\n    protected initGcComponent() {\n        var element = document.createElement('div');\n        this.createTemplate(element);\n        if (Array.isArray((this as any).calendarDimensions)) {\n            (this as any).calendarDimensions = <Dimensions>{\n                width: (this as any).calendarDimensions[0],\n                height: (this as any).calendarDimensions[1]\n            }\n        }\n        this._imCtrl = new GC.InputMan.GcCalendar(element, this as any);\n    }\n\n    @Input()\n    public visible: boolean;\n    @Input()\n    public calendarZoomRange: GC.InputMan.CalendarZoomRange | GC.InputMan.CalendarType[];\n    @Input()\n    public maxSelectionCount: number;\n    @Input()\n    public selectionMode: GC.InputMan.CalendarSelectionMode;\n    @Input()\n    public selectedDate: Date | null;\n    @Input()\n    public enabled: boolean;\n    @Input()\n    public weekTitleSelect: boolean;\n    @Input()\n    public weekNumberSelect: boolean;\n    @Input()\n    public focusDate: Date | null;\n    @Input()\n    public maxDate: Date | null;\n    @Input()\n    public minDate: Date | null;\n    @Input()\n    public allowSelection: GC.InputMan.AllowSelection;\n    @Input()\n    public emptyRows: GC.InputMan.EmptyRows;\n    @Input()\n    public firstDayOfWeek: GC.InputMan.DayOfWeek;\n    @Input()\n    public firstFiscalMonth: GC.InputMan.Months;\n    @Input()\n    public firstMonthInView: GC.InputMan.Months;\n    @Input()\n    public yearMonthFormat: string;\n    @Input()\n    public headerFormat: string;\n    @Input()\n    public showZoomButton: boolean;\n    @Input()\n    public showRokuyou: GC.InputMan.Rokuyou;\n    @Input()\n    public showHeader: boolean;\n    @Input()\n    public showToday: boolean;\n    @Input()\n    public showWeekNumber: boolean;\n    @Input()\n    public showTrailing: boolean;\n    @Input()\n    public calendarYear: GC.InputMan.CalendarYear;\n    @Input()\n    public showNavigator: GC.InputMan.CalendarNavigators;\n    @Input()\n    public navigatorOrientation: number | GC.InputMan.NavigatorOrientation;\n    @Input()\n    public overrideTipText: string;\n    @Input()\n    public calendarType: GC.InputMan.CalendarType;\n    @Property(\"setCalendarDimensions\", \"\", true)\n    @Input()\n    public calendarDimensions: Array<number>;\n    @Input()\n    public scrollRate: number;\n    @Input()\n    public autoSwitch: boolean;\n    @Input()\n    public showAnimation: boolean;\n    @Input()\n    public width: number | string;\n    @Input()\n    public height: number | string;\n    @Input()\n    public minWidth: number | string;\n    @Input()\n    public minHeight: number | string;\n    @Input()\n    public maxWidth: number | string;\n    @Input()\n    public maxHeight: number | string;\n    @Input()\n    public allowResize: boolean;\n    @Output()\n    public onClickDate: EventEmitter<GC.InputMan.GcCalendar> = new EventEmitter();\n    @Output()\n    public onScrolled: EventEmitter<GC.InputMan.GcCalendar> = new EventEmitter();\n    @Output()\n    public onFocusDateChanged: EventEmitter<GC.InputMan.GcCalendar> = new EventEmitter();\n    @Output()\n    public onSelectedDateChanged: EventEmitter<GC.InputMan.GcCalendar> = new EventEmitter();\n    // For V2.1 Compatibility, we have to keep this property or event\n    @Output()\n    public focusDateChange: EventEmitter<Date> = new EventEmitter();\n    @Output()\n    public selectedDateChange: EventEmitter<Date> = new EventEmitter();\n\n\n    protected bindEvent() {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        this._imCtrl.onClickDate((s) => { this.onClickDate.emit(s) });\n        this._imCtrl.onScrolled((s) => { this.onScrolled.emit(s) });\n        this._imCtrl.onFocusDateChanged((s) => {\n            this.onFocusDateChanged.emit(s);\n            this.focusDateChange.emit(s.getFocusDate());\n        });\n        this._imCtrl.onSelectedDateChanged((s) => {\n            this.onSelectedDateChanged.emit(s);\n            if (this._imCtrl.selectionMode == GC.InputMan.CalendarSelectionMode.One) {\n                this.onChange(s.getSelectedDate());\n            } else {\n                this.onChange(s.getSelections());\n            }\n            this.onTouched();\n            this.selectedDateChange.emit(s.getSelectedDate());\n        });\n    }\n}","import { Component, Input, ElementRef, Output, ContentChildren, QueryList, EventEmitter, forwardRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { provideParent, GcComponents } from './GcComponents';\n\ntype ComboBoxValuesType = number[] | string[] | boolean[] | object[];\ntype ComboBoxItemType = string | object;\ntype ComboBoxItemsType = string[] | object[];\n\n@Component({\n    selector: 'gc-combo-box-column',\n    template: ``\n})\nexport class GcComboBoxColumnComponent {\n    @Input()\n    public name: string;\n    @Input()\n    public label: string;\n    @Input()\n    public width: number | string;\n    @Input()\n    public isValuePath: boolean;\n    @Input()\n    public visible: boolean;\n    @Input()\n    public clickSort: boolean;\n    @Input()\n    public contentAlignment: GC.InputMan.Alignment;\n    @Input()\n    public headerAlignment: GC.InputMan.Alignment;\n    @Input()\n    public showTip: boolean;\n}\n\n@Component({\n    selector: 'gc-combo-box',\n    template: ``,\n    providers: [\n        provideParent(GcComboBoxComponent),\n        {\n            provide: NG_VALUE_ACCESSOR,\n            multi: true,\n            useExisting: forwardRef(() => GcComboBoxComponent),\n        }\n    ]\n})\nexport class GcComboBoxComponent extends GcComponents<GC.InputMan.GcComboBox> implements ControlValueAccessor {\n\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n    private text: string;\n    private onChange: Function = () => { };\n    private onTouched: Function = () => { };\n\n    writeValue(value: any): void {\n        this.text = value;\n        if (this._imCtrl) {\n            this._imCtrl.text = this.text;\n        }\n    }\n    registerOnChange(onChange: any): void {\n        this.onChange = onChange;\n    }\n    registerOnTouched(onTouched: any): void {\n        this.onTouched = onTouched;\n    }\n    setDisabledState(isDisabled: boolean): void {\n        this.enabled = !isDisabled;\n        if (this._imCtrl) {\n            this._imCtrl.enabled = this.enabled;\n        }\n    }\n\n    @Input()\n    public items: ComboBoxValuesType;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public selectedValue: number | string | boolean | object;\n    @Input()\n    public allowDropDownResize: boolean;\n    @Input()\n    public width: number | string;\n    @Input()\n    public height: number | string;\n    @Input()\n    public minWidth: number | string;\n    @Input()\n    public minHeight: number | string;\n    @Input()\n    public maxWidth: number | string;\n    @Input()\n    public maxHeight: number | string;\n    @Input()\n    public fontSize: number | string;\n    @Input()\n    public readOnly: boolean;\n    @Input()\n    public autoSelect: boolean;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public selectedIndex: number;\n    @Input()\n    public autoFilter: string | GC.InputMan.AutoFilter;\n    @Input()\n    public visible: boolean;\n    @Input()\n    public enabled: boolean;\n    @Input()\n    public showTip: boolean;\n    @Property(\"setEditable\")\n    @Input()\n    public isEditable: boolean;\n    @Input()\n    public watermarkDisplayNullText: string;\n    @Input()\n    public watermarkNullText: string;\n    @Input()\n    public highlightText: boolean;\n    @Input()\n    public exitOnEnterKey: string | GC.InputMan.ExitKey;\n    @Input()\n    public useClipboard: boolean;\n    @Input()\n    public acceptsCrlf: string | GC.InputMan.CrLfMode;\n    @Input()\n    public acceptsTabChar: GC.InputMan.TabCharMode;\n    @Input()\n    public ellipsis: string | GC.InputMan.EllipsisMode;\n    @Input()\n    public ellipsisString: string;\n    @Input()\n    public exitOnLeftRightKey: string | GC.InputMan.ExitOnLeftRightKey;\n    @Input()\n    public tabIndex: number;\n    @Input()\n    public showHelpButton: boolean;\n    @Input()\n    public autoCompleteMode: GC.InputMan.AutoCompleteMode;\n    @Input()\n    public autoCompleteMatchMode: GC.InputMan.AutoCompleteMatchMode;\n    @Input()\n    public showCopyButton: boolean;\n    @Input()\n    public helpContent: string;\n    @Input()\n    public copyMessage: string;\n    @Input()\n    public copiedMessage: string;\n    @Input()\n    public floatingLabelText: string;\n    @Input()\n    public floatingLabelType: GC.InputMan.FloatingLabelType;\n    @Input()\n    public floatingLabelDirection: GC.InputMan.FloatingLabelDirection;\n\n    @Input()\n    public editMode: string | GC.InputMan.EditMode;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public checkedValues: ComboBoxValuesType;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public selectedItem: ComboBoxItemType;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public checkedItems: ComboBoxItemsType;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public checkedIndices: number[];\n    @Input()\n    public showDropDownButton: boolean;\n    @Input()\n    public dropDownButtonPosition: string | GC.InputMan.DropDownButtonAlignment;\n    @Input()\n    public showSpinButton: boolean;\n    @Input()\n    public spinButtonPosition: string | GC.InputMan.SpinButtonAlignment;\n    @Input()\n    public dropDownWidth: number | 'auto';\n    @Input()\n    public dropDownHeight: number;\n    @Input()\n    public minPrefixLength: number;\n    @Input()\n    public isMultiSelect: boolean;\n    @Input()\n    public dropDownOverflow: string | GC.InputMan.ScrollBars;\n    @Input()\n    public visibleItems: number;\n    @Input()\n    public itemHeight: number;\n    @Input()\n    public columns: GC.InputMan.ColumnConfig[];\n    @Input()\n    public showHeader: boolean;\n    @Input()\n    public valueMemberPath: string;\n    @Input()\n    public displayMemberPath: string;\n    @Input()\n    public checkOnClick: boolean;\n    @Input()\n    public itemTemplate: string | string[];\n    @Input()\n    public headerTemplate: string;\n    @Input()\n    public footerTemplate: string;\n    @Input()\n    public spinWheel: boolean;\n    @Input()\n    public emptyTemplate: string;\n    @Input()\n    public load: (context: GC.InputMan.ILoadContext) => void;\n    @Input()\n    public pageSize: number;\n    @Input()\n    public virtualMode: boolean;\n    @Input()\n    public generatingItem: (args: GC.InputMan.IItemGeneratingArgs) => void;\n    @Input()\n    public selectTemplate: (args: GC.InputMan.ITemplateSelectArgs) => string;\n    @Input()\n    public formatItem: (args: GC.InputMan.IItemArgs) => void;\n    @Input()\n    public allowColumnResize: boolean;\n    @Input()\n    public colHeaderHeight: number;\n    @Input()\n    public container: HTMLElement;\n    @Input()\n    public autoDropDown: boolean;\n    @Input()\n    public dropDownButtonVisible: boolean;\n    @Input()\n    public showClearButton: boolean;\n    @Input()\n    public autoScale: boolean;\n    @Input()\n    public minScaleFactor: number;\n    @Input()\n    public multipleItemSeparator: string;\n    @Input()\n    public dropDownType: GC.InputMan.ComboDropDownType;\n    @Input()\n    public dropDownTreeConfig: GC.InputMan.ComboBoxDropDownTreeConfig;\n    @Input()\n    public checkBySpace: boolean;\n    @Output()\n    public selectedChanged: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public checkedChanged: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public dropDownClosed: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public dropDownOpened: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public textChanged: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public spinDown: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public spinUp: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public itemsChanged: EventEmitter<GC.InputMan.GcComboBox> = new EventEmitter();\n    @Output()\n    public itemsChange: EventEmitter<ComboBoxValuesType> = new EventEmitter();\n    @Output()\n    public selectedValueChange: EventEmitter<object | string | number | boolean> = new EventEmitter();\n    @Output()\n    public selectedIndexChange: EventEmitter<number> = new EventEmitter();\n    @Output()\n    public checkedValuesChange: EventEmitter<ComboBoxValuesType> = new EventEmitter();\n    @Output()\n    public selectedItemChange: EventEmitter<object | string> = new EventEmitter();\n    @Output()\n    public checkedItemsChange: EventEmitter<ComboBoxItemsType> = new EventEmitter();\n    @Output()\n    public checkedIndicesChange: EventEmitter<number[]> = new EventEmitter();\n\n    @ContentChildren(GcComboBoxColumnComponent)\n    public columnComponents: QueryList<GcComboBoxColumnComponent>;\n\n    protected initGcComponent(): void {\n        if (this.columnComponents && this.columnComponents.length > 0) {\n            this.columns = [];\n            this.columnComponents.forEach((column: GcComboBoxColumnComponent) => {\n                this.columns.push({\n                    name: column.name,\n                    label: column.label,\n                    width: column.width,\n                    isValuePath: column.isValuePath,\n                    visible: column.visible,\n                    clickSort: column.clickSort,\n                    contentAlignment: column.contentAlignment,\n                    headerAlignment: column.headerAlignment,\n                    showTip: column.showTip\n                });\n            });\n        }\n        var element = document.createElement('select');\n        this.createTemplate(element);\n        this._imCtrl = new GC.InputMan.GcComboBox(element, this as any);\n    }\n    protected bindEvent(): void {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.SelectedChanged, (eventArgs) => {\n            this.selectedChanged.emit(eventArgs);\n            this.selectedValueChange.emit(this._imCtrl.getSelectedValue());\n            this.selectedIndexChange.emit(this._imCtrl.getSelectedIndex());\n            this.selectedItemChange.emit(this._imCtrl.getSelectedItem());\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.CheckedChanged, (eventArgs) => {\n            this.checkedChanged.emit(eventArgs);\n            this.checkedValuesChange.emit(this._imCtrl.getCheckedValues());\n            this.checkedItemsChange.emit(this._imCtrl.getCheckedItems());\n            this.checkedIndicesChange.emit(this._imCtrl.getCheckedIndices());\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.DropDownClosed, (eventArgs) => {\n            this.dropDownClosed.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.DropDownOpened, (eventArgs) => {\n            this.dropDownOpened.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.TextChanged, (eventArgs) => {\n            this.textChanged.emit(eventArgs);\n            this.onChange(this._imCtrl.text);\n            this.onTouched();\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.SpinDown, (eventArgs) => {\n            this.spinDown.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.SpinUp, (eventArgs) => {\n            this.spinUp.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcComboBoxEvent.ItemsChanged, (eventArgs) => {\n            this.itemsChanged.emit(eventArgs);\n            this.itemsChange.emit(this._imCtrl.getItems());\n        });\n    }\n}","import { Input, Output, EventEmitter, ElementRef, Component, Injectable } from '@angular/core';\nimport { GC } from '../inputman';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    template: ''\n})\nexport abstract class GcInputManBaseComponent<T extends GC.InputMan.GcInputManBase> extends GcComponents<T> {\n\n    @Input()\n    public visible: boolean;\n    @Input()\n    public width: number | string;\n    @Input()\n    public height: number | string;\n    @Input()\n    public minWidth: number | string;\n    @Input()\n    public minHeight: number | string;\n    @Input()\n    public maxWidth: number | string;\n    @Input()\n    public maxHeight: number | string;\n    @Input()\n    public fontSize: number | string;\n    @Input()\n    public enabled: boolean;\n    @Input()\n    public readOnly: boolean;\n    @Input()\n    public exitOnLeftRightKey: GC.InputMan.ExitOnLeftRightKey;\n    @Input()\n    public editMode: GC.InputMan.EditMode;\n    @Input()\n    public watermarkDisplayNullText: string | null;\n    @Input()\n    public watermarkNullText: string | null;\n    @Input()\n    public useClipboard: boolean;\n    @Input()\n    public exitOnEnterKey: GC.InputMan.ExitKey;\n    @Input()\n    public container: HTMLElement;\n    @Input()\n    public autoDropDown: boolean;\n    @Input()\n    public dropDownButtonVisible: boolean;\n    @Input()\n    public autoScale: boolean;\n    @Input()\n    public minScaleFactor: number;\n    @Input()\n    public tabIndex: number;\n    @Input()\n    public showHelpButton: boolean;\n    @Input()\n    public showCopyButton: boolean;\n    @Input()\n    public helpContent: string;\n    @Input()\n    public copyMessage: string;\n    @Input()\n    public copiedMessage: string;\n    @Input()\n    public floatingLabelText: string;\n    @Input()\n    public floatingLabelType: GC.InputMan.FloatingLabelType;\n    @Input()\n    public floatingLabelDirection: GC.InputMan.FloatingLabelDirection;\n    @Input()\n    public showClearButton: boolean;\n    @Output()\n    public onEditStatusChanged: EventEmitter<T> = new EventEmitter();\n    @Output()\n    public onInvalidInput: EventEmitter<T> = new EventEmitter();\n    @Output()\n    public onKeyExit: EventEmitter<T> = new EventEmitter();\n    @Output()\n    public onTextChanged: EventEmitter<T> = new EventEmitter();\n    @Output()\n    public onInput: EventEmitter<T> = new EventEmitter();\n    @Output()\n    public onFocusOut: EventEmitter<{sender: T}> = new EventEmitter();\n    @Output()\n    public onKeyDown: EventEmitter<{sender: T}> = new EventEmitter();\n    @Output()\n    public onKeyUp: EventEmitter<{sender: T}> = new EventEmitter();\n    @Output()\n    public onSyncValueToOriginalInput: EventEmitter<{ value: boolean | number | string | object, element: HTMLInputElement | HTMLTextAreaElement }> = new EventEmitter();\n    // For V2.1 Compatibility, we have to keep this property or event\n    @Output()\n    public textChange: EventEmitter<string> = new EventEmitter();\n\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    protected bindEvent() {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        this._imCtrl.onEditStatusChanged((s) => { this.onEditStatusChanged.emit(s); });\n        this._imCtrl.onInvalidInput((s) => { this.onInvalidInput.emit(s); });\n        this._imCtrl.onKeyExit((s) => { this.onKeyExit.emit(s); });\n        this._imCtrl.onTextChanged((s) => { this.onTextChanged.emit(s); this.textChange.emit(s.getText() as any); });\n        this._imCtrl.onInput((s) => { this.onInput.emit(s); });\n        this._imCtrl.onFocusOut((s) => { this.onFocusOut.emit({ sender: s }); });\n        this._imCtrl.onKeyDown((s) => { this.onKeyDown.emit({ sender: s }); });\n        this._imCtrl.onKeyUp((s) => { this.onKeyUp.emit({ sender: s }); });\n        this._imCtrl.onSyncValueToOriginalInput((v, e) => { this.onSyncValueToOriginalInput.emit({ value: v, element: e }); });\n    }\n}","import { Component, ElementRef, Input, Output, EventEmitter, forwardRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { provideParent } from './GcComponents';\nimport { GcInputManBaseComponent } from './GcInputManBase';\n\n@Component({\n    selector: 'gc-datetime',\n    template: ``,\n    providers: [\n        provideParent(GcDateTimeComponent),\n        {\n            provide: NG_VALUE_ACCESSOR,\n            multi: true,\n            useExisting: forwardRef(() => GcDateTimeComponent),\n        }\n    ]\n})\nexport class GcDateTimeComponent extends GcInputManBaseComponent<GC.InputMan.GcDateTime> implements ControlValueAccessor {\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    private onChange: Function = () => { };\n    private onTouched: Function = () => { };\n\n    writeValue(value: any): void {\n        this.value = value;\n        if (this._imCtrl) {\n            this._imCtrl.value = this.value;\n        }\n    }\n    registerOnChange(onChange: any): void {\n        this.onChange = onChange;\n    }\n    registerOnTouched(onTouched: any): void {\n        this.onTouched = onTouched;\n    }\n    setDisabledState(isDisabled: boolean): void {\n        this.enabled = !isDisabled;\n        if (this._imCtrl) {\n            this._imCtrl.enabled = this.enabled;\n        }\n    }\n\n    protected initGcComponent() {\n        var element = document.createElement('input');\n        this.createTemplate(element);\n        this._imCtrl = new GC.InputMan.GcDateTime(element, this as any);\n    }\n\n    @Input()\n    public acceptsCrlf: GC.InputMan.CrLfMode;\n    @Input()\n    public autoConvert: boolean;\n    @Input()\n    public text: string | null;\n    @Property(\"\", \"\", false, false)\n    @Input()\n    public number: number;\n    @Input()\n    public maxDate: Date | string | null;\n    @Input()\n    public minDate: Date | string | null;\n    @Input()\n    public formatPattern: string | null;\n    @Input()\n    public spinIncrement: number;\n    @Input()\n    public spinOnKeys: boolean;\n    @Input()\n    public spinWrap: boolean;\n    @Input()\n    public allowSpin: boolean;\n    @Input()\n    public spinWheel: boolean;\n    @Input()\n    public displayFormatPattern: string | null;\n    @Input()\n    public watermarkEmptyEraText: string | null;\n    @Input()\n    public promptChar: string | null;\n    @Input()\n    public AMDesignator: string | null;\n    @Input()\n    public PMDesignator: string | null;\n    @Input()\n    public twoDigitYearMax: number;\n    @Input()\n    public hour12Mode: GC.InputMan.Hour12Mode;\n    @Input()\n    public tabAction: GC.InputMan.TabAction;\n    @Input()\n    public maxMinBehavior: GC.InputMan.MaxMinBehavior;\n    @Input()\n    public midnightAs24: boolean;\n    @Input()\n    public showLiterals: GC.InputMan.ShowLiterals;\n    @Input()\n    public adjustValueOnFocus: boolean;\n    @Input()\n    public useTwoDigitYearMax: boolean;\n    @Input()\n    public validateMode: GC.InputMan.ValidateMode;\n    @Input()\n    public clipContent: GC.InputMan.ClipContent;\n    @Input()\n    public value: Date | string;\n    @Input()\n    public watermarkDisplayEmptyEraText: string | null;\n    @Input()\n    public dropDownConfig: GC.InputMan.GcDateTimeDropDownConfig;\n    @Input()\n    public exitOnLastChar: boolean;\n    @Input()\n    public highlightText: GC.InputMan.HighlightText;\n    @Input()\n    public showSpinButton: boolean;\n    @Input()\n    public spinButtonPosition: string | null | GC.InputMan.SpinButtonAlignment;\n    @Input()\n    public showDropDownButton: boolean;\n    @Input()\n    public dropDownButtonAlignment: string | null | GC.InputMan.DropDownButtonAlignment;\n    @Output()\n    public onSpinDown: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    @Output()\n    public onSpinUp: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    @Output()\n    public onInvalidRange: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    @Output()\n    public onInvalidValue: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    @Output()\n    public onNumberChanged: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    @Output()\n    public onValueChanged: EventEmitter<GC.InputMan.GcDateTime> = new EventEmitter();\n    // For V2.1 Compatibility, we have to keep this property or event\n    @Output()\n    public numberChange: EventEmitter<number> = new EventEmitter();\n    @Output()\n    public valueChange: EventEmitter<Date> = new EventEmitter();\n\n    protected bindEvent() {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        super.bindEvent();\n        this._imCtrl.onSpinDown((s) => { this.onSpinDown.emit(s); });\n        this._imCtrl.onSpinUp((s) => { this.onSpinUp.emit(s); });\n        this._imCtrl.onInvalidRange((s) => { this.onInvalidRange.emit(s); });\n        this._imCtrl.onInvalidValue((s) => { this.onInvalidValue.emit(s); });\n        this._imCtrl.onNumberChanged((s) => {\n            this.onNumberChanged.emit(s);\n            this.numberChange.emit(s.getNumber() as any);\n        });\n        this._imCtrl.onValueChanged((s) => {\n            this.onValueChanged.emit(s);\n            this.onChange(s.getValue());\n            this.onTouched();\n            this.valueChange.emit(s.getValue());\n        });\n    }\n\n}","import { Component, ElementRef, Input, Output, EventEmitter, forwardRef } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-datetime-picker',\n    template: ``,\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            multi: true,\n            useExisting: forwardRef(() => GcDateTimePickerComponent),\n        }\n    ]\n})\nexport class GcDateTimePickerComponent extends GcComponents<GC.InputMan.GcDateTimePicker> implements ControlValueAccessor {\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    private onChange: Function = () => { };\n    private onTouched: Function = () => { };\n\n    writeValue(value: any): void {\n        this.selectedValue = value;\n        if (this._imCtrl) {\n            this._imCtrl.value = this.selectedValue;\n        }\n    }\n    registerOnChange(onChange: any): void {\n        this.onChange = onChange;\n    }\n    registerOnTouched(onTouched: any): void {\n        this.onTouched = onTouched;\n    }\n    setDisabledState(isDisabled: boolean): void {\n        this.enabled = !isDisabled;\n        if (this._imCtrl) {\n            this._imCtrl.enabled = this.enabled;\n        }\n    }\n\n    @Property(\"setValue\")\n    @Input()\n    public selectedValue: Date;\n    @Input()\n    public maxDate: Date;\n    @Input()\n    public minDate: Date;\n    @Property('setPickerType')\n    @Input()\n    public type: GC.InputMan.PickerType;\n    @Input()\n    public minuteInterval: GC.InputMan.Interval;\n    @Input()\n    public secondsInterval: GC.InputMan.Interval;\n    @Input()\n    public enabled: boolean;\n    @Input()\n    public visible: boolean;\n    @Property('showSeconds', \"\", false, false)\n    @Input()\n    public hasSeconds: boolean;\n    @Property('showMidnightAs24', \"\", false, false)\n    @Input()\n    public showMidnightAs24: boolean;\n    @Input()\n    public yearFormat: (curDate: Date) => string;\n    @Input()\n    public monthFormat: (curDate: Date) => string;\n    @Input()\n    public dayFormat: (curDate: Date) => string;\n    @Output()\n    public selectedDateChanged: EventEmitter<{sender: GC.InputMan.GcDateTimePicker, eArgs: any}> = new EventEmitter();\n    @Output()\n    public selectedValueChange: EventEmitter<Date> = new EventEmitter();\n\n    protected initGcComponent(): void {\n\n        var element = document.createElement('div');\n        this.createTemplate(element);\n        this._imCtrl = new GC.InputMan.GcDateTimePicker(element, this as any);\n    }\n\n    protected bindEvent(): void {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        this._imCtrl.addEventListener(GC.InputMan.GcDateTimePickerEvent.SelectedDateChanged, (sender, eventArgs) => {\n            this.selectedDateChanged.emit({ sender: sender, eArgs: eventArgs });\n            this.selectedValueChange.emit(this._imCtrl.getValue());\n            this.onChange(this._imCtrl.getValue());\n            this.onTouched();\n        });\n    }\n\n}","import { Component, ElementRef, Input } from '@angular/core';\nimport { GC } from '../inputman';\nimport { provideParent, GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-form-persistence',\n    template: `<ng-content></ng-content>`,\n    providers: [provideParent(GcFormPersistenceComponent)]\n})\nexport class GcFormPersistenceComponent extends GcComponents<GC.InputMan.GcFormPersistence> {\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    @Input()\n    public id: string;\n    @Input()\n    public storageMode: GC.InputMan.StorageMode;\n    @Input()\n    public saveMode: GC.InputMan.SaveMode;\n\n    protected initGcComponent(): void {\n        var form = this._container.querySelector('form');\n        if (form) {\n            this._imCtrl = new GC.InputMan.GcFormPersistence(form, this as any);\n            this._imCtrl.persist();\n        }\n    }\n\n    protected bindEvent(): void { }\n}","import { Component, Input, ContentChildren, QueryList, Output, ElementRef, EventEmitter } from '@angular/core';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-function-key-info',\n    template: ``\n})\nexport class GcFunctionKeyInfoComponent {\n    @Input()\n    key: GC.InputMan.FunctionKey;\n    @Input()\n    description: string;\n    @Input()\n    tipText: string;\n    @Input()\n    displayStyle: GC.InputMan.DisplayStyle;\n    @Input()\n    imagePosition: GC.InputMan.ImagePosition;\n}\n\n@Component({\n    selector: 'gc-function-key',\n    template: ``\n})\nexport class GcFunctionKeyComponent extends GcComponents<GC.InputMan.GcFunctionKey> {\n    @Input() keyRepeat: boolean;\n    @Input() handleMouse: boolean;\n    @Input() showTip: boolean;\n    @Input() combinationKeyDisplayMode: GC.InputMan.CombinationKeyDisplayMode;\n    @Property(\"addFunctionKey\", \"\", true)\n    @Input() functionKeys: (GC.InputMan.FunctionKeyInfo | GC.InputMan.FunctionKey)[];\n    @Input() enabled: boolean;\n    @Input() visible: boolean;\n    @ContentChildren(GcFunctionKeyInfoComponent)\n    public functionKeyComponents: QueryList<GcFunctionKeyInfoComponent>;\n\n\n    @Output() onActived: EventEmitter<GC.InputMan.KeyActivateArgs> = new EventEmitter();\n\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    protected initGcComponent(): void {\n        if (this.functionKeyComponents && this.functionKeyComponents.length > 0) {\n            this.functionKeys = [];\n            this.functionKeyComponents.forEach((functionKeyInfo: GcFunctionKeyInfoComponent) => {\n                this.functionKeys.push({\n                    key: functionKeyInfo.key,\n                    description: functionKeyInfo.description,\n                    tipText: functionKeyInfo.tipText,\n                    displayStyle: functionKeyInfo.displayStyle,\n                    imagePosition: functionKeyInfo.imagePosition\n                });\n            });\n        }\n\n        var element = document.createElement('div');\n        this.createTemplate(element);\n\n        this._imCtrl = new GC.InputMan.GcFunctionKey(element, this as any);\n    }\n\n    protected bindEvent() {\n        if (!this._imCtrl) return;\n\n        this._imCtrl.onActived((s, e) => {\n            this.onActived.emit(e);\n        });\n    }\n}\n","import { Component, AfterViewInit, ElementRef, Optional, Input } from '@angular/core';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-icon-notifier',\n    template: ``,\n})\nexport class GcIconNotifierComponent extends GcComponents<GC.InputMan.GcIconNotifier> implements AfterViewInit {\n\n    public ngAfterViewInit() {\n        if (!this._parent || typeof this._parent !== 'object' ||\n            typeof this._parent.getNestedIMControl() !== 'object') {\n            return;\n        }\n        this._imCtrl = new GC.InputMan.GcIconNotifier(this._parent.getNestedIMControl(), this as any);\n        this.onInitialized.emit(this._imCtrl);\n    }\n\n    protected bindEvent() { }\n    constructor(ref: ElementRef, @Optional() private _parent: GcComponents<GC.InputMan.GcInputManBase | GC.InputMan.GcComboBox>) {\n        super(ref);\n    }\n\n    @Input()\n    public direction: GC.InputMan.IconDirection;\n    @Property('setFailIconSrc')\n    @Input()\n    public failIcon: string;\n    @Property('setSuccessIconSrc')\n    @Input()\n    public successIcon: string;\n    @Input()\n    public failMessage: string;\n    @Input()\n    public successMessage: string;\n\n    protected initGcComponent(): void {\n    }\n\n    public onFail(): void {\n        return this._imCtrl.onFail();\n    }\n\n    public onSuccess(): void {\n        return this._imCtrl.onSuccess();\n    }\n\n    public onClear(): void {\n        return this._imCtrl.onClear();\n    }\n\n}","import { Component, Input, ElementRef, Output, ContentChildren, QueryList, EventEmitter } from '@angular/core';\nimport { GC } from '../inputman';\nimport { Property } from '../common';\nimport { GcComponents } from './GcComponents';\n\n@Component({\n    selector: 'gc-list-box-column',\n    template: ``,\n})\nexport class GcListBoxColumnComponent {\n\n\n    @Input()\n    public name: string;\n    @Input()\n    public label: string;\n    @Input()\n    public width: number | string;\n    @Input()\n    public isValuePath: boolean;\n    @Input()\n    public visible: boolean;\n    @Input()\n    public clickSort: boolean;\n    @Input()\n    public contentAlignment: GC.InputMan.Alignment;\n    @Input()\n    public headerAlignment: GC.InputMan.Alignment;\n    @Input()\n    public showTip: boolean;\n}\n\n@Component({\n    selector: 'gc-list-box',\n    template: ``,\n})\nexport class GcListBoxComponent extends GcComponents<GC.InputMan.GcListBox> {\n\n    constructor(ref: ElementRef) {\n        super(ref);\n    }\n\n    @Input()\n    public items: Array<object> | Array<string>;\n    @Input()\n    public columns: Array<GC.InputMan.ColumnConfig>;\n    @Input()\n    public virtualMode: boolean;\n    @Input()\n    public allowResize: boolean;\n    @Input()\n    public selectionMode: string | GC.InputMan.ListBoxSelectionMode;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public selectedIndex: number;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public checkedIndex: number;\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public selectedIndices: number[];\n    @Input()\n    @Property(\"\", \"\", false, false)\n    public checkedIndices: number[];\n    @Input()\n    public allowColumnResize: boolean;\n    @Input()\n    public overflow: string | GC.InputMan.ScrollBars;\n    @Property(\"resizeWidth\")\n    @Input()\n    public width: number | 'auto';\n    @Property(\"resizeHeight\")\n    @Input()\n    public height: number;\n    @Input()\n    public itemHeight: number;\n    @Input()\n    public checkOnClick: boolean;\n    @Property('setVisibleItemCount')\n    @Input()\n    public visibleItems: number;\n    @Input()\n    public visible: boolean;\n    @Input()\n    public enabled: boolean;\n    @Input()\n    public showTip: boolean;\n    @Input()\n    public multiColumn: boolean;\n    @Input()\n    public colHeaderHeight: number;\n    @Input()\n    public showHeader: boolean;\n    @Input()\n    public valueMemberPath: string;\n    @Input()\n    public displayMemberPath: string;\n    @Input()\n    public showCheckBox: boolean;\n    @Input()\n    public itemTemplate: string | string[];\n    @Input()\n    public headerTemplate: string\n    @Input()\n    public footerTemplate: string;\n    @Input()\n    public load: (context: GC.InputMan.ILoadContext) => void;\n    @Input()\n    public pageSize: number;\n    @Input()\n    public dragDrop: boolean;\n    @Input()\n    public dragSource: GC.InputMan.ListBoxDragSource;\n    @Input()\n    public generatingItem: (args: GC.InputMan.IItemGeneratingArgs) => void;\n    @Input()\n    public selectTemplate: (args: GC.InputMan.ITemplateSelectArgs) => string;\n    @Input()\n    public formatItem: (args: GC.InputMan.IItemArgs) => void;\n    @Output()\n    public checkedChanged: EventEmitter<GC.InputMan.GcListBox> = new EventEmitter();\n    @Output()\n    public selectedChanged: EventEmitter<GC.InputMan.GcListBox> = new EventEmitter();\n    @Output()\n    public focusedChanged: EventEmitter<GC.InputMan.GcListBox> = new EventEmitter();\n    @Output()\n    public itemClick: EventEmitter<{sender: GC.InputMan.GcListBox, eArgs: any}> = new EventEmitter();\n    @Output()\n    public loadComplete: EventEmitter<GC.InputMan.GcListBox> = new EventEmitter();\n    @Output()\n    public itemsChanged: EventEmitter<GC.InputMan.GcListBox> = new EventEmitter();\n    @Output()\n    public selectedIndexChange: EventEmitter<number> = new EventEmitter();\n    @Output()\n    public checkedIndexChange: EventEmitter<number> = new EventEmitter();\n    @Output()\n    public selectedIndicesChange: EventEmitter<Array<number>> = new EventEmitter();\n    @Output()\n    public checkedIndicesChange: EventEmitter<Array<number>> = new EventEmitter();\n    @Output()\n    public dropping: EventEmitter<GC.InputMan.DropEventArgs> = new EventEmitter();\n    @Output()\n    public dropped: EventEmitter<GC.InputMan.DropEventArgs> = new EventEmitter();\n\n    @ContentChildren(GcListBoxColumnComponent)\n    public columnComponents: QueryList<GcListBoxColumnComponent>;\n\n    protected initGcComponent(): void {\n        if (this.columnComponents && this.columnComponents.length > 0) {\n            this.columns = [];\n            this.columnComponents.forEach((column: GcListBoxColumnComponent) => {\n                this.columns.push({\n                    name: column.name,\n                    label: column.label,\n                    width: column.width,\n                    isValuePath: column.isValuePath,\n                    visible: column.visible,\n                    clickSort: column.clickSort,\n                    contentAlignment: column.contentAlignment,\n                    headerAlignment: column.headerAlignment,\n                    showTip: column.showTip\n                });\n            });\n        }\n        var element = document.createElement('select');\n        this.createTemplate(element);\n        this._imCtrl = new GC.InputMan.GcListBox(element, this as any);\n    }\n\n\n    protected bindEvent(): void {\n        if (!this._imCtrl) {\n            return;\n        }\n\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.CheckedChanged, (eventArgs) => {\n            this.checkedChanged.emit(eventArgs);\n            this.checkedIndexChange.emit(this._imCtrl.getCheckedIndices()[0]);\n            this.checkedIndicesChange.emit(this._imCtrl.getCheckedIndices());\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.SelectedChanged, (eventArgs) => {\n            this.selectedChanged.emit(eventArgs);\n            this.selectedIndexChange.emit(this._imCtrl.getSelectedIndex());\n            this.selectedIndicesChange.emit(this._imCtrl.getSelectedIndices());\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.FocusedChanged, (eventArgs) => {\n            this.focusedChanged.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.ItemClick, (sender, eventArgs) => {\n            this.itemClick.emit({ sender: sender, eArgs: eventArgs });\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.LoadComplete, (eventArgs) => {\n            this.loadComplete.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.ItemsChanged, (eventArgs) => {\n            this.itemsChanged.emit(eventArgs);\n        });\n        this._imCtrl.addEventListener(GC.InputMan.GcListBoxEvent.Dropping, (sender, eventArgs: GC.InputMan.DropEventArgs) => {\n            this.dropp