@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-83282.1 → 0.0.0-bugfix-dev-KB-84596.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 (100) hide show
  1. package/dist/cjs/ez-badge.cjs.entry.js +14 -2
  2. package/dist/cjs/ez-button.cjs.entry.js +1 -1
  3. package/dist/cjs/ez-card-item_2.cjs.entry.js +1416 -7
  4. package/dist/cjs/ez-chip.cjs.entry.js +1 -1
  5. package/dist/cjs/ez-date-input.cjs.entry.js +4 -17
  6. package/dist/cjs/ez-date-time-input.cjs.entry.js +4 -16
  7. package/dist/cjs/ez-form-view.cjs.entry.js +1 -1
  8. package/dist/cjs/ez-grid.cjs.entry.js +35 -61
  9. package/dist/cjs/ez-popover-plus_3.cjs.entry.js +200 -0
  10. package/dist/cjs/ez-scroller_2.cjs.entry.js +1 -1
  11. package/dist/cjs/ez-search.cjs.entry.js +28 -158
  12. package/dist/cjs/ez-split-item.cjs.entry.js +1 -1
  13. package/dist/cjs/ezui.cjs.js +1 -1
  14. package/dist/cjs/index-a7b0c73d.js +4 -4
  15. package/dist/cjs/loader.cjs.js +1 -1
  16. package/dist/cjs/searchFormatters-b7e1ed1e.js +23 -0
  17. package/dist/collection/collection-manifest.json +2 -1
  18. package/dist/collection/components/ez-badge/ez-badge.css +12 -1
  19. package/dist/collection/components/ez-badge/ez-badge.js +31 -1
  20. package/dist/collection/components/ez-button/ez-button.css +1 -1
  21. package/dist/collection/components/ez-card-item/ez-card-item.css +1 -3
  22. package/dist/collection/components/ez-chip/ez-chip.css +5 -1
  23. package/dist/collection/components/ez-date-input/ez-date-input.js +4 -17
  24. package/dist/collection/components/ez-date-time-input/ez-date-time-input.js +4 -16
  25. package/dist/collection/components/ez-form-view/fieldbuilder/templates/SearchInput.tpl.js +1 -1
  26. package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js +4 -2
  27. package/dist/collection/components/ez-grid/ez-grid.js +6 -3
  28. package/dist/collection/components/ez-grid/utils/ColumnFilterManager.js +7 -54
  29. package/dist/collection/components/ez-grid/utils/InMemoryFilterColumnDataSource.js +20 -4
  30. package/dist/collection/components/ez-popover-plus/ez-popover-plus.js +55 -15
  31. package/dist/collection/components/ez-popover-plus/subcomponent/ez-popover-core.css +2 -2
  32. package/dist/collection/components/ez-popover-plus/subcomponent/ez-popover-core.js +73 -13
  33. package/dist/collection/components/ez-scroller/ez-scroller.css +3 -0
  34. package/dist/collection/components/ez-search/ez-search.css +0 -219
  35. package/dist/collection/components/ez-search/ez-search.js +28 -167
  36. package/dist/collection/components/ez-search/subcomponent/search-list/search-list.css +227 -0
  37. package/dist/collection/components/ez-search/subcomponent/search-list/search-list.js +289 -0
  38. package/dist/collection/components/ez-search/utils/searchFormatters.js +18 -0
  39. package/dist/collection/components/ez-split-panel/structure/item/ez-split-item.js +1 -1
  40. package/dist/custom-elements/index.d.ts +6 -0
  41. package/dist/custom-elements/index.js +237 -282
  42. package/dist/esm/ez-badge.entry.js +14 -2
  43. package/dist/esm/ez-button.entry.js +1 -1
  44. package/dist/esm/ez-card-item_2.entry.js +1416 -7
  45. package/dist/esm/ez-chip.entry.js +1 -1
  46. package/dist/esm/ez-date-input.entry.js +4 -17
  47. package/dist/esm/ez-date-time-input.entry.js +4 -16
  48. package/dist/esm/ez-form-view.entry.js +1 -1
  49. package/dist/esm/ez-grid.entry.js +36 -62
  50. package/dist/esm/ez-popover-plus_3.entry.js +194 -0
  51. package/dist/esm/ez-scroller_2.entry.js +1 -1
  52. package/dist/esm/ez-search.entry.js +29 -159
  53. package/dist/esm/ez-split-item.entry.js +1 -1
  54. package/dist/esm/ezui.js +1 -1
  55. package/dist/esm/index-baa5e267.js +4 -4
  56. package/dist/esm/loader.js +1 -1
  57. package/dist/esm/searchFormatters-8229207e.js +20 -0
  58. package/dist/ezui/ezui.esm.js +1 -1
  59. package/dist/ezui/p-20cb13fa.entry.js +1 -0
  60. package/dist/ezui/p-23b6128c.entry.js +1 -0
  61. package/dist/ezui/p-2872fd16.entry.js +1 -0
  62. package/dist/ezui/p-288631d1.entry.js +1 -0
  63. package/dist/ezui/p-40a60148.js +1 -0
  64. package/dist/ezui/p-788467fe.entry.js +1 -0
  65. package/dist/ezui/p-a69355eb.entry.js +1 -0
  66. package/dist/ezui/p-b7706b43.entry.js +1 -0
  67. package/dist/ezui/{p-53116373.entry.js → p-cb5cd243.entry.js} +46 -46
  68. package/dist/ezui/p-d2bc2f06.entry.js +1 -0
  69. package/dist/ezui/p-dcf3c8e5.entry.js +1 -0
  70. package/dist/ezui/{p-17be134a.entry.js → p-e06a9886.entry.js} +1 -1
  71. package/dist/ezui/p-e75c7a23.entry.js +1 -0
  72. package/dist/types/components/ez-badge/ez-badge.d.ts +5 -0
  73. package/dist/types/components/ez-calendar/ez-calendar.d.ts +3 -3
  74. package/dist/types/components/ez-date-input/ez-date-input.d.ts +2 -2
  75. package/dist/types/components/ez-date-time-input/ez-date-time-input.d.ts +2 -2
  76. package/dist/types/components/ez-grid/controller/ag-grid/AgGridController.d.ts +1 -0
  77. package/dist/types/components/ez-grid/utils/ColumnFilterManager.d.ts +1 -1
  78. package/dist/types/components/ez-grid/utils/InMemoryFilterColumnDataSource.d.ts +3 -0
  79. package/dist/types/components/ez-popover-plus/ez-popover-plus.d.ts +9 -4
  80. package/dist/types/components/ez-popover-plus/subcomponent/ez-popover-core.d.ts +13 -3
  81. package/dist/types/components/ez-search/ez-search.d.ts +3 -13
  82. package/dist/types/components/ez-search/subcomponent/search-list/search-list.d.ts +23 -0
  83. package/dist/types/components/ez-search/utils/searchFormatters.d.ts +2 -0
  84. package/dist/types/components.d.ts +82 -6
  85. package/package.json +1 -1
  86. package/react/components.d.ts +1 -0
  87. package/react/components.js +1 -0
  88. package/react/components.js.map +1 -1
  89. package/dist/cjs/ez-popover-core_2.cjs.entry.js +0 -1504
  90. package/dist/esm/ez-popover-core_2.entry.js +0 -1499
  91. package/dist/ezui/p-0faf71c5.entry.js +0 -1
  92. package/dist/ezui/p-2bb2a0c4.entry.js +0 -1
  93. package/dist/ezui/p-3429080c.entry.js +0 -1
  94. package/dist/ezui/p-58783dcf.entry.js +0 -1
  95. package/dist/ezui/p-650e4b6d.entry.js +0 -1
  96. package/dist/ezui/p-65f471bc.entry.js +0 -1
  97. package/dist/ezui/p-7bd15498.entry.js +0 -1
  98. package/dist/ezui/p-990b4318.entry.js +0 -1
  99. package/dist/ezui/p-b26f6c5b.entry.js +0 -1
  100. package/dist/ezui/p-d9548bdf.entry.js +0 -1
