igniteui-webcomponents-grids 1.4.2 → 3.2.2

package/esm2015/lib/DataGridToolbarView_combined.js

@@ -4,16 +4,19 @@ 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, runOn, Delegate_$type, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, delegateRemove, enumGetBox, delegateCombine } from "igniteui-webcomponents-core";
+import { Base, runOn, Delegate_$type, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, delegateRemove, enumGetBox, typeCast, delegateCombine } from "igniteui-webcomponents-core";
 import { List$1 } from "igniteui-webcomponents-core";
 import { ControlDisplayDensity_$type } from "igniteui-webcomponents-core";
+import { Thickness } from "igniteui-webcomponents-core";
 import { XButton } from "igniteui-webcomponents-inputs";
 import { BrushUtil } from "igniteui-webcomponents-core";
 import { ElevationHelper } from "igniteui-webcomponents-inputs";
 import { BaseDOMEventProxy } from "igniteui-webcomponents-core";
+import { IDataGridComponent_$type } from "./IDataGridComponent";
+import { Grid } from "./Grid";
 import { BaseControlTheme_$type } from "igniteui-webcomponents-core";
 import { XIcon } from "igniteui-webcomponents-inputs";
-import { Thickness } from "igniteui-webcomponents-core";
+import { ToolbarVisualModelExport } from "./ToolbarVisualModelExport";
 /**
  * @hidden
  */
@@ -48,15 +51,15 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
             this.c.rootWrapper.setStyleProperty("justify-content", "space-between");
             this.c.rootWrapper.setStyleProperty("align-items", "center");
             this.c.rootWrapper.setStyleProperty("padding", "4px 16px 4px 16px");
-            if (this.a.bb != null) {
-                this.c.rootWrapper.setStyleProperty("background-color", this.a.bb._fill);
+            if (this.a.be != null) {
+                this.c.rootWrapper.setStyleProperty("background-color", this.a.be._fill);
             }
-            this.c.rootWrapper.setStyleProperty("border-width", "1px 1px 0px 1px");
+            this.aa();
             this.c.rootWrapper.setStyleProperty("border-style", "solid");
             this.c.rootWrapper.setStyleProperty("box-sizing", "border-box");
             this.c.rootWrapper.setStyleProperty("border-color", "rgba(0, 0, 0, 0.2)");
             this.c.rootWrapper.setStyleProperty("border-radius", "3px 3px 0px 0px");
-            this.ac();
+            this.ad();
             this.k = this.c.rootWrapper.getChildAt(0);
             this.y();
             let d = this.c.rootWrapper.getChildAt(1);
@@ -64,9 +67,9 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
             this.v();
             this.x();
         }
