igniteui-angular-inputs 16.1.0-beta.1

package/esm2015/lib/igx-x-prefix-dynamic-module.js

@@ -0,0 +1,45 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IgxChildContentDynamicModule } from "igniteui-angular-core";
+import { IgxXPrefixComponent } from './igx-x-prefix-component';
+import { XPrefix } from './XPrefix';
+import { TypeRegistrar } from "igniteui-angular-core";
+import { IgxXPrefixModule } from './igx-x-prefix-module';
+import * as i0 from "@angular/core";
+export let IgxXPrefixDynamicModule = /*@__PURE__*/ (() => {
+    class IgxXPrefixDynamicModule {
+        constructor() {
+            TypeRegistrar.registerCons('XPrefix', XPrefix);
+            TypeRegistrar.registerCons('IgxXPrefixComponent', IgxXPrefixComponent);
+            TypeRegistrar.register('XPrefix', XPrefix.$type);
+        }
+    }
+    IgxXPrefixDynamicModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixDynamicModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    IgxXPrefixDynamicModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixDynamicModule, imports: [CommonModule, IgxChildContentDynamicModule,
+            IgxXPrefixModule], exports: [IgxChildContentDynamicModule,
+            IgxXPrefixModule] });
+    IgxXPrefixDynamicModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixDynamicModule, imports: [[CommonModule, IgxChildContentDynamicModule,
+                IgxXPrefixModule
+            ], IgxChildContentDynamicModule,
+            IgxXPrefixModule] });
+    return IgxXPrefixDynamicModule;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixDynamicModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    exports: [IgxChildContentDynamicModule,
+                        IgxXPrefixModule
+                    ],
+                    imports: [CommonModule, IgxChildContentDynamicModule,
+                        IgxXPrefixModule
+                    ],
+                    entryComponents: [IgxXPrefixComponent]
+                }]
+        }], ctorParameters: function () { return []; } });

package/esm2015/lib/igx-x-prefix-module.js

@@ -0,0 +1,39 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IgxChildContentModule } from "igniteui-angular-core";
+import { IgxXPrefixComponent } from './igx-x-prefix-component';
+import { XPrefix } from './XPrefix';
+import { TypeRegistrar } from "igniteui-angular-core";
+import * as i0 from "@angular/core";
+export let IgxXPrefixModule = /*@__PURE__*/ (() => {
+    class IgxXPrefixModule {
+        constructor() {
+            TypeRegistrar.registerCons('IgxXPrefixComponent', IgxXPrefixComponent);
+            TypeRegistrar.register('XPrefix', XPrefix.$type);
+        }
+    }
+    IgxXPrefixModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    IgxXPrefixModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixModule, declarations: [IgxXPrefixComponent], imports: [CommonModule, IgxChildContentModule], exports: [IgxChildContentModule,
+            IgxXPrefixComponent] });
+    IgxXPrefixModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixModule, imports: [[CommonModule, IgxChildContentModule
+            ], IgxChildContentModule] });
+    return IgxXPrefixModule;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXPrefixModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [IgxXPrefixComponent],
+                    exports: [IgxChildContentModule,
+                        IgxXPrefixComponent
+                    ],
+                    imports: [CommonModule, IgxChildContentModule
+                    ],
+                    entryComponents: []
+                }]
+        }], ctorParameters: function () { return []; } });

package/esm2015/lib/igx-x-ripple-component.js

