igniteui-react-inputs
Version:
Ignite UI React input components.
492 lines (491 loc) • 14.7 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 } from "igniteui-react-core";
import { List$1 } from "igniteui-react-core";
import { ScaleTransform } from "igniteui-react-core";
import { NativeUI } from "igniteui-react-core";
import { KeyFrameAnimationFactory } from "igniteui-react-core";
import { AnimationKeyFrameEffect } from "igniteui-react-core";
import { AnimationKeyFrameEffectTiming } from "igniteui-react-core";
import { LinkedList$1 } from "igniteui-react-core";
import { IKeyFrameAnimation_$type } from "igniteui-react-core";
import { AnimationKeyFrameProperty } from "igniteui-react-core";
import { RippleVisualModelExport } from "./RippleVisualModelExport";
import { AppearanceHelper } from "igniteui-react-core";
import { BrushUtil } from "igniteui-react-core";
/**
* @hidden
*/
var RippleView = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(RippleView, _super);
function RippleView() {
var _this = _super.call(this) || this;
_this.b = null;
_this.g = null;
_this.c = null;
_this.f = new List$1(Delegate_$type, 0);
_this.l = null;
_this.d = true;
_this.k = null;
_this.h = null;
_this.j = null;
_this.i = null;
return _this;
}
RippleView.prototype.w = function () {
};
RippleView.prototype.e = function () {
return true;
};
RippleView.prototype.t = function (a) {
var e_1, _a;
if (a == null) {
try {
for (var _b = __values(fromEnum(this.f)), _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.f.clear();
}
this.g = a;
this.b.ai();
};
RippleView.prototype.v = function () {
var e_2, _a;
if (this.b.q == null) {
this.l = null;
try {
for (var _b = __values(fromEnum(this.f)), _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.f.clear();
}
else {
var b = this.b.q;
var c = this.g.getWrapper(b);
this.l = c;
this.f.add(c.listen("click", runOn(this, this.p)));
this.f.add(c.listen("mouseenter", runOn(this, this.q)));
this.f.add(c.listen("mouseleave", runOn(this, this.r)));
}
};
RippleView.prototype.r = function (a) {
this.b.ag();
};
RippleView.prototype.q = function (a) {
this.b.af();
};
RippleView.prototype.p = function (a) {
if (this.l == null) {
return;
}
var b = this.g.rootWrapper.getOffset();
var c = a.pageX - b.left;
var d = a.pageY - b.top;
this.b.al(c, d, this.g.rootWrapper.outerWidth(), this.g.rootWrapper.outerHeight());
};
RippleView.prototype.aa = function () {
if (this.b.j) {
this.g.rootWrapper.setStyleProperty("background-color", this.b.as._fill);
}
};
RippleView.prototype.x = function () {
this.g.rootWrapper.setStyleProperty("background-color", "transparent");
};
RippleView.prototype.z = function () {
this.g.rootWrapper.setStyleProperty("background-color", this.b.as._fill);
};
RippleView.prototype.m = function (a, b, c) {
var d = this.g.createElement("span");
d.setStyleProperty("width", c * 2 + "px");
d.setStyleProperty("height", c * 2 + "px");
d.setStyleProperty("top", b + "px");
d.setStyleProperty("left", a + "px");
d.setStyleProperty("background-color", this.b.at._fill);
d.setStyleProperty("position", "absolute");
d.setStyleProperty("pointer-events", "none");
d.setStyleProperty("border-radius", c + "px");
d.setStyleProperty("opacity", ".5");
NativeUI.af(d, ((function () {
var $ret = new ScaleTransform();
$ret.l = 0.3;
$ret.m = 0.3;
return $ret;
})()));
this.g.append(d);
return d;
};
RippleView.prototype.y = function (a) {
var b = a;
b.remove();
};
RippleView.prototype.n = function () {
if (KeyFrameAnimationFactory.h == null) {
KeyFrameAnimationFactory.h = this.g;
}
};
RippleView.prototype.a = function (a, b) {
return new AnimationKeyFrameEffect(0, a, 0, null, b);
};
RippleView.prototype.o = function (a) {
};
RippleView.prototype.s = function () {
this.d = true;
this.v();
};
RippleView.prototype.u = function () {
var e_3, _a;
this.d = false;
try {
for (var _b = __values(fromEnum(this.f)), _c = _b.next(); !_c.done; _c = _b.next()) {
var a = _c.value;
a();
}
}
catch (e_3_1) {
e_3 = { error: e_3_1 };
}
finally {
try {
if (_c && !_c.done && (_a = _b.return))
_a.call(_b);
}
finally {
if (e_3)
throw e_3.error;
}
}
this.f.clear();
};
RippleView.$t = markType(RippleView, 'RippleView');
return RippleView;
}(Base));
export { RippleView };
/**
* @hidden
*/
var XRipple = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(XRipple, _super);
function XRipple() {
var _this = _super.call(this) || this;
_this.c = null;
_this.j = false;
_this.p = null;
_this.ar = null;
_this.aq = null;
_this.ao = XRipple.au;
_this.m = new LinkedList$1(IKeyFrameAnimation_$type);
_this.ap = XRipple.av;
_this.n = 600;
_this.f = false;
_this.e = false;
_this.g = false;
_this.propertyChanged = null;
var a = new RippleView();
a.b = _this;
_this.c = a;
_this.c.w();
return _this;
}
XRipple.prototype.destroy = function () {
this.provideContainer(null);
};
XRipple.prototype.ah = function (a, b, c) {
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
this.aj(a, b, c);
};
XRipple.prototype.aj = function (a, b, c) {
switch (a) {
case "RippleColor":
this.at = this.ax != null ? this.ax : XRipple.av;
break;
case "HoverColor":
this.as = this.aw != null ? this.aw : XRipple.au;
break;
case "EventSource":
if (this.c.e()) {
this.c.v();
}
break;
case "ActualRippleColor":
this.an();
break;
case "ActualHoverColor":
this.am();
break;
}
};
XRipple.prototype.am = function () {
if (this.i) {
this.c.x();
return;
}
this.c.aa();
};
XRipple.prototype.an = function () {
};
XRipple.prototype.af = function () {
this.j = true;
if (this.i) {
this.c.x();
return;
}
if (this.k) {
this.c.z();
}
};
XRipple.prototype.ag = function () {
this.j = false;
if (this.k || this.i) {
this.c.x();
}
};
Object.defineProperty(XRipple.prototype, "q", {
get: function () {
return this.p;
},
set: function (a) {
var b = this.p;
this.p = a;
if (b != this.p) {
this.ah("EventSource", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "ax", {
get: function () {
return this.ar;
},
set: function (a) {
var b = this.ar;
this.ar = a;
if (b != this.ar) {
this.ah("RippleColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "aw", {
get: function () {
return this.aq;
},
set: function (a) {
var b = this.aq;
this.aq = a;
if (b != this.aq) {
this.ah("HoverColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "as", {
get: function () {
return this.ao;
},
set: function (a) {
var b = this.ao;
this.ao = a;
if (b != this.ao) {
this.ah("ActualHoverColor", b, a);
}
},
enumerable: false,
configurable: true
});
XRipple.prototype.al = function (a, b, c, d) {
var _this = this;
if (this.i) {
return;
}
var e = Math.max(c, d);
var f = e / 2;
var g = a - f;
var h = b - f;
if (this.h) {
g = 0;
h = 0;
}
var i = this.c.m(g, h, f);
var j = this.d(i);
this.m.f(j);
var k = this.m.d;
j.play();
j.finished.f(function (l) {
j.commitStyles();
_this.m.h(k);
_this.c.y(i);
});
};
XRipple.prototype.d = function (a) {
var b = this.a;
var c = KeyFrameAnimationFactory.f.c(this.c.a(a, b).m(new AnimationKeyFrameProperty(1, 0.5), new AnimationKeyFrameProperty(14, ((function () {
var $ret = new ScaleTransform();
$ret.l = 0.3;
$ret.m = 0.3;
return $ret;
})()))).m(new AnimationKeyFrameProperty(1, 0), new AnimationKeyFrameProperty(14, ((function () {
var $ret = new ScaleTransform();
$ret.l = 2;
$ret.m = 2;
return $ret;
})()))));
return c;
};
Object.defineProperty(XRipple.prototype, "at", {
get: function () {
return this.ap;
},
set: function (a) {
var b = this.ap;
this.ap = a;
if (b != this.ap) {
this.ah("ActualRippleColor", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "o", {
get: function () {
return this.n;
},
set: function (a) {
var b = this.n;
this.n = a;
if (b != this.n) {
this.ah("RippleDuration", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "i", {
get: function () {
return this.f;
},
set: function (a) {
var b = this.f;
this.f = a;
if (b != this.f) {
this.ah("IsDisabled", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "h", {
get: function () {
return this.e;
},
set: function (a) {
var b = this.e;
this.e = a;
if (b != this.e) {
this.ah("IsCentered", b, a);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(XRipple.prototype, "k", {
get: function () {
return this.g;
},
set: function (a) {
var b = this.g;
this.g = a;
if (b != this.g) {
this.ah("IsHoverEnabled", b, a);
}
},
enumerable: false,
configurable: true
});
XRipple.prototype.ai = function () {
this.c.v();
};
Object.defineProperty(XRipple.prototype, "a", {
get: function () {
var a = new AnimationKeyFrameEffectTiming();
a.g = this.o;
a.b = 0;
return a;
},
enumerable: false,
configurable: true
});
XRipple.prototype.onDetachedFromUI = function () {
this.c.u();
};
XRipple.prototype.onAttachedToUI = function () {
this.c.s();
};
XRipple.prototype.l = function () {
return this.c.e();
};
XRipple.prototype.r = function () {
return this.b();
};
XRipple.prototype.v = function () {
var a = this.b();
return a.g();
};
XRipple.prototype.b = function () {
var a = new RippleVisualModelExport();
a.a = AppearanceHelper.a(this.as);
a.b = AppearanceHelper.a(this.at);
a.f = this.o;
a.d = this.i;
a.c = this.h;
a.e = this.k;
return a;
};
XRipple.prototype.provideContainer = function (a) {
this.c.t(a);
};
XRipple.$t = markType(XRipple, 'XRipple', Base.$, [INotifyPropertyChanged_$type]);
XRipple.au = BrushUtil.j(40, 0, 0, 0);
XRipple.av = BrushUtil.j(189, 0, 0, 0);
return XRipple;
}(Base));
export { XRipple };