@@ -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 ezChipCss = ":host{--ez-label-chip--height:30px;--ez-label-chip__label--font-size:var(--text--medium, 14px);--ez-label-chip__label--font-family:var(--font-pattern, Arial);--ez-label-chip__label--font-weight:var(--text-weight--medium, 400);--ez-label-chip__label--space--medium:var(--space--medium, 12px);--ez-label-chip__label--title--primary:var(--title--primary, #2B3A54);--ez-label-chip__label--text--primary:var(--text--primary, #626e82);--ez-label-chip__label__container--border-radius:var(--border--radius-large, 24px);--ez-label-chip__label__container--border:1px solid;--ez-label-chip__label__container--border-color-strokes:var(--color--strokes, #DCE0E8);--ez-label-chip__label__container--color-primary:var(--color--primary, #008561);--ez-label-chip__label__container-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ez-label-chip__label__container--background-color:var(--color--primary-300);--ez-label-chip__label__container--border-color:#0085610F;--ez-label-chip__label__container--default--border-color--active:var(--color--primary, #007a5a);--ez-label-chip__label__container--default--background-color--hover:var(--color--primary-300, #f2faf8);--ez-label-chip__label__container--default--color--hover:var(--color--primary, #f2faf8);--ez-label-chip__label__container--text--disabled:var(--text--disable, #AFB6C0);--ez-label-chip__label__container--default--border-color--active:var(--color--primary)}.lbl{display:flex;white-space:nowrap;align-items:center;cursor:pointer;user-select:none;color:var(--ez-label-chip__label--title--primary);height:var(--ez-label-chip--height);font-family:var(--ez-label-chip__label--font-family);font-size:var(--ez-label-chip__label--font-size);font-weight:var(--ez-label-chip__label--font-weight)}.lbl--active{color:var(--ez-label-chip__label__container--default--color--hover)}.lbl--disabled{color:var(--ez-label-chip__label__container--text--disabled)}.label__container{cursor:pointer;width:max-content;display:flex;flex-wrap:wrap;align-items:center;background-color:#FFFFFF;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary);border:var(--ez-label-chip__label__container--border);border-radius:var(--ez-label-chip__label__container--border-radius);border-color:var(--ez-label-chip__label__container--border-color-strokes);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium);outline-color:var(--ez-label-chip__label__container--default--border-color--active)}.label__content{display:flex;align-items:center;flex-wrap:wrap;--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--disabled{cursor:default;border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__container--active{border-color:var(--ez-label-chip__label__container--default--background-color--hover);background-color:var(--ez-label-chip__label__container--default--background-color--hover);color:var(--ez-label-chip__label__container--default--color--hover);fill:var(--ez-label-chip__label__container--default--color--hover);--ez-icon--color:var(--ez-label-chip__label__container--default--color--hover)}.label__container:hover{border-color:var(--ez-label-chip__label__container--default--border-color--active)}.label__container:focus{outline:var(--border--medium) var(--ez-label-chip__label__container--default--border-color--active)}.label__container--disabled:hover{cursor:default;border:var(--ez-label-chip__label__container--border);border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__content__icon{display:flex;cursor:pointer;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--row-reverse{flex-direction:row-reverse}.label__container .btn-close{padding:0px 0px 0px 8px}.label__container--row-reverse .btn-close{padding:0px 8px 0px 0px}.cursor-disable{cursor:default}ez-icon{--ez-icon--color:inherit}";
8
+ const ezChipCss = ":host{--ez-label-chip--height:30px;--ez-label-chip__label--font-size:var(--text--medium, 14px);--ez-label-chip__label--font-family:var(--font-pattern, Arial);--ez-label-chip__label--font-weight:var(--text-weight--medium, 400);--ez-label-chip__label--space--medium:var(--space--medium, 12px);--ez-label-chip__label--title--primary:var(--title--primary, #2B3A54);--ez-label-chip__label--text--primary:var(--text--primary, #626e82);--ez-label-chip__label__container--border-radius:var(--border--radius-large, 24px);--ez-label-chip__label__container--border:1px solid;--ez-label-chip__label__container--border-color-strokes:var(--color--strokes, #DCE0E8);--ez-label-chip__label__container--color-primary:var(--color--primary, #008561);--ez-label-chip__label__container-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ez-label-chip__label__container--background-color:var(--color--primary-300);--ez-label-chip__label__container--border-color:#0085610F;--ez-label-chip__label__container--default--border-color--active:var(--color--primary, #007a5a);--ez-label-chip__label__container--default--background-color--hover:var(--color--primary-300, #f2faf8);--ez-label-chip__label__container--default--color--hover:var(--color--primary, #f2faf8);--ez-label-chip__label__container--text--disabled:var(--text--disable, #AFB6C0);--ez-label-chip__label__container--default--border-color--active:var(--color--primary);--ez-label-chip__label__container--default--margin-top:var(--space-extra-small, 3px)}.lbl{display:flex;white-space:nowrap;align-items:center;cursor:pointer;user-select:none;color:var(--ez-label-chip__label--title--primary);height:var(--ez-label-chip--height);font-family:var(--ez-label-chip__label--font-family);font-size:var(--ez-label-chip__label--font-size);font-weight:var(--ez-label-chip__label--font-weight)}.lbl--active{color:var(--ez-label-chip__label__container--default--color--hover)}.lbl--disabled{color:var(--ez-label-chip__label__container--text--disabled)}.label__container{cursor:pointer;width:max-content;display:flex;flex-wrap:wrap;align-items:center;background-color:#FFFFFF;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary);border:var(--ez-label-chip__label__container--border);border-radius:var(--ez-label-chip__label__container--border-radius);border-color:var(--ez-label-chip__label__container--border-color-strokes);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium);outline-color:var(--ez-label-chip__label__container--default--border-color--active);margin-top:var(--ez-label-chip__label__container--default--margin-top)}.label__content{display:flex;align-items:center;flex-wrap:wrap;--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--disabled{cursor:default;border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__container--active{border-color:var(--ez-label-chip__label__container--default--background-color--hover);background-color:var(--ez-label-chip__label__container--default--background-color--hover);color:var(--ez-label-chip__label__container--default--color--hover);fill:var(--ez-label-chip__label__container--default--color--hover);--ez-icon--color:var(--ez-label-chip__label__container--default--color--hover)}.label__container:hover{border-color:var(--ez-label-chip__label__container--default--border-color--active)}.label__container:focus{outline:none;box-shadow:0 0 0 2px var(--ez-label-chip__label__container--default--border-color--active)}.label__container--disabled:hover{cursor:default;border:var(--ez-label-chip__label__container--border);border-color:var(--ez-label-chip__label__container-color--disable-secondary);background-color:var(--ez-label-chip__label__container-color--disable-secondary);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);--ez-icon--color:var(--ez-label-chip__label__container--text--disabled)}.label__content__icon{display:flex;cursor:pointer;color:var(--ez-label-chip__label--text--primary);fill:var(--ez-label-chip__label--text--primary);--ez-icon--color:var(--ez-label-chip__label--text--primary)}.label__container--row-reverse{flex-direction:row-reverse}.label__container .btn-close{padding:0px 0px 0px 8px}.label__container--row-reverse .btn-close{padding:0px 8px 0px 0px}.cursor-disable{cursor:default}ez-icon{--ez-icon--color:inherit}";
9
9
 