@@ -0,0 +1,322 @@
+import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
+import { XRipple } from "./XRipple";
+import { brushToString, stringToBrush, ensureBool, toSpinal, initializePropertiesFromCss, NamePatcher } from "igniteui-angular-core";
+import { AngularRenderer } from "igniteui-angular-core";
+import * as i0 from "@angular/core";
+export let IgxXRippleComponent = /*@__PURE__*/ (() => {
+    class IgxXRippleComponent {
+        constructor(renderer, _elRef, ngZone, injector, componentFactoryResolver) {
+            this.renderer = renderer;
+            this._elRef = _elRef;
+            this.ngZone = ngZone;
+            this.injector = injector;
+            this.componentFactoryResolver = componentFactoryResolver;
+            this._wrapper = null;
+            this._root = null;
+            this._implementation = null;
+            this.__p = null;
+            this._hasUserValues = new Set();
+            this._stylingContainer = null;
+            this._stylingParent = null;
+            this._inStyling = false;
+            this._zoneRunner = null;
+            if (this._styling) {
+                NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
+            }
+            this._implementation = this.createImplementation();
+            this._implementation.externalObject = this;
+            if (renderer) {
+                this.container = renderer.createElement("div");
+                renderer.appendChild(_elRef.element.nativeElement, this.container);
+                renderer.setStyle(this.container, "display", "block");
+            }
+            var root;
+            root = this.container;
+            if (this.container != null) {
+                root = this.container;
+            }
+            if (root && root.nativeElement) {
+                root = root.nativeElement;
+            }
+            this._root = root;
+            var ripple = this.i;
+            this._ripple = ripple;
+            if (renderer) {
+                var ren = new AngularRenderer(root, this.renderer, window.document, this.ngZone, true, {});
+                this._wrapper = ren;
+                ripple.provideContainer(ren);
+            }
+        }
+        set height(value) {
+            this._height = value;
+            this._wrapper.rootWrapper.setStyleProperty("height", value);
+        }
+        get height() {
+            return this._height;
+        }
+        set width(value) {
+            this._width = value;
+            this._wrapper.rootWrapper.setStyleProperty("width", value);
+        }
+        get width() {
+            return this._width;
+        }
+        set top(value) {
+            this._top = value;
+            this._wrapper.rootWrapper.setStyleProperty("top", value);
+        }
+        get top() {
+            return this._top;
+        }
+        set left(value) {
+            this._left = value;
+            this._wrapper.rootWrapper.setStyleProperty("left", value);
+        }
+        get left() {
+            return this._left;
+        }
+        set position(value) {
+            this._position = value;
+            this._wrapper.rootWrapper.setStyleProperty("position", value);
+        }
+        get position() {
+            return this._position;
+        }
+        // supports angular themes or custom properties set in CSS
+        updateStyle() {
+            this._styling(this._root, this);
+        }
+        ngOnDestroy() {
+            this._ripple.destroy();
+            this._wrapper.destroy();
+        }
+        ngAfterContentInit() {
+            this._styling(this._root, this);
+            this.updateStyle();
+        }
+        createImplementation() {
+            return new XRipple();
+        }
+        get i() {
+            return this._implementation;
+        }
+        /**
+     * Gets or sets the target element to inject ripples into.
+    */
+        get eventSource() {
+            return this.i.q;
+        }
+        set eventSource(v) {
+            this.i.q = v;
+        }
+        /**
+         * Gets or sets the color to use for the background when the checkbox is unchecked.
+        */
+        get rippleColor() {
+            return brushToString(this.i.ax);
+        }
+        set rippleColor(v) {
+            this.i.ax = stringToBrush(v);
+        }
+        /**
+         * Gets or sets the color to use for the background when the ripple is hovered.
+        */
+        get hoverColor() {
+            return brushToString(this.i.aw);
+        }
+        set hoverColor(v) {
+            this.i.aw = stringToBrush(v);
+        }
+        /**
+         * Gets or sets the actual color to use for the background when the ripple is hovered.
+        */
+        get actualHoverColor() {
+            return brushToString(this.i.as);
+        }
+        set actualHoverColor(v) {
+            this.i.as = stringToBrush(v);
+        }
+        /**
+         * Gets or sets the color to use for the actual background when the checkbox is unchecked.
+        */
+        get actualRippleColor() {
+            return brushToString(this.i.at);
+        }
+        set actualRippleColor(v) {
+            this.i.at = stringToBrush(v);
+        }
+        /**
+         * Gets or sets the duration to use for the ripple animation.
+        */
+        get rippleDuration() {
+            return this.i.o;
+        }
+        set rippleDuration(v) {
+            this.i.o = +v;
+        }
+        /**
+         * Gets or sets if the ripple is disabled.
+        */
+        get isDisabled() {
+            return this.i.i;
+        }
+        set isDisabled(v) {
+            this.i.i = ensureBool(v);
+        }
+        /**
+         * Gets or sets if the ripple is centered.
+        */
+        get isCentered() {
+            return this.i.h;
+        }
+        set isCentered(v) {
+            this.i.h = ensureBool(v);
+        }
+        /**
+         * Gets or sets if the ripple is centered.
+        */
+        get isHoverEnabled() {
+            return this.i.k;
+        }
+        set isHoverEnabled(v) {
+            this.i.k = ensureBool(v);
+        }
+        findByName(name) {
+            if (this.findEphemera) {
+                if (name && name.indexOf("@@e:") == 0) {
+                    return this.findEphemera(name);
+                }
+            }
+            return null;
+        }
+        get hasUserValues() {
+            return this._hasUserValues;
+        }
+        __m(propertyName) {
+            if (!this._inStyling) {
+                this._hasUserValues.add(propertyName);
+            }
+        }
+        _styling(container, component, parent) {
+            if (this._inStyling) {
+                return;
+            }
+            this._inStyling = true;
+            this._stylingContainer = container;
+            this._stylingParent = component;
+            let genericPrefix = "";
+            let typeName = this.i.$type.name;
+            if (typeName.indexOf("Xam") === 0) {
+                typeName = typeName.substring(3);
+            }
+            genericPrefix = toSpinal("XRippleComponent");
+            let additionalPrefixes = [];
+            let prefix = toSpinal(typeName);
+            additionalPrefixes.push(prefix + "-");
+            let b = this.i.$type.baseType;
+            while (b && b.name != "Object" &&
+                b.name != "Base" &&
+                b.name != "Control" &&
+                b.Name != "DependencyObject" &&
+                b.Name != "FrameworkElement") {
+                typeName = b.name;
+                if (typeName.indexOf("Xam") === 0) {
+                    typeName = typeName.substring(3);
+                }
+                let basePrefix = toSpinal(typeName);
+                additionalPrefixes.push(basePrefix + "-");
+                b = b.baseType;
+            }
+            if (parent) {
+                let parentTypeName = parent.i.$type.name;
+                if (parentTypeName.indexOf("Xam") === 0) {
+                    parentTypeName = parentTypeName.substring(3);
+                }
+                let parentPrefix = toSpinal(parentTypeName);
+                additionalPrefixes.push(parentPrefix + "-" + genericPrefix + "-");
+                additionalPrefixes.push(parentPrefix + "-" + prefix + "-");
+            }
+            initializePropertiesFromCss(container, this, genericPrefix + "-", this.hasUserValues, false, additionalPrefixes);
+            if (this._otherStyling) {
+                this._otherStyling(container, component, parent);
+            }
+            this._inStyling = false;
+        }
+        onDetachedFromUI() {
+            this.i.onDetachedFromUI();
+        }
+        onAttachedToUI() {
+            this.i.onAttachedToUI();
+        }
+        /**
+         * Exports visual information about the current state of the grid.
+        
+        */
+        exportVisualModel() {
+            let iv = this.i.r();
+            return (iv);
+        }
+        /**
+         * Returns a serialized copy of the exported visual model
+        
+        */
+        exportSerializedVisualModel() {
+            let iv = this.i.v();
+            return (iv);
+        }
+        _runInZone(act) {
+            if (this._zoneRunner != null) {
+                this._zoneRunner(act);
+            }
+            else {
+                act();
+            }
+        }
+    }
+    IgxXRippleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+    IgxXRippleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxXRippleComponent, selector: "igx-x-ripple", inputs: { height: "height", width: "width", top: "top", left: "left", position: "position", eventSource: "eventSource", rippleColor: "rippleColor", hoverColor: "hoverColor", actualHoverColor: "actualHoverColor", actualRippleColor: "actualRippleColor", rippleDuration: "rippleDuration", isDisabled: "isDisabled", isCentered: "isCentered", isHoverEnabled: "isHoverEnabled" }, host: { classAttribute: "ig-x-ripple igx-x-ripple" }, providers: [], ngImport: i0, template: ``, isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: block;           \n\t\t}\n\t"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    return IgxXRippleComponent;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'igx-x-ripple',
+                    template: ``,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [],
+                    host: { 'class': 'ig-x-ripple igx-x-ripple' },
+                    styles: [`
+		:host {
+			display: block;           
+		}
+	`]
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { height: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], top: [{
+                type: Input
+            }], left: [{
+                type: Input
+            }], position: [{
+                type: Input
+            }], eventSource: [{
+                type: Input
+            }], rippleColor: [{
+                type: Input
+            }], hoverColor: [{
+                type: Input
+            }], actualHoverColor: [{
+                type: Input
+            }], actualRippleColor: [{
+                type: Input
+            }], rippleDuration: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], isCentered: [{
+                type: Input
+            }], isHoverEnabled: [{
+                type: Input
+            }] } });

