@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-33731.0 → 0.0.0-bugfix-dev-KB-35029.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/dist/cjs/ez-grid.cjs.entry.js +18 -6
  2. package/dist/cjs/ez-popup.cjs.entry.js +1 -1
  3. package/dist/cjs/filter-column.cjs.entry.js +5 -16
  4. package/dist/collection/collection-manifest.json +1 -1
  5. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +10 -7
  6. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridUtils.js +8 -0
  7. package/dist/collection/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.js +3 -1
  8. package/dist/collection/components/ez-grid/subcomponents/filter-column.js +5 -16
  9. package/dist/collection/components/ez-popup/ez-popup.css +2 -1
  10. package/dist/collection/utils/form/test/DataBinder.test.js +9 -0
  11. package/dist/custom-elements/index.js +24 -23
  12. package/dist/esm/ez-grid.entry.js +18 -6
  13. package/dist/esm/ez-popup.entry.js +1 -1
  14. package/dist/esm/filter-column.entry.js +5 -16
  15. package/dist/ezui/ezui.esm.js +1 -1
  16. package/dist/ezui/{p-7e460899.entry.js → p-844ee673.entry.js} +1 -1
  17. package/dist/ezui/p-af15c277.entry.js +1 -0
  18. package/dist/ezui/{p-51c5e071.entry.js → p-d373ba17.entry.js} +1 -1
  19. package/dist/types/components/ez-grid/controller/ag-grid/AgGridUtils.d.ts +1 -0
  20. package/dist/types/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.d.ts +1 -1
  21. package/dist/types/components/ez-grid/subcomponents/filter-column.d.ts +1 -4
  22. package/dist/types/components/ez-split-panel/ez-split-panel.d.ts +23 -0
  23. package/dist/types/utils/form/test/DataBinder.test.d.ts +1 -0
  24. package/package.json +4 -5
  25. package/dist/ezui/p-baf80b13.entry.js +0 -1
package/dist/cjs/ez-grid.cjs.entry.js CHANGED
@@ -118953,6 +118953,15 @@ class DataSource {
118953
118953
  }
118954
118954
  }
118955
118955
 