10
10
  const EzChip = class {
11
11
  constructor(hostRef) {
@@ -97,22 +97,9 @@ const EzDateInput = class {
97
97
  this._changePending = false;
98
98
  }
99
99
  }
100
- showCalendar() {
101
- this.handleBlur();
102
- this._calendar.value = this.value;
103
- let top;
104
- if (this.isFixed()) {
105
- top = 29;
106
- this._calendar.fitHorizontal(0);
107
- }
108
- else {
109
- top = this.errorMessage || this.mode === "slim" ? 6 : -13;
110
- }
111
- this._calendar.fitVertical(top, this._elem.clientHeight);
112
- }
113
100
  hideCalendar() {
114
101
  this.changeValue(this._calendar.value);
115
- this._calendar.hide();
102
+ this._popover.hide();
116
103
  }
117
104
  handleBlur() {
118
105
  if (!this._changePending) {
@@ -173,8 +160,8 @@ const EzDateInput = class {
173
160
  this._textInput.value = textValue;
174
161
  }
175
162
  }
176
- isFixed() {
177
- return this._elem.dataset.isFixed === "true";
163
+ disconnectedCallback() {
164
+ this.hideCalendar();
178
165
  }
179
166
  componentDidLoad() {
180
167
  CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
@@ -187,7 +174,7 @@ const EzDateInput = class {
187
174
  }
188
175
  render() {
189
176
  core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
190
- return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), index.h("ez-calendar", { ref: elem => this._calendar = elem, "data-element-id": core.ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, "data-is-fixed": this._elem.dataset.isFixed })));
177
+ return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, canShowError: this.canShowError }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => { var _a; return (_a = this._popover) === null || _a === void 0 ? void 0 : _a.showUnder(this._textInput); }, slot: "leftIcon" })), index.h("ez-popover-plus", { ref: elem => this._popover = elem, anchorElement: this._textInput, autoClose: true, boxWidth: 'fit-content', overlayType: 'none' }, index.h("ez-calendar", { ref: elem => this._calendar = elem, "data-element-id": core.ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); } }))));
191
178
  }
192
179
  get _elem() { return index.getElement(this); }