-        ac() {
+        ad() {
             if (this.c != null) {
-                switch (this.a.k) {
+                switch (this.a.l) {
                     case 1:
                         this.c.rootWrapper.setStyleProperty("height", "52px");
                         break;
@@ -84,27 +87,30 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
         }
         z() {
             if (this.c != null) {
-                if (this.a.bb != null) {
-                    this.c.rootWrapper.setStyleProperty("background-color", this.a.bb._fill);
+                if (this.a.be != null) {
+                    this.c.rootWrapper.setStyleProperty("background-color", this.a.be._fill);
                 }
             }
         }
+        aa() {
+            this.c.rootWrapper.setStyleProperty("border-width", this.a.bi.top + "px " + this.a.bi.right + "px " + this.a.bi.bottom + "px " + this.a.bi.left + "px");
+        }
         y() {
-            if (this.k != null && this.a.ap != null) {
-                this.k.setText(this.a.ap);
-                this.k.setStyleProperty("font", "16px \"Segoe UI\", Verdana");
+            if (this.k != null && this.a.ar != null) {
+                this.k.setText(this.a.ar);
+                this.k.setStyleProperty("font", "16px Verdana");
             }
-            this.ag();
             this.ah();
+            this.ai();
         }
-        ag() {
-            if (this.k != null && this.a.bd != null) {
-                this.k.setStyleProperty("color", this.a.bd._fill);
+        ah() {
+            if (this.k != null && this.a.bg != null) {
+                this.k.setStyleProperty("color", this.a.bg._fill);
             }
         }
-        ah() {
-            if (this.k != null && this.a.m != null) {
-                this.k.setStyleProperty("font", this.a.m.fontString);
+        ai() {
+            if (this.k != null && this.a.n != null) {
+                this.k.setStyleProperty("font", this.a.n.fontString);
             }
         }
         v() {
@@ -120,10 +126,10 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
                 b.setStyleProperty("height", "calc(100% - 16px)");
                 b.setStyleProperty("padding", "4px 16px 4px 16px");
                 b.setStyleProperty("box-sizing", "border-box");
-                if (this.a.p == true) {
-                    if (this.a.f == null) {
+                if (this.a.q == true) {
+                    if (this.a.g == null) {
                         this.d = this.c.createElement("div");
-                        this.a.a2(this.a, this.c, this.f, this.d, "Hiding");
+                        this.a.a5(this.a, this.c, this.f, this.d, "Hiding");
                         this.f.listen("click", runOn(this, this.n));
                     }
                     else {
@@ -135,24 +141,24 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
                 }
             }
         }
-        ad() {
+        ae() {
             if (this.d != null) {
                 let a = this.d.getChildAt(1);
-                a.setText(this.a.r.toString());
+                a.setText(this.a.s.toString());
             }
         }
-        aa() {
+        ab() {
             if (this.d != null) {
                 if (this.d.getChildCount() > 2) {
                     let a = this.d.getChildAt(2);
-                    a.setText(this.a.ab.toString());
+                    a.setText(this.a.ad.toString());
                 }
                 else {
                     let b = this.c.createElement("span");
                     b.setStyleProperty("display", "inline-block");
                     b.setStyleProperty("font-size", "14px");
                     b.setStyleProperty("font-weight", "600");
-                    b.setText(this.a.ab);
+                    b.setText(this.a.ad);
                     this.d.append(b);
                 }
             }
@@ -185,10 +191,10 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
                 b.setStyleProperty("height", "calc(100% - 16px)");
                 b.setStyleProperty("padding", "8px 16px 8px 16px");
                 b.setStyleProperty("box-sizing", "border-box");
-                if (this.a.q == true) {
-                    if (this.a.g == null) {
+                if (this.a.r == true) {
+                    if (this.a.h == null) {
                         this.i = this.c.createElement("div");
-                        this.a.a2(this.a, this.c, this.h, this.i, "Pinning");
+                        this.a.a5(this.a, this.c, this.h, this.i, "Pinning");
                         this.h.listen("click", runOn(this, this.u));
                     }
                     else {
@@ -200,24 +206,24 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
                 }
             }
         }
-        ae() {
+        af() {
             if (this.i != null) {
                 let a = this.i.getChildAt(1);
-                a.setText(this.a.s.toString());
+                a.setText(this.a.t.toString());
             }
         }
-        af() {
+        ag() {
             if (this.i != null) {
                 if (this.i.getChildCount() > 2) {
                     let a = this.i.getChildAt(2);
-                    a.setText(this.a.ag);
+                    a.setText(this.a.ai);
                 }
                 else {
                     let b = this.c.createElement("span");
                     b.setStyleProperty("display", "inline-block");
                     b.setStyleProperty("font-size", "14px");
                     b.setStyleProperty("font-weight", "600");
-                    b.setText(this.a.ag);
+                    b.setText(this.a.ai);
                     this.i.append(b);
                 }
             }
@@ -240,17 +246,17 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
         w(a) {
             let b = ElevationHelper.e(12, BrushUtil.g(66, 0, 0, 0), BrushUtil.g(30, 0, 0, 0), BrushUtil.g(20, 0, 0, 0), 1);
             a.setStyleProperty("boxShadow", b);
-            a.setStyleProperty("background-color", this.a.bc._fill);
+            a.setStyleProperty("background-color", this.a.bf._fill);
             a.setStyleProperty("position", "absolute");
             a.setStyleProperty("z-index", "12000");
             a.setStyleProperty("display", "none");
         }
-        ab() {
+        ac() {
             if (this.j != null) {
-                this.j.setStyleProperty("background-color", this.a.bc._fill);
+                this.j.setStyleProperty("background-color", this.a.bf._fill);
             }
             if (this.e != null) {
-                this.e.setStyleProperty("background-color", this.a.bc._fill);
+                this.e.setStyleProperty("background-color", this.a.bf._fill);
             }
         }
         t() {
@@ -276,12 +282,12 @@ export let DataGridToolbarView = /*@__PURE__*/ (() => {
             a.stopPropagation();
         }
         q(a) {
-            if (BaseDOMEventProxy.cz(a) == 8) {
-                this.a.at();
+            if (BaseDOMEventProxy.c0(a) == 8) {
+                this.a.av();
             }
         }
         r(a) {
-            this.a.at();
+            this.a.av();
         }
         o() {
         }
@@ -299,27 +305,28 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             this.e = null;
             this.c = null;
             this.d = null;
-            this.r = 0;
             this.s = 0;
-            this.f = null;
+            this.t = 0;
             this.g = null;
+            this.h = null;
             this.propertyChanged = null;
             this.a = null;
-            this.x = null;
-            this.l = null;
-            this.ba = BrushUtil.g(255, 24, 29, 31);
-            this.a8 = BrushUtil.g(255, 248, 248, 248);
-            this.a9 = BrushUtil.g(255, 248, 248, 248);
-            this.n = false;
-            this.t = null;
-            this.u = null;
+            this.y = null;
+            this.m = null;
+            this.bd = BrushUtil.g(255, 24, 29, 31);
+            this.bb = BrushUtil.g(255, 248, 248, 248);
+            this.bc = BrushUtil.g(255, 248, 248, 248);
             this.o = false;
+            this.u = null;
             this.v = null;
+            this.p = false;
             this.w = null;
-            this.j = 2;
-            this.h = 1;
-            this.r = 0;
+            this.x = null;
+            this.bh = new Thickness(1, 1, 1, 1, 0);
+            this.k = 2;
+            this.i = 1;
             this.s = 0;
+            this.t = 0;
             let a = new DataGridToolbarView();
             a.a = this;
             this.e = a;
@@ -332,16 +339,16 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             this.provideContainer(null, null, null);
             if (this.b != null) {
                 let a = this.b;
-                a.columnHiddenChanged = delegateRemove(a.columnHiddenChanged, runOn(this, this.a6));
+                a.columnHiddenChanged = delegateRemove(a.columnHiddenChanged, runOn(this, this.a9));
                 let b = this.b;
-                b.columnPinnedChanged = delegateRemove(b.columnPinnedChanged, runOn(this, this.a7));
+                b.columnPinnedChanged = delegateRemove(b.columnPinnedChanged, runOn(this, this.ba));
             }
         }
         provideContainer(a, b, c) {
             this.c = b;
             this.d = c;
-            this.a3();
-            this.a4();
+            this.a6();
+            this.a7();
             this.e.p(a);
         }
         get b() {
@@ -351,77 +358,67 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             let b = this.a;
             this.a = a;
             if (b != this.a) {
-                this.ax("TargetGrid", b, this.a);
-            }
-        }
-        get ap() {
-            return this.x;
-        }
-        set ap(a) {
-            let b = this.x;
-            this.x = a;
-            if (b != this.x) {
-                this.ax("ToolbarTitle", b, this.x);
+                this.a0("TargetGrid", b, this.a);
             }
         }
-        get m() {
-            return this.l;
+        get ar() {
+            return this.y;
         }
-        set m(a) {
-            let b = this.l;
-            this.l = a;
-            if (b != this.l) {
-                this.ax("ToolbarTitleStyle", b, this.l);
+        set ar(a) {
+            let b = this.y;
+            this.y = a;
+            if (b != this.y) {
+                this.a0("ToolbarTitle", b, this.y);
             }
         }
-        get bd() {
-            return this.ba;
+        get n() {
+            return this.m;
         }
-        set bd(a) {
-            let b = this.ba;
-            this.ba = a;
-            if (b != this.ba) {
-                this.ax("ToolbarTitleColor", b, this.ba);
+        set n(a) {
+            let b = this.m;
+            this.m = a;
+            if (b != this.m) {
+                this.a0("ToolbarTitleStyle", b, this.m);
             }
         }
-        get bb() {
-            return this.a8;
+        get bg() {
+            return this.bd;
         }
-        set bb(a) {
-            let b = this.a8;
-            this.a8 = a;
-            if (b != this.a8) {
-                this.ax("BackgroundColor", b, this.a8);
+        set bg(a) {
+            let b = this.bd;
+            this.bd = a;
+            if (b != this.bd) {
+                this.a0("ToolbarTitleColor", b, this.bd);
             }
         }
-        get bc() {
-            return this.a9;
+        get be() {
+            return this.bb;
         }
-        set bc(a) {
-            let b = this.a9;
-            this.a9 = a;
-            if (b != this.a9) {
-                this.ax("DialogBackgroundColor", b, this.a9);
+        set be(a) {
+            let b = this.bb;
+            this.bb = a;
+            if (b != this.bb) {
+                this.a0("BackgroundColor", b, this.bb);
             }
         }
-        get p() {
-            return this.n;
+        get bf() {
+            return this.bc;
         }
-        set p(a) {
-            let b = this.n;
-            this.n = a;
-            if (b != this.n) {
-                this.ax("ColumnChooser", b, this.n);
+        set bf(a) {
+            let b = this.bc;
+            this.bc = a;
+            if (b != this.bc) {
+                this.a0("DialogBackgroundColor", b, this.bc);
             }
         }
-        get ab() {
-            return this.t;
+        get q() {
+            return this.o;
         }
-        set ab(a) {
-            let b = this.t;
-            this.t = a;
-            if (b != this.t) {
-                this.ax("ColumnChooserText", b, this.t);
+        set q(a) {
+            let b = this.o;
+            this.o = a;
+            if (b != this.o) {
+                this.a0("ColumnChooser", b, this.o);
             }
         }
         get ad() {
@@ -431,27 +428,27 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             let b = this.u;
             this.u = a;
             if (b != this.u) {
-                this.ax("ColumnChooserTitle", b, this.u);
+                this.a0("ColumnChooserText", b, this.u);
             }
         }
-        get q() {
-            return this.o;
-        }
-        set q(a) {
-            let b = this.o;
-            this.o = a;
-            if (b != this.o) {
-                this.ax("ColumnPinning", b, this.o);
-            }
-        }
-        get ag() {
+        get af() {
             return this.v;
         }
-        set ag(a) {
+        set af(a) {
             let b = this.v;
             this.v = a;
             if (b != this.v) {
-                this.ax("ColumnPinningText", b, this.v);
+                this.a0("ColumnChooserTitle", b, this.v);
+            }
+        }
+        get r() {
+            return this.p;
+        }
+        set r(a) {
+            let b = this.p;
+            this.p = a;
+            if (b != this.p) {
+                this.a0("ColumnPinning", b, this.p);
             }
         }
         get ai() {
@@ -461,155 +458,203 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             let b = this.w;
             this.w = a;
             if (b != this.w) {
-                this.ax("ColumnPinningTitle", b, this.w);
+                this.a0("ColumnPinningText", b, this.w);
             }
         }
-        get k() {
-            return this.j;
+        get ak() {
+            return this.x;
         }
-        set k(a) {
-            let b = this.j;
-            this.j = a;
-            if (b != this.j) {
-                this.ax("Density", enumGetBox(ControlDisplayDensity_$type, b), enumGetBox(ControlDisplayDensity_$type, this.j));
+        set ak(a) {
+            let b = this.x;
+            this.x = a;
+            if (b != this.x) {
+                this.a0("ColumnPinningTitle", b, this.x);
+            }
+        }
+        get bi() {
+            return this.bh;
+        }
+        set bi(a) {
+            let b = this.bh;
+            this.bh = a;
+            if (b != this.bh) {
+                this.a0("BorderWidth", b, this.bh);
             }
         }
-        get i() {
-            return this.h;
+        get l() {
+            return this.k;
         }
-        set i(a) {
-            let b = this.h;
-            this.h = a;
-            if (b != this.h) {
-                this.ax("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, this.h));
+        set l(a) {
+            let b = this.k;
+            this.k = a;
+            if (b != this.k) {
+                this.a0("Density", enumGetBox(ControlDisplayDensity_$type, b), enumGetBox(ControlDisplayDensity_$type, this.k));
             }
         }
-        ax(a, b, c) {
+        get j() {
+            return this.i;
+        }
+        set j(a) {
+            let b = this.i;
+            this.i = a;
+            if (b != this.i) {
+                this.a0("BaseTheme", enumGetBox(BaseControlTheme_$type, b), enumGetBox(BaseControlTheme_$type, this.i));
+            }
+        }
+        a0(a, b, c) {
             if (this.propertyChanged != null) {
                 this.propertyChanged(this, new PropertyChangedEventArgs(a));
             }
-            this.ay(a, b, c);
+            this.a1(a, b, c);
         }
-        ay(a, b, c) {
+        a1(a, b, c) {
             switch (a) {
                 case "TargetGrid":
-                    this.a3();
-                    this.a4();
-                    this.a5();
-                    this.e.ac();
+                    this.a6();
+                    this.a7();
+                    this.a8(typeCast(Grid.$, b));
+                    this.e.ad();
                     break;
                 case "ToolbarTitle":
                     this.e.y();
                     break;
                 case "ToolbarTitleStyle":
-                    this.e.ah();
+                    this.e.ai();
                     break;
                 case "ToolbarTitleColor":
-                    this.e.ag();
+                    this.e.ah();
                     break;
                 case "BackgroundColor":
                     this.e.z();
                     break;
                 case "DialogBackgroundColor":
-                    this.e.ab();
+                    this.e.ac();
                     if (this.c != null) {
-                        this.c.aq = this.bc;
+                        this.c.aq = this.bf;
                     }
                     if (this.d != null) {
-                        this.d.an = this.bc;
+                        this.d.an = this.bf;
                     }
                     break;
                 case "ColumnChooser":
-                    this.a3();
+                    this.a6();
                     this.e.v();
                     break;
                 case "ColumnChooserText":
-                    this.e.aa();
+                    this.e.ab();
                     break;
                 case "ColumnChooserTitle":
                     if (this.c != null) {
-                        this.c.v = this.ad;
+                        this.c.v = this.af;
                     }
                     break;
                 case "ColumnPinning":
-                    this.a4();
+                    this.a7();
                     this.e.x();
                     break;
                 case "ColumnPinningText":
-                    this.e.af();
+                    this.e.ag();
                     break;
                 case "ColumnPinningTitle":
                     if (this.d != null) {
-                        this.d.v = this.ai;
+                        this.d.v = this.ak;
                     }
                     break;
                 case "Density":
-                    this.a0();
+                    this.a3();
                     break;
                 case "BaseTheme":
-                    this.a1();
+                    this.a4();
+                    break;
+                case "BorderWidth":
+                    this.e.aa();
+                    break;
+            }
+        }
+        az(a, b) {
+            switch (b.propertyName) {
+                case "IsToolbarColumnChooserVisible":
+                    this.q = this.b.jr;
+                    break;
+                case "IsToolbarColumnPinningVisible":
+                    this.r = this.b.js;
+                    break;
+                case "ToolbarTitle":
+                    this.ar = this.b.ss;
+                    break;
+                case "ToolbarColumnChooserText":
+                    this.ad = this.b.sk;
+                    break;
+                case "ToolbarColumnChooserTitle":
+                    this.af = this.b.sm;
+                    break;
+                case "ToolbarColumnPinningText":
+                    this.ai = this.b.so;
+                    break;
+                case "ToolbarColumnPinningTitle":
+                    this.ak = this.b.sq;
                     break;
             }
         }
-        a1() {
+        a4() {
             if (this.c != null) {
-                this.c.f = this.i;
+                this.c.f = this.j;
             }
             if (this.d != null) {
-                this.d.f = this.i;
-            }
-            if (this.f != null) {
-                this.f.i = this.i;
+                this.d.f = this.j;
             }
             if (this.g != null) {
-                this.g.i = this.i;
+                this.g.i = this.j;
+            }
+            if (this.h != null) {
+                this.h.i = this.j;
             }
         }
-        a0() {
-            if (this.k == 0) {
+        a3() {
+            if (this.l == 0) {
                 if (this.b != null) {
-                    this.k = this.b.gb;
+                    this.l = this.b.gd;
                 }
             }
-            if (this.f != null) {
-                this.f.m = this.k;
-            }
             if (this.g != null) {
-                this.g.m = this.k;
+                this.g.m = this.l;
+            }
+            if (this.h != null) {
+                this.h.m = this.l;
             }
             if (this.c != null) {
-                this.c.h = this.k;
+                this.c.h = this.l;
             }
             if (this.d != null) {
-                this.d.h = this.k;
+                this.d.h = this.l;
             }
-            this.e.ac();
+            this.e.ad();
         }
-        a2(a, b, c, d, e) {
+        a5(a, b, c, d, e) {
             let f = new XButton();
             let g = b.getSubRenderer(c);
             f.provideContainer(g);
             let h = g.getExternal(f, g.rootWrapper, g.getExternal(a, null, null));
-            f.i = this.i;
-            f.m = this.k;
+            f.i = this.j;
+            f.m = this.l;
             let i = null;
             let j = null;
             let k = null;
             switch (e) {
                 case "Hiding":
-                    this.f = f;
-                    i = DataGridToolbar.am;
-                    j = this.r.toString();
-                    if (this.ab != null) {
-                        k = this.ab;
+                    this.g = f;
+                    i = DataGridToolbar.ao;
+                    j = this.s.toString();
+                    if (this.ad != null) {
+                        k = this.ad;
                     }
                     break;
                 case "Pinning":
-                    this.g = f;
-                    i = DataGridToolbar.an;
-                    j = this.s.toString();
-                    if (this.ag != null) {
-                        k = this.ag;
+                    this.h = f;
+                    i = DataGridToolbar.ap;
+                    j = this.t.toString();
+                    if (this.ai != null) {
+                        k = this.ai;
                     }
                     break;
             }
@@ -646,66 +691,92 @@ export let DataGridToolbar = /*@__PURE__*/ (() => {
             }
             f.appendButtonContent(d);
         }
-        at() {
+        av() {
             this.e.l();
         }
-        a3() {
-            if (this.p && this.c != null && this.b != null) {
-                if (this.ad != null) {
-                    this.c.v = this.ad;
+        a6() {
+            if (this.q && this.c != null && this.b != null) {
+                if (this.af != null) {
+                    this.c.v = this.af;
                 }
                 this.c.b = this.b;
-                this.c.f = this.i;
-                this.c.aq = this.bc;
+                this.c.f = this.j;
+                this.c.aq = this.bf;
                 this.c.an(new Thickness(1, -16, 3, -16, 3));
             }
         }
-        a4() {
-            if (this.q && this.d != null && this.b != null) {
-                if (this.ai != null) {
-                    this.d.v = this.ai;
+        a7() {
+            if (this.r && this.d != null && this.b != null) {
+                if (this.ak != null) {
+                    this.d.v = this.ak;
                 }
                 this.d.b = this.b;
-                this.d.f = this.i;
-                this.d.an = this.bc;
+                this.d.f = this.j;
+                this.d.an = this.bf;
                 this.d.ak(new Thickness(1, -16, 3, -16, 3));
             }
         }
-        a5() {
+        a8(a) {
+            if (a != null) {
+                a.columnHiddenChanged = delegateRemove(a.columnHiddenChanged, runOn(this, this.a9));
+                a.columnPinnedChanged = delegateRemove(a.columnPinnedChanged, runOn(this, this.ba));
+                a.propertyChanged = delegateRemove(a.propertyChanged, runOn(this, this.az));
+            }
             if (this.b != null) {
-                let a = this.b;
-                a.columnHiddenChanged = delegateCombine(a.columnHiddenChanged, runOn(this, this.a6));
                 let b = this.b;
-                b.columnPinnedChanged = delegateCombine(b.columnPinnedChanged, runOn(this, this.a7));
-                this.av();
+                b.columnHiddenChanged = delegateCombine(b.columnHiddenChanged, runOn(this, this.a9));
+                let c = this.b;
+                c.columnPinnedChanged = delegateCombine(c.columnPinnedChanged, runOn(this, this.ba));
+                let d = this.b;
+                d.propertyChanged = delegateCombine(d.propertyChanged, runOn(this, this.az));
+                this.ax();
+                if (this.b.toolbar != null) {
+                    this.ar = this.b.ss;
+                    this.q = this.b.jr;
+                    this.ad = this.b.sk;
+                    this.af = this.b.sm;
+                    this.r = this.b.js;
+                    this.ai = this.b.so;
+                    this.ak = this.b.sq;
+                }
             }
         }
-        av() {
+        ax() {
             if (this.b != null) {
                 let a = this.b.actualColumns.count;
-                this.r = 0;
                 this.s = 0;
+                this.t = 0;
                 for (let b = 0; b < a; b++) {
-                    if (this.b.actualColumns._inner[b].g2 == true) {
-                        this.r++;
+                    if (this.b.actualColumns._inner[b].g6 == true) {
+                        this.s++;
                     }
                     if (this.b.actualColumns._inner[b].f5 == 1) {
-                        this.s++;
+                        this.t++;
                     }
                 }
             }
-            this.e.ad();
             this.e.ae();
+            this.e.af();
+        }
+        a9(a, b) {
+            this.ax();
+        }
+        ba(a, b) {
+            this.ax();
+        }
+        exportVisualModel() {
+            return this.f();
         }
-        a6(a, b) {
-            this.av();
+        exportSerializedVisualModel() {
+            let a = this.f();
+            return a.serialize();
         }
-        a7(a, b) {
-            this.av();
+        f() {
+            return new ToolbarVisualModelExport();
         }
     }
-    DataGridToolbar.$t = /*@__PURE__*/ markType(DataGridToolbar, 'DataGridToolbar', Base.$, [INotifyPropertyChanged_$type]);
-    DataGridToolbar.am = "M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z";
-    DataGridToolbar.an = "M13.2,3.8l7.1,7.1l-2.8-0.1l-3.4,3.4l0.1,4.2l-3.5-3.5l-5.4,5.4l-1.4,0l0-1.4l5.4-5.4L5.7,9.8l4.2,0.1l3.4-3.4L13.2,3.8z";
+    DataGridToolbar.$t = /*@__PURE__*/ markType(DataGridToolbar, 'DataGridToolbar', Base.$, [INotifyPropertyChanged_$type, IDataGridComponent_$type]);
+    DataGridToolbar.ao = "M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z";
+    DataGridToolbar.ap = "M13.2,3.8l7.1,7.1l-2.8-0.1l-3.4,3.4l0.1,4.2l-3.5-3.5l-5.4,5.4l-1.4,0l0-1.4l5.4-5.4L5.7,9.8l4.2,0.1l3.4-3.4L13.2,3.8z";
     return DataGridToolbar;
 })();