118956
+ function calcFilterColumnLeftPosition(leftReference) {
118957
+ const FIX_MARGIN = 60;
118958
+ const FILTER_COLUMN_WIDTH = 330;
118959
+ const screenWidth = window.innerWidth;
118960
+ const maxLeft = screenWidth - (FILTER_COLUMN_WIDTH + FIX_MARGIN);
118961
+ const leftInt = leftReference - FIX_MARGIN;
118962
+ return leftInt > maxLeft ? maxLeft : leftInt;
118963
+ }
118964
+
118956
118965
  class EzGridCustomHeader {
118957
118966
  init(agParams) {
118958
118967
  var _a;
@@ -118989,7 +118998,8 @@ class EzGridCustomHeader {
118989
118998
  }
118990
118999
  onClickFilter() {
118991
119000
  var _a;
118992
- this.params.showColumnFilter((_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left);
119001
+ const iconLeft = (_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left;
119002
+ this.params.showColumnFilter(`${calcFilterColumnLeftPosition(iconLeft)}px`, true);
118993
119003
  }
118994
119004
  configSortIcon() {
118995
119005
  this.sortDownIcon.style.display = this.params.column.isSortDescending() ? 'flex' : 'none';
@@ -119666,7 +119676,7 @@ class AgGridController {
119666
119676
  this._idAttribName = '__record__id__';
119667
119677
  this._gridConfig = [];
119668
119678
  this._filteredColumns = new Map();
119669
- this._filterColumnleftPosition = 0;
119679
+ this._filterColumnleftPosition = '0px';
119670
119680
  this._enterprise = enterprise;
119671
119681
  }
119672
119682
  getGridConfig() {
@@ -119792,9 +119802,11 @@ class AgGridController {
119792
119802
  this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
119793
119803
  }
119794
119804
  }
119795
- setFilterColumnLeftPosition({ type, ePopup }) {
119796
- if (type === 'columnMenu') {
119797
- this._filterColumnleftPosition = ePopup.getBoundingClientRect().left;
119805
+ setFilterColumnLeftPosition(params) {
119806
+ if (params.type === 'columnMenu') {
119807
+ const ePopup = params.ePopup;
119808
+ const leftString = ePopup.style.left.replace('px', '');
119809
+ this._filterColumnleftPosition = `${calcFilterColumnLeftPosition(parseInt(leftString))}px`;
119798
119810
  return;
119799
119811
  }
119800
119812
  }
@@ -120234,7 +120246,7 @@ class AgGridController {
120234
120246
  tooltip: tooltip,
120235
120247
  isSortable: propSortable,
120236
120248
  hasFilter: () => this.hasFilterColumn(source.name),
120237
- showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
120249
+ showColumnFilter: (leftPosition, fromIcon) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon }),
120238
120250
  },
120239
120251
  valueFormatter: params => {
120240
120252
  if (params.value == undefined) {
package/dist/cjs/ez-popup.cjs.entry.js CHANGED
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-a7b0c73d.js');
6
6
  const core = require('@sankhyalabs/core');
7
7
 
8
- const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;min-height:100%;height:100%}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
8
+ const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;height:100%;background:red}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
9
9
 
10
10
  const EzPopup = class {
11
11
  constructor(hostRef) {
package/dist/cjs/filter-column.cjs.entry.js CHANGED
@@ -22,8 +22,6 @@ const FilterColumn = class {
22
22
  this.TOP_POSITION_NO_TASKBAR = '32';
23
23
  this.TOP_POSITION_NO_TASKBAR_HEADER_HIDDEN = '20';
24
24
  this.DEFAULT_HEIGHT = 430;
25
- this.FIX_MARGIN = 60;
26
- this.FILTER_COLUMN_WIDTH = 330;
27
25
  this.opened = true;
28
26
  this.columnName = undefined;
29
27
  this.columnLabel = undefined;
@@ -56,24 +54,15 @@ const FilterColumn = class {
56
54
  await this.ezPopoverElement.show(this.calcTopPosition(), this.calculateLeftPosition(configs));
57
55
  }
58
56
  }
59
- calculateLeftPosition({ leftPosition, fromIcon }) {
60
- const leftPositionCalculated = this.calcFilterColumnLeftPosition(leftPosition);
61
- if (!fromIcon) {
62
- return `${leftPositionCalculated}px`;
57
+ calculateLeftPosition(configs) {
58
+ if (!configs.fromIcon) {
59
+ return configs.leftPosition;
63
60
  }
64
61
  const difference = this.ezPopoverElement.getBoundingClientRect().left;
65
- const leftResolved = (leftPositionCalculated + 16) - difference;
62
+ const leftReference = parseInt(configs.leftPosition.replace('px', ''));
63
+ const leftResolved = (leftReference + 16) - difference;
66
64
  return `${(leftResolved > 0 ? leftResolved : 0)}px`;
67
65
  }
68
- calcFilterColumnLeftPosition(leftReference) {
69
- var _a, _b;
70
- const gridReference = this.ezPopoverElement.closest("ez-grid");
71
- const gridLimit = (_a = gridReference.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.right;
72
- const popoverDiff = (_b = this.ezPopoverElement.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
73
- const maxLeft = gridLimit - (this.FILTER_COLUMN_WIDTH + popoverDiff);
74
- const leftInt = leftReference - (this.FIX_MARGIN + popoverDiff);
75
- return leftInt > maxLeft ? maxLeft : leftInt;
76
- }
77
66
  buildIsTextSearch() {
78
67
  var _a, _b;
79
68
  const userInterface = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.userInterface) !== null && _b !== void 0 ? _b : core.UserInterface.SHORTTEXT;
package/dist/collection/collection-manifest.json CHANGED
@@ -6,7 +6,6 @@
6
6
  "./components/ez-combo-box/ez-combo-box.js",
7
7
  "./components/ez-card-item/ez-card-item.js",
8
8
  "./components/ez-search/ez-search.js",
9
- "./components/ez-actions-button/ez-actions-button.js",
10
9
  "./components/ez-breadcrumb/ez-breadcrumb.js",
11
10
  "./components/ez-text-input/ez-text-input.js",
12
11
  "./components/ez-popover/ez-popover.js",
@@ -15,6 +14,7 @@
15
14
  "./components/ez-text-edit/ez-text-edit.js",
16
15
  "./components/ez-upload/ez-upload.js",
17
16
  "./components/ez-grid/subcomponents/filter-column.js",
17
+ "./components/ez-actions-button/ez-actions-button.js",
18
18
  "./components/ez-alert/ez-alert.js",
19
19
  "./components/ez-application/ez-application.js",
20
20
  "./components/ez-badge/ez-badge.js",
package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js CHANGED
@@ -1,4 +1,4 @@
1
- import { ApplicationContext, DataType, MaskFormatter, NumberUtils, SortMode, StringUtils, UserInterface, } from '@sankhyalabs/core';
1
+ import { ApplicationContext, DataType, MaskFormatter, NumberUtils, SortMode, StringUtils, UserInterface } from '@sankhyalabs/core';
2
2
  import { Grid, } from 'ag-grid-community';
3
3
  import { Grid as EnterpriseGrid, LicenseManager } from 'ag-grid-enterprise';
4
4
  import DataSource from './DataSource';
@@ -6,7 +6,8 @@ import { EzGridCustomHeader } from './components/EzGridCustomHeader';
6
6
  import { CellRendererStatus } from './components/cellRendererStatus';
7
7
  import SelectionHeader from './components/selectionHeader';
8
8
  import gridTerms from './i18n/pt-BR.js';
9
- import { DISTINCT_FILTER_NAME_PREFIX, EZ_GRID_LOADING_SOURCE } from '../../../../utils/constants';
9
+ import { EZ_GRID_LOADING_SOURCE, DISTINCT_FILTER_NAME_PREFIX } from '../../../../utils/constants';
10
+ import { calcFilterColumnLeftPosition } from './AgGridUtils';
10
11
  import GridEditionManager from './GridEditionManager';
11
12
  export default class AgGridController {
12
13
  configFilterColumn(filterColumn) {
@@ -37,7 +38,7 @@ export default class AgGridController {
37
38
  this._idAttribName = '__record__id__';
38
39
  this._gridConfig = [];
39
40
  this._filteredColumns = new Map();
40
- this._filterColumnleftPosition = 0;
41
+ this._filterColumnleftPosition = '0px';
41
42
  this._enterprise = enterprise;
42
43
  }
43
44
  getGridConfig() {
@@ -163,9 +164,11 @@ export default class AgGridController {
163
164
  this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
164
165
  }
165
166
  }
166
- setFilterColumnLeftPosition({ type, ePopup }) {
167
- if (type === 'columnMenu') {
168
- this._filterColumnleftPosition = ePopup.getBoundingClientRect().left;
167
+ setFilterColumnLeftPosition(params) {
168
+ if (params.type === 'columnMenu') {
169
+ const ePopup = params.ePopup;
170
+ const leftString = ePopup.style.left.replace('px', '');
171
+ this._filterColumnleftPosition = `${calcFilterColumnLeftPosition(parseInt(leftString))}px`;
169
172
  return;
170
173
  }
171
174
  }
@@ -605,7 +608,7 @@ export default class AgGridController {
605
608
  tooltip: tooltip,
606
609
  isSortable: propSortable,
607
610
  hasFilter: () => this.hasFilterColumn(source.name),
608
- showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
611
+ showColumnFilter: (leftPosition, fromIcon) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon }),
609
612
  },
610
613
  valueFormatter: params => {
611
614
  if (params.value == undefined) {
package/dist/collection/components/ez-grid/controller/ag-grid/AgGridUtils.js ADDED
@@ -0,0 +1,8 @@
1
+ export function calcFilterColumnLeftPosition(leftReference) {
2
+ const FIX_MARGIN = 60;
3
+ const FILTER_COLUMN_WIDTH = 330;
4
+ const screenWidth = window.innerWidth;
5
+ const maxLeft = screenWidth - (FILTER_COLUMN_WIDTH + FIX_MARGIN);
6
+ const leftInt = leftReference - FIX_MARGIN;
7
+ return leftInt > maxLeft ? maxLeft : leftInt;
8
+ }
package/dist/collection/components/ez-grid/controller/ag-grid/components/EzGridCustomHeader.js CHANGED
@@ -1,3 +1,4 @@
1
+ import { calcFilterColumnLeftPosition } from '../AgGridUtils';
1
2
  export class EzGridCustomHeader {
2
3
  init(agParams) {
3
4
  var _a;
@@ -34,7 +35,8 @@ export class EzGridCustomHeader {
34
35
  }
35
36
  onClickFilter() {
36
37
  var _a;
37
- this.params.showColumnFilter((_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left);
38
+ const iconLeft = (_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left;
39
+ this.params.showColumnFilter(`${calcFilterColumnLeftPosition(iconLeft)}px`, true);
38
40
  }
39
41
  configSortIcon() {
40
42
  this.sortDownIcon.style.display = this.params.column.isSortDescending() ? 'flex' : 'none';
package/dist/collection/components/ez-grid/subcomponents/filter-column.js CHANGED
@@ -13,8 +13,6 @@ export class FilterColumn {
13
13
  this.TOP_POSITION_NO_TASKBAR = '32';
14
14
  this.TOP_POSITION_NO_TASKBAR_HEADER_HIDDEN = '20';
15
15
  this.DEFAULT_HEIGHT = 430;
16
- this.FIX_MARGIN = 60;
17
- this.FILTER_COLUMN_WIDTH = 330;
18
16
  this.opened = true;
19
17
  this.columnName = undefined;
20
18
  this.columnLabel = undefined;
@@ -47,24 +45,15 @@ export class FilterColumn {
47
45
  await this.ezPopoverElement.show(this.calcTopPosition(), this.calculateLeftPosition(configs));
48
46
  }
49
47
  }
50
- calculateLeftPosition({ leftPosition, fromIcon }) {
51
- const leftPositionCalculated = this.calcFilterColumnLeftPosition(leftPosition);
52
- if (!fromIcon) {
53
- return `${leftPositionCalculated}px`;
48
+ calculateLeftPosition(configs) {
49
+ if (!configs.fromIcon) {
50
+ return configs.leftPosition;
54
51
  }
55
52
  const difference = this.ezPopoverElement.getBoundingClientRect().left;
56
- const leftResolved = (leftPositionCalculated + 16) - difference;
53
+ const leftReference = parseInt(configs.leftPosition.replace('px', ''));
54
+ const leftResolved = (leftReference + 16) - difference;
57
55
  return `${(leftResolved > 0 ? leftResolved : 0)}px`;
58
56
  }
59
- calcFilterColumnLeftPosition(leftReference) {
60
- var _a, _b;
61
- const gridReference = this.ezPopoverElement.closest("ez-grid");
62
- const gridLimit = (_a = gridReference.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.right;
63
- const popoverDiff = (_b = this.ezPopoverElement.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
64
- const maxLeft = gridLimit - (this.FILTER_COLUMN_WIDTH + popoverDiff);
65
- const leftInt = leftReference - (this.FIX_MARGIN + popoverDiff);
66
- return leftInt > maxLeft ? maxLeft : leftInt;
67
- }
68
57
  buildIsTextSearch() {
69
58
  var _a, _b;
70
59
  const userInterface = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.userInterface) !== null && _b !== void 0 ? _b : UserInterface.SHORTTEXT;
package/dist/collection/components/ez-popup/ez-popup.css CHANGED
@@ -86,8 +86,9 @@
86
86
  .popup__expandable-content {
87
87
  box-sizing: border-box;
88
88
  width: 100%;
89
- min-height: 100%;
89
+ /*min-height: 100%;*/
90
90
  height: 100%;
91
+ background: red;
91
92
  }
92
93
 
93
94
  .popup__header {
package/dist/collection/utils/form/test/DataBinder.test.js ADDED
@@ -0,0 +1,9 @@
1
+ import { DataUnit } from "@sankhyalabs/core";
2
+ import DataBinder from "../DataBinder";
3
+ describe('DataBinder', () => {
4
+ it('constructor', async () => {
5
+ const du = new DataUnit();
6
+ const db = new DataBinder(du);
7
+ expect(db).toBeTruthy();
8
+ });
9
+ });
package/dist/custom-elements/index.js CHANGED
@@ -123827,6 +123827,15 @@ class DataSource {
123827
123827
  }
123828
123828
  }
123829
123829
 
123830
+ function calcFilterColumnLeftPosition(leftReference) {
123831
+ const FIX_MARGIN = 60;
123832
+ const FILTER_COLUMN_WIDTH = 330;
123833
+ const screenWidth = window.innerWidth;
123834
+ const maxLeft = screenWidth - (FILTER_COLUMN_WIDTH + FIX_MARGIN);
123835
+ const leftInt = leftReference - FIX_MARGIN;
123836
+ return leftInt > maxLeft ? maxLeft : leftInt;
123837
+ }
123838
+
123830
123839
  class EzGridCustomHeader {
123831
123840
  init(agParams) {
123832
123841
  var _a;
@@ -123863,7 +123872,8 @@ class EzGridCustomHeader {
123863
123872
  }
123864
123873
  onClickFilter() {
123865
123874
  var _a;
123866
- this.params.showColumnFilter((_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left);
123875
+ const iconLeft = (_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left;
123876
+ this.params.showColumnFilter(`${calcFilterColumnLeftPosition(iconLeft)}px`, true);
123867
123877
  }
123868
123878
  configSortIcon() {
123869
123879
  this.sortDownIcon.style.display = this.params.column.isSortDescending() ? 'flex' : 'none';
@@ -124540,7 +124550,7 @@ class AgGridController {
124540
124550
  this._idAttribName = '__record__id__';
124541
124551
  this._gridConfig = [];
124542
124552
  this._filteredColumns = new Map();
124543
- this._filterColumnleftPosition = 0;
124553
+ this._filterColumnleftPosition = '0px';
124544
124554
  this._enterprise = enterprise;
124545
124555
  }
124546
124556
  getGridConfig() {
@@ -124666,9 +124676,11 @@ class AgGridController {
124666
124676
  this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
124667
124677
  }
124668
124678
  }
124669
- setFilterColumnLeftPosition({ type, ePopup }) {
124670
- if (type === 'columnMenu') {
124671
- this._filterColumnleftPosition = ePopup.getBoundingClientRect().left;
124679
+ setFilterColumnLeftPosition(params) {
124680
+ if (params.type === 'columnMenu') {
124681
+ const ePopup = params.ePopup;
124682
+ const leftString = ePopup.style.left.replace('px', '');
124683
+ this._filterColumnleftPosition = `${calcFilterColumnLeftPosition(parseInt(leftString))}px`;
124672
124684
  return;
124673
124685
  }
124674
124686
  }
@@ -125108,7 +125120,7 @@ class AgGridController {
125108
125120
  tooltip: tooltip,
125109
125121
  isSortable: propSortable,
125110
125122
  hasFilter: () => this.hasFilterColumn(source.name),
125111
- showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
125123
+ showColumnFilter: (leftPosition, fromIcon) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon }),
125112
125124
  },
125113
125125
  valueFormatter: params => {
125114
125126
  if (params.value == undefined) {
@@ -127187,7 +127199,7 @@ const EzPopover$1 = class extends HTMLElement$1 {
127187
127199
  static get style() { return ezPopoverCss; }
127188
127200
  };
127189
127201
 
127190
- const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;min-height:100%;height:100%}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
127202
+ const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;height:100%;background:red}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
127191
127203
 
127192
127204
  const EzPopup$1 = class extends HTMLElement$1 {
127193
127205
  constructor() {
@@ -131073,8 +131085,6 @@ const FilterColumn$1 = class extends HTMLElement$1 {
131073
131085
  this.TOP_POSITION_NO_TASKBAR = '32';
131074
131086
  this.TOP_POSITION_NO_TASKBAR_HEADER_HIDDEN = '20';
131075
131087
  this.DEFAULT_HEIGHT = 430;
131076
- this.FIX_MARGIN = 60;
131077
- this.FILTER_COLUMN_WIDTH = 330;
131078
131088
  this.opened = true;
131079
131089
  this.columnName = undefined;
131080
131090
  this.columnLabel = undefined;
@@ -131107,24 +131117,15 @@ const FilterColumn$1 = class extends HTMLElement$1 {
131107
131117
  await this.ezPopoverElement.show(this.calcTopPosition(), this.calculateLeftPosition(configs));
131108
131118
  }
131109
131119
  }
131110
- calculateLeftPosition({ leftPosition, fromIcon }) {
131111
- const leftPositionCalculated = this.calcFilterColumnLeftPosition(leftPosition);
131112
- if (!fromIcon) {
131113
- return `${leftPositionCalculated}px`;
131120
+ calculateLeftPosition(configs) {
131121
+ if (!configs.fromIcon) {
131122
+ return configs.leftPosition;
131114
131123
  }
131115
131124
  const difference = this.ezPopoverElement.getBoundingClientRect().left;
131116
- const leftResolved = (leftPositionCalculated + 16) - difference;
131125
+ const leftReference = parseInt(configs.leftPosition.replace('px', ''));
131126
+ const leftResolved = (leftReference + 16) - difference;
131117
131127
  return `${(leftResolved > 0 ? leftResolved : 0)}px`;
131118
131128
  }
131119
- calcFilterColumnLeftPosition(leftReference) {
131120
- var _a, _b;
131121
- const gridReference = this.ezPopoverElement.closest("ez-grid");
131122
- const gridLimit = (_a = gridReference.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.right;
131123
- const popoverDiff = (_b = this.ezPopoverElement.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
131124
- const maxLeft = gridLimit - (this.FILTER_COLUMN_WIDTH + popoverDiff);
131125
- const leftInt = leftReference - (this.FIX_MARGIN + popoverDiff);
131126
- return leftInt > maxLeft ? maxLeft : leftInt;
131127
- }
131128
131129
  buildIsTextSearch() {
131129
131130
  var _a, _b;
131130
131131
  const userInterface = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.userInterface) !== null && _b !== void 0 ? _b : UserInterface.SHORTTEXT;
package/dist/esm/ez-grid.entry.js CHANGED
@@ -118949,6 +118949,15 @@ class DataSource {
118949
118949
  }
118950
118950
  }
118951
118951
 
118952
+ function calcFilterColumnLeftPosition(leftReference) {
118953
+ const FIX_MARGIN = 60;
118954
+ const FILTER_COLUMN_WIDTH = 330;
118955
+ const screenWidth = window.innerWidth;
118956
+ const maxLeft = screenWidth - (FILTER_COLUMN_WIDTH + FIX_MARGIN);
118957
+ const leftInt = leftReference - FIX_MARGIN;
118958
+ return leftInt > maxLeft ? maxLeft : leftInt;
118959
+ }
118960
+
118952
118961
  class EzGridCustomHeader {
118953
118962
  init(agParams) {
118954
118963
  var _a;
@@ -118985,7 +118994,8 @@ class EzGridCustomHeader {
118985
118994
  }
118986
118995
  onClickFilter() {
118987
118996
  var _a;
118988
- this.params.showColumnFilter((_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left);
118997
+ const iconLeft = (_a = this.filterButton) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().left;
118998
+ this.params.showColumnFilter(`${calcFilterColumnLeftPosition(iconLeft)}px`, true);
118989
118999
  }
118990
119000
  configSortIcon() {
118991
119001
  this.sortDownIcon.style.display = this.params.column.isSortDescending() ? 'flex' : 'none';
@@ -119662,7 +119672,7 @@ class AgGridController {
119662
119672
  this._idAttribName = '__record__id__';
119663
119673
  this._gridConfig = [];
119664
119674
  this._filteredColumns = new Map();
119665
- this._filterColumnleftPosition = 0;
119675
+ this._filterColumnleftPosition = '0px';
119666
119676
  this._enterprise = enterprise;
119667
119677
  }
119668
119678
  getGridConfig() {
@@ -119788,9 +119798,11 @@ class AgGridController {
119788
119798
  this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
119789
119799
  }
119790
119800
  }
119791
- setFilterColumnLeftPosition({ type, ePopup }) {
119792
- if (type === 'columnMenu') {
119793
- this._filterColumnleftPosition = ePopup.getBoundingClientRect().left;
119801
+ setFilterColumnLeftPosition(params) {
119802
+ if (params.type === 'columnMenu') {
119803
+ const ePopup = params.ePopup;
119804
+ const leftString = ePopup.style.left.replace('px', '');
119805
+ this._filterColumnleftPosition = `${calcFilterColumnLeftPosition(parseInt(leftString))}px`;
119794
119806
  return;
119795
119807
  }
119796
119808
  }
@@ -120230,7 +120242,7 @@ class AgGridController {
120230
120242
  tooltip: tooltip,
120231
120243
  isSortable: propSortable,
120232
120244
  hasFilter: () => this.hasFilterColumn(source.name),
120233
- showColumnFilter: (leftPosition) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon: true }),
120245
+ showColumnFilter: (leftPosition, fromIcon) => this.showFilterColumn({ columnName: source.name, columnLabel: source.label, leftPosition, filteredOptions: this._filteredColumns.get(source.name), fromIcon }),
120234
120246
  },
120235
120247
  valueFormatter: params => {
120236
120248
  if (params.value == undefined) {
package/dist/esm/ez-popup.entry.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host } from './index-baa5e267.js';
2
2
  import { FloatingManager } from '@sankhyalabs/core';
3
3
 
4
- const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;min-height:100%;height:100%}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
4
+ const ezPopupCss = ":host{display:flex;--ez-popup-z-index:var(--elevation--24, 24);--ez-popup__container--color:var(--title--primary, #2b3a54);--ez-popup__container--padding:var(--space--large, 24px);--ez-popup__header--padding-bottom:var(--space--medium, 12px);--ez-popup__title--font-family:var(--font-pattern, \"Roboto\");--ez-popup__title--font-size:var(--title--extra-large, 24px);--ez-popup__title--color:var(--title--primary, #2b3a54);--ez-popup__title--font-weight:var(--text-weight--large, 600);--ez-popup__btn__close--icon-color:var(--title--primary, #2b3a54);--ez-popup__btn__close--icon:url('data:image/svg+xml;utf8,<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 8.2421753,6.9944578 13.743748,1.4930784 C 13.907781,1.3290628 14,1.1065946 14,0.87462511 14,0.64266712 13.907782,0.42019873 13.743748,0.25617155 13.579712,0.09215597 13.35727,6.48e-8 13.125266,6.48e-8 12.89338,6.48e-8 12.670821,0.09215634 12.506787,0.25617155 L 7.005215,5.7575508 1.5035972,0.25617155 C 1.3395631,0.09215597 1.1170968,6.48e-8 0.88511716,6.48e-8 0.65314917,6.48e-8 0.4306712,0.09215597 0.26663695,0.25617155 0.10260271,0.42019873 0.01045441,0.64266712 0.01045441,0.87462511 c 0,0.23196949 0.0921483,0.45443769 0.25618254,0.61845329 L 5.7682546,6.9944578 0.26663695,12.497027 c -0.0834745,0.08067 -0.15003245,0.1772 -0.19581514,0.283871 C 0.02505077,12.887561 9.831648e-4,13.002399 2.950369e-5,13.118395 -9.2415746e-4,13.234504 0.02125019,13.349689 0.06527245,13.457057 c 0.04401053,0.107479 0.10898307,0.205064 0.1911168,0.287137 0.0821454,0.08208 0.17979645,0.146888 0.28727561,0.190839 0.10747906,0.04395 0.22262954,0.06598 0.33872417,0.06493 0.116095,-10e-4 0.23082547,-0.0253 0.33747687,-0.07112 0.1066637,-0.04593 0.2031133,-0.112615 0.2837313,-0.196086 L 7.005215,8.2313646 12.506787,13.732768 c 0.164034,0.164027 0.386593,0.256125 0.618479,0.256125 0.232004,0 0.454446,-0.09209 0.618482,-0.256125 C 13.907781,13.568741 14,13.346308 14,13.114315 14,12.882323 13.90779,12.659888 13.743748,12.495861 Z\"/></svg>')}.overlay{position:fixed;display:flex;top:0px;z-index:var(--ez-popup-z-index, 24);left:0px;width:100%;align-items:center;justify-content:center;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}.popup{display:flex;height:100%;align-items:center;justify-content:center;box-sizing:border-box}.popup__container{width:100%;max-height:90%;height:100%;display:flex;flex-wrap:wrap;overflow:hidden;outline:none;background:#FFFF;color:var(--ez-popup__container--color);border-radius:12px;box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122);box-sizing:border-box;padding:var(--ez-popup__container--padding)}.popup__container--auto{height:auto}.popup__content{box-sizing:border-box;max-height:100%;width:100%;display:grid;grid-template-rows:auto 1fr}.popup__expandable-content{box-sizing:border-box;width:100%;height:100%;background:red}.popup__header{width:100%;display:flex}.popup__header--padding{padding-bottom:var(--ez-popup__header--padding-bottom)}.popup__title{display:flex;margin:0;width:100%;font-family:var(--ez-popup__title--font-family);font-size:var(--ez-popup__title--font-size);font-weight:var(--ez-popup__title--font-weight);color:var(--ez-popup__title--color);line-height:1.3}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-popup__btn__close--icon-color);width:14px;height:14px;-webkit-mask-image:var(--ez-popup__btn__close--icon);mask-image:var(--ez-popup__btn__close--icon)}.btn-close--solo{width:100%}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}.ez-popup__size-limit--x-small{min-width:350px;max-width:560px}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
5
5
 
6
6
  const EzPopup = class {
7
7
  constructor(hostRef) {
package/dist/esm/filter-column.entry.js CHANGED
@@ -18,8 +18,6 @@ const FilterColumn = class {
18
18
  this.TOP_POSITION_NO_TASKBAR = '32';
19
19
  this.TOP_POSITION_NO_TASKBAR_HEADER_HIDDEN = '20';
20
20
  this.DEFAULT_HEIGHT = 430;
21
- this.FIX_MARGIN = 60;
22
- this.FILTER_COLUMN_WIDTH = 330;
23
21
  this.opened = true;
24
22
  this.columnName = undefined;
25
23
  this.columnLabel = undefined;
@@ -52,24 +50,15 @@ const FilterColumn = class {
52
50
  await this.ezPopoverElement.show(this.calcTopPosition(), this.calculateLeftPosition(configs));
53
51
  }
54
52
  }
55
- calculateLeftPosition({ leftPosition, fromIcon }) {
56
- const leftPositionCalculated = this.calcFilterColumnLeftPosition(leftPosition);
57
- if (!fromIcon) {
58
- return `${leftPositionCalculated}px`;
53
+ calculateLeftPosition(configs) {
54
+ if (!configs.fromIcon) {
55
+ return configs.leftPosition;
59
56
  }
60
57
  const difference = this.ezPopoverElement.getBoundingClientRect().left;
61
- const leftResolved = (leftPositionCalculated + 16) - difference;
58
+ const leftReference = parseInt(configs.leftPosition.replace('px', ''));
59
+ const leftResolved = (leftReference + 16) - difference;
62
60
  return `${(leftResolved > 0 ? leftResolved : 0)}px`;
63
61
  }
64
- calcFilterColumnLeftPosition(leftReference) {
65
- var _a, _b;
66
- const gridReference = this.ezPopoverElement.closest("ez-grid");
67
- const gridLimit = (_a = gridReference.getBoundingClientRect()) === null || _a === void 0 ? void 0 : _a.right;
68
- const popoverDiff = (_b = this.ezPopoverElement.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
69
- const maxLeft = gridLimit - (this.FILTER_COLUMN_WIDTH + popoverDiff);
70
- const leftInt = leftReference - (this.FIX_MARGIN + popoverDiff);
71
- return leftInt > maxLeft ? maxLeft : leftInt;
72
- }
73
62
  buildIsTextSearch() {
74
63
  var _a, _b;
75
64
  const userInterface = (_b = (_a = this.fieldDescriptor) === null || _a === void 0 ? void 0 : _a.userInterface) !== null && _b !== void 0 ? _b : UserInterface.SHORTTEXT;