193
180
  static get watchers() { return {
@@ -131,21 +131,9 @@ const EzDateTimeInput = class {
131
131
  this.value = newValueValidated;
132
132
  }
133
133
  }
134
- showCalendar() {
135
- let top;
136
- if (this.isFixed()) {
137
- top = 29;
138
- this._calendar.fitHorizontal(0);
139
- }
140
- else {
141
- top = this.errorMessage || this.mode === "slim" ? 6 : -13;
142
- }
143
- this._calendar.fitVertical(top, this._elem.clientHeight);
144
- this._calendar.style.visibility = 'inherit';
145
- }
146
134
  hideCalendar() {
147
135
  this.changeValue(this._calendar.value);
148
- this._calendar.hide();
136
+ this._popover.hide();
149
137
  }
150
138
  getParsedDateTime(strValue) {
151
139
  var _a, _b;
@@ -223,8 +211,8 @@ const EzDateTimeInput = class {
223
211
  this._textInput.value = textValue;
224
212
  }
225
213
  }
226
- isFixed() {
227
- return this._elem.dataset.isFixed === "true";
214
+ disconnectedCallback() {
215
+ this.hideCalendar();
228
216
  }
229
217
  componentDidLoad() {
230
218
  CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
@@ -237,7 +225,7 @@ const EzDateTimeInput = class {
237
225
  }
238
226
  render() {
239
227
  core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
240
- return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick(), canShowError: this.canShowError }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), index.h("ez-calendar", { ref: elem => this._calendar = elem, "data-element-id": core.ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, time: true, showSeconds: this.showSeconds, "data-is-fixed": this._elem.dataset.isFixed })));
228
+ return (index.h(index.Host, null, index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, "data-slave-mode": "true", label: this.label, restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onKeyDown: event => { this.handleKeyDown(event); }, onBlur: () => this.handleBlur(), onInput: (evt) => this.handleInput(evt), onFocus: () => this.handleFocus(), onClick: () => this.handleClick(), canShowError: this.canShowError }, index.h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => { var _a; return (_a = this._popover) === null || _a === void 0 ? void 0 : _a.showUnder(this._textInput); }, slot: "leftIcon" })), index.h("ez-popover-plus", { ref: elem => this._popover = elem, anchorElement: this._textInput, autoClose: true, boxWidth: 'fit-content', overlayType: 'none' }, index.h("ez-calendar", { ref: elem => this._calendar = elem, "data-element-id": core.ElementIDUtils.getInternalIDInfo("calendar"), onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, time: true, showSeconds: this.showSeconds }))));
241
229
  }
242
230
  get _elem() { return index.getElement(this); }
243
231
  static get watchers() { return {
@@ -80,7 +80,7 @@ function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecisio
80
80
  const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader, props }) => {
81
81
  var _a;
82
82
  return (index.h("div", { class: "ez-col ez-col--sd-12" },
83
- index.h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false })));
83
+ index.h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false })));
84
84
  };
85
85
 
