igniteui-angular-inputs 17.3.0 → 18.0.0

package/esm2015/lib/IconView_combined.js

@@ -5,14 +5,17 @@ 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, String_$type, Delegate_$type, fromEnum, runOn, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, enumGetBox } from "igniteui-angular-core";
+import { DomWrapper_$type } from "igniteui-angular-core";
 import { List$1 } from "igniteui-angular-core";
 import { Tuple$2 } from "igniteui-angular-core";
 import { SVGNode } from "igniteui-angular-core";
 import { FastIterationDictionary$2 } from "igniteui-angular-core";
+import { Dictionary$2 } from "igniteui-angular-core";
+import { Brush } from "igniteui-angular-core";
+import { NativeUI } from "igniteui-angular-core";
 import { isNaN_ } from "igniteui-angular-core";
 import { IIcon_$type } from "igniteui-angular-core";
 import { BaseControlTheme_$type } from "igniteui-angular-core";
-import { NativeUI } from "igniteui-angular-core";
 import { IconClickedEventArgs } from "./IconClickedEventArgs";
 import { IconVisualModelExport } from "./IconVisualModelExport";
 import { AppearanceHelper } from "igniteui-angular-core";
@@ -26,136 +29,229 @@ export let IconView = /*@__PURE__*/ (() => {
     class IconView extends Base {
         constructor() {
             super();
-            this.b = null;
-            this.o = null;
-            this.e = null;
-            this.i = new List$1(Delegate_$type, 0);
-            this.j = null;
-            this.k = null;
-            this.l = null;
-            this.m = null;
-            this.n = null;
             this.c = null;
+            this.s = null;
+            this.f = null;
+            this.l = new List$1(Delegate_$type, 0);
+            this.n = null;
+            this.o = null;
+            this.p = null;
+            this.q = null;
+            this.r = null;
             this.d = null;
+            this.e = null;
+            this.y = null;
+            this.k = new Dictionary$2(Brush.$, String_$type, 0);
+            this.g = true;
+            this.v = null;
             this.u = null;
             this.t = null;
-            this.f = true;
-            this.p = null;
-            this.q = null;
-            this.j = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
-            this.k = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
-            this.l = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
-            this.m = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
+            this.m = new List$1(DomWrapper_$type, 0);
             this.n = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
-            this.c = new FastIterationDictionary$2(String_$type, List$1.$.specialize(Tuple$2.$.specialize(SVGNode.$, Base.$)), 0);
+            this.o = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
+            this.p = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
+            this.q = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
+            this.r = new List$1(Tuple$2.$.specialize(SVGNode.$, Base.$), 0);
             this.d = new FastIterationDictionary$2(String_$type, List$1.$.specialize(Tuple$2.$.specialize(SVGNode.$, Base.$)), 0);
+            this.e = new FastIterationDictionary$2(String_$type, List$1.$.specialize(Tuple$2.$.specialize(SVGNode.$, Base.$)), 0);
         }
-        ac() {
+        ag() {
         }
-        g() {
+        i() {
             return true;
         }
-        get r() {
-            return this.p;
+        get w() {
+            return this.v;
         }
-        get s() {
+        get x() {
             return null;
         }
-        get h() {
+        get b() {
+            return this.m.toArray();
+        }
+        get j() {
             return true;
         }
-        aa(a) {
+        ae(a) {
             if (a == null) {
-                for (let b of fromEnum(this.i)) {
+                for (let b of fromEnum(this.l)) {
                     b();
                 }
-                this.i.clear();
-                if (this.p != null) {
-                    this.p.unlistenAll();
+                this.l.clear();
+                if (this.v != null) {
+                    this.v.unlistenAll();
+                }
+                if (this.u != null) {
+                    this.u.unlistenAll();
                 }
             }
-            this.o = a;
+            this.s = a;
             a.rootWrapper.setStyleProperty("position", "relative");
-            this.o.rootWrapper.setStyleProperty("display", "flex");
-            this.o.rootWrapper.setStyleProperty("flex-direction", "row");
-            this.o.rootWrapper.setStyleProperty("flex-wrap", "no-wrap");
-            this.o.rootWrapper.setStyleProperty("align-items", "center");
-            this.ae();
-            let c = this.o.createElementNS("svg", "http://www.w3.org/2000/svg");
+            this.s.rootWrapper.setStyleProperty("display", "flex");
+            this.s.rootWrapper.setStyleProperty("flex-direction", "row");
+            this.s.rootWrapper.setStyleProperty("flex-wrap", "no-wrap");
+            this.s.rootWrapper.setStyleProperty("align-items", "center");
+            this.s.rootWrapper.setStyleProperty("justify-content", "center");
+            this.am();
+            let c = this.s.createElementNS("svg", "http://www.w3.org/2000/svg");
             c.setStyleProperty("position", "absolute");
             c.setStyleProperty("top", "0");
             c.setStyleProperty("left", "0");
             c.setStyleProperty("right", "0");
             c.setStyleProperty("bottom", "0");
-            this.p = c;
-            this.ai();
-            let d = this.o.createElementNS("path", "http://www.w3.org/2000/svg");
-            d.setAttribute("d", "");
-            this.p.append(d);
-            if (this.u != null) {
-                d.setAttribute("d", this.u);
-            }
-            this.q = d;
-            this.o.append(this.p);
-            this.i.add(c.listen("click", runOn(this, this.z)));
-            this.b.b6();
-        }
-        ag(a) {
-            if (this.u != a) {
-                this.u = a;
-                this.o.rootWrapper.removeChildren();
-                this.o.rootWrapper.append(this.p);
-                if (this.q != null) {
-                    this.q.setAttribute("d", this.u);
+            this.v = c;
+            let d = this.s.createElement("img");
+            d.setStyleProperty("height", "100%");
+            d.setStyleProperty("width", "100%");
+            d.setStyleProperty("object-fit", "contain");
+            this.u = d;
+            this.ar();
+            this.t = a.createElementNS("defs", "http://www.w3.org/2000/svg");
+            this.v.append(this.t);
+            this.s.append(this.v);
+            this.l.add(c.listen("click", runOn(this, this.ad)));
+            this.c.cc();
+        }
+        ao(a) {
+            this.k.clear();
+            this.s.rootWrapper.removeChildren();
+            this.s.rootWrapper.append(this.v);
+            this.v.removeChildren();
+            this.t.removeChildren();
+            this.m.clear();
+            if (a != null) {
+                let b = this.s.createElementNS("path", "http://www.w3.org/2000/svg");
+                b.setAttribute("d", a);
+                this.v.append(this.t);
+                this.v.append(b);
+                this.m.add(b);
+            }
+        }
+        ap(a) {
+            this.k.clear();
+            this.s.rootWrapper.removeChildren();
+            this.s.rootWrapper.append(this.v);
+            this.v.removeChildren();
+            this.t.removeChildren();
+            this.m.clear();
+            if (a != null && a.length > 0) {
+                this.v.append(this.t);
+                for (let b = 0; b < a.length; b++) {
+                    let c = this.s.createElementNS("path", "http://www.w3.org/2000/svg");
+                    c.setAttribute("d", a[b]);
+                    this.v.append(c);
+                    this.m.add(c);
                 }
             }
         }
-        af(a) {
-            if (this.t != a) {
-                this.t = a;
-                this.o.rootWrapper.removeChildren();
-                let b = this.o.rootWrapper.getNativeElement();
-                b.innerHTML = this.t;
+        an(a) {
+            this.s.rootWrapper.removeChildren();
+            if (a != null) {
+                let b = this.s.rootWrapper.getNativeElement();
+                b.innerHTML = a;
+            }
+        }
+        al(a) {
+            if (this.y != a) {
+                this.y = a;
+                this.s.rootWrapper.removeChildren();
+                this.s.rootWrapper.append(this.u);
+                this.u.setAttribute("src", a);
+            }
+        }
+        h() {
+            return this.c.svgPath != null || this.c.svg != null || this.c.b != null;
+        }
+        am() {
+            this.s.rootWrapper.setStyleProperty("width", isNaN_(this.c.aq) ? "1.5rem" : this.c.aq + "px");
+            this.s.rootWrapper.setStyleProperty("height", isNaN_(this.c.ai) ? "1.5rem" : this.c.ai + "px");
+        }
+        ar() {
+            let a = isNaN_(this.c.an) ? 0 : this.c.an;
+            let b = isNaN_(this.c.ao) ? 0 : this.c.ao;
+            let c = isNaN_(this.c.ap) ? 24 : this.c.ap;
+            let d = isNaN_(this.c.am) ? 24 : this.c.am;
+            this.v.setAttribute("viewBox", a + " " + b + " " + c + " " + d);
+        }
+        ai(a, b) {
+            let c = a.color;
+            if (!this.k.containsKey(a)) {
+                if (a.isGradient) {
+                    let d = this.t.getChildCount();
+                    let e = a;
+                    let f = this.s.createElementNS("linearGradient", "http://www.w3.org/2000/svg");
+                    let g = "ig_gradient_" + b + "_" + d;
+                    f.setAttribute("id", g);
+                    f.setAttribute("x1", e.startX.toString());
+                    f.setAttribute("x2", e.endX.toString());
+                    f.setAttribute("y1", e.startY.toString());
+                    f.setAttribute("y2", e.endY.toString());
+                    let j = e.gradientStops;
+                    for (let i = 0; i < j.length; i++) {
+                        let h = j[i];
+                        let k = this.s.createElementNS("stop", "http://www.w3.org/2000/svg");
+                        k.setAttribute("offset", h.offset * 100 + "%");
+                        k.setAttribute("stop-color", h._fill);
+                        f.append(k);
+                    }
+                    this.t.append(f);
+                    this.k.addItem(a, g);
+                }
+                else if (a.isRadialGradient) {
+                }
             }
         }
-        ae() {
-            this.o.rootWrapper.setStyleProperty("width", isNaN_(this.b.ao) ? "1.5rem" : this.b.ao + "px");
-            this.o.rootWrapper.setStyleProperty("height", isNaN_(this.b.ag) ? "1.5rem" : this.b.ag + "px");
+        aj(a, b) {
+            let c = a;
+            if (this.k.containsKey(b)) {
+                c.setAttribute("fill", "url(#" + this.k.item(b) + ")");
+                this.s.rootWrapper.removeChildren();
+                this.s.rootWrapper.append(this.v);
+            }
+            else {
+                NativeUI.r(a, b);
+            }
         }
-        ai() {
-            this.p.setAttribute("viewBox", (isNaN_(this.b.al) ? 0 : this.b.al) + " " + (isNaN_(this.b.am) ? 0 : this.b.am) + " " + (isNaN_(this.b.an) ? 24 : this.b.an) + " " + (isNaN_(this.b.ak) ? 24 : this.b.ak));
+        ak(a, b) {
+            let c = a;
+            if (this.k.containsKey(b)) {
+                c.setAttribute("stroke", "url('#" + this.k.item(b) + "')");
+            }
+            else {
+                NativeUI.aa(a, b);
+            }
         }
-        v(a) {
+        z(a) {
         }
-        ad() {
-            if (this.g()) {
+        ah() {
+            if (this.i()) {
             }
         }
-        w(a) {
-            this.b.b3();
+        aa(a) {
+            this.c.b9();
         }
-        x(a) {
-            this.b.b4();
+        ab(a) {
+            this.c.ca();
         }
-        y() {
-            this.f = true;
-            this.i.add(this.o.rootWrapper.listen("mouseenter", runOn(this, this.w)));
-            this.i.add(this.o.rootWrapper.listen("mouseleave", runOn(this, this.x)));
+        ac() {
+            this.g = true;
+            this.l.add(this.s.rootWrapper.listen("mouseenter", runOn(this, this.aa)));
+            this.l.add(this.s.rootWrapper.listen("mouseleave", runOn(this, this.ab)));
         }
-        ab() {
-            this.f = false;
-            for (let a of fromEnum(this.i)) {
+        af() {
+            this.g = false;
+            for (let a of fromEnum(this.l)) {
                 a();
             }
-            this.i.clear();
+            this.l.clear();
         }
-        ah(a) {
+        aq(a) {
             if (a != null) {
-                this.o.rootWrapper.setStyleProperty("font", a.fontString);
+                this.s.rootWrapper.setStyleProperty("font", a.fontString);
             }
         }
         a() {
-            let rect_ = this.o.rootWrapper.getNativeElement().getBoundingClientRect();
+            let rect_ = this.s.rootWrapper.getNativeElement().getBoundingClientRect();
             let a = (rect_.top);
             let b = (rect_.left);
             let c = new Array(2);
@@ -163,8 +259,8 @@ export let IconView = /*@__PURE__*/ (() => {
             c[1] = b;
             return c;
         }
-        z(a) {
-            this.b.b1();
+        ad(a) {
+            this.c.b7();
         }
     }
     IconView.$t = markType(IconView, 'IconView');
@@ -178,47 +274,49 @@ export let XIcon = /*@__PURE__*/ (() => {
         constructor() {
             super();
             this._view = null;
-            this.h = 0;
-            this.cc = XIcon.cs;
-            this.cd = XIcon.cw;
-            this.ce = XIcon.cx;
-            this.t = XIcon.af;
-            this.cf = XIcon.cs;
-            this.cn = XIcon.cw;
-            this.x = XIcon.af;
-            this.co = XIcon.cx;
-            this.cg = XIcon.ct;
-            this.ch = XIcon.cu;
-            this.v = XIcon.ae;
-            this.ci = null;
-            this.a = null;
-            this.b = null;
-            this.cj = null;
-            this.ck = null;
-            this.cl = null;
-            this.cm = null;
+            this.j = 0;
+            this.cj = XIcon.cz;
+            this.ck = XIcon.c3;
+            this.cl = XIcon.c4;
+            this.v = XIcon.ah;
+            this.cm = XIcon.cz;
+            this.cu = XIcon.c3;
+            this.z = XIcon.ah;
+            this.cv = XIcon.c4;
+            this.cn = XIcon.c0;
+            this.co = XIcon.c1;
+            this.x = XIcon.ag;
+            this.cp = null;
+            this.c = null;
+            this.d = null;
+            this.cq = null;
+            this.cr = null;
+            this.cs = null;
+            this.ct = null;
             this.aw = null;
-            this.av = null;
-            this.j = null;
-            this.au = "ig-icon-" + XIcon.ar++;
-            this.ap = 0;
-            this.l = false;
-            this.at = null;
+            this.az = null;
+            this.ay = null;
+            this.a = null;
+            this.l = null;
+            this.ax = "ig-icon-" + XIcon.at++;
+            this.ar = 0;
             this.n = false;
-            this.m = false;
-            this.w = 1;
-            this.z = NaN;
-            this.aa = NaN;
+            this.av = null;
+            this.p = false;
+            this.o = false;
+            this.y = 1;
             this.ab = NaN;
-            this.y = NaN;
             this.ac = NaN;
-            this.u = NaN;
+            this.ad = NaN;
+            this.aa = NaN;
+            this.ae = NaN;
+            this.w = NaN;
             this.clicked = null;
             this.propertyChanged = null;
             let a = new IconView();
-            a.b = this;
+            a.c = this;
             this.view = a;
-            this.view.ac();
+            this.view.ag();
         }
         get view() {
             return this._view;
@@ -229,13 +327,13 @@ export let XIcon = /*@__PURE__*/ (() => {
         destroy() {
             this.provideContainer(null);
         }
-        b5(a, b, c) {
+        cb(a, b, c) {
             if (this.propertyChanged != null) {
                 this.propertyChanged(this, new PropertyChangedEventArgs(a));
             }
-            this.b7(a, b, c);
+            this.ce(a, b, c);
         }
-        b7(a, b, c) {
+        ce(a, b, c) {
             switch (a) {
                 case "Fill":
                 case "Stroke":
@@ -244,198 +342,305 @@ export let XIcon = /*@__PURE__*/ (() => {
                 case "HoverStroke":
                 case "HoverStrokeThickness":
                 case "IsHover":
-                    this.cb();
+                    this.ci();
                     break;
+                case "FillColors":
+                case "StrokeColors":
                 case "ActualFill":
                 case "ActualStroke":
                 case "ActualStrokeWidth":
-                case "SVGPath":
+                    this.cg();
+                    break;
                 case "SVG":
-                    this.b9();
+                    this.az = null;
+                    this.a = null;
+                    this.cg();
+                    break;
+                case "SVGPath":
+                    this.ay = null;
+                    this.a = null;
+                    this.cg();
+                    break;
+                case "SVGPaths":
+                    this.ay = null;
+                    this.az = null;
+                    this.cg();
+                    break;
+                case "DataURL":
+                    this.ay = null;
+                    this.az = null;
+                    this.a = null;
+                    this.cg();
                     break;
                 case "Opacity":
-                    this.ca();
+                    this.ch();
                     break;
                 case "ViewBoxLeft":
                 case "ViewBoxTop":
                 case "ViewBoxWidth":
                 case "ViewBoxHeight":
-                    this.view.ai();
+                    this.view.ar();
                     break;
                 case "Width":
                 case "Height":
-                    this.view.ae();
+                    this.view.am();
                     break;
             }
         }
-        cb() {
-            let a = this.fill != null ? this.fill : XIcon.cs;
-            let b = this.c5 != null ? this.c5 : XIcon.cw;
-            let c = !isNaN_(this.aj) ? this.aj : XIcon.af;
-            let d = this.c6 != null ? this.c6 : XIcon.cx;
-            if (this.r) {
-                this.cp = this.cy != null ? this.cy : a;
-                this.cq = this.cz != null ? this.cz : b;
-                this.ad = !isNaN_(this.ah) ? this.ah : c;
-                this.cr = this.c0 != null ? this.c0 : d;
+        ci() {
+            let a = this.fill != null ? this.fill : XIcon.cz;
+            let b = this.dc != null ? this.dc : XIcon.c3;
+            let c = !isNaN_(this.al) ? this.al : XIcon.ah;
+            let d = this.dd != null ? this.dd : XIcon.c4;
+            if (this.t) {
+                this.cw = this.c5 != null ? this.c5 : a;
+                this.cx = this.c6 != null ? this.c6 : b;
+                this.af = !isNaN_(this.aj) ? this.aj : c;
+                this.cy = this.c7 != null ? this.c7 : d;
             }
             else {
-                this.cp = a;
-                this.cq = b;
-                this.ad = c;
-                this.cr = d;
+                this.cw = a;
+                this.cx = b;
+                this.af = c;
+                this.cy = d;
             }
         }
-        get p() {
-            return this.svgPath != null && !this.view.h;
+        get r() {
+            return this.svgPath != null && !this.view.j;
         }
-        ca() {
-            NativeUI.y(this.view.r, this.ai);
+        ch() {
+            NativeUI.y(this.view.w, this.ak);
         }
-        b9() {
-            let a = this.view.r;
-            if (this.p) {
-                let b = this.view.s;
-                NativeUI.r(b, this.cp);
-                NativeUI.aa(b, this.cq);
-                NativeUI.ad(b, this.ad);
+        cg() {
+            let a = this.view.w;
+            if (this.r) {
+                let b = this.view.x;
+                NativeUI.r(b, this.cw);
+                NativeUI.aa(b, this.cx);
+                NativeUI.ad(b, this.af);
             }
             else {
                 let c = false;
                 if (this.svgPath != null) {
                     if (stringStartsWith(trimStart(this.svgPath, ' ', '\n', '\r', '\t'), "<svg")) {
-                        this.view.af(this.svgPath);
+                        this.view.an(this.svgPath);
                         c = true;
                     }
                     else {
-                        this.view.ag(this.svgPath);
+                        this.view.ao(this.svgPath);
                     }
                 }
+                else if (this.b != null) {
+                    this.view.ap(this.b);
+                    let d = this.view.b;
+                    if (d != null && d.length > 0) {
+                        let e = NativeUI.r;
+                        let f = NativeUI.aa;
+                        this.cd();
+                        e = runOn(this.view, this.view.aj);
+                        f = runOn(this.view, this.view.ak);
+                        for (let g = 0; g < d.length; g++) {
+                            if (this.cw != null) {
+                                e(d[g], this.cw);
+                            }
+                            if (this.cx != null) {
+                                f(d[g], this.cx);
+                            }
+                            if (!isNaN_(this.af)) {
+                                NativeUI.ad(d[g], this.af);
+                            }
+                            if (this.cy != null) {
+                                NativeUI.q(d[g], this.cy);
+                            }
+                            if (this.e != null && this.e.count == d.length) {
+                                e(d[g], this.e.item(g));
+                            }
+                            if (this.f != null && this.f.count == d.length) {
+                                f(d[g], this.f.item(g));
+                            }
+                        }
+                    }
+                    if (this.m != null) {
+                        this.view.aq(this.m);
+                    }
+                    return;
+                }
                 else if (this.svg != null) {
-                    this.view.af(this.svg);
+                    this.view.an(this.svg);
                     c = true;
                 }
+                else if (this.a7 != null) {
+                    this.view.al(this.a7);
+                }
                 if (c) {
-                    for (let d = 0; d < this.view.k.count; d++) {
-                        let e = this.view.k._inner[d].c;
-                        NativeUI.r(this.view.k._inner[d].d, e.l.f(this.c1));
+                    for (let h = 0; h < this.view.o.count; h++) {
+                        let i = this.view.o._inner[h].c;
+                        NativeUI.r(this.view.o._inner[h].d, i.l.f(this.c8));
                     }
-                    for (let f = 0; f < this.view.l.count; f++) {
-                        let g = this.view.l._inner[f].c;
-                        NativeUI.aa(this.view.l._inner[f].d, g.m.f(this.c2));
+                    for (let j = 0; j < this.view.p.count; j++) {
+                        let k = this.view.p._inner[j].c;
+                        NativeUI.aa(this.view.p._inner[j].d, k.m.f(this.c9));
                     }
-                    for (let h = 0; h < this.view.m.count; h++) {
-                        let i = this.view.m._inner[h].c;
-                        NativeUI.r(this.view.m._inner[h].d, i.l.f(this.c3));
+                    for (let l = 0; l < this.view.q.count; l++) {
+                        let m = this.view.q._inner[l].c;
+                        NativeUI.r(this.view.q._inner[l].d, m.l.f(this.da));
                     }
-                    for (let j = 0; j < this.view.n.count; j++) {
-                        let k = this.view.n._inner[j].c;
-                        NativeUI.aa(this.view.n._inner[j].d, k.m.f(this.c4));
+                    for (let n = 0; n < this.view.r.count; n++) {
+                        let o = this.view.r._inner[n].c;
+                        NativeUI.aa(this.view.r._inner[n].d, o.m.f(this.db));
                     }
-                    for (let l = 0; l < this.view.c.o.count; l++) {
-                        let m = this.view.c.o._inner[l];
-                        let n = m.split('-');
-                        let o = parseInt(n[n.length - 1]);
-                        if (o < this.c.count) {
-                            for (let p = 0; p < this.view.c.q._inner[l].count; p++) {
-                                let q = this.view.c.q._inner[l]._inner[p].c;
-                                NativeUI.r(this.view.c.q._inner[l]._inner[p].d, q.l.f(this.c.item(o)));
+                    for (let p = 0; p < this.view.d.o.count; p++) {
+                        let q = this.view.d.o._inner[p];
+                        let r = q.split('-');
+                        let s = parseInt(r[r.length - 1]);
+                        if (s < this.e.count) {
+                            for (let t = 0; t < this.view.d.q._inner[p].count; t++) {
+                                let u = this.view.d.q._inner[p]._inner[t].c;
+                                NativeUI.r(this.view.d.q._inner[p]._inner[t].d, u.l.f(this.e.item(s)));
                             }
                         }
                     }
-                    for (let r = 0; r < this.view.d.o.count; r++) {
-                        let s = this.view.d.o._inner[r];
-                        let t = s.split('-');
-                        let u = parseInt(t[t.length - 1]);
-                        if (u < this.d.count) {
-                            for (let v = 0; v < this.view.d.q._inner[r].count; v++) {
-                                let w = this.view.d.q._inner[r]._inner[v].c;
-                                NativeUI.aa(this.view.d.q._inner[r]._inner[v].d, w.m.f(this.d.item(u)));
+                    for (let v = 0; v < this.view.e.o.count; v++) {
+                        let w = this.view.e.o._inner[v];
+                        let x = w.split('-');
+                        let y = parseInt(x[x.length - 1]);
+                        if (y < this.f.count) {
+                            for (let z = 0; z < this.view.e.q._inner[v].count; z++) {
+                                let aa = this.view.e.q._inner[v]._inner[z].c;
+                                NativeUI.aa(this.view.e.q._inner[v]._inner[z].d, aa.m.f(this.f.item(y)));
                             }
                         }
                     }
-                    for (let x = 0; x < this.view.j.count; x++) {
-                        let y = this.view.j._inner[x].c;
-                        NativeUI.r(this.view.j._inner[x].d, y.l.f(this.cp));
-                        NativeUI.aa(this.view.j._inner[x].d, y.m.f(this.cq));
+                    for (let ab = 0; ab < this.view.n.count; ab++) {
+                        let ac = this.view.n._inner[ab].c;
+                        NativeUI.r(this.view.n._inner[ab].d, ac.l.f(this.cw));
+                        NativeUI.aa(this.view.n._inner[ab].d, ac.m.f(this.cx));
                     }
                 }
-                let z = this.view.r;
-                if (this.cp != null) {
-                    NativeUI.r(z, this.cp);
+                let ad = this.view.w;
+                if (this.cw != null) {
+                    NativeUI.r(ad, this.cw);
                 }
-                if (this.cq != null) {
-                    NativeUI.aa(z, this.cq);
+                if (this.cx != null) {
+                    NativeUI.aa(ad, this.cx);
                 }
-                if (!isNaN_(this.ad)) {
-                    NativeUI.ad(z, this.ad);
+                if (!isNaN_(this.af)) {
+                    NativeUI.ad(ad, this.af);
                 }
             }
-            if (this.k != null) {
-                this.view.ah(this.k);
+            if (this.m != null) {
+                this.view.aq(this.m);
             }
-            if (this.cr != null) {
-                NativeUI.q(this.view.r, this.cr);
+            if (this.cy != null) {
+                NativeUI.q(this.view.w, this.cy);
             }
         }
-        get i() {
-            return this.h;
+        cd() {
+            if (this.cw != null) {
+                this.view.ai(this.cw, "fill");
+            }
+            if (this.cx != null) {
+                this.view.ai(this.cx, "stroke");
+            }
+            if (this.e != null) {
+                for (let a of fromEnum(this.e)) {
+                    this.view.ai(a, "fills");
+                }
+            }
+            if (this.f != null) {
+                for (let b of fromEnum(this.f)) {
+                    this.view.ai(b, "strokes");
+                }
+            }
         }
-        set i(a) {
-            let b = this.h;
-            this.h = a;
-            if (b != this.h) {
-                this.b5("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, a));
+        get k() {
+            return this.j;
+        }
+        set k(a) {
+            let b = this.j;
+            this.j = a;
+            if (b != this.j) {
+                this.cb("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, a));
             }
         }
-        get cp() {
-            return this.cc;
+        get cw() {
+            return this.cj;
         }
-        set cp(a) {
-            let b = this.cc;
-            this.cc = a;
-            if (b != this.cc) {
-                this.b5("ActualFill", b, a);
+        set cw(a) {
+            let b = this.cj;
+            this.cj = a;
+            if (b != this.cj) {
+                this.cb("ActualFill", b, a);
             }
         }
-        get cq() {
-            return this.cd;
+        get cx() {
+            return this.ck;
         }
-        set cq(a) {
-            let b = this.cd;
-            this.cd = a;
-            if (b != this.cd) {
-                this.b5("ActualStroke", b, a);
+        set cx(a) {
+            let b = this.ck;
+            this.ck = a;
+            if (b != this.ck) {
+                this.cb("ActualStroke", b, a);
             }
         }
-        get cr() {
-            return this.ce;
+        get cy() {
+            return this.cl;
         }
-        set cr(a) {
-            let b = this.ce;
-            this.ce = a;
-            if (b != this.ce) {
-                this.b5("ActualTextColor", b, a);
+        set cy(a) {
+            let b = this.cl;
+            this.cl = a;
+            if (b != this.cl) {
+                this.cb("ActualTextColor", b, a);
             }
         }
-        get ad() {
-            return this.t;
+        get af() {
+            return this.v;
         }
-        set ad(a) {
-            let b = this.t;
-            this.t = a;
-            if (b != this.t) {
-                this.b5("ActualStrokeWidth", b, a);
+        set af(a) {
+            let b = this.v;
+            this.v = a;
+            if (b != this.v) {
+                this.cb("ActualStrokeWidth", b, a);
             }
         }
         get fill() {
-            return this.cf;
+            return this.cm;
         }
         set fill(a) {
-            let b = this.cf;
-            this.cf = a;
-            if (b != this.cf) {
-                this.b5("Fill", b, a);
+            let b = this.cm;
+            this.cm = a;
+            if (b != this.cm) {
+                this.cb("Fill", b, a);
+            }
+        }
+        get dc() {
+            return this.cu;
+        }
+        set dc(a) {
+            let b = this.cu;
+            this.cu = a;
+            if (b != this.cu) {
+                this.cb("Stroke", b, a);
+            }
+        }
+        get al() {
+            return this.z;
+        }
+        set al(a) {
+            let b = this.z;
+            this.z = a;
+            if (b != this.z) {
+                this.cb("StrokeWidth", b, a);
+            }
+        }
+        get dd() {
+            return this.cv;
+        }
+        set dd(a) {
+            let b = this.cv;
+            this.cv = a;
+            if (b != this.cv) {
+                this.cb("TextColor", b, a);
             }
         }
         get c5() {
@@ -445,17 +650,7 @@ export let XIcon = /*@__PURE__*/ (() => {
             let b = this.cn;
             this.cn = a;
             if (b != this.cn) {
-                this.b5("Stroke", b, a);
-            }
-        }
-        get aj() {
-            return this.x;
-        }
-        set aj(a) {
-            let b = this.x;
-            this.x = a;
-            if (b != this.x) {
-                this.b5("StrokeWidth", b, a);
+                this.cb("HoverFill", b, a);
             }
         }
         get c6() {
@@ -465,227 +660,207 @@ export let XIcon = /*@__PURE__*/ (() => {
             let b = this.co;
             this.co = a;
             if (b != this.co) {
-                this.b5("TextColor", b, a);
-            }
-        }
-        get cy() {
-            return this.cg;
-        }
-        set cy(a) {
-            let b = this.cg;
-            this.cg = a;
-            if (b != this.cg) {
-                this.b5("HoverFill", b, a);
+                this.cb("HoverStroke", b, a);
             }
         }
-        get cz() {
-            return this.ch;
+        get aj() {
+            return this.x;
         }
-        set cz(a) {
-            let b = this.ch;
-            this.ch = a;
-            if (b != this.ch) {
-                this.b5("HoverStroke", b, a);
+        set aj(a) {
+            let b = this.x;
+            this.x = a;
+            if (b != this.x) {
+                this.cb("HoverStrokeThickness", b, a);
             }
         }
-        get ah() {
-            return this.v;
+        get c7() {
+            return this.cp;
         }
-        set ah(a) {
-            let b = this.v;
-            this.v = a;
-            if (b != this.v) {
-                this.b5("HoverStrokeThickness", b, a);
+        set c7(a) {
+            let b = this.cp;
+            this.cp = a;
+            if (b != this.cp) {
+                this.cb("HoverTextColor", b, a);
             }
         }
-        get c0() {
-            return this.ci;
+        get e() {
+            return this.c;
         }
-        set c0(a) {
-            let b = this.ci;
-            this.ci = a;
-            if (b != this.ci) {
-                this.b5("HoverTextColor", b, a);
+        set e(a) {
+            let b = this.c;
+            this.c = a;
+            if (b != this.c) {
+                this.cb("FillColors", b, this.c);
             }
         }
-        get c() {
-            return this.a;
+        get f() {
+            return this.d;
         }
-        set c(a) {
-            let b = this.a;
-            this.a = a;
-            if (b != this.a) {
-                this.b5("FillColors", b, this.a);
+        set f(a) {
+            let b = this.d;
+            this.d = a;
+            if (b != this.d) {
+                this.cb("StrokeColors", b, this.d);
             }
         }
-        get d() {
-            return this.b;
+        get c8() {
+            return this.cq;
         }
-        set d(a) {
-            let b = this.b;
-            this.b = a;
-            if (b != this.b) {
-                this.b5("StrokeColors", b, this.b);
+        set c8(a) {
+            let b = this.cq;
+            this.cq = a;
+            if (b != this.cq) {
+                this.cb("PrimaryFillColor", b, this.cq);
             }
         }
-        get c1() {
-            return this.cj;
+        get c9() {
+            return this.cr;
         }
-        set c1(a) {
-            let b = this.cj;
-            this.cj = a;
-            if (b != this.cj) {
-                this.b5("PrimaryFillColor", b, this.cj);
+        set c9(a) {
+            let b = this.cr;
+            this.cr = a;
+            if (b != this.cr) {
+                this.cb("PrimaryStrokeColor", b, this.cr);
             }
         }
-        get c2() {
-            return this.ck;
+        get da() {
+            return this.cs;
         }
-        set c2(a) {
-            let b = this.ck;
-            this.ck = a;
-            if (b != this.ck) {
-                this.b5("PrimaryStrokeColor", b, this.ck);
+        set da(a) {
+            let b = this.cs;
+            this.cs = a;
+            if (b != this.cs) {
+                this.cb("SecondaryFillColor", b, this.cs);
             }
         }
-        get c3() {
-            return this.cl;
+        get db() {
+            return this.ct;
         }
-        set c3(a) {
-            let b = this.cl;
-            this.cl = a;
-            if (b != this.cl) {
-                this.b5("SecondaryFillColor", b, this.cl);
+        set db(a) {
+            let b = this.ct;
+            this.ct = a;
+            if (b != this.ct) {
+                this.cb("SecondaryStrokeColor", b, this.ct);
             }
         }
-        get c4() {
-            return this.cm;
+        get a7() {
+            return this.aw;
         }
-        set c4(a) {
-            let b = this.cm;
-            this.cm = a;
-            if (b != this.cm) {
-                this.b5("SecondaryStrokeColor", b, this.cm);
+        set a7(a) {
+            let b = this.aw;
+            this.aw = a;
+            if (b != this.aw) {
+                this.cb("DataURL", b, a);
             }
         }
         get svgPath() {
-            return this.aw;
+            return this.az;
         }
         set svgPath(a) {
-            let b = this.aw;
-            this.aw = a;
-            if (b != this.aw) {
-                this.b5("SVGPath", b, a);
+            let b = this.az;
+            this.az = a;
+            if (b != this.az) {
+                this.cb("SVGPath", b, a);
             }
         }
         get svg() {
-            return this.av;
+            return this.ay;
         }
         set svg(a) {
-            let b = this.av;
-            this.av = a;
-            if (b != this.av) {
-                this.b5("SVG", b, this.av);
+            let b = this.ay;
+            this.ay = a;
+            if (b != this.ay) {
+                this.cb("SVG", b, this.ay);
             }
         }
-        b3() {
-            this.r = true;
-        }
-        b4() {
-            this.r = false;
-        }
-        get k() {
-            return this.j;
+        get b() {
+            return this.a;
         }
-        set k(a) {
-            let b = this.j;
-            this.j = a;
-            if (b != this.j) {
-                this.b5("TextStyle", b, a);
+        set b(a) {
+            let b = this.a;
+            this.a = a;
+            if (b != this.a) {
+                this.cb("SVGPaths", b, this.a);
             }
         }
-        get bc() {
-            return this.au;
+        b9() {
+            this.t = true;
         }
-        set bc(a) {
-            let b = this.au;
-            this.au = a;
-            if (b != this.au) {
-                this.b5("Id", b, a);
-            }
+        ca() {
+            this.t = false;
         }
-        get o() {
+        get m() {
             return this.l;
         }
-        get aq() {
-            return this.ap;
-        }
-        set aq(a) {
-            let b = this.ap;
-            this.ap = a;
-            this.l = true;
-            if (b != this.ap) {
-                this.b5("TabIndex", b, a);
+        set m(a) {
+            let b = this.l;
+            this.l = a;
+            if (b != this.l) {
+                this.cb("TextStyle", b, a);
             }
         }
-        get a1() {
-            return this.at;
+        get bh() {
+            return this.ax;
         }
-        set a1(a) {
-            let b = this.at;
-            this.at = a;
-            if (b != this.at) {
-                this.b5("AriaLabel", b, a);
+        set bh(a) {
+            let b = this.ax;
+            this.ax = a;
+            if (b != this.ax) {
+                this.cb("Id", b, a);
             }
         }
-        get r() {
+        get q() {
             return this.n;
         }
-        set r(a) {
-            let b = this.n;
-            this.n = a;
-            if (b != this.n) {
-                this.b5("IsHover", b, a);
+        get as() {
+            return this.ar;
+        }
+        set as(a) {
+            let b = this.ar;
+            this.ar = a;
+            this.n = true;
+            if (b != this.ar) {
+                this.cb("TabIndex", b, a);
             }
         }
-        get disabled() {
-            return this.m;
+        get a4() {
+            return this.av;
         }
-        set disabled(a) {
-            let b = this.m;
-            this.m = a;
-            if (b != this.m) {
-                this.b5("IsDisabled", b, a);
+        set a4(a) {
+            let b = this.av;
+            this.av = a;
+            if (b != this.av) {
+                this.cb("AriaLabel", b, a);
             }
         }
-        get ai() {
-            return this.w;
+        get t() {
+            return this.p;
         }
-        set ai(a) {
-            let b = this.w;
-            this.w = a;
-            if (b != this.w) {
-                this.b5("Opacity", b, this.w);
+        set t(a) {
+            let b = this.p;
+            this.p = a;
+            if (b != this.p) {
+                this.cb("IsHover", b, a);
             }
         }
-        get al() {
-            return this.z;
+        get disabled() {
+            return this.o;
         }
-        set al(a) {
-            let b = this.z;
-            this.z = a;
-            if (b != this.z) {
-                this.b5("ViewBoxLeft", b, this.z);
+        set disabled(a) {
+            let b = this.o;
+            this.o = a;
+            if (b != this.o) {
+                this.cb("IsDisabled", b, a);
             }
         }
-        get am() {
-            return this.aa;
+        get ak() {
+            return this.y;
         }
-        set am(a) {
-            let b = this.aa;
-            this.aa = a;
-            if (b != this.aa) {
-                this.b5("ViewBoxTop", b, this.aa);
+        set ak(a) {
+            let b = this.y;
+            this.y = a;
+            if (b != this.y) {
+                this.cb("Opacity", b, this.y);
             }
         }
         get an() {
@@ -695,17 +870,7 @@ export let XIcon = /*@__PURE__*/ (() => {
             let b = this.ab;
             this.ab = a;
             if (b != this.ab) {
-                this.b5("ViewBoxWidth", b, this.ab);
-            }
-        }
-        get ak() {
-            return this.y;
-        }
-        set ak(a) {
-            let b = this.y;
-            this.y = a;
-            if (b != this.y) {
-                this.b5("ViewBoxHeight", b, this.y);
+                this.cb("ViewBoxLeft", b, this.ab);
             }
         }
         get ao() {
@@ -715,28 +880,58 @@ export let XIcon = /*@__PURE__*/ (() => {
             let b = this.ac;
             this.ac = a;
             if (b != this.ac) {
-                this.b5("Width", b, this.ac);
+                this.cb("ViewBoxTop", b, this.ac);
             }
         }
-        get ag() {
-            return this.u;
+        get ap() {
+            return this.ad;
         }
-        set ag(a) {
-            let b = this.u;
-            this.u = a;
-            if (b != this.u) {
-                this.b5("Height", b, this.u);
+        set ap(a) {
+            let b = this.ad;
+            this.ad = a;
+            if (b != this.ad) {
+                this.cb("ViewBoxWidth", b, this.ad);
             }
         }
-        b6() {
+        get am() {
+            return this.aa;
+        }
+        set am(a) {
+            let b = this.aa;
+            this.aa = a;
+            if (b != this.aa) {
+                this.cb("ViewBoxHeight", b, this.aa);
+            }
+        }
+        get aq() {
+            return this.ae;
+        }
+        set aq(a) {
+            let b = this.ae;
+            this.ae = a;
+            if (b != this.ae) {
+                this.cb("Width", b, this.ae);
+            }
+        }
+        get ai() {
+            return this.w;
+        }
+        set ai(a) {
+            let b = this.w;
+            this.w = a;
+            if (b != this.w) {
+                this.cb("Height", b, this.w);
+            }
+        }
+        cc() {
         }
         onDetachedFromUI() {
-            this.view.ab();
+            this.view.af();
         }
         onAttachedToUI() {
-            this.view.y();
+            this.view.ac();
         }
-        b1() {
+        b7() {
             if (this.disabled) {
                 return;
             }
@@ -744,72 +939,73 @@ export let XIcon = /*@__PURE__*/ (() => {
                 this.clicked(this, new IconClickedEventArgs());
             }
         }
-        s() {
-            return this.view.g();
+        u() {
+            return this.view.i();
         }
-        as() {
-            return this.e();
+        au() {
+            return this.g();
         }
-        a4() {
-            let a = this.e();
-            return a.j();
+        a9() {
+            let a = this.g();
+            return a.k();
         }
-        e() {
+        g() {
             let a = new IconVisualModelExport();
-            let b = this.view.r;
+            let b = this.view.w;
             a.a = AppearanceHelper.a(NativeUI.al(b));
             a.c = AppearanceHelper.a(NativeUI.al(b));
             a.b = AppearanceHelper.a(NativeUI.am(b));
-            a.d = this.ad;
+            a.d = this.af;
             let c = this.view.a();
             a.h = c[0];
             a.f = c[1];
             a.e = NativeUI.d(b);
             a.i = NativeUI.k(b);
             a.svgPath = this.svgPath;
-            if (this.k != null) {
-                let d = this.k;
-                if (this.view != null && d.p == null) {
-                    let e = this.view.o;
+            a.j = this.a7;
+            if (this.m != null) {
+                let d = this.m;
+                if (this.view != null && d.q == null) {
+                    let e = this.view.s;
                     let f = FontUtil.getFontInfoFromString(e, d.fontString);
-                    d.p = f.p;
-                    d.e = f.e;
                     d.q = f.q;
-                    d.s = f.s;
+                    d.f = f.f;
+                    d.r = f.r;
                     d.t = f.t;
                     d.u = f.u;
+                    d.v = f.v;
                 }
-                if (d.p != null) {
-                    a.l = d.p;
+                if (d.q != null) {
+                    a.m = d.q;
                 }
-                if (!isNaN_(d.e)) {
-                    a.g = d.e;
+                if (!isNaN_(d.f)) {
+                    a.g = d.f;
                 }
-                if (d.u != null) {
-                    a.p = d.u;
+                if (d.v != null) {
+                    a.q = d.v;
                 }
-                if (d.s != null) {
-                    a.n = d.s;
+                if (d.t != null) {
+                    a.o = d.t;
                 }
-                if (d.q != null) {
-                    a.m = d.s;
+                if (d.r != null) {
+                    a.n = d.t;
                 }
             }
             return a;
         }
         provideContainer(a) {
-            this.view.aa(a);
+            this.view.ae(a);
         }
     }
     XIcon.$t = markType(XIcon, 'XIcon', Base.$, [INotifyPropertyChanged_$type, IIcon_$type]);
-    XIcon.cs = null;
-    XIcon.cx = null;
-    XIcon.cw = null;
-    XIcon.ct = null;
-    XIcon.cu = null;
-    XIcon.cv = null;
-    XIcon.af = NaN;
-    XIcon.ae = NaN;
-    XIcon.ar = 0;
+    XIcon.cz = null;
+    XIcon.c4 = null;
+    XIcon.c3 = null;
+    XIcon.c0 = null;
+    XIcon.c1 = null;
+    XIcon.c2 = null;
+    XIcon.ah = NaN;
+    XIcon.ag = NaN;
+    XIcon.at = 0;
     return XIcon;
 })();