igniteui-react-inputs
Version:
Ignite UI React input components.
1,315 lines (1,314 loc) • 44.2 kB
JavaScript
/*
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 { __extends, __values } from "tslib";
import { Base, Delegate_$type, fromEnum, runOn, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, enumGetBox, String_$type } from "igniteui-react-core";
import { XRipple } from "./XRipple";
import { List$1 } from "igniteui-react-core";
import { Size } from "igniteui-react-core";
import { KeyFrameAnimationFactory } from "igniteui-react-core";
import { AnimationKeyFrameEffect } from "igniteui-react-core";
import { AnimationKeyFrameEffectTiming } from "igniteui-react-core";
import { stringReplace } from "igniteui-react-core";
import { BaseControlTheme_$type } from "igniteui-react-core";
import { CheckboxLabelPosition_$type } from "./CheckboxLabelPosition";
import { BrushUtil } from "igniteui-react-core";
import { ThemeResolver } from "./ThemeResolver";
import { CornerRadius } from "igniteui-react-core";
import { NativeUI } from "igniteui-react-core";
import { Thickness } from "igniteui-react-core";
import { CheckboxChangeEventArgs } from "./CheckboxChangeEventArgs";
import { AnimationKeyFrameProperty } from "igniteui-react-core";
import { TransformGroup } from "igniteui-react-core";
import { RotateTransform } from "igniteui-react-core";
import { TranslateTransform } from "igniteui-react-core";
import { CheckboxVisualModelExport } from "./CheckboxVisualModelExport";
import { AppearanceHelper } from "igniteui-react-core";
import { Dictionary$2 } from "igniteui-react-core";
import { Theme } from "./Theme";
import { isNaN_ } from "igniteui-react-core";
/**
* @hidden
*/
var CheckboxView = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(CheckboxView, _super);
function CheckboxView() {
var _this = _super.call(this) || this;
_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;
return _this;
}
CheckboxView.prototype.af = function () {
};
CheckboxView.prototype.i = function () {
return true;
};
CheckboxView.prototype.ad = function (a) {
var e_1, _a;
if (a == null) {
try {
for (var _b = __values(fromEnum(this.j)), _c = _b.next(); !_c.done; _c = _b.next()) {
var b = _c.value;
b();
}
}
catch (e_1_1) {
e_1 = { error: e_1_1 };
}
finally {
try {
if (_c && !_c.done && (_a = _b.return))
_a.call(_b);
}
finally {
if (e_1)
throw e_1.error;
}
}
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");
var 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.aj();
this.j.add(c.listen("change", runOn(this, this.x)));
this.j.add(c.listen("click", runOn(this, this.y)));
this.j.add(c.listen("focus", runOn(this, this.z)));
this.j.add(c.listen("blur", runOn(this, this.w)));
this.l.append(c);
var 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);
var 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);
var 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);
var g = this.l.createElementNS("path", "http://www.w3.org/2000/svg");
g.setAttribute("d", this.c.bf);
f.append(g);
this.n = g;
var h = this.l.createElement("div");
var 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");
var j = new XRipple();
j.provideContainer(i);
j.q = d;
var 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);
var 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.v)));
this.l.append(l);
this.l.getPortal(l, "ChildContent", function (m) {
}, true);
this.c.cp();
};
CheckboxView.prototype.v = function (a) {
this.c.toggle();
};
CheckboxView.prototype.aj = function () {
if (this.i()) {
var 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);
}
};
CheckboxView.prototype.al = function () {
return new Size(1, this.q.width(), this.q.height());
};
CheckboxView.prototype.ai = function () {
this.n.setAttribute("d", this.c.bf);
};
CheckboxView.prototype.ag = function () {
if (this.i()) {
var a = this.c.b1;
this.r.setAttribute("id", a);
this.q.setAttribute("for", a);
}
};
CheckboxView.prototype.w = function (a) {
this.c.focused = false;
};
CheckboxView.prototype.z = function (a) {
this.c.focused = true;
};
CheckboxView.prototype.y = function (a) {
a.stopPropagation();
if (this.h()) {
var native_ = this.r.getNativeElement();
native_.blur();
}
this.c.toggle();
};
CheckboxView.prototype.h = function () {
return false;
};
CheckboxView.prototype.x = function (a) {
a.stopPropagation();
};
CheckboxView.prototype.aa = function () {
if (KeyFrameAnimationFactory.h == null) {
KeyFrameAnimationFactory.h = this.l;
}
};
CheckboxView.prototype.a = function (a) {
return new AnimationKeyFrameEffect(0, this.q, 0, null, a);
};
CheckboxView.prototype.b = function (a) {
return new AnimationKeyFrameEffect(0, this.o, 0, null, a);
};
CheckboxView.prototype.ab = function (a) {
};
Object.defineProperty(CheckboxView.prototype, "t", {
get: function () {
return this.q;
},
enumerable: false,
configurable: true
});
Object.defineProperty(CheckboxView.prototype, "s", {
get: function () {
return this.q;
},
enumerable: false,
configurable: true
});
Object.defineProperty(CheckboxView.prototype, "e", {
get: function () {
return this.d;
},
enumerable: false,
configurable: true
});
Object.defineProperty(CheckboxView.prototype, "u", {
get: function () {
return this.o;
},
enumerable: false,
configurable: true
});
CheckboxView.prototype.ac = function () {
this.g = true;
this.j.add(this.r.listen("change", runOn(this, this.x)));
this.j.add(this.r.listen("click", runOn(this, this.y)));
this.j.add(this.r.listen("focus", runOn(this, this.z)));
this.j.add(this.r.listen("blur", runOn(this, this.w)));
this.j.add(this.p.listen("click", runOn(this, this.v)));
};
CheckboxView.prototype.ae = function () {
var e_2, _a;
this.g = false;
try {
for (var _b = __values(fromEnum(this.j)), _c = _b.next(); !_c.done; _c = _b.next()) {
var a = _c.value;
a();
}
}
catch (e_2_1) {
e_2 = { error: e_2_1 };
}
finally {
try {
if (_c && !_c.done && (_a = _b.return))
_a.call(_b);
}
finally {
if (e_2)
throw e_2.error;
}
}
this.j.clear();
};
CheckboxView.prototype.ah = function () {
var model_ = this.c;
if (model_.externalObject && model_.externalObject.refreshDefaults) {
model_.externalObject.refreshDefaults();
}
;
};
CheckboxView.prototype.ak = function (a, b) {
this.d.ax = a;
this.d.aw = b;
};
CheckboxView.prototype.k = function () {
var a = this.q.getStyleProperty("border-top-width");
a = stringReplace(a, "px", "");
return parseFloat(a);
};
CheckboxView.$t = markType(CheckboxView, 'CheckboxView');
return CheckboxView;
}(Base));
export { CheckboxView };
/**
* @hidden
*/
var XCheckbox = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(XCheckbox, _super);
function XCheckbox() {
var _this = _super.call(this) || this;
_this._view = null;
_this.l = 0;
_this.s = false;
_this.ag = false;
_this.c6 = null;
_this.c1 = ThemeResolver.ah(XCheckbox.m, BrushUtil.j(0, 0, 0, 0), BrushUtil.j(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;
var a = new CheckboxView();
a.c = _this;
_this.view = a;
_this.view.af();
return _this;
}
Object.defineProperty(XCheckbox.prototype, "view", {
get: function () {
return this._view;
},
set: function (a) {
this._view = a;
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "n", {
get: function () {
return this.l;
},
set: function (a) {
var b = this.l;
this.l = a;
if (b != this.l) {
this.co("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, a));
}
},
enumerable: false,
configurable: true
});
XCheckbox.prototype.destroy = function () {
this.provideContainer(null);
};
XCheckbox.prototype.co = function (a, b, c) {
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
this.cq(a, b, c);
};
XCheckbox.prototype.cu = function () {
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;
};
XCheckbox.prototype.cq = function (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();
var d = (this.z);
this.z = true;
this.cv(this.indeterminate);
this.z = d;
break;
case "ActualCornerRadius":
this.ct();
break;
case "ActualCheckPath":
this.view.ai();
break;
case "IsChecked":
if (!this.s) {
var e = this.indeterminate;
this.s = true;
this.indeterminate = false;
this.s = false;
var 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.ag();
break;
}
};
XCheckbox.prototype.ct = function () {
var a = this.view.t;
var b = this.view.s;
if (a == null || b == null) {
return;
}
NativeUI.o(a, new CornerRadius(0, this.ao));
NativeUI.o(b, new CornerRadius(0, this.ao));
if (!isNaN_(this.an)) {
NativeUI.p(b, new Thickness(0, this.an));
}
if (this.checked) {
NativeUI.m(a, this.c8);
NativeUI.n(b, this.c9);
}
else {
NativeUI.m(a, this.db);
NativeUI.n(b, this.dc);
}
};
XCheckbox.prototype.cw = function () {
var a = this.view.u;
if (a == null) {
return;
}
NativeUI.aa(a, this.da);
NativeUI.ad(a, this.ap);
};
Object.defineProperty(XCheckbox.prototype, "dl", {
get: function () {
return this.c6;
},
set: function (a) {
var b = this.c6;
this.c6 = a;
if (b != this.c6) {
this.co("UncheckedBackgroundColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "db", {
get: function () {
return this.c1;
},
set: function (a) {
var b = this.c1;
this.c1 = a;
if (b != this.c1) {
this.co("ActualUncheckedBackgroundColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "dd", {
get: function () {
return this.c3;
},
set: function (a) {
var b = this.c3;
this.c3 = a;
if (b != this.c3) {
this.co("CheckedBackgroundColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "dk", {
get: function () {
return this.c5;
},
set: function (a) {
var b = this.c5;
this.c5 = a;
if (b != this.c5) {
this.co("TickColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "da", {
get: function () {
return this.c0;
},
set: function (a) {
var b = this.c0;
this.c0 = a;
if (b != this.c0) {
this.co("ActualTickColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "dm", {
get: function () {
return this.c7;
},
set: function (a) {
var b = this.c7;
this.c7 = a;
if (b != this.c7) {
this.co("UncheckedBorderColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "de", {
get: function () {
return this.c4;
},
set: function (a) {
var b = this.c4;
this.c4 = a;
if (b != this.c4) {
this.co("CheckedBorderColor", b, a);
}
},
enumerable: false,
configurable: true
});
XCheckbox.prototype.cx = function (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");
};
Object.defineProperty(XCheckbox.prototype, "bf", {
get: function () {
return this.a5;
},
set: function (a) {
var b = this.a5;
this.a5 = a;
if (b != this.a5) {
this.co("ActualCheckPath", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "dc", {
get: function () {
return this.c2;
},
set: function (a) {
var b = this.c2;
this.c2 = a;
if (b != this.c2) {
this.co("ActualUncheckedBorderColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "c9", {
get: function () {
return this.cz;
},
set: function (a) {
var b = this.cz;
this.cz = a;
if (b != this.cz) {
this.co("ActualCheckedBorderColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "aq", {
get: function () {
return this.ak;
},
set: function (a) {
var b = this.ak;
this.ak = a;
if (b != this.ak) {
this.co("BorderWidth", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "an", {
get: function () {
return this.ah;
},
set: function (a) {
var b = this.ah;
this.ah = a;
if (b != this.ah) {
this.co("ActualBorderWidth", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "ar", {
get: function () {
return this.al;
},
set: function (a) {
var b = this.al;
this.al = a;
if (b != this.al) {
this.co("CornerRadius", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "av", {
get: function () {
return this.am;
},
set: function (a) {
var b = this.am;
this.am = a;
if (b != this.am) {
this.co("TickStrokeWidth", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "ap", {
get: function () {
return this.aj;
},
set: function (a) {
var b = this.aj;
this.aj = a;
if (b != this.aj) {
this.co("ActualTickStrokeWidth", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "ao", {
get: function () {
return this.ai;
},
set: function (a) {
var b = this.ai;
this.ai = a;
if (b != this.ai) {
this.co("ActualCornerRadius", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "c8", {
get: function () {
return this.cy;
},
set: function (a) {
var b = this.cy;
this.cy = a;
if (b != this.cy) {
this.co("ActualCheckedBackgroundColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "b1", {
get: function () {
return this.a9;
},
set: function (a) {
var b = this.a9;
this.a9 = a;
if (b != this.a9) {
this.co("InputId", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "bz", {
get: function () {
return this.a8;
},
set: function (a) {
var b = this.a8;
this.a8 = a;
if (b != this.a8) {
this.co("Id", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "labelId", {
get: function () {
return this.ba;
},
set: function (a) {
var b = this.ba;
this.ba = a;
if (b != this.ba) {
this.co("LabelId", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "ca", {
get: function () {
return this.bb;
},
set: function (a) {
var b = this.bb;
this.bb = a;
if (b != this.bb) {
this.co("Name", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "aa", {
get: function () {
return this.t;
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "az", {
get: function () {
return this.ax;
},
set: function (a) {
var b = this.ax;
this.ax = a;
this.t = true;
if (b != this.ax) {
this.co("TabIndex", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "ay", {
get: function () {
return this.aw;
},
set: function (a) {
var b = this.aw;
this.aw = a;
if (b != this.aw) {
this.co("Required", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "bn", {
get: function () {
return this.a7;
},
set: function (a) {
var b = this.a7;
this.a7 = a;
if (b != this.a7) {
this.co("AriaLabelledBy", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "bm", {
get: function () {
return this.a6;
},
set: function (a) {
var b = this.a6;
this.a6 = a;
if (b != this.a6) {
this.co("AriaLabel", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "a4", {
get: function () {
return this.a2;
},
set: function (a) {
var b = this.a2;
this.a2 = a;
if (b != this.a2) {
this.co("Value", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "focused", {
get: function () {
return this.w;
},
set: function (a) {
var b = this.w;
this.w = a;
if (b != this.w) {
this.co("IsFocused", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "e", {
get: function () {
return this.d;
},
set: function (a) {
var b = this.d;
this.d = a;
if (b != this.d) {
this.co("LabelPosition", enumGetBox(CheckboxLabelPosition_$type, b), enumGetBox(CheckboxLabelPosition_$type, a));
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "y", {
get: function () {
return this.q;
},
set: function (a) {
var b = this.q;
this.q = a;
if (b != this.q) {
this.co("DisableRipple", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "checked", {
get: function () {
return this.u;
},
set: function (a) {
var b = this.u;
this.u = a;
if (b != this.u) {
this.co("IsChecked", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "indeterminate", {
get: function () {
return this.x;
},
set: function (a) {
var b = this.x;
this.x = a;
if (b != this.x) {
this.co("IsIndeterminate", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "disabled", {
get: function () {
return this.v;
},
set: function (a) {
var b = this.v;
this.v = a;
if (b != this.v) {
this.co("IsDisabled", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XCheckbox.prototype, "z", {
get: function () {
return this.r;
},
set: function (a) {
var b = this.r;
this.r = a;
if (b != this.r) {
this.co("DisableTransitions", b, a);
}
},
enumerable: false,
configurable: true
});
XCheckbox.prototype.cp = function () {
this.ck();
if (this.checked) {
this.view.ak(BrushUtil.s(this.c8, 0.6), BrushUtil.s(this.c8, 0.1));
}
else {
this.view.ak(BrushUtil.s(this.c8, 0.6), BrushUtil.s(this.dc, 0.1));
}
};
Object.defineProperty(XCheckbox.prototype, "a", {
get: function () {
var a = new AnimationKeyFrameEffectTiming();
a.g = 300;
a.b = 0;
return a;
},
enumerable: false,
configurable: true
});
XCheckbox.prototype.ck = function () {
this.view.aa();
var a = false;
if (this.o == null) {
if (!a) {
a = true;
this.view.ah();
}
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)));
}
};
XCheckbox.prototype.toggle = function () {
if (this.disabled) {
return;
}
this.ck();
this.focused = false;
this.s = true;
var 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) {
var b = new CheckboxChangeEventArgs();
b.isChecked = this.checked;
b.isIndeterminate = this.indeterminate;
this.change(this, b);
}
};
XCheckbox.prototype.cv = function (a) {
var _this = this;
this.ck();
var b = this.checked;
if (this.indeterminate) {
b = true;
}
var c = 1;
if (!b) {
c = -1;
}
if (b) {
this.view.ak(BrushUtil.s(this.c8, 0.6), BrushUtil.s(this.c8, 0.1));
}
else {
this.view.ak(BrushUtil.s(this.c8, 0.6), BrushUtil.s(this.dc, 0.1));
}
if (!this.indeterminate) {
NativeUI.af(this.view.u, null);
}
if (this.z || this.indeterminate || a) {
var d = this.view.t;
var e = this.view.s;
var f = this.view.u;
if (this.indeterminate) {
var g = new TransformGroup();
var h = this.view.al();
g.j.add(((function () {
var $ret = new RotateTransform();
$ret.j = 45;
return $ret;
})()));
g.j.add(((function () {
var $ret = new TranslateTransform();
$ret.j = -_this.view.k();
return $ret;
})()));
NativeUI.m(d, this.c8);
NativeUI.n(e, this.c9);
NativeUI.y(f, 1);
NativeUI.ac(f, 41);
NativeUI.af(f, g);
}
else if (b) {
NativeUI.m(d, this.c8);
NativeUI.n(e, this.c9);
NativeUI.y(f, 1);
NativeUI.ac(f, 0);
}
else {
NativeUI.m(d, this.db);
NativeUI.n(e, this.dc);
NativeUI.y(f, 0);
NativeUI.ac(f, 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(function (i) {
if (_this.o != null) {
_this.o.commitStyles();
}
});
this.p.reverse();
this.p.finished.f(function (i) {
if (_this.p != null) {
_this.p.commitStyles();
}
});
}
else {
this.o.play();
this.o.finished.f(function (i) {
if (_this.o != null) {
_this.o.commitStyles();
}
});
this.p.play();
this.p.finished.f(function (i) {
if (_this.p != null) {
_this.p.commitStyles();
}
});
}
};
XCheckbox.prototype.onDetachedFromUI = function () {
this.view.ae();
};
XCheckbox.prototype.onAttachedToUI = function () {
this.view.ac();
};
XCheckbox.prototype.onContentReady = function () {
if (this.indeterminate) {
this.cv(false);
}
};
XCheckbox.prototype.af = function () {
return this.view.i();
};
XCheckbox.prototype.a3 = function () {
return this.b();
};
XCheckbox.prototype.by = function () {
var a = this.b();
return a.s();
};
XCheckbox.prototype.b = function () {
var 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;
};
XCheckbox.prototype.provideContainer = function (a) {
this.view.ad(a);
};
XCheckbox.$t = markType(XCheckbox, 'XCheckbox', Base.$, [INotifyPropertyChanged_$type]);
XCheckbox.g = ThemeResolver.a(((function () {
var $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.j(255, 153, 153, 153));
$ret.addItem("CheckedBorderColor", BrushUtil.j(138, 33, 150, 243));
$ret.addItem("UncheckedBackgroundColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("CheckedBackgroundColor", BrushUtil.j(255, 33, 150, 243));
$ret.addItem("TickColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("TickStrokeWidth", 3);
$ret.addItem("BorderWidth", NaN);
$ret.addItem("CornerRadius", 2);
return $ret;
})()));
XCheckbox.h = ThemeResolver.a(((function () {
var $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.j(138, 0, 0, 0));
$ret.addItem("CheckedBorderColor", BrushUtil.j(138, 0, 0, 0));
$ret.addItem("UncheckedBackgroundColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("CheckedBackgroundColor", BrushUtil.j(255, 228, 28, 119));
$ret.addItem("TickColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("TickStrokeWidth", 3);
$ret.addItem("BorderWidth", NaN);
$ret.addItem("CornerRadius", 2);
return $ret;
})()));
XCheckbox.j = ThemeResolver.a(((function () {
var $ret = new Dictionary$2(String_$type, Base.$, 0);
$ret.addItem("CheckPath", "M5.1,12.7 9,17.6 19,9");
$ret.addItem("UncheckedBorderColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("CheckedBorderColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("UncheckedBackgroundColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("CheckedBackgroundColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("TickColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("TickStrokeWidth", 3);
$ret.addItem("BorderWidth", 1);
$ret.addItem("CornerRadius", 2);
return $ret;
})()));
XCheckbox.i = ThemeResolver.a(((function () {
var $ret = new Dictionary$2(String_$type, Base.$, 0);
$ret.addItem("CheckPath", "M5.1,12.7 9,17.6 19,9");
$ret.addItem("UncheckedBorderColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("CheckedBorderColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("UncheckedBackgroundColor", BrushUtil.j(255, 55, 63, 86));
$ret.addItem("CheckedBackgroundColor", BrushUtil.j(255, 105, 136, 255));
$ret.addItem("TickColor", BrushUtil.j(255, 255, 255, 255));
$ret.addItem("TickStrokeWidth", 3);
$ret.addItem("BorderWidth", 1);
$ret.addItem("CornerRadius", 2);
return $ret;
})()));
XCheckbox.k = new ThemeResolver(1, ((function () {
var $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;
}(Base));
export { XCheckbox };