86
86
  const buildTextArea = ({ name, label, readOnly, contextName, rows, canShowError }) => {
@@ -64768,6 +64768,7 @@ class AgGridController {
64768
64768
  this.RECORD_ARCHIVE_COL_ID = '__RECORD_ARCHIVE__';
64769
64769
  this.BLOCK_LOAD_DEBOUNCE = 100;
64770
64770
  this.DEFAULT_FONT_SIZE = 14;
64771
+ this.DEFAULT_FONT_SIZE_HTML5 = 32;
64771
64772
  this.DEFAULT_ICON_SIZE = 12;
64772
64773
  this.DEFAULT_MAX_SIZE = 200;
64773
64774
  this.DOC_WIDTH = 800;
@@ -65833,8 +65834,9 @@ class AgGridController {
65833
65834
  if (cfgColumn.customWidth != undefined) {
65834
65835
  return cfgColumn.customWidth;
65835
65836
  }
65836
- if (cfgColumn.width != undefined) {
65837
- return cfgColumn.width;
65837
+ if (cfgColumn.width != undefined && !isNaN(cfgColumn.width)) {
65838
+ // TODO: Valor somado devido a divergência do tamanho das fontes entre HTML5 e Design System.
65839
+ return parseInt(cfgColumn.width) + this.DEFAULT_FONT_SIZE_HTML5;
65838
65840
  }
65839
65841
  const field = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getField(cfgColumn.name);
65840
65842
  if ((field === null || field === void 0 ? void 0 : field.userInterface) === core.UserInterface.SEARCH) {
@@ -65895,82 +65897,51 @@ function getElementID(sufix) {
65895
65897
  };
65896
65898
  }
65897
65899
 
65898
- const COLUMN_FILTER_PATTERN = /FILTRO_COLUNA_(.+)/;
65899
65900
  class ColumnFilterManager {
65900
65901
  static getColumnFilters(filters, fieldName) {
65901
- const columnFilters = new Map();
65902
- if (filters == undefined || filters.length == 0) {
65903
- return columnFilters;
65904
- }
65905
- filters.forEach(filter => {
65906
- const result = COLUMN_FILTER_PATTERN.exec(filter.name);
65907
- if (result) {
65908
- if (fieldName !== result[1]) {
65909
- columnFilters.set(filter.name, Object.assign({ columnName: result[1] }, filter));
65910
- }
65911
- }
65912
- });
65913
- return columnFilters;
65902
+ return core.ColumnFilterManager.getColumnFilters(filters, fieldName);
65914
65903
  }
65915
65904
  static getFilterFunction(dataUnit, filters) {
65916
- if (filters != undefined && filters.length > 0) {
65917
- return record => {
65918
- for (const filter of filters) {
65919
- if (!ColumnFilterManager.recordMatchesFilter(dataUnit, record, filter)) {
65920
- return false;
65921
- }
65922
- }
65923
- return true;
65924
- };
65925
- }
65926
- return undefined;
65927
- }
65928
- static recordMatchesFilter(dataUnit, record, columnFilter) {
65929
- const fieldValue = record[columnFilter.columnName];
65930
- for (let param of columnFilter.params) {
65931
- const paramValue = dataUnit.valueFromString(columnFilter.columnName, param.value);
65932
- if (core.FieldComparator.compareValues(dataUnit.getField(columnFilter.columnName), fieldValue, paramValue) === 0) {
65933
- return true;
65934
- }
65935
- }
65936
- return false;
65905
+ return core.ColumnFilterManager.getFilterFunction(dataUnit, filters);
65937
65906
  }
65938
65907
  static compileDistinct(fieldName, dataUnit) {
65939
- const request = dataUnit.getLastLoadRequest();
65940
- let list = dataUnit.records;
65941
- if (request != undefined) {
65942
- const columnFilters = Array.from(ColumnFilterManager.getColumnFilters(request.filters, fieldName).values());
65943
- const filterFunciton = ColumnFilterManager.getFilterFunction(dataUnit, columnFilters);
65944
- if (filterFunciton != undefined) {
65945
- list = list.filter(filterFunciton);
65946
- }
65947
- }
65948
- const distinct = new Map(list.map(record => {
65949
- const fieldValue = record[fieldName];
65950
- if (fieldValue == undefined) {
65951
- return [null, { label: null, value: null, check: true }];
65952
- }
65953
- const item = { label: dataUnit.getFormattedValue(fieldName, fieldValue), value: fieldValue, check: true };
65954
- return [item.label, item];
65955
- }));
65956
- return Array.from(distinct.values());
65908
+ return core.ColumnFilterManager.compileDistinct(fieldName, dataUnit);
65909
+ }
65910
+ static compileDistinctFromArray(fieldName, dataUnit, records) {
65911
+ return core.ColumnFilterManager.compileDistinctFromArray(fieldName, dataUnit, records);
65957
65912
  }
65958
65913
  }
65959
65914
 
65960
65915
  class InMemoryFilterColumnDataSource {
65961
65916
  constructor(dataUnit) {
65962
- var _a;
65917
+ this.lastAppliedFilters = [];
65918
+ this.FILTER_COLUMN_TERM = 'FILTRO_COLUNA_';
65963
65919
  this.onDataUnitAction = (action) => {
65920
+ var _a, _b;
65964
65921
  if (action.type === core.Action.DATA_SAVED || action.type === core.Action.RECORDS_REMOVED) {
65965
65922
  this.originalRecords = this.dataUnit.records;
65923
+ return;
65966
65924
  }
65925
+ if (action.type !== core.Action.DATA_LOADED)
65926
+ return;
65927
+ const appliedFilters = this.getAppliedFilterNames((_b = (_a = action.payload) === null || _a === void 0 ? void 0 : _a.filters) !== null && _b !== void 0 ? _b : []);
65928
+ if (this.originalRecords && core.ObjectUtils.equals(appliedFilters, this.lastAppliedFilters))
65929
+ return;
65930
+ this.originalRecords = action.payload.records;
65931
+ this.lastAppliedFilters = appliedFilters;
65967
65932
  };
65968
65933
  this.dataUnit = dataUnit;
65969
- this.originalRecords = (_a = this.dataUnit.records) !== null && _a !== void 0 ? _a : [];
65934
+ if (this.dataUnit.records.length > 0) {
65935
+ this.originalRecords = this.dataUnit.records;
65936
+ }
65970
65937
  this.dataUnit.subscribe(this.onDataUnitAction);
65971
65938
  }
65939
+ getAppliedFilterNames(filters) {
65940
+ const appliedFilters = filters.map(filter => filter.name);
65941
+ return appliedFilters.filter(filterName => !filterName.includes(this.FILTER_COLUMN_TERM));
65942
+ }
65972
65943
  getStaticOptions(fieldName) {
65973
- return Promise.resolve(ColumnFilterManager.compileDistinct(fieldName, this.dataUnit));
65944
+ return Promise.resolve(ColumnFilterManager.compileDistinctFromArray(fieldName, this.dataUnit, this.originalRecords));
65974
65945
  }
65975
65946
  fetchData(filterTerm, fieldName) {
65976
65947
  return new Promise(resolve => {
@@ -66535,7 +66506,8 @@ const EzGrid = class {
66535
66506
  return `${total == undefined ? ` de ${count + 1} ou mais` : ` de ${total}`}`;
66536
66507
  }
66537
66508
  _hasToShowCancelPagination() {
66538
- const { total, count } = this._paginationInfo;
66509
+ var _a;
66510
+ const { total, count } = (_a = this._paginationInfo) !== null && _a !== void 0 ? _a : {};
66539
66511
  const hasMore = (total === undefined);
66540
66512
  return !this.dataUnit.cancelPagination && hasMore && count > this.dataUnit.pageSize;
66541
66513
  }
@@ -66606,8 +66578,10 @@ const EzGrid = class {
66606
66578
  }
66607
66579
  }
66608
66580
  getDataSource() {
66609
- var _a;
66610
- return (_a = this.columnfilterDataSource) !== null && _a !== void 0 ? _a : new InMemoryFilterColumnDataSource(this.dataUnit);
66581
+ if (!this.columnfilterDataSource) {
66582
+ this.columnfilterDataSource = new InMemoryFilterColumnDataSource(this.dataUnit);
66583
+ }
66584
+ return this.columnfilterDataSource;
66611
66585
  }
66612
66586
  hideHeader() {
66613
66587
  return !this._hasLeftButtons && !this._paginationInfo;
@@ -0,0 +1,200 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-a7b0c73d.js');
6
+ const core = require('@sankhyalabs/core');
7
+ const searchFormatters = require('./searchFormatters-b7e1ed1e.js');
8
+
9
+ const ezPopoverPlusCss = ":host{display:none}";
10
+
11
+ const EzPopoverPlus = class {
12
+ constructor(hostRef) {
13
+ index.registerInstance(this, hostRef);
14
+ this.ezVisibilityChange = index.createEvent(this, "ezVisibilityChange", 7);
15
+ this.autoClose = true;
16
+ this.boxWidth = "fit-content";
17
+ this.opened = false;
18
+ this.overlayType = "light";
19
+ this.anchorElement = undefined;
20
+ this.options = { horizontalGap: 0, verticalGap: 0, fromRight: false };
21
+ this.useAnchorSize = false;
22
+ this.minWidth = 150;
23
+ }
24
+ async observeOpened(newValue) {
25
+ if (newValue && !this._popOverCore) {
26
+ this.renderPopoverCore();
27
+ }
28
+ this._popOverCore.opened = newValue;
29
+ }
30
+ /**
31
+ * Atualiza a posição do popover.
32
+ */
33
+ async updatePosition(top, left) {
34
+ var _a;
35
+ await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.updatePosition(top, left));
36
+ }
37
+ /**
38
+ * Exibe o ez-popover.
39
+ */
40
+ async show(top, left) {
41
+ if (!this._popOverCore) {
42
+ this.renderPopoverCore();
43
+ }
44
+ await this._popOverCore.show(top, left);
45
+ }
46
+ /**
47
+ * Ancora a exibição do popOver a um elemento HTML.
48
+ */
49
+ async showUnder(element, options) {
50
+ if (!this._popOverCore) {
51
+ this.renderPopoverCore();
52
+ }
53
+ await this._popOverCore.showUnder(element, options);
54
+ }
55
+ /**
56
+ * Oculta o ez-popover.
57
+ */
58
+ async hide() {
59
+ var _a;
60
+ await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.hide());
61
+ }
62
+ /**
63
+ * Altera as opções.
64
+ */
65
+ async setOptions(options) {
66
+ var _a;
67
+ await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.setOptions(options));
68
+ }
69
+ /**
70
+ * Altera o elemento de ancoragem.
71
+ */
72
+ async setAnchorElement(anchor) {
73
+ var _a;
74
+ await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.setAnchorElement(anchor));
75
+ this.anchorElement = anchor;
76
+ }
77
+ renderPopoverCore() {
78
+ var _a;
79
+ this._popOverCore = document.createElement('ez-popover-core');
80
+ this._popOverCore.opened = this.opened;
81
+ this._popOverCore.anchorElement = this.anchorElement;
82
+ this._popOverCore.autoClose = this.autoClose;
83
+ this._popOverCore.boxWidth = this.boxWidth;
84
+ this._popOverCore.overlayType = this.overlayType;
85
+ this._popOverCore.options = this.options;
86
+ this._popOverCore.useAnchorSize = this.useAnchorSize;
87
+ this._popOverCore.minWidth = this.minWidth;
88
+ this._popOverCore.addEventListener('ezVisibilityChange', ({ detail }) => {
89
+ this.ezVisibilityChange.emit(detail);
90
+ this.opened = detail;
91
+ });
92
+ const firstChild = this._host.children.item(0);
93
+ if (firstChild) {
94
+ this._popOverCore.appendChild(firstChild);
95
+ }
96
+ else {
97
+ console.warn('O slot do popover está vazio. Adicione conteúdo ao slot para exibição correta.');
98
+ }
99
+ const root = document.body.querySelector("#root");
100
+ const firstDiv = document.body.getElementsByTagName("div").item(0);
101
+ const parentElement = (_a = root !== null && root !== void 0 ? root : firstDiv) !== null && _a !== void 0 ? _a : document.body;
102
+ parentElement.appendChild(this._popOverCore);
103
+ }
104
+ render() {
105
+ return (index.h(index.Host, null, index.h("slot", null)));
106
+ }
107
+ get _host() { return index.getElement(this); }
108
+ static get watchers() { return {
109
+ "opened": ["observeOpened"]
110
+ }; }
111
+ };
112
+ EzPopoverPlus.style = ezPopoverPlusCss;
113
+
114
+ const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
115
+
116
+ const MultiSelectionBoxMessage = class {
117
+ constructor(hostRef) {
118
+ index.registerInstance(this, hostRef);
119
+ this.message = undefined;
120
+ }
121
+ render() {
122
+ return (index.h("div", { class: "multi-selection__message" }, index.h("span", { class: "multi-selection__text-message" }, this.message)));
123
+ }
124
+ };
125
+ MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
126
+
127
+ const searchListCss = ":host{--ez-search__list-title--primary:var(--title--primary, #2B3A54);--ez-search__list-text--primary:var(--text--primary, #626e82);--ez-search__list-height:calc(var(--ez-search--font-size) + var(--ez-search--space--medium) + 4px);--ez-search__list-min-width:64px;--ez-search__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-search__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-search__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-search__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-search__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-search__scrollbar--width:var(--space--small, 6px);--ez-search--border-radius-small:var(--border--radius-small, 6px);--ez-search--font-size:var(--text--medium, 14px);--ez-search--font-family:var(--font-pattern, Arial);--ez-search--font-weight--large:var(--text-weight--large, 500);--ez-search--font-weight--medium:var(--text-weight--medium, 400);--ez-search--background-medium:var(--background--medium, #f0f3f7);--ez-search--line-height:calc(var(--text--medium, 14px) + 4px)}.list-options{position:relative;z-index:var(--more-visible, 2);margin:var(--space--small) 0px;padding:0px;padding-inline-start:0px;box-sizing:border-box;width:100%;height:100%;max-height:350px;min-width:150px;display:flex;flex-direction:column;scroll-behavior:smooth;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--ez-search__scrollbar--color-clicked) var(--ez-search__scrollbar--color-background)}.list-options::-webkit-scrollbar{background-color:var(--scrollbar--background);width:var(--space--small);max-width:var(--space--small);min-width:var(--space--small);height:var(--space--small);max-height:var(--space--small);min-height:var(--space--small)}.list-options::-webkit-scrollbar-track{background-color:var(--ez-search__scrollbar--color-background);border-radius:var(--ez-search__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb{background-color:var(--ez-search__scrollbar--color-default);border-radius:var(--ez-search__scrollbar--border-radius)}.list-options::-webkit-scrollbar-thumb:vertical:hover,.list-options::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-search__scrollbar--color-hover)}.list-options::-webkit-scrollbar-thumb:vertical:active,.list-options::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-search__scrollbar--color-clicked)}.message{text-align:center;display:flex;justify-content:center;align-items:center;list-style-type:none;margin:var(--space--medium) 0px;min-height:var(--ez-search__list-height)}.message__no-result{color:var(--ez-search__list-title--primary);font-family:var(--ez-search--font-family);font-size:var(--ez-search--font-size)}.message__loading{border-radius:50%;width:14px;height:14px;-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid var(--ez-search__list-title--primary);border-top:3px solid transparent}.item__value,.item__label{flex-basis:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ez-search__list-title--primary);font-family:var(--ez-search--font-family);font-size:var(--ez-search--font-size);line-height:var(--ez-search--line-height)}.item__label{font-weight:var(--ez-search--font-weight--medium)}.item__label--bold{font-weight:var(--ez-search--font-weight--large)}.item__value{text-align:center;color:var(--ez-search__list-text--primary);font-weight:var(--ez-search--font-weight--large)}.item__value--hidden{visibility:hidden;position:absolute;white-space:nowrap;z-index:-1;top:0;left:0}.item__label{text-align:left}.item__list>li:hover{background-color:var(--ez-search--background-medium)}.item{display:flex;align-items:center;width:100%;box-sizing:border-box;list-style-type:none;cursor:pointer;border-radius:var(--ez-search--border-radius-small);gap:var(--space--small, 6px)}.preselected{background-color:var(--background--medium)}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}@supports not (scrollbar-width: thin){.item{padding-right:8px}}";
128
+
129
+ const SearchList = class {
130
+ constructor(hostRef) {
131
+ index.registerInstance(this, hostRef);
132
+ this.changeValue = index.createEvent(this, "changeValue", 7);
133
+ this.changePreSelection = index.createEvent(this, "changePreSelection", 7);
134
+ this._startHighlightTag = "<span class='card-item__highlight'>";
135
+ this._endHighlightTag = "</span>";
136
+ this.showLoading = undefined;
137
+ this.visibleOptions = [];
138
+ this.textEmptyList = undefined;
139
+ this.canShowListOptions = undefined;
140
+ this.value = undefined;
141
+ this.showOptionValue = true;
142
+ this.preSelection = undefined;
143
+ }
144
+ async nextOption() {
145
+ const newPreSelection = this.preSelection === undefined ? 0 : Math.min(this.preSelection + 1, this.visibleOptions.length - 1);
146
+ this.changePreSelection.emit(newPreSelection);
147
+ this.scrollToOption(this.visibleOptions[newPreSelection]);
148
+ }
149
+ async previousOption() {
150
+ const newPreSelection = this.preSelection === undefined ? 0 : Math.max(this.preSelection - 1, 0);
151
+ this.changePreSelection.emit(newPreSelection);
152
+ this.scrollToOption(this.visibleOptions[newPreSelection]);
153
+ }
154
+ selectOption(newOption) {
155
+ const newOptionsReplaced = Object.assign(Object.assign({}, newOption), { value: searchFormatters.replaceHighlight(newOption === null || newOption === void 0 ? void 0 : newOption.value), label: searchFormatters.replaceHighlight(newOption === null || newOption === void 0 ? void 0 : newOption.label) });
156
+ const newOptionsFormatted = Object.assign(Object.assign({}, newOptionsReplaced), { value: searchFormatters.replaceQuotes(newOptionsReplaced === null || newOptionsReplaced === void 0 ? void 0 : newOptionsReplaced.value), label: searchFormatters.replaceQuotes(newOptionsReplaced === null || newOptionsReplaced === void 0 ? void 0 : newOptionsReplaced.label) });
157
+ this.changeValue.emit(newOptionsFormatted);
158
+ }
159
+ createOption(detail) {
160
+ let { key, title } = detail;
161
+ const startHighlight = new RegExp(this._startHighlightTag, 'g');
162
+ const endHighlight = new RegExp(this._endHighlightTag, 'g');
163
+ title = core.StringUtils.decodeHtmlEntities(title);
164
+ const option = {
165
+ value: key === null || key === void 0 ? void 0 : key.replace(startHighlight, '').replace(endHighlight, ''),
166
+ label: title === null || title === void 0 ? void 0 : title.replace(startHighlight, '').replace(endHighlight, '')
167
+ };
168
+ this.selectOption(option);
169
+ }
170
+ scrollToOption(opt) {
171
+ window.requestAnimationFrame(() => {
172
+ const liElem = (opt === null || opt === void 0 ? void 0 : opt.value)
173
+ ? this._optionsList.querySelector(`div#item_${opt.value.replace(/([ #;&,.+*~':"!^$[\]()=<>|/\\])/g, '\\$1')}`)
174
+ : undefined;
175
+ if (liElem) {
176
+ liElem.scrollIntoView({ behavior: "smooth", block: "nearest" });
177
+ }
178
+ });
179
+ }
180
+ buildItem(opt, index$1) {
181
+ opt.label = opt.label || opt.value;
182
+ const card = {
183
+ key: opt.value,
184
+ title: opt.label,
185
+ details: opt.details
186
+ };
187
+ return index.h("div", { style: { "height": "100%" }, class: index$1 === this.preSelection ? "item preselected" : "item", id: `item_${opt.value}`, onMouseDown: () => this.createOption(card), onMouseOver: () => this.changePreSelection.emit(index$1) }, index.h("ez-card-item", { item: card, compacted: true, enableKey: this.showOptionValue }));
188
+ }
189
+ render() {
190
+ return (index.h(index.Host, null, index.h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this.showLoading
191
+ && this.visibleOptions.length === 0
192
+ && index.h("div", { class: "message" }, index.h("span", { class: "message__no-result" }, this.textEmptyList)), this.showLoading
193
+ && index.h("div", { class: "message" }, index.h("div", { class: "message__loading" })), this.canShowListOptions && this.visibleOptions.map((opt, index) => this.buildItem(opt, index)))));
194
+ }
195
+ };
196
+ SearchList.style = searchListCss;
197
+
198
+ exports.ez_popover_plus = EzPopoverPlus;
199
+ exports.multi_selection_box_message = MultiSelectionBoxMessage;
200
+ exports.search_list = SearchList;
@@ -6,7 +6,7 @@ const index = require('./index-a7b0c73d.js');
6
6
  const core = require('@sankhyalabs/core');
7
7
  const EzScrollDirection = require('./EzScrollDirection-b2c99895.js');
8
8
 
9
- const ezScrollerCss = ":host{--ez-scroller--box-shadow-color:var(--background--body, #fafcff);--ez-scroller__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-scroller__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-scroller__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-scroller__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-scroller__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-scroller__scrollbar--width:var(--space--small, 6px);--ez-scroller__max-height:unset;display:flex;cursor:grab;width:100%;overflow:hidden}.dragging{cursor:grabbing}.ez-scroller__container{display:flex;overflow-y:hidden;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:transparent transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked),.ez-scroller__container:not(.ez-scroller__container--locked):hover{scrollbar-color:var(--ez-scroller__scrollbar--color-clicked) var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container--both{overflow-y:scroll;overflow-x:scroll;flex-wrap:wrap}.ez-scroller__container--horizontal{overflow-x:scroll;flex-direction:row}.ez-scroller__container--vertical{overflow-y:scroll;flex-direction:column;width:100%;max-height:var(--ez-scroller__max-height)}.ez-scroller__container::-webkit-scrollbar{background-color:transparent;width:var(--ez-scroller__scrollbar--width);height:var(--ez-scroller__scrollbar--width);max-width:var(--ez-scroller__scrollbar--width);min-width:var(--ez-scroller__scrollbar--width)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar{background-color:var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container::-webkit-scrollbar-track{visibility:hidden;background-color:transparent;border-radius:var(--ez-scroller__scrollbar--border-radius)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-track,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-track{background-color:var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container::-webkit-scrollbar-thumb{background-color:transparent;border-radius:var(--ez-scroller__scrollbar--border-radius)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb{background-color:var(--ez-scroller__scrollbar--color-default)}.ez-scroller__container::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container::-webkit-scrollbar-thumb:horizontal:hover{background-color:transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:horizontal:hover,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-scroller__scrollbar--color-hover)}.ez-scroller__container::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container::-webkit-scrollbar-thumb:horizontal:active{background-color:transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:horizontal:active,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-scroller__scrollbar--color-clicked)}.ez-scroller__wrapper{display:flex;position:relative;width:100%;height:auto}.ez-scroller__wrapper--horizontal{flex-direction:row}.ez-scroller__wrapper--vertical{flex-direction:column}.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--shadow-end::after{content:\"\";display:flex;position:absolute;z-index:1}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-end::after{width:24px;min-height:calc(100% - 10px)}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-start::before{left:0;background:linear-gradient(to right, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-end::after{right:0;background:linear-gradient(to left, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-end::after{min-width:calc(100% - 10px);height:24px}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-start::before{top:0;background:linear-gradient(to bottom, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-end::after{bottom:0;background:linear-gradient(to top, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}";
9
+ const ezScrollerCss = ":host{--ez-scroller--box-shadow-color:var(--background--body, #fafcff);--ez-scroller__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-scroller__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-scroller__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-scroller__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-scroller__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-scroller__scrollbar--width:var(--space--small, 6px);--ez-scroller__max-height:unset;--ez-scroller__scrollbar--padding-right:var(--space-extra-small, 3px);display:flex;cursor:grab;width:100%;overflow:hidden}.dragging{cursor:grabbing}.ez-scroller__container{display:flex;overflow-y:hidden;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:transparent transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked),.ez-scroller__container:not(.ez-scroller__container--locked):hover{scrollbar-color:var(--ez-scroller__scrollbar--color-clicked) var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container--both{overflow-y:scroll;overflow-x:scroll;flex-wrap:wrap}.ez-scroller__container--horizontal{overflow-x:scroll;flex-direction:row;padding-right:var(--ez-scroller__scrollbar--padding-right)}.ez-scroller__container--vertical{overflow-y:scroll;flex-direction:column;width:100%;max-height:var(--ez-scroller__max-height)}.ez-scroller__container::-webkit-scrollbar{background-color:transparent;width:var(--ez-scroller__scrollbar--width);height:var(--ez-scroller__scrollbar--width);max-width:var(--ez-scroller__scrollbar--width);min-width:var(--ez-scroller__scrollbar--width)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar{background-color:var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container::-webkit-scrollbar-track{visibility:hidden;background-color:transparent;border-radius:var(--ez-scroller__scrollbar--border-radius)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-track,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-track{background-color:var(--ez-scroller__scrollbar--color-background)}.ez-scroller__container::-webkit-scrollbar-thumb{background-color:transparent;border-radius:var(--ez-scroller__scrollbar--border-radius)}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb{background-color:var(--ez-scroller__scrollbar--color-default)}.ez-scroller__container::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container::-webkit-scrollbar-thumb:horizontal:hover{background-color:transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:horizontal:hover,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:vertical:hover,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-scroller__scrollbar--color-hover)}.ez-scroller__container::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container::-webkit-scrollbar-thumb:horizontal:active{background-color:transparent}.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container--both:not(.ez-scroller__container--locked)::-webkit-scrollbar-thumb:horizontal:active,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:vertical:active,.ez-scroller__container:not(.ez-scroller__container--locked):hover::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-scroller__scrollbar--color-clicked)}.ez-scroller__wrapper{display:flex;position:relative;width:100%;height:auto}.ez-scroller__wrapper--horizontal{flex-direction:row}.ez-scroller__wrapper--vertical{flex-direction:column}.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--shadow-end::after{content:\"\";display:flex;position:absolute;z-index:1}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-end::after{width:24px;min-height:calc(100% - 10px)}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-start::before{left:0;background:linear-gradient(to right, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--horizontal.ez-scroller__wrapper--shadow-end::after{right:0;background:linear-gradient(to left, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-start::before,.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-end::after{min-width:calc(100% - 10px);height:24px}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-start::before{top:0;background:linear-gradient(to bottom, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}.ez-scroller__wrapper--vertical.ez-scroller__wrapper--shadow-end::after{bottom:0;background:linear-gradient(to top, var(--ez-scroller--box-shadow-color) 20%, transparent 80%)}";
10
10
 
11
11
  const EzScroller = class {
12
12
  constructor(hostRef) {