igniteui-angular-inputs 16.1.0-beta.1

package/esm2015/lib/CheckboxView_combined.js

@@ -0,0 +1,1105 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE:  you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { Base, Delegate_$type, fromEnum, runOn, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, enumGetBox, String_$type } from "igniteui-angular-core";
+import { XRipple } from "./XRipple";
+import { List$1 } from "igniteui-angular-core";
+import { Size } from "igniteui-angular-core";
+import { KeyFrameAnimationFactory } from "igniteui-angular-core";
+import { AnimationKeyFrameEffect } from "igniteui-angular-core";
+import { AnimationKeyFrameEffectTiming } from "igniteui-angular-core";
+import { stringReplace } from "igniteui-angular-core";
+import { BaseControlTheme_$type } from "igniteui-angular-core";
+import { CheckboxLabelPosition_$type } from "./CheckboxLabelPosition";
+import { BrushUtil } from "igniteui-angular-core";
+import { ThemeResolver } from "./ThemeResolver";
+import { CornerRadius } from "igniteui-angular-core";
+import { NativeUI } from "igniteui-angular-core";
+import { Thickness } from "igniteui-angular-core";
+import { CheckboxChangeEventArgs } from "./CheckboxChangeEventArgs";
+import { AnimationKeyFrameProperty } from "igniteui-angular-core";
+import { TransformGroup } from "igniteui-angular-core";
+import { RotateTransform } from "igniteui-angular-core";
+import { TranslateTransform } from "igniteui-angular-core";
+import { CheckboxVisualModelExport } from "./CheckboxVisualModelExport";
+import { AppearanceHelper } from "igniteui-angular-core";
+import { Dictionary$2 } from "igniteui-angular-core";
+import { Theme } from "./Theme";
+import { isNaN_ } from "igniteui-angular-core";
+/**
+ * @hidden
+ */
+export let CheckboxView = /*@__PURE__*/ (() => {
+    class CheckboxView extends Base {
+        constructor() {
+            super();
+            this.c = null;
+            this.l = null;
+            this.f = null;
+            this.j = new List$1(Delegate_$type, 0);
+            this.g = true;
+            this.r = null;
+            this.m = null;
+            this.q = null;
+            this.n = null;
+            this.o = null;
+            this.d = null;
+            this.p = null;
+        }
+        ae() {
+        }
+        i() {
+            return true;
+        }
+        ac(a) {
+            if (a == null) {
+                for (let b of fromEnum(this.j)) {
+                    b();
+                }
+                this.j.clear();
+                return;
+            }
+            this.l = a;
+            this.l.rootWrapper.setStyleProperty("display", "flex");
+            this.l.rootWrapper.setStyleProperty("flex-direction", "row");
+            this.l.rootWrapper.setStyleProperty("flex-wrap", "no-wrap");
+            this.l.rootWrapper.setStyleProperty("align-items", "center");
+            let c = this.l.createElement("input");
+            this.r = c;
+            this.r.addClass("ig-native-checkbox");
+            this.r.setStyleProperty("position", "absolute");
+            this.r.setStyleProperty("width", "1px");
+            this.r.setStyleProperty("height", "1px");
+            this.r.setStyleProperty("margin", "-1px");
+            this.r.setStyleProperty("border", "none");
+            this.r.setStyleProperty("clip", "rect(0, 0, 0, 0)");
+            this.r.setStyleProperty("outline", "0");
+            this.r.setStyleProperty("pointer-events", "none");
+            this.r.setStyleProperty("overflow", "hidden");
+            this.r.setStyleProperty("-webkit-appearance", "none");
+            this.r.setStyleProperty("-moz-appearance", "none");
+            this.r.setStyleProperty("appearance", "none");
+            this.r.setAttribute("type", "checkbox");
+            this.r.setAttribute("id", this.c.b1);
+            this.ai();
+            this.j.add(c.listen("change", runOn(this, this.w)));
+            this.j.add(c.listen("click", runOn(this, this.x)));
+            this.j.add(c.listen("focus", runOn(this, this.y)));
+            this.j.add(c.listen("blur", runOn(this, this.v)));
+            this.l.append(c);
+            let d = this.l.createElement("div");
+            d.addClass("ig-checkbox-box");
+            d.setStyleProperty("width", "1.25em");
+            d.setStyleProperty("height", "1.25em");
+            d.setStyleProperty("position", "relative");
+            this.m = d;
+            this.l.append(d);
+            let e = this.l.createElement("label");
+            e.setAttribute("for", this.c.b1);
+            e.addClass("ig-checkbox-composite");
+            e.setStyleProperty("box-sizing", "border-box");
+            e.setStyleProperty("position", "relative");
+            e.setStyleProperty("display", "inline-block");
+            e.setStyleProperty("cursor", "pointer");
+            e.setStyleProperty("width", "1.25em");
+            e.setStyleProperty("height", "1.25em");
+            e.setStyleProperty("min-width", "1.25em");
+            e.setStyleProperty("border-width", "0.125rem");
+            e.setStyleProperty("border-style", "solid");
+            e.setStyleProperty("border-color", "rgba(0,0,0,0.54)");
+            e.setStyleProperty("border-top-color", "rgba(0, 0, 0, 0.54)");
+            e.setStyleProperty("border-right-color", "rgba(0, 0, 0, 0.54)");
+            e.setStyleProperty("border-bottom-color", "rgba(0, 0, 0, 0.54)");
+            e.setStyleProperty("border-left-color", "rgba(0, 0, 0, 0.54)");
+            e.setStyleProperty("border-radius", "2px");
+            e.setStyleProperty("-webkit-tap-highlight-color", "transparent");
+            e.setStyleProperty("overflow", "hidden");
+            this.q = e;
+            this.m.append(e);
+            let f = this.l.createElementNS("svg", "http://www.w3.org/2000/svg");
+            f.setAttribute("viewBox", "0 0 24 24");
+            f.addClass("ig-checkbox-mark");
+            f.setStyleProperty("position", "absolute");
+            f.setStyleProperty("top", "0");
+            f.setStyleProperty("left", "0");
+            f.setStyleProperty("right", "0");
+            f.setStyleProperty("bottom", "0");
+            f.setStyleProperty("stroke", "#fff");
+            f.setStyleProperty("stroke-linecap", "square");
+            f.setStyleProperty("stroke-width", "3");
+            f.setStyleProperty("stroke-dasharray", "24");
+            f.setStyleProperty("stroke-dashoffset", "24");
+            f.setStyleProperty("fill", "none");
+            f.setStyleProperty("opacity", "0");
+            f.setStyleProperty("z-index", "1");
+            this.o = f;
+            e.append(f);
+            let g = this.l.createElementNS("path", "http://www.w3.org/2000/svg");
+            g.setAttribute("d", this.c.bf);
+            f.append(g);
+            this.n = g;
+            let h = this.l.createElement("div");
+            let i = this.l.getSubRenderer(h);
+            h.setStyleProperty("position", "absolute");
+            h.setStyleProperty("width", "3em");
+            h.setStyleProperty("height", "3em");
+            h.setStyleProperty("right", "calc(50% - 1.5em)");
+            h.setStyleProperty("top", "calc(50% - 1.5em)");
+            h.setStyleProperty("border-radius", "24px");
+            h.setStyleProperty("overflow", "hidden");
+            let j = new XRipple();
+            j.provideContainer(i);
+            j.q = d;
+            let k = this.l.getExternal(j, this.l.rootWrapper, this.l.getExternal(this.c, null, null));
+            j.h = true;
+            j.k = true;
+            this.d = j;
+            d.append(h);
+            let l = this.l.createElement("span");
+            l.addClass("ig-checkbox-label");
+            l.setStyleProperty("font-family", "Verdana");
+            l.setStyleProperty("font-weight", "400");
+            l.setStyleProperty("font-size", "1rem");
+            l.setStyleProperty("letter-spacing", ".00937rem");
+            l.setStyleProperty("text-transform", "none");
+            l.setStyleProperty("line-height", "1.5rem");
+            l.setStyleProperty("margin-left", "8px");
+            l.setStyleProperty("margin-top", "0");
+            l.setStyleProperty("margin-bottom", "0");
+            l.setStyleProperty("cursor", "pointer");
+            l.setStyleProperty("role", "label");
+            this.p = l;
+            this.j.add(l.listen("click", runOn(this, this.u)));
+            this.l.append(l);
+            this.l.getPortal(l, "ChildContent", (m) => {
+            }, true);
+            this.c.cp();
+        }
+        u(a) {
+            this.c.toggle();
+        }
+        ai() {
+            if (this.i()) {
+                let a = this.c.b1;
+                this.r.setAttribute("name", this.c.ca);
+                this.r.setProperty("value", this.c.a4);
+                if (this.c.aa) {
+                    this.r.setAttribute("tabindex", this.c.az.toString());
+                }
+                this.r.setProperty("disabled", this.c.disabled);
+                this.r.setProperty("indeterminate", this.c.indeterminate);
+                this.r.setProperty("checked", this.c.checked);
+                this.r.setProperty("required", this.c.ay);
+                if (this.c.indeterminate) {
+                    this.r.setAttribute("aria-checked", "mixed");
+                }
+                else {
+                    this.r.setAttribute("aria-checked", this.c.checked ? "true" : "false");
+                }
+                this.r.setAttribute("aria-labelledby", this.c.bn);
+                this.r.setAttribute("aria-label", this.c.bm);
+            }
+        }
+        ak() {
+            return new Size(1, this.q.width(), this.q.height());
+        }
+        ah() {
+            this.n.setAttribute("d", this.c.bf);
+        }
+        af() {
+            if (this.i()) {
+                let a = this.c.b1;
+                this.r.setAttribute("id", a);
+                this.q.setAttribute("for", a);
+            }
+        }
+        v(a) {
+            this.c.focused = false;
+        }
+        y(a) {
+            this.c.focused = true;
+        }
+        x(a) {
+            a.stopPropagation();
+            if (this.h()) {
+                let native_ = this.r.getNativeElement();
+                native_.blur();
+            }
+            this.c.toggle();
+        }
+        h() {
+            return false;
+        }
+        w(a) {
+            a.stopPropagation();
+        }
+        z() {
+            if (KeyFrameAnimationFactory.h == null) {
+                KeyFrameAnimationFactory.h = this.l;
+            }
+        }
+        a(a) {
+            return new AnimationKeyFrameEffect(0, this.q, 0, null, a);
+        }
+        b(a) {
+            return new AnimationKeyFrameEffect(0, this.o, 0, null, a);
+        }
+        aa(a) {
+        }
+        get s() {
+            return this.q;
+        }
+        get e() {
+            return this.d;
+        }
+        get t() {
+            return this.o;
+        }
+        ab() {
+            this.g = true;
+            this.j.add(this.r.listen("change", runOn(this, this.w)));
+            this.j.add(this.r.listen("click", runOn(this, this.x)));
+            this.j.add(this.r.listen("focus", runOn(this, this.y)));
+            this.j.add(this.r.listen("blur", runOn(this, this.v)));
+            this.j.add(this.p.listen("click", runOn(this, this.u)));
+        }
+        ad() {
+            this.g = false;
+            for (let a of fromEnum(this.j)) {
+                a();
+            }
+            this.j.clear();
+        }
+        ag() {
+            let model_ = this.c;
+            if (model_.externalObject && model_.externalObject.refreshDefaults) {
+                model_.externalObject.refreshDefaults();
+            }
+            ;
+        }
+        aj(a, b) {
+            this.d.ax = a;
+            this.d.aw = b;
+        }
+        k() {
+            let a = this.q.getStyleProperty("border-top-width");
+            a = stringReplace(a, "px", "");
+            return parseFloat(a);
+        }
+    }
+    CheckboxView.$t = markType(CheckboxView, 'CheckboxView');
+    return CheckboxView;
+})();
+/**
+ * @hidden
+ */
+export let XCheckbox = /*@__PURE__*/ (() => {
+    class XCheckbox extends Base {
+        constructor() {
+            super();
+            this._view = null;
+            this.l = 0;
+            this.s = false;
+            this.ag = false;
+            this.c6 = null;
+            this.c1 = ThemeResolver.ah(XCheckbox.m, BrushUtil.g(0, 0, 0, 0), BrushUtil.g(0, 0, 0, 0));
+            this.c3 = null;
+            this.c5 = null;
+            this.c0 = ThemeResolver.ag(XCheckbox.m, XCheckbox.k, "TickColor");
+            this.c7 = null;
+            this.c4 = null;
+            this.bv = XCheckbox.k.v(XCheckbox.m, "CheckPath");
+            this.dj = XCheckbox.k.ae(XCheckbox.m, "UncheckedBorderColor");
+            this.dg = XCheckbox.k.ae(XCheckbox.m, "CheckedBorderColor");
+            this.as = XCheckbox.k.j(XCheckbox.m, "BorderWidth");
+            this.df = XCheckbox.k.ae(XCheckbox.m, "CheckedBackgroundColor");
+            this.at = XCheckbox.k.j(XCheckbox.m, "CornerRadius");
+            this.dh = XCheckbox.k.ae(XCheckbox.m, "TickColor");
+            this.au = XCheckbox.k.j(XCheckbox.m, "TickStrokeWidth");
+            this.di = XCheckbox.k.ae(XCheckbox.m, "UncheckedBackgroundColor");
+            this.a5 = ThemeResolver.x(XCheckbox.m, XCheckbox.k, "CheckPath");
+            this.c2 = ThemeResolver.ag(XCheckbox.m, XCheckbox.k, "UncheckedBorderColor");
+            this.cz = ThemeResolver.ag(XCheckbox.m, XCheckbox.k, "CheckedBorderColor");
+            this.ak = NaN;
+            this.ah = ThemeResolver.l(XCheckbox.m, XCheckbox.k, "BorderWidth");
+            this.al = NaN;
+            this.am = NaN;
+            this.aj = ThemeResolver.l(XCheckbox.m, XCheckbox.k, "TickStrokeWidth");
+            this.ai = ThemeResolver.l(XCheckbox.m, XCheckbox.k, "CornerRadius");
+            this.cy = ThemeResolver.ag(XCheckbox.m, XCheckbox.k, "CheckedBackgroundColor");
+            this.a9 = "ig-native-checkbox-" + XCheckbox.a1++;
+            this.a8 = "ig-checkbox-" + XCheckbox.a0++;
+            this.ba = null;
+            this.bb = null;
+            this.ax = 0;
+            this.t = false;
+            this.aw = 0;
+            this.a7 = null;
+            this.a6 = null;
+            this.a2 = null;
+            this.w = false;
+            this.change = null;
+            this.d = 0;
+            this.q = false;
+            this.u = false;
+            this.x = false;
+            this.v = false;
+            this.r = false;
+            this.o = null;
+            this.p = null;
+            this.propertyChanged = null;
+            this.ba = this.a8 + "-label";
+            this.a7 = this.ba;
+            let a = new CheckboxView();
+            a.c = this;
+            this.view = a;
+            this.view.ae();
+        }
+        get view() {
+            return this._view;
+        }
+        set view(a) {
+            this._view = a;
+        }
+        get n() {
+            return this.l;
+        }
+        set n(a) {
+            let b = this.l;
+            this.l = a;
+            if (b != this.l) {
+                this.co("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, a));
+            }
+        }
+        destroy() {
+            this.provideContainer(null);
+        }
+        co(a, b, c) {
+            if (this.propertyChanged != null) {
+                this.propertyChanged(this, new PropertyChangedEventArgs(a));
+            }
+            this.cq(a, b, c);
+        }
+        cu() {
+            this.da = this.dk != null ? this.dk : this.dh;
+            this.dc = this.dm != null ? this.dm : this.dj;
+            this.c9 = this.de != null ? this.de : this.dg;
+            this.an = !isNaN_(this.aq) ? this.aq : this.as;
+            this.c8 = this.dd != null ? this.dd : this.df;
+            this.db = this.dl != null ? this.dl : this.di;
+            this.ao = !isNaN_(this.ar) ? this.ar : this.at;
+            this.ap = !isNaN_(this.av) ? this.av : this.au;
+            this.bf = this.bv;
+        }
+        cq(a, b, c) {
+            switch (a) {
+                case "BaseTheme":
+                    this.cx(this.n);
+                    this.cu();
+                    break;
+                case "TickColor":
+                    this.da = this.dk != null ? this.dk : this.dh;
+                    break;
+                case "UncheckedBorderColor":
+                    this.dc = this.dm != null ? this.dm : this.dj;
+                    break;
+                case "CheckedBorderColor":
+                    this.c9 = this.de != null ? this.de : this.dg;
+                    break;
+                case "BorderWidth":
+                    this.an = !isNaN_(this.aq) ? this.aq : this.as;
+                    break;
+                case "CheckedBackgroundColor":
+                    this.c8 = this.dd != null ? this.dd : this.df;
+                    break;
+                case "UncheckedBackgroundColor":
+                    this.db = this.dl != null ? this.dl : this.di;
+                    break;
+                case "CornerRadius":
+                    this.ao = !isNaN_(this.ar) ? this.ar : this.at;
+                    break;
+                case "TickStrokeWidth":
+                    this.ap = !isNaN_(this.av) ? this.av : this.au;
+                    break;
+                case "ActualTickStrokeWidth":
+                case "ActualTickColor":
+                    this.cw();
+                    break;
+                case "ActualCheckedBackgroundColor":
+                case "ActualUncheckedBackgroundColor":
+                case "ActualUncheckedBorderColor":
+                case "ActualCheckedBorderColor":
+                case "ActualBorderWidth":
+                    if (this.o != null) {
+                        this.o.cancel();
+                    }
+                    if (this.p != null) {
+                        this.p.cancel();
+                    }
+                    this.o = null;
+                    this.p = null;
+                    this.ct();
+                    let d = (this.z);
+                    this.z = true;
+                    this.cv(this.indeterminate);
+                    this.z = d;
+                    break;
+                case "ActualCornerRadius":
+                    this.ct();
+                    break;
+                case "ActualCheckPath":
+                    this.view.ah();
+                    break;
+                case "IsChecked":
+                    if (!this.s) {
+                        let e = this.indeterminate;
+                        this.s = true;
+                        this.indeterminate = false;
+                        this.s = false;
+                        let f = (this.z);
+                        this.z = true;
+                        this.cv(e);
+                        this.z = f;
+                    }
+                    break;
+                case "IsIndeterminate":
+                    if (!this.s) {
+                        this.cv(b);
+                    }
+                    break;
+                case "DisableRipple":
+                    this.view.e.i = this.y;
+                    break;
+                case "InputId":
+                    this.view.af();
+                    break;
+            }
+        }
+        ct() {
+            let a = this.view.s;
+            if (a == null) {
+                return;
+            }
+            NativeUI.n(a, new CornerRadius(0, this.ao));
+            if (!isNaN_(this.an)) {
+                NativeUI.o(a, new Thickness(0, this.an));
+            }
+            if (this.checked) {
+                NativeUI.l(a, this.c8);
+                NativeUI.m(a, this.c9);
+            }
+            else {
+                NativeUI.l(a, this.db);
+                NativeUI.m(a, this.dc);
+            }
+        }
+        cw() {
+            let a = this.view.t;
+            if (a == null) {
+                return;
+            }
+            NativeUI.y(a, this.da);
+            NativeUI.ab(a, this.ap);
+        }
+        get dl() {
+            return this.c6;
+        }
+        set dl(a) {
+            let b = this.c6;
+            this.c6 = a;
+            if (b != this.c6) {
+                this.co("UncheckedBackgroundColor", b, a);
+            }
+        }
+        get db() {
+            return this.c1;
+        }
+        set db(a) {
+            let b = this.c1;
+            this.c1 = a;
+            if (b != this.c1) {
+                this.co("ActualUncheckedBackgroundColor", b, a);
+            }
+        }
+        get dd() {
+            return this.c3;
+        }
+        set dd(a) {
+            let b = this.c3;
+            this.c3 = a;
+            if (b != this.c3) {
+                this.co("CheckedBackgroundColor", b, a);
+            }
+        }
+        get dk() {
+            return this.c5;
+        }
+        set dk(a) {
+            let b = this.c5;
+            this.c5 = a;
+            if (b != this.c5) {
+                this.co("TickColor", b, a);
+            }
+        }
+        get da() {
+            return this.c0;
+        }
+        set da(a) {
+            let b = this.c0;
+            this.c0 = a;
+            if (b != this.c0) {
+                this.co("ActualTickColor", b, a);
+            }
+        }
+        get dm() {
+            return this.c7;
+        }
+        set dm(a) {
+            let b = this.c7;
+            this.c7 = a;
+            if (b != this.c7) {
+                this.co("UncheckedBorderColor", b, a);
+            }
+        }
+        get de() {
+            return this.c4;
+        }
+        set de(a) {
+            let b = this.c4;
+            this.c4 = a;
+            if (b != this.c4) {
+                this.co("CheckedBorderColor", b, a);
+            }
+        }
+        cx(a) {
+            this.bv = XCheckbox.k.v(a, "CheckPath");
+            this.dj = XCheckbox.k.ae(a, "UncheckedBorderColor");
+            this.dg = XCheckbox.k.ae(a, "CheckedBorderColor");
+            this.as = XCheckbox.k.j(a, "BorderWidth");
+            this.df = XCheckbox.k.ae(a, "CheckedBackgroundColor");
+            this.at = XCheckbox.k.j(a, "CornerRadius");
+            this.dh = XCheckbox.k.ae(a, "TickColor");
+            this.au = XCheckbox.k.j(a, "TickStrokeWidth");
+            this.di = XCheckbox.k.ae(a, "UncheckedBackgroundColor");
+        }
+        get bf() {
+            return this.a5;
+        }
+        set bf(a) {
+            let b = this.a5;
+            this.a5 = a;
+            if (b != this.a5) {
+                this.co("ActualCheckPath", b, a);
+            }
+        }
+        get dc() {
+            return this.c2;
+        }
+        set dc(a) {
+            let b = this.c2;
+            this.c2 = a;
+            if (b != this.c2) {
+                this.co("ActualUncheckedBorderColor", b, a);
+            }
+        }
+        get c9() {
+            return this.cz;
+        }
+        set c9(a) {
+            let b = this.cz;
+            this.cz = a;
+            if (b != this.cz) {
+                this.co("ActualCheckedBorderColor", b, a);
+            }
+        }
+        get aq() {
+            return this.ak;
+        }
+        set aq(a) {
+            let b = this.ak;
+            this.ak = a;
+            if (b != this.ak) {
+                this.co("BorderWidth", b, a);
+            }
+        }
+        get an() {
+            return this.ah;
+        }
+        set an(a) {
+            let b = this.ah;
+            this.ah = a;
+            if (b != this.ah) {
+                this.co("ActualBorderWidth", b, a);
+            }
+        }
+        get ar() {
+            return this.al;
+        }
+        set ar(a) {
+            let b = this.al;
+            this.al = a;
+            if (b != this.al) {
+                this.co("CornerRadius", b, a);
+            }
+        }
+        get av() {
+            return this.am;
+        }
+        set av(a) {
+            let b = this.am;
+            this.am = a;
+            if (b != this.am) {
+                this.co("TickStrokeWidth", b, a);
+            }
+        }
+        get ap() {
+            return this.aj;
+        }
+        set ap(a) {
+            let b = this.aj;
+            this.aj = a;
+            if (b != this.aj) {
+                this.co("ActualTickStrokeWidth", b, a);
+            }
+        }
+        get ao() {
+            return this.ai;
+        }
+        set ao(a) {
+            let b = this.ai;
+            this.ai = a;
+            if (b != this.ai) {
+                this.co("ActualCornerRadius", b, a);
+            }
+        }
+        get c8() {
+            return this.cy;
+        }
+        set c8(a) {
+            let b = this.cy;
+            this.cy = a;
+            if (b != this.cy) {
+                this.co("ActualCheckedBackgroundColor", b, a);
+            }
+        }
+        get b1() {
+            return this.a9;
+        }
+        set b1(a) {
+            let b = this.a9;
+            this.a9 = a;
+            if (b != this.a9) {
+                this.co("InputId", b, a);
+            }
+        }
+        get bz() {
+            return this.a8;
+        }
+        set bz(a) {
+            let b = this.a8;
+            this.a8 = a;
+            if (b != this.a8) {
+                this.co("Id", b, a);
+            }
+        }
+        get labelId() {
+            return this.ba;
+        }
+        set labelId(a) {
+            let b = this.ba;
+            this.ba = a;
+            if (b != this.ba) {
+                this.co("LabelId", b, a);
+            }
+        }
+        get ca() {
+            return this.bb;
+        }
+        set ca(a) {
+            let b = this.bb;
+            this.bb = a;
+            if (b != this.bb) {
+                this.co("Name", b, a);
+            }
+        }
+        get aa() {
+            return this.t;
+        }
+        get az() {
+            return this.ax;
+        }
+        set az(a) {
+            let b = this.ax;
+            this.ax = a;
+            this.t = true;
+            if (b != this.ax) {
+                this.co("TabIndex", b, a);
+            }
+        }
+        get ay() {
+            return this.aw;
+        }
+        set ay(a) {
+            let b = this.aw;
+            this.aw = a;
+            if (b != this.aw) {
+                this.co("Required", b, a);
+            }
+        }
+        get bn() {
+            return this.a7;
+        }
+        set bn(a) {
+            let b = this.a7;
+            this.a7 = a;
+            if (b != this.a7) {
+                this.co("AriaLabelledBy", b, a);
+            }
+        }
+        get bm() {
+            return this.a6;
+        }
+        set bm(a) {
+            let b = this.a6;
+            this.a6 = a;
+            if (b != this.a6) {
+                this.co("AriaLabel", b, a);
+            }
+        }
+        get a4() {
+            return this.a2;
+        }
+        set a4(a) {
+            let b = this.a2;
+            this.a2 = a;
+            if (b != this.a2) {
+                this.co("Value", b, a);
+            }
+        }
+        get focused() {
+            return this.w;
+        }
+        set focused(a) {
+            let b = this.w;
+            this.w = a;
+            if (b != this.w) {
+                this.co("IsFocused", b, a);
+            }
+        }
+        get e() {
+            return this.d;
+        }
+        set e(a) {
+            let b = this.d;
+            this.d = a;
+            if (b != this.d) {
+                this.co("LabelPosition", enumGetBox(CheckboxLabelPosition_$type, b), enumGetBox(CheckboxLabelPosition_$type, a));
+            }
+        }
+        get y() {
+            return this.q;
+        }
+        set y(a) {
+            let b = this.q;
+            this.q = a;
+            if (b != this.q) {
+                this.co("DisableRipple", b, a);
+            }
+        }
+        get checked() {
+            return this.u;
+        }
+        set checked(a) {
+            let b = this.u;
+            this.u = a;
+            if (b != this.u) {
+                this.co("IsChecked", b, a);
+            }
+        }
+        get indeterminate() {
+            return this.x;
+        }
+        set indeterminate(a) {
+            let b = this.x;
+            this.x = a;
+            if (b != this.x) {
+                this.co("IsIndeterminate", b, a);
+            }
+        }
+        get disabled() {
+            return this.v;
+        }
+        set disabled(a) {
+            let b = this.v;
+            this.v = a;
+            if (b != this.v) {
+                this.co("IsDisabled", b, a);
+            }
+        }
+        get z() {
+            return this.r;
+        }
+        set z(a) {
+            let b = this.r;
+            this.r = a;
+            if (b != this.r) {
+                this.co("DisableTransitions", b, a);
+            }
+        }
+        cp() {
+            this.ck();
+            if (this.checked) {
+                this.view.aj(BrushUtil.p(this.c8, 0.6), BrushUtil.p(this.c8, 0.1));
+            }
+            else {
+                this.view.aj(BrushUtil.p(this.c8, 0.6), BrushUtil.p(this.dc, 0.1));
+            }
+        }
+        get a() {
+            let a = new AnimationKeyFrameEffectTiming();
+            a.g = 300;
+            a.b = 0;
+            return a;
+        }
+        ck() {
+            this.view.z();
+            let a = false;
+            if (this.o == null) {
+                if (!a) {
+                    a = true;
+                    this.view.ag();
+                }
+                this.o = KeyFrameAnimationFactory.f.c(this.view.a(this.a).m(new AnimationKeyFrameProperty(2, this.db), new AnimationKeyFrameProperty(3, this.dc)).m(new AnimationKeyFrameProperty(2, this.c8), new AnimationKeyFrameProperty(3, this.c9)));
+                this.p = KeyFrameAnimationFactory.f.c(this.view.b(this.a).m(new AnimationKeyFrameProperty(19, 24), new AnimationKeyFrameProperty(1, 0)).m(new AnimationKeyFrameProperty(19, 0), new AnimationKeyFrameProperty(1, 1)));
+            }
+        }
+        toggle() {
+            if (this.disabled) {
+                return;
+            }
+            this.ck();
+            this.focused = false;
+            this.s = true;
+            let a = false;
+            if (this.indeterminate) {
+                a = true;
+                this.checked = true;
+            }
+            this.indeterminate = false;
+            this.checked = !this.checked;
+            this.s = false;
+            this.cv(a);
+            if (this.change != null) {
+                let b = new CheckboxChangeEventArgs();
+                b.isChecked = this.checked;
+                b.isIndeterminate = this.indeterminate;
+                this.change(this, b);
+            }
+        }
+        cv(a) {
+            this.ck();
+            let b = this.checked;
+            if (this.indeterminate) {
+                b = true;
+            }
+            let c = 1;
+            if (!b) {
+                c = -1;
+            }
+            if (b) {
+                this.view.aj(BrushUtil.p(this.c8, 0.6), BrushUtil.p(this.c8, 0.1));
+            }
+            else {
+                this.view.aj(BrushUtil.p(this.c8, 0.6), BrushUtil.p(this.dc, 0.1));
+            }
+            if (!this.indeterminate) {
+                NativeUI.ad(this.view.t, null);
+            }
+            if (this.z || this.indeterminate || a) {
+                let d = this.view.s;
+                let e = this.view.t;
+                if (this.indeterminate) {
+                    let f = new TransformGroup();
+                    f.j.add(((() => {
+                        let $ret = new RotateTransform();
+                        $ret.j = 45;
+                        return $ret;
+                    })()));
+                    f.j.add(((() => {
+                        let $ret = new TranslateTransform();
+                        $ret.j = -this.view.k();
+                        return $ret;
+                    })()));
+                    NativeUI.l(d, this.c8);
+                    NativeUI.m(d, this.c9);
+                    NativeUI.w(e, 1);
+                    NativeUI.aa(e, 41);
+                    NativeUI.ad(e, f);
+                }
+                else if (b) {
+                    NativeUI.l(d, this.c8);
+                    NativeUI.m(d, this.c9);
+                    NativeUI.w(e, 1);
+                    NativeUI.aa(e, 0);
+                }
+                else {
+                    NativeUI.l(d, this.db);
+                    NativeUI.m(d, this.dc);
+                    NativeUI.w(e, 0);
+                    NativeUI.aa(e, 24);
+                }
+                if (this.o.playState == 1) {
+                    this.o.cancel();
+                }
+                if (this.p.playState == 1) {
+                    this.p.cancel();
+                }
+                return;
+            }
+            if ((c > 0 && this.o.playbackRate < 0) || (c < 0 && this.o.playbackRate > 0)) {
+                this.o.reverse();
+                this.o.finished.f((g) => {
+                    if (this.o != null) {
+                        this.o.commitStyles();
+                    }
+                });
+                this.p.reverse();
+                this.p.finished.f((g) => {
+                    if (this.p != null) {
+                        this.p.commitStyles();
+                    }
+                });
+            }
+            else {
+                this.o.play();
+                this.o.finished.f((g) => {
+                    if (this.o != null) {
+                        this.o.commitStyles();
+                    }
+                });
+                this.p.play();
+                this.p.finished.f((g) => {
+                    if (this.p != null) {
+                        this.p.commitStyles();
+                    }
+                });
+            }
+        }
+        onDetachedFromUI() {
+            this.view.ad();
+        }
+        onAttachedToUI() {
+            this.view.ab();
+        }
+        onContentReady() {
+            if (this.indeterminate) {
+                this.cv(false);
+            }
+        }
+        af() {
+            return this.view.i();
+        }
+        a3() {
+            return this.b();
+        }
+        by() {
+            let a = this.b();
+            return a.s();
+        }
+        b() {
+            let a = new CheckboxVisualModelExport();
+            a.f = this.n;
+            a.d = AppearanceHelper.a(this.db);
+            a.c = AppearanceHelper.a(this.da);
+            a.e = AppearanceHelper.a(this.dc);
+            a.b = AppearanceHelper.a(this.c9);
+            a.o = this.aq;
+            a.l = this.an;
+            a.p = this.ar;
+            a.q = this.av;
+            a.n = this.ap;
+            a.m = this.ao;
+            a.a = AppearanceHelper.a(this.c8);
+            a.r = this.a4;
+            a.j = this.focused;
+            a.g = this.y;
+            a.h = this.checked;
+            a.k = this.indeterminate;
+            a.i = this.disabled;
+            return a;
+        }
+        provideContainer(a) {
+            this.view.ac(a);
+        }
+    }
+    XCheckbox.$t = markType(XCheckbox, 'XCheckbox', Base.$, [INotifyPropertyChanged_$type]);
+    XCheckbox.g = ThemeResolver.a(((() => {
+        let $ret = new Dictionary$2(String_$type, Base.$, 0);
+        $ret.addItem("CheckPath", "M4.1,12.7 9,17.6 20.3,6.3");
+        $ret.addItem("UncheckedBorderColor", BrushUtil.g(255, 153, 153, 153));
+        $ret.addItem("CheckedBorderColor", BrushUtil.g(138, 33, 150, 243));
+        $ret.addItem("UncheckedBackgroundColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("CheckedBackgroundColor", BrushUtil.g(255, 33, 150, 243));
+        $ret.addItem("TickColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("TickStrokeWidth", 3);
+        $ret.addItem("BorderWidth", NaN);
+        $ret.addItem("CornerRadius", 2);
+        return $ret;
+    })()));
+    XCheckbox.h = ThemeResolver.a(((() => {
+        let $ret = new Dictionary$2(String_$type, Base.$, 0);
+        $ret.addItem("CheckPath", "M4.1,12.7 9,17.6 20.3,6.3");
+        $ret.addItem("UncheckedBorderColor", BrushUtil.g(138, 0, 0, 0));
+        $ret.addItem("CheckedBorderColor", BrushUtil.g(138, 0, 0, 0));
+        $ret.addItem("UncheckedBackgroundColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("CheckedBackgroundColor", BrushUtil.g(255, 228, 28, 119));
+        $ret.addItem("TickColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("TickStrokeWidth", 3);
+        $ret.addItem("BorderWidth", NaN);
+        $ret.addItem("CornerRadius", 2);
+        return $ret;
+    })()));
+    XCheckbox.j = ThemeResolver.a(((() => {
+        let $ret = new Dictionary$2(String_$type, Base.$, 0);
+        $ret.addItem("CheckPath", "M5.1,12.7 9,17.6 19,9");
+        $ret.addItem("UncheckedBorderColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("CheckedBorderColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("UncheckedBackgroundColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("CheckedBackgroundColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("TickColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("TickStrokeWidth", 3);
+        $ret.addItem("BorderWidth", NaN);
+        $ret.addItem("CornerRadius", 2);
+        return $ret;
+    })()));
+    XCheckbox.i = ThemeResolver.a(((() => {
+        let $ret = new Dictionary$2(String_$type, Base.$, 0);
+        $ret.addItem("CheckPath", "M5.1,12.7 9,17.6 19,9");
+        $ret.addItem("UncheckedBorderColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("CheckedBorderColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("UncheckedBackgroundColor", BrushUtil.g(255, 55, 63, 86));
+        $ret.addItem("CheckedBackgroundColor", BrushUtil.g(255, 105, 136, 255));
+        $ret.addItem("TickColor", BrushUtil.g(255, 255, 255, 255));
+        $ret.addItem("TickStrokeWidth", 3);
+        $ret.addItem("BorderWidth", NaN);
+        $ret.addItem("CornerRadius", 2);
+        return $ret;
+    })()));
+    XCheckbox.k = new ThemeResolver(1, ((() => {
+        let $ret = new Dictionary$2(BaseControlTheme_$type, Theme.$, 0);
+        $ret.addItem(2, XCheckbox.h);
+        $ret.addItem(1, XCheckbox.g);
+        $ret.addItem(3, XCheckbox.j);
+        $ret.addItem(4, XCheckbox.i);
+        $ret.addItem(5, XCheckbox.j);
+        $ret.addItem(6, XCheckbox.i);
+        return $ret;
+    })()), 2);
+    XCheckbox.m = 2;
+    XCheckbox.a1 = 0;
+    XCheckbox.a0 = 0;
+    return XCheckbox;
+})();