package/esm2015/lib/igx-x-ripple-dynamic-module.js

@@ -0,0 +1,38 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IgxXRippleComponent } from './igx-x-ripple-component';
+import { XRipple } from './XRipple';
+import { TypeRegistrar } from "igniteui-angular-core";
+import { IgxXRippleModule } from './igx-x-ripple-module';
+import * as i0 from "@angular/core";
+export let IgxXRippleDynamicModule = /*@__PURE__*/ (() => {
+    class IgxXRippleDynamicModule {
+        constructor() {
+            TypeRegistrar.registerCons('XRipple', XRipple);
+            TypeRegistrar.registerCons('IgxXRippleComponent', IgxXRippleComponent);
+            TypeRegistrar.register('XRipple', XRipple.$type);
+        }
+    }
+    IgxXRippleDynamicModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleDynamicModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    IgxXRippleDynamicModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleDynamicModule, imports: [CommonModule, IgxXRippleModule], exports: [IgxXRippleModule] });
+    IgxXRippleDynamicModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleDynamicModule, imports: [[CommonModule, IgxXRippleModule
+            ], IgxXRippleModule] });
+    return IgxXRippleDynamicModule;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleDynamicModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    exports: [IgxXRippleModule
+                    ],
+                    imports: [CommonModule, IgxXRippleModule
+                    ],
+                    entryComponents: [IgxXRippleComponent]
+                }]
+        }], ctorParameters: function () { return []; } });

