igniteui-webcomponents-inputs 1.3.3

package/esm5/lib/igc-button-component.js

@@ -0,0 +1,2722 @@
+import * as tslib_1 from "tslib";
+import { Button } from "./Button";
+import { ensureEnum, brushToString, stringToBrush, ensureBool, initializePropertiesFromCss, NamePatcher, toSpinal, enumToString, getAllPropertyNames, fromSpinal } from "igniteui-webcomponents-core";
+import { FontInfo } from "igniteui-webcomponents-core";
+import { WebComponentRenderer, PortalManager } from "igniteui-webcomponents-core";
+import { delegateCombine, delegateRemove } from "igniteui-webcomponents-core";
+import { TypeRegistrar } from "igniteui-webcomponents-core";
+import { RegisterElementHelper } from "igniteui-webcomponents-core";
+import { CornerRadius } from "igniteui-webcomponents-core";
+import { ButtonDisplayStyle_$type } from './ButtonDisplayStyle';
+import { IgcButtonClickEventArgs } from './igc-button-click-event-args';
+import { ControlDisplayDensity_$type } from "igniteui-webcomponents-core";
+import { BaseControlTheme_$type } from "igniteui-webcomponents-core";
+import { ElevationMode_$type } from "igniteui-webcomponents-core";
+import { IgcHTMLElement } from "igniteui-webcomponents-core";
+var IgcButtonComponent = /** @class */ /*@__PURE__*/ (function (_super) {
+    tslib_1.__extends(IgcButtonComponent, _super);
+    function IgcButtonComponent() {
+        var _this = _super.call(this) || this;
+        _this._disconnected = false;
+        _this._settingAttributes = false;
+        _this._attached = false;
+        _this._queuedSetAttributes = [];
+        _this._updatingFromAttribute = false;
+        _this.__p = null;
+        _this._hasUserValues = new Set();
+        _this._stylingContainer = null;
+        _this._stylingParent = null;
+        _this._inStyling = false;
+        _this._clicked = null;
+        _this._clicked_wrapped = null;
+        if (_this._styling) {
+            NamePatcher.ensureStylablePatched(Object.getPrototypeOf(_this));
+        }
+        _this._portalManager = new PortalManager("buttonContent");
+        _this._renderer = new WebComponentRenderer(_this, document, true, {}, _this._portalManager);
+        _this._container = _this._renderer.createElement("div");
+        _this._renderer.updateRoot(_this._container);
+        _this._implementation = _this.createImplementation();
+        _this._implementation.externalObject = _this;
+        //this._container.setStyleProperty("width", "100%");
+        //this._container.setStyleProperty("height", "100%");
+        var root;
+        root = _this._container;
+        if (_this._container.getNativeElement() != null) {
+            root = _this._container.getNativeElement();
+        }
+        _this._wrapper = _this._renderer;
+        var button = _this.i;
+        _this._button = button;
+        button.provideContainer(_this._renderer);
+        _this._onChildrenChanged();
+        //Checkbox.notifySizeChanged();
+        var mut = new MutationObserver(function (list) {
+            var e_1, _b;
+            try {
+                for (var list_1 = tslib_1.__values(list), list_1_1 = list_1.next(); !list_1_1.done; list_1_1 = list_1.next()) {
+                    var mutation = list_1_1.value;
+                    if (mutation.type == 'childList') {
+                        _this._onChildrenChanged();
+                    }
+                }
+            }
+            catch (e_1_1) {
+                e_1 = { error: e_1_1 };
+            }
+            finally {
+                try {
+                    if (list_1_1 && !list_1_1.done && (_b = list_1.return))
+                        _b.call(list_1);
+                }
+                finally {
+                    if (e_1)
+                        throw e_1.error;
+                }
+            }
+        });
+        mut.observe(_this, {
+            childList: true
+        });
+        return _this;
+        //this._renderer.addSizeWatcher(() => {
+        //    this._checkbox.notifySizeChanged();
+        //});
+    }
+    IgcButtonComponent.prototype._onDisplayChanged = function () {
+        this.style.display = this.display;
+    };
+    IgcButtonComponent.prototype._onFlexDirectionChanged = function () {
+        this.style.flexDirection = this.flexDirection;
+    };
+    IgcButtonComponent.prototype._onFlexGrowChanged = function () {
+        this.style.flexGrow = this.flexGrow;
+    };
+    IgcButtonComponent.prototype._onAlignItemsChanged = function () {
+        this.style.alignItems = this.alignItems;
+    };
+    IgcButtonComponent.prototype._onChildrenChanged = function () {
+        var children = [];
+        for (var i = 0; i < this.childNodes.length; i++) {
+            var child = this.childNodes[i];
+            if (child !== this._container.getNativeElement()) {
+                children.push(child);
+            }
+        }
+        this._portalManager.onChildrenChanged(children);
+    };
+    // supports angular themes or custom properties set in CSS
+    IgcButtonComponent.prototype.updateStyle = function () {
+        this._styling(this, this);
+    };
+    IgcButtonComponent.prototype.destroy = function () {
+        this._button.destroy();
+        this._wrapper.destroy();
+    };
+    IgcButtonComponent.prototype.createImplementation = function () {
+        return new Button();
+    };
+    IgcButtonComponent.prototype.disconnectedCallback = function () {
+        this._disconnected = true;
+        if (this.i) {
+            this.i.onDetachedFromUI();
+        }
+    };
+    IgcButtonComponent.prototype.connectedCallback = function () {
+        if (this._disconnected) {
+            this._disconnected = false;
+            if (this.i) {
+                this.i.onAttachedToUI();
+            }
+            return;
+        }
+        this.classList.add("ig-button");
+        this.classList.add("igc-button");
+        this.appendChild(this._container.getNativeElement());
+        this._attached = true;
+        this.style.display = this.display;
+        //this.style.height = this._height;
+        //this.style.width = this._width;
+        this._flushQueuedAttributes();
+        // supports themes or custom properties set in CSS 
+        this._styling(this, this);
+        this.afterContentInit();
+    };
+    IgcButtonComponent.prototype.afterContentInit = function () {
+        //this.i.notifySizeChanged();
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "i", {
+        /**
+         * @hidden
+         */
+        get: function () {
+            return this._implementation;
+        } /**
+                                     * @hidden
+                                     */,
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent._createFromInternal = function (internal) {
+        if (!internal) {
+            return null;
+        }
+        if (!internal.$type) {
+            return null;
+        }
+        var name = internal.$type.name;
+        var externalName = "Igc" + name + "Component";
+        if (!TypeRegistrar.isRegistered(externalName)) {
+            return null;
+        }
+        return TypeRegistrar.create(externalName);
+    };
+    IgcButtonComponent.prototype._enqueueSetAttribute = function (attrName, attrValue) {
+        this._queuedSetAttributes.push({ attrName: attrName, attrValue: attrValue });
+    };
+    IgcButtonComponent.prototype._flushQueuedAttributes = function () {
+        this._settingAttributes = true;
+        for (var i = 0; i < this._queuedSetAttributes.length; i++) {
+            this.setAttribute(this._queuedSetAttributes[i].attrName, this._queuedSetAttributes[i].attrValue);
+        }
+        this._settingAttributes = false;
+        this._queuedSetAttributes.length = 0;
+    };
+    IgcButtonComponent.prototype._a = function (attrName, attrValue) {
+        if (this._updatingFromAttribute) {
+            return;
+        }
+        if (attrValue) {
+            attrValue = attrValue.toString();
+        }
+        this._settingAttributes = true;
+        attrName = toSpinal(attrName);
+        if (this._attached) {
+            this.setAttribute(attrName, attrValue);
+        }
+        else {
+            this._enqueueSetAttribute(attrName, attrValue);
+        }
+        this._settingAttributes = false;
+    };
+    Object.defineProperty(IgcButtonComponent, "observedAttributes", {
+        get: function () {
+            if (IgcButtonComponent._observedAttributesIgcButtonComponent == null) {
+                var names = getAllPropertyNames(IgcButtonComponent);
+                for (var i = 0; i < names.length; i++) {
+                    names[i] = toSpinal(names[i]);
+                }
+                IgcButtonComponent._observedAttributesIgcButtonComponent = names;
+            }
+            return IgcButtonComponent._observedAttributesIgcButtonComponent;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.attributeChangedCallback = function (name, oldValue, newValue) {
+        if (this._settingAttributes) {
+            return;
+        }
+        var setName = fromSpinal(name);
+        this._updatingFromAttribute = true;
+        this[setName] = newValue;
+        this._updatingFromAttribute = false;
+    };
+    IgcButtonComponent.register = function () {
+        if (!IgcButtonComponent._isElementRegistered) {
+            IgcButtonComponent._isElementRegistered = true;
+            RegisterElementHelper.registerElement(IgcButtonComponent.htmlTagName, IgcButtonComponent);
+        }
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "minWidth", {
+        /**
+     * Gets or sets the min width to use for the button.
+    */
+        get: function () {
+            return this.i.bh;
+        },
+        set: function (v) {
+            this.i.bh = +v;
+            this._a("minWidth", this.i.bh);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "minHeight", {
+        /**
+         * Gets or sets the min height to use for the button.
+        */
+        get: function () {
+            return this.i.bg;
+        },
+        set: function (v) {
+            this.i.bg = +v;
+            this._a("minHeight", this.i.bg);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "displayType", {
+        /**
+         * Gets or sets the display style to use for the button.
+        */
+        get: function () {
+            return this.i.s;
+        },
+        set: function (v) {
+            this.i.s = ensureEnum(ButtonDisplayStyle_$type, v);
+            this._a("displayType", enumToString(ButtonDisplayStyle_$type, this.i.s));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "density", {
+        /**
+         * Gets or sets the display density to use for the button.
+        */
+        get: function () {
+            return this.i.h;
+        },
+        set: function (v) {
+            this.i.h = ensureEnum(ControlDisplayDensity_$type, v);
+            this._a("density", enumToString(ControlDisplayDensity_$type, this.i.h));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "baseTheme", {
+        /**
+         * Gets or sets the base built in theme to use for the button.
+        */
+        get: function () {
+            return this.i.d;
+        },
+        set: function (v) {
+            this.i.d = ensureEnum(BaseControlTheme_$type, v);
+            this._a("baseTheme", enumToString(BaseControlTheme_$type, this.i.d));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDensity", {
+        /**
+         * Gets the actual display density to use for the label.
+        */
+        get: function () {
+            return this.i.g;
+        },
+        set: function (v) {
+            this.i.g = ensureEnum(ControlDisplayDensity_$type, v);
+            this._a("actualDensity", enumToString(ControlDisplayDensity_$type, this.i.g));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualBorderColor", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return brushToString(this.i.m9);
+        },
+        set: function (v) {
+            this.i.m9 = stringToBrush(v);
+            this._a("actualBorderColor", brushToString(this.i.m9));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualUmbraShadowColor", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return brushToString(this.i.nk);
+        },
+        set: function (v) {
+            this.i.nk = stringToBrush(v);
+            this._a("actualUmbraShadowColor", brushToString(this.i.nk));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualPenumbraShadowColor", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return brushToString(this.i.nh);
+        },
+        set: function (v) {
+            this.i.nh = stringToBrush(v);
+            this._a("actualPenumbraShadowColor", brushToString(this.i.nh));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualAmbientShadowColor", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return brushToString(this.i.m7);
+        },
+        set: function (v) {
+            this.i.m7 = stringToBrush(v);
+            this._a("actualAmbientShadowColor", brushToString(this.i.m7));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualRestingElevation", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return this.i.cg;
+        },
+        set: function (v) {
+            this.i.cg = +v;
+            this._a("actualRestingElevation", this.i.cg);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualFocusElevation", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return this.i.ce;
+        },
+        set: function (v) {
+            this.i.ce = +v;
+            this._a("actualFocusElevation", this.i.ce);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualHoverElevation", {
+        /**
+         * Gets or sets the color to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return this.i.cf;
+        },
+        set: function (v) {
+            this.i.cf = +v;
+            this._a("actualHoverElevation", this.i.cf);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualRippleColor", {
+        /**
+         * Gets or sets the color to use for the ripple when the button is pressed.
+        */
+        get: function () {
+            return brushToString(this.i.ni);
+        },
+        set: function (v) {
+            this.i.ni = stringToBrush(v);
+            this._a("actualRippleColor", brushToString(this.i.ni));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.kc ? this.i.kc.b : NaN;
+        },
+        set: function (v) {
+            this.ensureActualCornerRadius();
+            this.i.kc.b = +v;
+            this._a("actualCornerRadiusBottomRight", this.i.kc.b);
+            this.i.kc = this.i.kc;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.kc ? this.i.kc.a : NaN;
+        },
+        set: function (v) {
+            this.ensureActualCornerRadius();
+            this.i.kc.a = +v;
+            this._a("actualCornerRadiusBottomLeft", this.i.kc.a);
+            this.i.kc = this.i.kc;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.kc ? this.i.kc.c : NaN;
+        },
+        set: function (v) {
+            this.ensureActualCornerRadius();
+            this.i.kc.c = +v;
+            this._a("actualCornerRadiusTopLeft", this.i.kc.c);
+            this.i.kc = this.i.kc;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualCornerRadiusTopRight", {
+        get: function () {
+            return this.i.kc ? this.i.kc.d : NaN;
+        },
+        set: function (v) {
+            this.ensureActualCornerRadius();
+            this.i.kc.d = +v;
+            this._a("actualCornerRadiusTopRight", this.i.kc.d);
+            this.i.kc = this.i.kc;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureActualCornerRadius = function () {
+        if (this.i.kc) {
+            return;
+        }
+        this.i.kc = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "actualBackgroundColor", {
+        /**
+         * Gets the color to use for the actual background.
+        */
+        get: function () {
+            return brushToString(this.i.m8);
+        },
+        set: function (v) {
+            this.i.m8 = stringToBrush(v);
+            this._a("actualBackgroundColor", brushToString(this.i.m8));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDisabledBackgroundColor", {
+        /**
+         * Gets the actual color to use for the disabled background of the button.
+        */
+        get: function () {
+            return brushToString(this.i.na);
+        },
+        set: function (v) {
+            this.i.na = stringToBrush(v);
+            this._a("actualDisabledBackgroundColor", brushToString(this.i.na));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDisabledBorderColor", {
+        /**
+         * Gets the actual color to use for the disabled border of the button.
+        */
+        get: function () {
+            return brushToString(this.i.nb);
+        },
+        set: function (v) {
+            this.i.nb = stringToBrush(v);
+            this._a("actualDisabledBorderColor", brushToString(this.i.nb));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDisabledTextColor", {
+        /**
+         * Gets the actual color to use for the disabled text of the button.
+        */
+        get: function () {
+            return brushToString(this.i.nc);
+        },
+        set: function (v) {
+            this.i.nc = stringToBrush(v);
+            this._a("actualDisabledTextColor", brushToString(this.i.nc));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDisabledElevation", {
+        /**
+         * Gets the actual disabled elevation to use for the button.
+        */
+        get: function () {
+            return this.i.cd;
+        },
+        set: function (v) {
+            this.i.cd = +v;
+            this._a("actualDisabledElevation", this.i.cd);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualElevationMode", {
+        /**
+         * Gets the actual disabled elevation to use for the button.
+        */
+        get: function () {
+            return this.i.k;
+        },
+        set: function (v) {
+            this.i.k = ensureEnum(ElevationMode_$type, v);
+            this._a("actualElevationMode", enumToString(ElevationMode_$type, this.i.k));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualTextColor", {
+        /**
+         * Gets the color to use for the actual background.
+        */
+        get: function () {
+            return brushToString(this.i.nj);
+        },
+        set: function (v) {
+            this.i.nj = stringToBrush(v);
+            this._a("actualTextColor", brushToString(this.i.nj));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualHoverTextColor", {
+        /**
+         * Gets the color to use for the actual background.
+        */
+        get: function () {
+            return brushToString(this.i.ng);
+        },
+        set: function (v) {
+            this.i.ng = stringToBrush(v);
+            this._a("actualHoverTextColor", brushToString(this.i.ng));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualFocusBackgroundColor", {
+        /**
+         * Gets the color to use for the actual background.
+        */
+        get: function () {
+            return brushToString(this.i.nd);
+        },
+        set: function (v) {
+            this.i.nd = stringToBrush(v);
+            this._a("actualFocusBackgroundColor", brushToString(this.i.nd));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualFocusTextColor", {
+        /**
+         * Gets the actual color to use for the focused text.
+        */
+        get: function () {
+            return brushToString(this.i.ne);
+        },
+        set: function (v) {
+            this.i.ne = stringToBrush(v);
+            this._a("actualFocusTextColor", brushToString(this.i.ne));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualHoverBackgroundColor", {
+        /**
+         * Gets the hover color to use for the actual background.
+        */
+        get: function () {
+            return brushToString(this.i.nf);
+        },
+        set: function (v) {
+            this.i.nf = stringToBrush(v);
+            this._a("actualHoverBackgroundColor", brushToString(this.i.nf));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualBorderWidth", {
+        /**
+         * Gets or sets the Width to use for the check mark when the checkbox is checked.
+        */
+        get: function () {
+            return this.i.aw;
+        },
+        set: function (v) {
+            this.i.aw = +v;
+            this._a("actualBorderWidth", this.i.aw);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the background of the button when the  type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.tw);
+        },
+        set: function (v) {
+            this.i.tw = stringToBrush(v);
+            this._a("raisedBackgroundColor", brushToString(this.i.tw));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedDisabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.ty);
+        },
+        set: function (v) {
+            this.i.ty = stringToBrush(v);
+            this._a("raisedDisabledBackgroundColor", brushToString(this.i.ty));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedDisabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.tz);
+        },
+        set: function (v) {
+            this.i.tz = stringToBrush(v);
+            this._a("raisedDisabledBorderColor", brushToString(this.i.tz));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedDisabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.t0);
+        },
+        set: function (v) {
+            this.i.t0 = stringToBrush(v);
+            this._a("raisedDisabledTextColor", brushToString(this.i.t0));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedDisabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.ep;
+        },
+        set: function (v) {
+            this.i.ep = +v;
+            this._a("raisedDisabledElevation", this.i.ep);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedHoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the  type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.t3);
+        },
+        set: function (v) {
+            this.i.t3 = stringToBrush(v);
+            this._a("raisedHoverBackgroundColor", brushToString(this.i.t3));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedBorderColor", {
+        /**
+         * Gets or sets the border color to use for the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.tx);
+        },
+        set: function (v) {
+            this.i.tx = stringToBrush(v);
+            this._a("raisedBorderColor", brushToString(this.i.tx));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedRestingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.es;
+        },
+        set: function (v) {
+            this.i.es = +v;
+            this._a("raisedRestingElevation", this.i.es);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedHoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.er;
+        },
+        set: function (v) {
+            this.i.er = +v;
+            this._a("raisedHoverElevation", this.i.er);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedFocusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.eq;
+        },
+        set: function (v) {
+            this.i.eq = +v;
+            this._a("raisedFocusElevation", this.i.eq);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedBorderWidth", {
+        /**
+         * Gets or sets the width to use for the button border when the type is raised.
+        */
+        get: function () {
+            return this.i.bj;
+        },
+        set: function (v) {
+            this.i.bj = +v;
+            this._a("raisedBorderWidth", this.i.bj);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.ky ? this.i.ky.b : NaN;
+        },
+        set: function (v) {
+            this.ensureRaisedCornerRadius();
+            this.i.ky.b = +v;
+            this._a("raisedCornerRadiusBottomRight", this.i.ky.b);
+            this.i.ky = this.i.ky;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.ky ? this.i.ky.a : NaN;
+        },
+        set: function (v) {
+            this.ensureRaisedCornerRadius();
+            this.i.ky.a = +v;
+            this._a("raisedCornerRadiusBottomLeft", this.i.ky.a);
+            this.i.ky = this.i.ky;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.ky ? this.i.ky.c : NaN;
+        },
+        set: function (v) {
+            this.ensureRaisedCornerRadius();
+            this.i.ky.c = +v;
+            this._a("raisedCornerRadiusTopLeft", this.i.ky.c);
+            this.i.ky = this.i.ky;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedCornerRadiusTopRight", {
+        get: function () {
+            return this.i.ky ? this.i.ky.d : NaN;
+        },
+        set: function (v) {
+            this.ensureRaisedCornerRadius();
+            this.i.ky.d = +v;
+            this._a("raisedCornerRadiusTopRight", this.i.ky.d);
+            this.i.ky = this.i.ky;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureRaisedCornerRadius = function () {
+        if (this.i.ky) {
+            return;
+        }
+        this.i.ky = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedRippleColor", {
+        /**
+         * Gets or sets the color to use for the background when the button is pressed and the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.t5);
+        },
+        set: function (v) {
+            this.i.t5 = stringToBrush(v);
+            this._a("raisedRippleColor", brushToString(this.i.t5));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the background of the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.sv);
+        },
+        set: function (v) {
+            this.i.sv = stringToBrush(v);
+            this._a("flatBackgroundColor", brushToString(this.i.sv));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatDisabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.sx);
+        },
+        set: function (v) {
+            this.i.sx = stringToBrush(v);
+            this._a("flatDisabledBackgroundColor", brushToString(this.i.sx));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatDisabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.sy);
+        },
+        set: function (v) {
+            this.i.sy = stringToBrush(v);
+            this._a("flatDisabledBorderColor", brushToString(this.i.sy));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatDisabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.sz);
+        },
+        set: function (v) {
+            this.i.sz = stringToBrush(v);
+            this._a("flatDisabledTextColor", brushToString(this.i.sz));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatDisabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is flat.
+        */
+        get: function () {
+            return this.i.eb;
+        },
+        set: function (v) {
+            this.i.eb = +v;
+            this._a("flatDisabledElevation", this.i.eb);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatHoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.s2);
+        },
+        set: function (v) {
+            this.i.s2 = stringToBrush(v);
+            this._a("flatHoverBackgroundColor", brushToString(this.i.s2));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatBorderColor", {
+        /**
+         * Gets or sets the border color to use for the button when the type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.sw);
+        },
+        set: function (v) {
+            this.i.sw = stringToBrush(v);
+            this._a("flatBorderColor", brushToString(this.i.sw));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatRestingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button when the type is flat.
+        */
+        get: function () {
+            return this.i.ee;
+        },
+        set: function (v) {
+            this.i.ee = +v;
+            this._a("flatRestingElevation", this.i.ee);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatHoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button when the type is flat.
+        */
+        get: function () {
+            return this.i.ed;
+        },
+        set: function (v) {
+            this.i.ed = +v;
+            this._a("flatHoverElevation", this.i.ed);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatFocusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button when the type is flat.
+        */
+        get: function () {
+            return this.i.ec;
+        },
+        set: function (v) {
+            this.i.ec = +v;
+            this._a("flatFocusElevation", this.i.ec);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatRippleColor", {
+        /**
+         * Gets or sets the color to use for the background when the button is pressed and the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.s4);
+        },
+        set: function (v) {
+            this.i.s4 = stringToBrush(v);
+            this._a("flatRippleColor", brushToString(this.i.s4));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.s5);
+        },
+        set: function (v) {
+            this.i.s5 = stringToBrush(v);
+            this._a("flatTextColor", brushToString(this.i.s5));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatHoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button when type is flat.
+        */
+        get: function () {
+            return brushToString(this.i.s3);
+        },
+        set: function (v) {
+            this.i.s3 = stringToBrush(v);
+            this._a("flatHoverTextColor", brushToString(this.i.s3));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatFocusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused and flat.
+        */
+        get: function () {
+            return brushToString(this.i.s0);
+        },
+        set: function (v) {
+            this.i.s0 = stringToBrush(v);
+            this._a("flatFocusBackgroundColor", brushToString(this.i.s0));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatFocusTextColor", {
+        /**
+         * Gets or sets the color to use for the text the button when it is focused and flat.
+        */
+        get: function () {
+            return brushToString(this.i.s1);
+        },
+        set: function (v) {
+            this.i.s1 = stringToBrush(v);
+            this._a("flatFocusTextColor", brushToString(this.i.s1));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatBorderWidth", {
+        /**
+         * Gets or sets the width to use for the button border when the type is flat.
+        */
+        get: function () {
+            return this.i.be;
+        },
+        set: function (v) {
+            this.i.be = +v;
+            this._a("flatBorderWidth", this.i.be);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.kv ? this.i.kv.b : NaN;
+        },
+        set: function (v) {
+            this.ensureFlatCornerRadius();
+            this.i.kv.b = +v;
+            this._a("flatCornerRadiusBottomRight", this.i.kv.b);
+            this.i.kv = this.i.kv;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.kv ? this.i.kv.a : NaN;
+        },
+        set: function (v) {
+            this.ensureFlatCornerRadius();
+            this.i.kv.a = +v;
+            this._a("flatCornerRadiusBottomLeft", this.i.kv.a);
+            this.i.kv = this.i.kv;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.kv ? this.i.kv.c : NaN;
+        },
+        set: function (v) {
+            this.ensureFlatCornerRadius();
+            this.i.kv.c = +v;
+            this._a("flatCornerRadiusTopLeft", this.i.kv.c);
+            this.i.kv = this.i.kv;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flatCornerRadiusTopRight", {
+        get: function () {
+            return this.i.kv ? this.i.kv.d : NaN;
+        },
+        set: function (v) {
+            this.ensureFlatCornerRadius();
+            this.i.kv.d = +v;
+            this._a("flatCornerRadiusTopRight", this.i.kv.d);
+            this.i.kv = this.i.kv;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureFlatCornerRadius = function () {
+        if (this.i.kv) {
+            return;
+        }
+        this.i.kv = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "backgroundColor", {
+        /**
+         * Gets or sets the color to use for the background when the button regardless of type.
+        */
+        get: function () {
+            return brushToString(this.i.nl);
+        },
+        set: function (v) {
+            this.i.nl = stringToBrush(v);
+            this._a("backgroundColor", brushToString(this.i.nl));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is disabled.
+        */
+        get: function () {
+            return brushToString(this.i.sh);
+        },
+        set: function (v) {
+            this.i.sh = stringToBrush(v);
+            this._a("disabledBackgroundColor", brushToString(this.i.sh));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.si);
+        },
+        set: function (v) {
+            this.i.si = stringToBrush(v);
+            this._a("disabledBorderColor", brushToString(this.i.si));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.sj);
+        },
+        set: function (v) {
+            this.i.sj = stringToBrush(v);
+            this._a("disabledTextColor", brushToString(this.i.sj));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.d6;
+        },
+        set: function (v) {
+            this.i.d6 = +v;
+            this._a("disabledElevation", this.i.d6);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "elevationMode", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is raised.
+        */
+        get: function () {
+            return this.i.o;
+        },
+        set: function (v) {
+            this.i.o = ensureEnum(ElevationMode_$type, v);
+            this._a("elevationMode", enumToString(ElevationMode_$type, this.i.o));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "hoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the  type is hovered.
+        */
+        get: function () {
+            return brushToString(this.i.s8);
+        },
+        set: function (v) {
+            this.i.s8 = stringToBrush(v);
+            this._a("hoverBackgroundColor", brushToString(this.i.s8));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "borderColor", {
+        /**
+         * Gets or sets the border color to use for the button regardless of type.
+        */
+        get: function () {
+            return brushToString(this.i.nm);
+        },
+        set: function (v) {
+            this.i.nm = stringToBrush(v);
+            this._a("borderColor", brushToString(this.i.nm));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "restingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button regardless of type.
+        */
+        get: function () {
+            return this.i.et;
+        },
+        set: function (v) {
+            this.i.et = +v;
+            this._a("restingElevation", this.i.et);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "hoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button regardless of type.
+        */
+        get: function () {
+            return this.i.eg;
+        },
+        set: function (v) {
+            this.i.eg = +v;
+            this._a("hoverElevation", this.i.eg);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "focusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button regardless of type.
+        */
+        get: function () {
+            return this.i.ef;
+        },
+        set: function (v) {
+            this.i.ef = +v;
+            this._a("focusElevation", this.i.ef);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "textStyle", {
+        /**
+         * Gets or sets the use for the button.
+        */
+        get: function () {
+            if (this.i.v == null) {
+                return null;
+            }
+            return this.i.v.fontString;
+        },
+        set: function (v) {
+            var fi = new FontInfo();
+            fi.fontString = v;
+            this.i.v = fi;
+            this._a("textStyle", this.i.v != null ? this.i.v.fontString : "");
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "textColor", {
+        /**
+         * Gets or sets the color to use for the text of the button regardless of type.
+        */
+        get: function () {
+            return brushToString(this.i.t8);
+        },
+        set: function (v) {
+            this.i.t8 = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.t8));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "hoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button regardless of type.
+        */
+        get: function () {
+            return brushToString(this.i.s9);
+        },
+        set: function (v) {
+            this.i.s9 = stringToBrush(v);
+            this._a("hoverTextColor", brushToString(this.i.s9));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "rippleColor", {
+        /**
+         * Gets or sets the color to use for the background of the button regardless of type.
+        */
+        get: function () {
+            return brushToString(this.i.t7);
+        },
+        set: function (v) {
+            this.i.t7 = stringToBrush(v);
+            this._a("rippleColor", brushToString(this.i.t7));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.t6);
+        },
+        set: function (v) {
+            this.i.t6 = stringToBrush(v);
+            this._a("raisedTextColor", brushToString(this.i.t6));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedHoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button when type is raised.
+        */
+        get: function () {
+            return brushToString(this.i.t4);
+        },
+        set: function (v) {
+            this.i.t4 = stringToBrush(v);
+            this._a("raisedHoverTextColor", brushToString(this.i.t4));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedFocusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused and raised.
+        */
+        get: function () {
+            return brushToString(this.i.t1);
+        },
+        set: function (v) {
+            this.i.t1 = stringToBrush(v);
+            this._a("raisedFocusBackgroundColor", brushToString(this.i.t1));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "raisedFocusTextColor", {
+        /**
+         * Gets or sets the color to use for the text the button when it is focused and raised.
+        */
+        get: function () {
+            return brushToString(this.i.t2);
+        },
+        set: function (v) {
+            this.i.t2 = stringToBrush(v);
+            this._a("raisedFocusTextColor", brushToString(this.i.t2));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "focusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused.
+        */
+        get: function () {
+            return brushToString(this.i.s6);
+        },
+        set: function (v) {
+            this.i.s6 = stringToBrush(v);
+            this._a("focusBackgroundColor", brushToString(this.i.s6));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "focusTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when it is focused.
+        */
+        get: function () {
+            return brushToString(this.i.s7);
+        },
+        set: function (v) {
+            this.i.s7 = stringToBrush(v);
+            this._a("focusTextColor", brushToString(this.i.s7));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "borderWidth", {
+        /**
+         * Gets or sets the width to use for the button border regardless of type.
+        */
+        get: function () {
+            return this.i.ax;
+        },
+        set: function (v) {
+            this.i.ax = +v;
+            this._a("borderWidth", this.i.ax);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "cornerRadiusBottomRight", {
+        get: function () {
+            return this.i.ke ? this.i.ke.b : NaN;
+        },
+        set: function (v) {
+            this.ensureCornerRadius();
+            this.i.ke.b = +v;
+            this._a("cornerRadiusBottomRight", this.i.ke.b);
+            this.i.ke = this.i.ke;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "cornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.ke ? this.i.ke.a : NaN;
+        },
+        set: function (v) {
+            this.ensureCornerRadius();
+            this.i.ke.a = +v;
+            this._a("cornerRadiusBottomLeft", this.i.ke.a);
+            this.i.ke = this.i.ke;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "cornerRadiusTopLeft", {
+        get: function () {
+            return this.i.ke ? this.i.ke.c : NaN;
+        },
+        set: function (v) {
+            this.ensureCornerRadius();
+            this.i.ke.c = +v;
+            this._a("cornerRadiusTopLeft", this.i.ke.c);
+            this.i.ke = this.i.ke;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "cornerRadiusTopRight", {
+        get: function () {
+            return this.i.ke ? this.i.ke.d : NaN;
+        },
+        set: function (v) {
+            this.ensureCornerRadius();
+            this.i.ke.d = +v;
+            this._a("cornerRadiusTopRight", this.i.ke.d);
+            this.i.ke = this.i.ke;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureCornerRadius = function () {
+        if (this.i.ke) {
+            return;
+        }
+        this.i.ke = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the background of the button when the  type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tl);
+        },
+        set: function (v) {
+            this.i.tl = stringToBrush(v);
+            this._a("outlinedBackgroundColor", brushToString(this.i.tl));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedDisabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tn);
+        },
+        set: function (v) {
+            this.i.tn = stringToBrush(v);
+            this._a("outlinedDisabledBackgroundColor", brushToString(this.i.tn));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedDisabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.to);
+        },
+        set: function (v) {
+            this.i.to = stringToBrush(v);
+            this._a("outlinedDisabledBorderColor", brushToString(this.i.to));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedDisabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tp);
+        },
+        set: function (v) {
+            this.i.tp = stringToBrush(v);
+            this._a("outlinedDisabledTextColor", brushToString(this.i.tp));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedDisabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is outlined.
+        */
+        get: function () {
+            return this.i.el;
+        },
+        set: function (v) {
+            this.i.el = +v;
+            this._a("outlinedDisabledElevation", this.i.el);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedHoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the  type is hoveredOutlined.
+        */
+        get: function () {
+            return brushToString(this.i.ts);
+        },
+        set: function (v) {
+            this.i.ts = stringToBrush(v);
+            this._a("outlinedHoverBackgroundColor", brushToString(this.i.ts));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedBorderColor", {
+        /**
+         * Gets or sets the border color to use for the button when the type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tm);
+        },
+        set: function (v) {
+            this.i.tm = stringToBrush(v);
+            this._a("outlinedBorderColor", brushToString(this.i.tm));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedRestingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button when the type is outlined.
+        */
+        get: function () {
+            return this.i.eo;
+        },
+        set: function (v) {
+            this.i.eo = +v;
+            this._a("outlinedRestingElevation", this.i.eo);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedHoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button when the type is outlined.
+        */
+        get: function () {
+            return this.i.en;
+        },
+        set: function (v) {
+            this.i.en = +v;
+            this._a("outlinedHoverElevation", this.i.en);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedFocusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button when the type is outlined.
+        */
+        get: function () {
+            return this.i.em;
+        },
+        set: function (v) {
+            this.i.em = +v;
+            this._a("outlinedFocusElevation", this.i.em);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedBorderWidth", {
+        /**
+         * Gets or sets the width to use for the button border when the type is outlined.
+        */
+        get: function () {
+            return this.i.bi;
+        },
+        set: function (v) {
+            this.i.bi = +v;
+            this._a("outlinedBorderWidth", this.i.bi);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.kx ? this.i.kx.b : NaN;
+        },
+        set: function (v) {
+            this.ensureOutlinedCornerRadius();
+            this.i.kx.b = +v;
+            this._a("outlinedCornerRadiusBottomRight", this.i.kx.b);
+            this.i.kx = this.i.kx;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.kx ? this.i.kx.a : NaN;
+        },
+        set: function (v) {
+            this.ensureOutlinedCornerRadius();
+            this.i.kx.a = +v;
+            this._a("outlinedCornerRadiusBottomLeft", this.i.kx.a);
+            this.i.kx = this.i.kx;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.kx ? this.i.kx.c : NaN;
+        },
+        set: function (v) {
+            this.ensureOutlinedCornerRadius();
+            this.i.kx.c = +v;
+            this._a("outlinedCornerRadiusTopLeft", this.i.kx.c);
+            this.i.kx = this.i.kx;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedCornerRadiusTopRight", {
+        get: function () {
+            return this.i.kx ? this.i.kx.d : NaN;
+        },
+        set: function (v) {
+            this.ensureOutlinedCornerRadius();
+            this.i.kx.d = +v;
+            this._a("outlinedCornerRadiusTopRight", this.i.kx.d);
+            this.i.kx = this.i.kx;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureOutlinedCornerRadius = function () {
+        if (this.i.kx) {
+            return;
+        }
+        this.i.kx = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedRippleColor", {
+        /**
+         * Gets or sets the color to use for the background when the button is pressed and the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.tu);
+        },
+        set: function (v) {
+            this.i.tu = stringToBrush(v);
+            this._a("outlinedRippleColor", brushToString(this.i.tu));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tv);
+        },
+        set: function (v) {
+            this.i.tv = stringToBrush(v);
+            this._a("outlinedTextColor", brushToString(this.i.tv));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedHoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button when type is outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tt);
+        },
+        set: function (v) {
+            this.i.tt = stringToBrush(v);
+            this._a("outlinedHoverTextColor", brushToString(this.i.tt));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedFocusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused and outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tq);
+        },
+        set: function (v) {
+            this.i.tq = stringToBrush(v);
+            this._a("outlinedFocusBackgroundColor", brushToString(this.i.tq));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "outlinedFocusTextColor", {
+        /**
+         * Gets or sets the color to use for the text the button when it is focused and outlined.
+        */
+        get: function () {
+            return brushToString(this.i.tr);
+        },
+        set: function (v) {
+            this.i.tr = stringToBrush(v);
+            this._a("outlinedFocusTextColor", brushToString(this.i.tr));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the background of the button when the  type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.sk);
+        },
+        set: function (v) {
+            this.i.sk = stringToBrush(v);
+            this._a("fabBackgroundColor", brushToString(this.i.sk));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabDisabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is fab.
+        */
+        get: function () {
+            return brushToString(this.i.sm);
+        },
+        set: function (v) {
+            this.i.sm = stringToBrush(v);
+            this._a("fabDisabledBackgroundColor", brushToString(this.i.sm));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabDisabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is fab.
+        */
+        get: function () {
+            return brushToString(this.i.sn);
+        },
+        set: function (v) {
+            this.i.sn = stringToBrush(v);
+            this._a("fabDisabledBorderColor", brushToString(this.i.sn));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabDisabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is fab.
+        */
+        get: function () {
+            return brushToString(this.i.so);
+        },
+        set: function (v) {
+            this.i.so = stringToBrush(v);
+            this._a("fabDisabledTextColor", brushToString(this.i.so));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabDisabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is fab.
+        */
+        get: function () {
+            return this.i.d7;
+        },
+        set: function (v) {
+            this.i.d7 = +v;
+            this._a("fabDisabledElevation", this.i.d7);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabHoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the  type is hoveredFab.
+        */
+        get: function () {
+            return brushToString(this.i.sr);
+        },
+        set: function (v) {
+            this.i.sr = stringToBrush(v);
+            this._a("fabHoverBackgroundColor", brushToString(this.i.sr));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabBorderColor", {
+        /**
+         * Gets or sets the border color to use for the button when the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.sl);
+        },
+        set: function (v) {
+            this.i.sl = stringToBrush(v);
+            this._a("fabBorderColor", brushToString(this.i.sl));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabRestingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button when the type is floating action button.
+        */
+        get: function () {
+            return this.i.ea;
+        },
+        set: function (v) {
+            this.i.ea = +v;
+            this._a("fabRestingElevation", this.i.ea);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabHoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button when the type is floating action button.
+        */
+        get: function () {
+            return this.i.d9;
+        },
+        set: function (v) {
+            this.i.d9 = +v;
+            this._a("fabHoverElevation", this.i.d9);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabFocusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button when the type is floating action button.
+        */
+        get: function () {
+            return this.i.d8;
+        },
+        set: function (v) {
+            this.i.d8 = +v;
+            this._a("fabFocusElevation", this.i.d8);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabBorderWidth", {
+        /**
+         * Gets or sets the width to use for the button border when the type is floating action button.
+        */
+        get: function () {
+            return this.i.bd;
+        },
+        set: function (v) {
+            this.i.bd = +v;
+            this._a("fabBorderWidth", this.i.bd);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.ku ? this.i.ku.b : NaN;
+        },
+        set: function (v) {
+            this.ensureFabCornerRadius();
+            this.i.ku.b = +v;
+            this._a("fabCornerRadiusBottomRight", this.i.ku.b);
+            this.i.ku = this.i.ku;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.ku ? this.i.ku.a : NaN;
+        },
+        set: function (v) {
+            this.ensureFabCornerRadius();
+            this.i.ku.a = +v;
+            this._a("fabCornerRadiusBottomLeft", this.i.ku.a);
+            this.i.ku = this.i.ku;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.ku ? this.i.ku.c : NaN;
+        },
+        set: function (v) {
+            this.ensureFabCornerRadius();
+            this.i.ku.c = +v;
+            this._a("fabCornerRadiusTopLeft", this.i.ku.c);
+            this.i.ku = this.i.ku;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabCornerRadiusTopRight", {
+        get: function () {
+            return this.i.ku ? this.i.ku.d : NaN;
+        },
+        set: function (v) {
+            this.ensureFabCornerRadius();
+            this.i.ku.d = +v;
+            this._a("fabCornerRadiusTopRight", this.i.ku.d);
+            this.i.ku = this.i.ku;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureFabCornerRadius = function () {
+        if (this.i.ku) {
+            return;
+        }
+        this.i.ku = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "fabRippleColor", {
+        /**
+         * Gets or sets the color to use for the background when the button is pressed and the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.st);
+        },
+        set: function (v) {
+            this.i.st = stringToBrush(v);
+            this._a("fabRippleColor", brushToString(this.i.st));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.su);
+        },
+        set: function (v) {
+            this.i.su = stringToBrush(v);
+            this._a("fabTextColor", brushToString(this.i.su));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabHoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button when type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.ss);
+        },
+        set: function (v) {
+            this.i.ss = stringToBrush(v);
+            this._a("fabHoverTextColor", brushToString(this.i.ss));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabFocusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused and fab.
+        */
+        get: function () {
+            return brushToString(this.i.sp);
+        },
+        set: function (v) {
+            this.i.sp = stringToBrush(v);
+            this._a("fabFocusBackgroundColor", brushToString(this.i.sp));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "fabFocusTextColor", {
+        /**
+         * Gets or sets the color to use for the text the button when it is focused and fab.
+        */
+        get: function () {
+            return brushToString(this.i.sq);
+        },
+        set: function (v) {
+            this.i.sq = stringToBrush(v);
+            this._a("fabFocusTextColor", brushToString(this.i.sq));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the background of the button when the  type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.ta);
+        },
+        set: function (v) {
+            this.i.ta = stringToBrush(v);
+            this._a("iconBackgroundColor", brushToString(this.i.ta));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconDisabledBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the disabled background of the button when the type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.tc);
+        },
+        set: function (v) {
+            this.i.tc = stringToBrush(v);
+            this._a("iconDisabledBackgroundColor", brushToString(this.i.tc));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconDisabledBorderColor", {
+        /**
+         * Gets or sets the color to use for the disabled border of the button when the type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.td);
+        },
+        set: function (v) {
+            this.i.td = stringToBrush(v);
+            this._a("iconDisabledBorderColor", brushToString(this.i.td));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconDisabledTextColor", {
+        /**
+         * Gets or sets the color to use for the disabled text of the button when the type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.te);
+        },
+        set: function (v) {
+            this.i.te = stringToBrush(v);
+            this._a("iconDisabledTextColor", brushToString(this.i.te));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconDisabledElevation", {
+        /**
+         * Gets or sets the disabled elevation to use for the button when the type is icon.
+        */
+        get: function () {
+            return this.i.eh;
+        },
+        set: function (v) {
+            this.i.eh = +v;
+            this._a("iconDisabledElevation", this.i.eh);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconHoverBackgroundColor", {
+        /**
+         * Gets or sets the hover color to use for the background of the button when the  type is hoveredIcon.
+        */
+        get: function () {
+            return brushToString(this.i.th);
+        },
+        set: function (v) {
+            this.i.th = stringToBrush(v);
+            this._a("iconHoverBackgroundColor", brushToString(this.i.th));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconBorderColor", {
+        /**
+         * Gets or sets the border color to use for the button when the type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.tb);
+        },
+        set: function (v) {
+            this.i.tb = stringToBrush(v);
+            this._a("iconBorderColor", brushToString(this.i.tb));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconRestingElevation", {
+        /**
+         * Gets or sets the elevation to use for the button when the type is icon.
+        */
+        get: function () {
+            return this.i.ek;
+        },
+        set: function (v) {
+            this.i.ek = +v;
+            this._a("iconRestingElevation", this.i.ek);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconHoverElevation", {
+        /**
+         * Gets or sets the hover elevation to use for the button when the type is icon.
+        */
+        get: function () {
+            return this.i.ej;
+        },
+        set: function (v) {
+            this.i.ej = +v;
+            this._a("iconHoverElevation", this.i.ej);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconFocusElevation", {
+        /**
+         * Gets or sets the focus elevation to use for the button when the type is icon.
+        */
+        get: function () {
+            return this.i.ei;
+        },
+        set: function (v) {
+            this.i.ei = +v;
+            this._a("iconFocusElevation", this.i.ei);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconBorderWidth", {
+        /**
+         * Gets or sets the width to use for the button border when the type is icon.
+        */
+        get: function () {
+            return this.i.bf;
+        },
+        set: function (v) {
+            this.i.bf = +v;
+            this._a("iconBorderWidth", this.i.bf);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconCornerRadiusBottomRight", {
+        get: function () {
+            return this.i.kw ? this.i.kw.b : NaN;
+        },
+        set: function (v) {
+            this.ensureIconCornerRadius();
+            this.i.kw.b = +v;
+            this._a("iconCornerRadiusBottomRight", this.i.kw.b);
+            this.i.kw = this.i.kw;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconCornerRadiusBottomLeft", {
+        get: function () {
+            return this.i.kw ? this.i.kw.a : NaN;
+        },
+        set: function (v) {
+            this.ensureIconCornerRadius();
+            this.i.kw.a = +v;
+            this._a("iconCornerRadiusBottomLeft", this.i.kw.a);
+            this.i.kw = this.i.kw;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconCornerRadiusTopLeft", {
+        get: function () {
+            return this.i.kw ? this.i.kw.c : NaN;
+        },
+        set: function (v) {
+            this.ensureIconCornerRadius();
+            this.i.kw.c = +v;
+            this._a("iconCornerRadiusTopLeft", this.i.kw.c);
+            this.i.kw = this.i.kw;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconCornerRadiusTopRight", {
+        get: function () {
+            return this.i.kw ? this.i.kw.d : NaN;
+        },
+        set: function (v) {
+            this.ensureIconCornerRadius();
+            this.i.kw.d = +v;
+            this._a("iconCornerRadiusTopRight", this.i.kw.d);
+            this.i.kw = this.i.kw;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.ensureIconCornerRadius = function () {
+        if (this.i.kw) {
+            return;
+        }
+        this.i.kw = new CornerRadius(2);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "iconRippleColor", {
+        /**
+         * Gets or sets the color to use for the background when the button is pressed and the type is floating action button.
+        */
+        get: function () {
+            return brushToString(this.i.tj);
+        },
+        set: function (v) {
+            this.i.tj = stringToBrush(v);
+            this._a("iconRippleColor", brushToString(this.i.tj));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconTextColor", {
+        /**
+         * Gets or sets the color to use for the text of the button when type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.tk);
+        },
+        set: function (v) {
+            this.i.tk = stringToBrush(v);
+            this._a("iconTextColor", brushToString(this.i.tk));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconHoverTextColor", {
+        /**
+         * Gets or sets the color to use for the hovered text of the button when type is icon.
+        */
+        get: function () {
+            return brushToString(this.i.ti);
+        },
+        set: function (v) {
+            this.i.ti = stringToBrush(v);
+            this._a("iconHoverTextColor", brushToString(this.i.ti));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconFocusBackgroundColor", {
+        /**
+         * Gets or sets the color to use for the backround the button when it is focused and icon.
+        */
+        get: function () {
+            return brushToString(this.i.tf);
+        },
+        set: function (v) {
+            this.i.tf = stringToBrush(v);
+            this._a("iconFocusBackgroundColor", brushToString(this.i.tf));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "iconFocusTextColor", {
+        /**
+         * Gets or sets the color to use for the text the button when it is focused and icon.
+        */
+        get: function () {
+            return brushToString(this.i.tg);
+        },
+        set: function (v) {
+            this.i.tg = stringToBrush(v);
+            this._a("iconFocusTextColor", brushToString(this.i.tg));
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "inputId", {
+        /**
+         * Gets or sets the id to use for the internal native checkbox.
+        */
+        get: function () {
+            return this.i.h8;
+        },
+        set: function (v) {
+            this.i.h8 = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "id", {
+        /**
+         * Gets or sets the id to use for the checkbox.
+        */
+        get: function () {
+            return this.i.h6;
+        },
+        set: function (v) {
+            this.i.h6 = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "display", {
+        /**
+         * Gets or sets the id to use for the checkbox.
+        */
+        get: function () {
+            return this.i.gc;
+        },
+        set: function (v) {
+            this.i.gc = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flexDirection", {
+        /**
+         * Gets or sets the id to use for the checkbox.
+        */
+        get: function () {
+            return this.i.hf;
+        },
+        set: function (v) {
+            this.i.hf = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "flexGrow", {
+        /**
+         * Gets or sets the flex-grow setting for the button.
+        */
+        get: function () {
+            return this.i.hh;
+        },
+        set: function (v) {
+            this.i.hh = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "alignItems", {
+        /**
+         * Gets or sets the id to use for the checkbox.
+        */
+        get: function () {
+            return this.i.fw;
+        },
+        set: function (v) {
+            this.i.fw = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "value", {
+        /**
+         * Gets or sets value to use for the checkbox.
+        */
+        get: function () {
+            return this.i.e0;
+        },
+        set: function (v) {
+            this.i.e0 = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "name", {
+        /**
+         * Gets or sets name to use for the button.
+        */
+        get: function () {
+            return this.i.ih;
+        },
+        set: function (v) {
+            this.i.ih = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "tabIndex", {
+        /**
+         * Gets or sets TabIndex to use for the checkbox.
+        */
+        get: function () {
+            return this.i.eu;
+        },
+        set: function (v) {
+            this.i.eu = +v;
+            this._a("tabIndex", this.i.eu);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "ariaLabel", {
+        /**
+         * Gets or sets the value of the aria-label attribute.
+        */
+        get: function () {
+            return this.i.fy;
+        },
+        set: function (v) {
+            this.i.fy = v;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "focused", {
+        /**
+         * Gets or sets if the checkbox is Focused.
+        */
+        get: function () {
+            return this.i.focused;
+        },
+        set: function (v) {
+            this.i.focused = ensureBool(v);
+            this._a("focused", this.i.focused);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "isFocusStyleEnabled", {
+        /**
+         * Gets or sets if the button show use styling to show focus.
+        */
+        get: function () {
+            return this.i.ak;
+        },
+        set: function (v) {
+            this.i.ak = ensureBool(v);
+            this._a("isFocusStyleEnabled", this.i.ak);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disableRipple", {
+        /**
+         * Gets or sets whether to disable the ripple effect for the button.
+        */
+        get: function () {
+            return this.i.af;
+        },
+        set: function (v) {
+            this.i.af = ensureBool(v);
+            this._a("disableRipple", this.i.af);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "actualDisableRipple", {
+        /**
+         * Gets whether to actually disable the ripple effect for the button.
+        */
+        get: function () {
+            return this.i.ae;
+        },
+        set: function (v) {
+            this.i.ae = ensureBool(v);
+            this._a("actualDisableRipple", this.i.ae);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "isHover", {
+        /**
+         * Gets or sets whether the checkbox is checked.
+        */
+        get: function () {
+            return this.i.al;
+        },
+        set: function (v) {
+            this.i.al = ensureBool(v);
+            this._a("isHover", this.i.al);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disabled", {
+        /**
+         * Gets or sets whether the checkbox is disabled.
+        */
+        get: function () {
+            return this.i.disabled;
+        },
+        set: function (v) {
+            this.i.disabled = ensureBool(v);
+            this._a("disabled", this.i.disabled);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(IgcButtonComponent.prototype, "disableTransitions", {
+        /**
+         * Gets or sets whether the checkbox transitions are disabled.
+        */
+        get: function () {
+            return this.i.ag;
+        },
+        set: function (v) {
+            this.i.ag = ensureBool(v);
+            this._a("disableTransitions", this.i.ag);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.findByName = function (name) {
+        return null;
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "hasUserValues", {
+        get: function () {
+            return this._hasUserValues;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent.prototype.__m = function (propertyName) {
+        if (!this._inStyling) {
+            this._hasUserValues.add(propertyName);
+        }
+    };
+    IgcButtonComponent.prototype._styling = function (container, component, parent) {
+        if (this._inStyling) {
+            return;
+        }
+        this._inStyling = true;
+        this._stylingContainer = container;
+        this._stylingParent = component;
+        var genericPrefix = "";
+        var typeName = this.i.$type.name;
+        if (typeName.indexOf("Xam") === 0) {
+            typeName = typeName.substring(3);
+        }
+        genericPrefix = toSpinal("ButtonComponent");
+        var additionalPrefixes = [];
+        var prefix = toSpinal(typeName);
+        additionalPrefixes.push(prefix + "-");
+        var 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);
+            }
+            var basePrefix = toSpinal(typeName);
+            additionalPrefixes.push(basePrefix + "-");
+            b = b.baseType;
+        }
+        if (parent) {
+            var parentTypeName = parent.i.$type.name;
+            if (parentTypeName.indexOf("Xam") === 0) {
+                parentTypeName = parentTypeName.substring(3);
+            }
+            var 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;
+    };
+    IgcButtonComponent.prototype.onDetachedFromUI = function () {
+        this.i.onDetachedFromUI();
+    };
+    IgcButtonComponent.prototype.onAttachedToUI = function () {
+        this.i.onAttachedToUI();
+    };
+    /**
+     * Exports visual information about the current state of the grid.
+    
+    */
+    IgcButtonComponent.prototype.exportVisualModel = function () {
+        var iv = this.i.ey();
+        return (iv);
+    };
+    /**
+     * Returns a serialized copy of the exported visual model
+    
+    */
+    IgcButtonComponent.prototype.exportSerializedVisualModel = function () {
+        var iv = this.i.gg();
+        return (iv);
+    };
+    Object.defineProperty(IgcButtonComponent.prototype, "clicked", {
+        get: function () {
+            return this._clicked;
+        },
+        set: function (ev) {
+            var _this = this;
+            if (this._clicked_wrapped !== null) {
+                this.i.clicked = delegateRemove(this.i.clicked, this._clicked_wrapped);
+                this._clicked_wrapped = null;
+                this._clicked = null;
+            }
+            this._clicked = ev;
+            this._clicked_wrapped = function (o, e) {
+                var outerArgs = new IgcButtonClickEventArgs();
+                outerArgs._provideImplementation(e);
+                if (_this.beforeClicked) {
+                    _this.beforeClicked(_this, outerArgs);
+                }
+                if (_this._clicked) {
+                    _this._clicked(_this, outerArgs);
+                }
+            };
+            this.i.clicked = delegateCombine(this.i.clicked, this._clicked_wrapped);
+        },
+        enumerable: true,
+        configurable: true
+    });
+    IgcButtonComponent._observedAttributesIgcButtonComponent = null;
+    IgcButtonComponent.htmlTagName = "igc-button";
+    IgcButtonComponent._isElementRegistered = false;
+    return IgcButtonComponent;
+}(IgcHTMLElement));
+export { IgcButtonComponent };
+//# sourceMappingURL=igc-button-component.js.map