package/esm2015/lib/igx-x-ripple-module.js

@@ -0,0 +1,36 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { IgxXRippleComponent } from './igx-x-ripple-component';
+import { XRipple } from './XRipple';
+import { TypeRegistrar } from "igniteui-angular-core";
+import * as i0 from "@angular/core";
+export let IgxXRippleModule = /*@__PURE__*/ (() => {
+    class IgxXRippleModule {
+        constructor() {
+            TypeRegistrar.registerCons('IgxXRippleComponent', IgxXRippleComponent);
+            TypeRegistrar.register('XRipple', XRipple.$type);
+        }
+    }
+    IgxXRippleModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    IgxXRippleModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleModule, declarations: [IgxXRippleComponent], imports: [CommonModule], exports: [IgxXRippleComponent] });
+    IgxXRippleModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleModule, imports: [[CommonModule,
+            ]] });
+    return IgxXRippleModule;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXRippleModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [IgxXRippleComponent],
+                    exports: [IgxXRippleComponent
+                    ],
+                    imports: [CommonModule,
+                    ],
+                    entryComponents: []
+                }]
+        }], ctorParameters: function () { return []; } });

package/esm2015/lib/igx-x-suffix-component.js

@@ -0,0 +1,165 @@
+import { TemplateRef, Component, ViewContainerRef, ViewChild, Input, ChangeDetectionStrategy, HostBinding } from '@angular/core';
+import { XSuffix } from "./XSuffix";
+import { ensureBool, NamePatcher } from "igniteui-angular-core";
+import { AngularRenderer, PortalManager } from "igniteui-angular-core";
+import { IgxXInputGroupItemComponent } from './igx-x-input-group-item-component';
+import * as i0 from "@angular/core";
+export let IgxXSuffixComponent = /*@__PURE__*/ (() => {
+    class IgxXSuffixComponent extends IgxXInputGroupItemComponent {
+        constructor(renderer, _elRef, ngZone, injector, componentFactoryResolver) {
+            super();
+            this.renderer = renderer;
+            this._elRef = _elRef;
+            this.ngZone = ngZone;
+            this.injector = injector;
+            this.componentFactoryResolver = componentFactoryResolver;
+            this._wrapper = null;
+            this._portalManager = null;
+            this._root = null;
+            if (this._styling) {
+                NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
+            }
+            this._implementation = this.createImplementation();
+            this._implementation.externalObject = this;
+            if (renderer) {
+                this.container = renderer.createElement("div");
+                renderer.appendChild(_elRef.element.nativeElement, this.container);
+                renderer.setStyle(this.container, "display", "inline-block");
+            }
+            var root;
+            root = this.container;
+            if (this.container != null) {
+                root = this.container;
+            }
+            if (root && root.nativeElement) {
+                root = root.nativeElement;
+            }
+            this._root = root;
+            var suffix = this.i;
+            this._suffix = suffix;
+            if (renderer) {
+                this._portalManager = new PortalManager("suffixContent", componentFactoryResolver);
+                var ren = new AngularRenderer(root, this.renderer, window.document, this.ngZone, true, {}, this._portalManager);
+                this._wrapper = ren;
+                suffix.provideContainer(ren);
+            }
+        }
+        // supports angular themes or custom properties set in CSS
+        updateStyle() {
+            this._styling(this._root, this);
+        }
+        ngOnDestroy() {
+            this._suffix.destroy();
+            this._wrapper.destroy();
+        }
+        ngAfterViewInit() {
+            this._portalManager.dynamicContent = this._dynamicContent;
+            this._portalManager.onChildContentChanged(this._childTemplateRef);
+            this._styling(this._root, this);
+            this.updateStyle();
+        }
+        createImplementation() {
+            return new XSuffix();
+        }
+        get i() {
+            return this._implementation;
+        }
+        /**
+     * Gets or sets the id to use for the checkbox.
+    */
+        get id() {
+            return this.i.z;
+        }
+        set id(v) {
+            this.i.z = v;
+        }
+        /**
+         * Gets or sets the value of the aria-label attribute.
+        */
+        get ariaLabel() {
+            return this.i.w;
+        }
+        set ariaLabel(v) {
+            this.i.w = v;
+        }
+        /**
+         * Gets or sets whether the suffix is hovered.
+        */
+        get isHover() {
+            return this.i.q;
+        }
+        set isHover(v) {
+            this.i.q = ensureBool(v);
+        }
+        /**
+         * Gets or sets whether the checkbox is disabled.
+        */
+        get disabled() {
+            return this.i.disabled;
+        }
+        set disabled(v) {
+            this.i.disabled = ensureBool(v);
+        }
+        onDetachedFromUI() {
+            this.i.onDetachedFromUI();
+        }
+        onAttachedToUI() {
+            this.i.onAttachedToUI();
+        }
+        /**
+         * Exports visual information about the current state of the grid.
+        
+        */
+        exportVisualModel() {
+            let iv = this.i.t();
+            return (iv);
+        }
+        /**
+         * Returns a serialized copy of the exported visual model
+        
+        */
+        exportSerializedVisualModel() {
+            let iv = this.i.y();
+            return (iv);
+        }
+    }
+    IgxXSuffixComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXSuffixComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+    IgxXSuffixComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxXSuffixComponent, selector: "igx-x-suffix", inputs: { id: "id", ariaLabel: ["aria-label", "ariaLabel"], isHover: "isHover", disabled: "disabled" }, host: { properties: { "attr.id": "this.id" }, classAttribute: "ig-x-suffix igx-x-suffix" }, providers: [], viewQueries: [{ propertyName: "_dynamicContent", first: true, predicate: ["dynamicContent"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "_childTemplateRef", first: true, predicate: ["childContent"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: `<ng-template #childContent><ng-content></ng-content></ng-template>
+<ng-container #dynamicContent></ng-container>`, isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: inline-block;  \n            vertical-align: middle;         \n\t\t}\n\t"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    return IgxXSuffixComponent;
+})();
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXSuffixComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'igx-x-suffix',
+                    template: `<ng-template #childContent><ng-content></ng-content></ng-template>
+<ng-container #dynamicContent></ng-container>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [],
+                    host: { 'class': 'ig-x-suffix igx-x-suffix' },
+                    styles: [`
+		:host {
+			display: inline-block;  
+            vertical-align: middle;         
+		}
+	`]
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { _dynamicContent: [{
+                type: ViewChild,
+                args: ["dynamicContent", { read: ViewContainerRef, static: true }]
+            }], _childTemplateRef: [{
+                type: ViewChild,
+                args: ["childContent", { read: TemplateRef, static: false }]
+            }], id: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }, {
+                type: Input
+            }], ariaLabel: [{
+                type: Input,
+                args: ['aria-label']
+            }], isHover: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }] } });