@acorex/components 19.14.1 → 19.15.0-next.1

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 (19) hide show
  1. package/decorators/lib/components/clear-button/clear-button.component.d.ts +1 -1
  2. package/fesm2022/acorex-components-check-box.mjs +2 -2
  3. package/fesm2022/acorex-components-check-box.mjs.map +1 -1
  4. package/fesm2022/acorex-components-datetime-picker.mjs +2 -2
  5. package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
  6. package/fesm2022/acorex-components-decorators.mjs +2 -1
  7. package/fesm2022/acorex-components-decorators.mjs.map +1 -1
  8. package/fesm2022/acorex-components-grid-layout-builder.mjs +42 -4
  9. package/fesm2022/acorex-components-grid-layout-builder.mjs.map +1 -1
  10. package/fesm2022/acorex-components-select-box.mjs +9 -3
  11. package/fesm2022/acorex-components-select-box.mjs.map +1 -1
  12. package/fesm2022/acorex-components-tabs.mjs +2 -2
  13. package/fesm2022/acorex-components-tabs.mjs.map +1 -1
  14. package/fesm2022/acorex-components-time-duration.mjs +36 -6
  15. package/fesm2022/acorex-components-time-duration.mjs.map +1 -1
  16. package/grid-layout-builder/lib/grid-layout-container.component.d.ts +3 -2
  17. package/package.json +1 -1
  18. package/select-box/lib/select-box.component.d.ts +1 -0
  19. package/time-duration/lib/time-duration.component.d.ts +2 -0
package/fesm2022/acorex-components-grid-layout-builder.mjs CHANGED
@@ -204,33 +204,71 @@ class AXGridLayoutContainerComponent extends NXComponent {
204
204
  this.onRemoved = output();
205
205
  this.onWidgetChange = output();
206
206
  this.onChange = output();
207
- this.isLayoutRendered = output();
207
+ this.onRender = output();
208
208
  this.isEmpty = model(false);
209
209
  //#endregion
210
210
  //#region Private Properties
211
211
  this.elementRef = inject(ElementRef);
212
212
  this.ngZone = inject(NgZone);
213
213
  this.el = this.elementRef.nativeElement;
214
+ this.isInitialized = false;
214
215
  //#endregion
215
216
  //#region Initialization
216
217
  this.#init = afterNextRender(() => {
217
- window.g = this;
218
218
  this.ngZone.runOutsideAngular(async () => {
219
219
  const { GridStack } = await import('gridstack');
220
220
  const gridStackOptions = removeUndefinedKeys(convertAXGridLayoutOptionsToGridStackOptions(this.options() ?? {}));
221
221
  this.grid = GridStack.init(gridStackOptions, this.el);
222
222
  this.updateAll();
223
223
  this.hookEvents(this.grid);
224
- this.isLayoutRendered.emit(true);
224
+ this.onRender.emit();
225
+ this.isInitialized = true;
225
226
  });
226
227
  this._sub = this.gridstackItems?.changes.subscribe(() => {
227
228
  this.updateAll();
228
229
  });
229
230
  });
231
+ // Watch for options changes
232
+ this.#optionsEffect = effect(() => {
233
+ const newOptions = this.options();
234
+ if (this.isInitialized && this.grid && newOptions) {
235
+ untracked(() => {
236
+ this.ngZone.runOutsideAngular(() => {
237
+ const gridStackOptions = removeUndefinedKeys(convertAXGridLayoutOptionsToGridStackOptions(newOptions));
238
+ // Apply each option individually
239
+ if (gridStackOptions.column !== undefined) {
240
+ this.grid?.column(gridStackOptions.column);
241
+ }
242
+ if (gridStackOptions.cellHeight !== undefined) {
243
+ this.grid?.cellHeight(gridStackOptions.cellHeight);
244
+ }
245
+ if (gridStackOptions.margin !== undefined) {
246
+ this.grid?.margin(gridStackOptions.margin);
247
+ }
248
+ if (gridStackOptions.disableResize !== undefined) {
249
+ this.grid?.enableResize(!gridStackOptions.disableResize);
250
+ }
251
+ if (gridStackOptions.disableDrag !== undefined) {
252
+ this.grid?.enableMove(!gridStackOptions.disableDrag);
253
+ }
254
+ if (gridStackOptions.float !== undefined) {
255
+ this.grid?.float(gridStackOptions.float);
256
+ }
257
+ if (gridStackOptions.animate !== undefined) {
258
+ this.grid?.setAnimation(gridStackOptions.animate);
259
+ }
260
+ // Update the layout after options have been applied
261
+ this.updateAll();
262
+ });
263
+ });
264
+ }
265
+ });
230
266
  }
231
267
  //#endregion
232
268
  //#region Initialization
233
269
  #init;
270
+ // Watch for options changes
271
+ #optionsEffect;
234
272
  ngOnDestroy() {
235
273
  this.unhookEvents(this.grid);
236
274
  this._sub?.unsubscribe();
@@ -378,7 +416,7 @@ class AXGridLayoutContainerComponent extends NXComponent {
378
416
  return { x: value.x, y: value.y };
379
417
  }
380
418
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXGridLayoutContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
381
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: AXGridLayoutContainerComponent, isStandalone: true, selector: "ax-grid-layout-container", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, isEmpty: { classPropertyName: "isEmpty", publicName: "isEmpty", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onAdded: "onAdded", onRemoved: "onRemoved", onWidgetChange: "onWidgetChange", onChange: "onChange", isLayoutRendered: "isLayoutRendered", isEmpty: "isEmptyChange" }, queries: [{ propertyName: "gridstackItems", predicate: AXGridLayoutWidgetComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content> `, isInline: true, styles: [".grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:#0000001a;margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle,.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"%23666\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 20 20\"><path d=\"m10 3 2 2H8l2-2v14l-2-2h4l-2 2\"/></svg>');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:0}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:0;left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:0}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:0;right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,top;cursor:move}.grid-stack-item.ui-draggable-disabled{cursor:not-allowed}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px #0003;opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing,.grid-stack-animate .grid-stack-item.grid-stack-placeholder{transition:left 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y=\"0\"]{top:0}.grid-stack>.grid-stack-item[gs-x=\"0\"]{left:0%}.gs-12>.grid-stack-item{width:8.333%}.gs-12>.grid-stack-item[gs-x=\"1\"]{left:8.333%}.gs-12>.grid-stack-item[gs-w=\"2\"]{width:16.667%}.gs-12>.grid-stack-item[gs-x=\"2\"]{left:16.667%}.gs-12>.grid-stack-item[gs-w=\"3\"]{width:25%}.gs-12>.grid-stack-item[gs-x=\"3\"]{left:25%}.gs-12>.grid-stack-item[gs-w=\"4\"]{width:33.333%}.gs-12>.grid-stack-item[gs-x=\"4\"]{left:33.333%}.gs-12>.grid-stack-item[gs-w=\"5\"]{width:41.667%}.gs-12>.grid-stack-item[gs-x=\"5\"]{left:41.667%}.gs-12>.grid-stack-item[gs-w=\"6\"]{width:50%}.gs-12>.grid-stack-item[gs-x=\"6\"]{left:50%}.gs-12>.grid-stack-item[gs-w=\"7\"]{width:58.333%}.gs-12>.grid-stack-item[gs-x=\"7\"]{left:58.333%}.gs-12>.grid-stack-item[gs-w=\"8\"]{width:66.667%}.gs-12>.grid-stack-item[gs-x=\"8\"]{left:66.667%}.gs-12>.grid-stack-item[gs-w=\"9\"]{width:75%}.gs-12>.grid-stack-item[gs-x=\"9\"]{left:75%}.gs-12>.grid-stack-item[gs-w=\"10\"]{width:83.333%}.gs-12>.grid-stack-item[gs-x=\"10\"]{left:83.333%}.gs-12>.grid-stack-item[gs-w=\"11\"]{width:91.667%}.gs-12>.grid-stack-item[gs-x=\"11\"]{left:91.667%}.gs-12>.grid-stack-item[gs-w=\"12\"]{width:100%}.gs-1>.grid-stack-item{width:100%}.gs-2>.grid-stack-item{width:50%}.gs-2>.grid-stack-item[gs-x=\"1\"]{left:50%}.gs-2>.grid-stack-item[gs-w=\"2\"]{width:100%}.gs-3>.grid-stack-item{width:33.333%}.gs-3>.grid-stack-item[gs-x=\"1\"]{left:33.333%}.gs-3>.grid-stack-item[gs-w=\"2\"]{width:66.667%}.gs-3>.grid-stack-item[gs-x=\"2\"]{left:66.667%}.gs-3>.grid-stack-item[gs-w=\"3\"]{width:100%}.gs-4>.grid-stack-item{width:25%}.gs-4>.grid-stack-item[gs-x=\"1\"]{left:25%}.gs-4>.grid-stack-item[gs-w=\"2\"]{width:50%}.gs-4>.grid-stack-item[gs-x=\"2\"]{left:50%}.gs-4>.grid-stack-item[gs-w=\"3\"]{width:75%}.gs-4>.grid-stack-item[gs-x=\"3\"]{left:75%}.gs-4>.grid-stack-item[gs-w=\"4\"]{width:100%}.gs-5>.grid-stack-item{width:20%}.gs-5>.grid-stack-item[gs-x=\"1\"]{left:20%}.gs-5>.grid-stack-item[gs-w=\"2\"]{width:40%}.gs-5>.grid-stack-item[gs-x=\"2\"]{left:40%}.gs-5>.grid-stack-item[gs-w=\"3\"]{width:60%}.gs-5>.grid-stack-item[gs-x=\"3\"]{left:60%}.gs-5>.grid-stack-item[gs-w=\"4\"]{width:80%}.gs-5>.grid-stack-item[gs-x=\"4\"]{left:80%}.gs-5>.grid-stack-item[gs-w=\"5\"]{width:100%}.gs-6>.grid-stack-item{width:16.667%}.gs-6>.grid-stack-item[gs-x=\"1\"]{left:16.667%}.gs-6>.grid-stack-item[gs-w=\"2\"]{width:33.333%}.gs-6>.grid-stack-item[gs-x=\"2\"]{left:33.333%}.gs-6>.grid-stack-item[gs-w=\"3\"]{width:50%}.gs-6>.grid-stack-item[gs-x=\"3\"]{left:50%}.gs-6>.grid-stack-item[gs-w=\"4\"]{width:66.667%}.gs-6>.grid-stack-item[gs-x=\"4\"]{left:66.667%}.gs-6>.grid-stack-item[gs-w=\"5\"]{width:83.333%}.gs-6>.grid-stack-item[gs-x=\"5\"]{left:83.333%}.gs-6>.grid-stack-item[gs-w=\"6\"]{width:100%}.gs-7>.grid-stack-item{width:14.286%}.gs-7>.grid-stack-item[gs-x=\"1\"]{left:14.286%}.gs-7>.grid-stack-item[gs-w=\"2\"]{width:28.571%}.gs-7>.grid-stack-item[gs-x=\"2\"]{left:28.571%}.gs-7>.grid-stack-item[gs-w=\"3\"]{width:42.857%}.gs-7>.grid-stack-item[gs-x=\"3\"]{left:42.857%}.gs-7>.grid-stack-item[gs-w=\"4\"]{width:57.143%}.gs-7>.grid-stack-item[gs-x=\"4\"]{left:57.143%}.gs-7>.grid-stack-item[gs-w=\"5\"]{width:71.429%}.gs-7>.grid-stack-item[gs-x=\"5\"]{left:71.429%}.gs-7>.grid-stack-item[gs-w=\"6\"]{width:85.714%}.gs-7>.grid-stack-item[gs-x=\"6\"]{left:85.714%}.gs-7>.grid-stack-item[gs-w=\"7\"]{width:100%}.gs-8>.grid-stack-item{width:12.5%}.gs-8>.grid-stack-item[gs-x=\"1\"]{left:12.5%}.gs-8>.grid-stack-item[gs-w=\"2\"]{width:25%}.gs-8>.grid-stack-item[gs-x=\"2\"]{left:25%}.gs-8>.grid-stack-item[gs-w=\"3\"]{width:37.5%}.gs-8>.grid-stack-item[gs-x=\"3\"]{left:37.5%}.gs-8>.grid-stack-item[gs-w=\"4\"]{width:50%}.gs-8>.grid-stack-item[gs-x=\"4\"]{left:50%}.gs-8>.grid-stack-item[gs-w=\"5\"]{width:62.5%}.gs-8>.grid-stack-item[gs-x=\"5\"]{left:62.5%}.gs-8>.grid-stack-item[gs-w=\"6\"]{width:75%}.gs-8>.grid-stack-item[gs-x=\"6\"]{left:75%}.gs-8>.grid-stack-item[gs-w=\"7\"]{width:87.5%}.gs-8>.grid-stack-item[gs-x=\"7\"]{left:87.5%}.gs-8>.grid-stack-item[gs-w=\"8\"]{width:100%}.gs-9>.grid-stack-item{width:11.111%}.gs-9>.grid-stack-item[gs-x=\"1\"]{left:11.111%}.gs-9>.grid-stack-item[gs-w=\"2\"]{width:22.222%}.gs-9>.grid-stack-item[gs-x=\"2\"]{left:22.222%}.gs-9>.grid-stack-item[gs-w=\"3\"]{width:33.333%}.gs-9>.grid-stack-item[gs-x=\"3\"]{left:33.333%}.gs-9>.grid-stack-item[gs-w=\"4\"]{width:44.444%}.gs-9>.grid-stack-item[gs-x=\"4\"]{left:44.444%}.gs-9>.grid-stack-item[gs-w=\"5\"]{width:55.556%}.gs-9>.grid-stack-item[gs-x=\"5\"]{left:55.556%}.gs-9>.grid-stack-item[gs-w=\"6\"]{width:66.667%}.gs-9>.grid-stack-item[gs-x=\"6\"]{left:66.667%}.gs-9>.grid-stack-item[gs-w=\"7\"]{width:77.778%}.gs-9>.grid-stack-item[gs-x=\"7\"]{left:77.778%}.gs-9>.grid-stack-item[gs-w=\"8\"]{width:88.889%}.gs-9>.grid-stack-item[gs-x=\"8\"]{left:88.889%}.gs-9>.grid-stack-item[gs-w=\"9\"]{width:100%}.gs-10>.grid-stack-item{width:10%}.gs-10>.grid-stack-item[gs-x=\"1\"]{left:10%}.gs-10>.grid-stack-item[gs-w=\"2\"]{width:20%}.gs-10>.grid-stack-item[gs-x=\"2\"]{left:20%}.gs-10>.grid-stack-item[gs-w=\"3\"]{width:30%}.gs-10>.grid-stack-item[gs-x=\"3\"]{left:30%}.gs-10>.grid-stack-item[gs-w=\"4\"]{width:40%}.gs-10>.grid-stack-item[gs-x=\"4\"]{left:40%}.gs-10>.grid-stack-item[gs-w=\"5\"]{width:50%}.gs-10>.grid-stack-item[gs-x=\"5\"]{left:50%}.gs-10>.grid-stack-item[gs-w=\"6\"]{width:60%}.gs-10>.grid-stack-item[gs-x=\"6\"]{left:60%}.gs-10>.grid-stack-item[gs-w=\"7\"]{width:70%}.gs-10>.grid-stack-item[gs-x=\"7\"]{left:70%}.gs-10>.grid-stack-item[gs-w=\"8\"]{width:80%}.gs-10>.grid-stack-item[gs-x=\"8\"]{left:80%}.gs-10>.grid-stack-item[gs-w=\"9\"]{width:90%}.gs-10>.grid-stack-item[gs-x=\"9\"]{left:90%}.gs-10>.grid-stack-item[gs-w=\"10\"]{width:100%}.gs-11>.grid-stack-item{width:9.091%}.gs-11>.grid-stack-item[gs-x=\"1\"]{left:9.091%}.gs-11>.grid-stack-item[gs-w=\"2\"]{width:18.182%}.gs-11>.grid-stack-item[gs-x=\"2\"]{left:18.182%}.gs-11>.grid-stack-item[gs-w=\"3\"]{width:27.273%}.gs-11>.grid-stack-item[gs-x=\"3\"]{left:27.273%}.gs-11>.grid-stack-item[gs-w=\"4\"]{width:36.364%}.gs-11>.grid-stack-item[gs-x=\"4\"]{left:36.364%}.gs-11>.grid-stack-item[gs-w=\"5\"]{width:45.455%}.gs-11>.grid-stack-item[gs-x=\"5\"]{left:45.455%}.gs-11>.grid-stack-item[gs-w=\"6\"]{width:54.545%}.gs-11>.grid-stack-item[gs-x=\"6\"]{left:54.545%}.gs-11>.grid-stack-item[gs-w=\"7\"]{width:63.636%}.gs-11>.grid-stack-item[gs-x=\"7\"]{left:63.636%}.gs-11>.grid-stack-item[gs-w=\"8\"]{width:72.727%}.gs-11>.grid-stack-item[gs-x=\"8\"]{left:72.727%}.gs-11>.grid-stack-item[gs-w=\"9\"]{width:81.818%}.gs-11>.grid-stack-item[gs-x=\"9\"]{left:81.818%}.gs-11>.grid-stack-item[gs-w=\"10\"]{width:90.909%}.gs-11>.grid-stack-item[gs-x=\"10\"]{left:90.909%}.gs-11>.grid-stack-item[gs-w=\"11\"]{width:100%}ax-grid-layout-container{display:block;border-style:solid;border-width:var(--ax-comp-grid-layout-container-border-width, 0px);border-color:rgba(var(--ax-comp-grid-layout-container-border-color, var(--ax-sys-color-border-surface)));background-color:rgba(var(--ax-comp-grid-layout-container-bg-color, transparent))}ax-grid-layout-container .grid-stack-placeholder>.placeholder-content{background-color:rgba(var(--ax-comp-grid-layout-placeholder-bg-color, var(--ax-sys-color-surface)))}ax-grid-layout-widget{display:block}.grid-stack-item{cursor:pointer;border-radius:var(--ax-comp-grid-layout-stack-item-border-radius, 0)}.grid-stack-item-content{display:flex;align-items:center;justify-content:center;border-style:solid;border-radius:var(--ax-comp-grid-layout-stack-item-content-border-radius, var(--ax-sys-border-radius));border-width:var(--ax-comp-grid-layout-stack-item-content-border-width, 1px);border-color:rgba(var(--ax-comp-grid-layout-stack-item-content-border-color, var(--ax-sys-color-border-surface)));background-color:rgba(var(--ax-comp-grid-layout-stack-item-content-bg-color, var(--ax-sys-color-surface)));overflow:auto;-webkit-user-select:none;user-select:none;text-align:center}.grid-stack-item-removing{animation:var(--ax-comp-grid-layout-stack-item-removing-animation, fadeAndBlur .5s linear forwards)}@keyframes fadeAndBlur{0%{opacity:1;filter:blur(0)}to{opacity:.8;filter:blur(5px)}}.grid-stack-trash{cursor:grabbing;min-height:var(--ax-comp-grid-layout-stack-trash-min-height, 120px);background-repeat:no-repeat;background-position:center center;background-image:var(--ax-comp-grid-layout-stack-trash-bg-image, url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDQzOC41MjkgNDM4LjUyOSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDM4LjUyOSA0MzguNTI5OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPGc+CgkJPHBhdGggZD0iTTQxNy42ODksNzUuNjU0Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2OC02LjU2My0yLjU2OGgtODguMjI0TDMwMi45MTcsMjUuNDFjLTIuODU0LTcuMDQ0LTcuOTk0LTEzLjA0LTE1LjQxMy0xNy45ODkgICAgQzI4MC4wNzgsMi40NzMsMjcyLjU1NiwwLDI2NC45NDUsMGgtOTEuMzYzYy03LjYxMSwwLTE1LjEzMSwyLjQ3My0yMi41NTQsNy40MjFjLTcuNDI0LDQuOTQ5LTEyLjU2MywxMC45NDQtMTUuNDE5LDE3Ljk4OSAgICBsLTE5Ljk4NSw0Ny42NzZoLTg4LjIyYy0yLjY2NywwLTQuODUzLDAuODU5LTYuNTY3LDIuNTY4Yy0xLjcwOSwxLjcxMy0yLjU2OCwzLjkwMy0yLjU2OCw2LjU2N3YxOC4yNzQgICAgYzAsMi42NjQsMC44NTUsNC44NTQsMi41NjgsNi41NjRjMS43MTQsMS43MTIsMy45MDQsMi41NjgsNi41NjcsMi41NjhoMjcuNDA2djI3MS44YzAsMTUuODAzLDQuNDczLDI5LjI2NiwxMy40MTgsNDAuMzk4ICAgIGM4Ljk0NywxMS4xMzksMTkuNzAxLDE2LjcwMywzMi4yNjQsMTYuNzAzaDIzNy41NDJjMTIuNTY2LDAsMjMuMzE5LTUuNzU2LDMyLjI2NS0xNy4yNjhjOC45NDUtMTEuNTIsMTMuNDE1LTI1LjE3NCwxMy40MTUtNDAuOTcxICAgIFYxMDkuNjI3aDI3LjQxMWMyLjY2MiwwLDQuODUzLTAuODU2LDYuNTYzLTIuNTY4YzEuNzA4LTEuNzA5LDIuNTctMy45LDIuNTctNi41NjRWODIuMjIxICAgIEM0MjAuMjYsNzkuNTU3LDQxOS4zOTcsNzcuMzY3LDQxNy42ODksNzUuNjU0eiBNMTY5LjMwMSwzOS42NzhjMS4zMzEtMS43MTIsMi45NS0yLjc2Miw0Ljg1My0zLjE0aDkwLjUwNCAgICBjMS45MDMsMC4zODEsMy41MjUsMS40Myw0Ljg1NCwzLjE0bDEzLjcwOSwzMy40MDRIMTU1LjMxMUwxNjkuMzAxLDM5LjY3OHogTTM0Ny4xNzMsMzgwLjI5MWMwLDQuMTg2LTAuNjY0LDguMDQyLTEuOTk5LDExLjU2MSAgICBjLTEuMzM0LDMuNTE4LTIuNzE3LDYuMDg4LTQuMTQxLDcuNzA2Yy0xLjQzMSwxLjYyMi0yLjQyMywyLjQyNy0yLjk5OCwyLjQyN0gxMDAuNDkzYy0wLjU3MSwwLTEuNTY1LTAuODA1LTIuOTk2LTIuNDI3ICAgIGMtMS40MjktMS42MTgtMi44MS00LjE4OC00LjE0My03LjcwNmMtMS4zMzEtMy41MTktMS45OTctNy4zNzktMS45OTctMTEuNTYxVjEwOS42MjdoMjU1LjgxNVYzODAuMjkxeiIgZmlsbD0iI2ZmOWNhZSIvPgoJCTxwYXRoIGQ9Ik0xMzcuMDQsMzQ3LjE3MmgxOC4yNzFjMi42NjcsMCw0Ljg1OC0wLjg1NSw2LjU2Ny0yLjU2N2MxLjcwOS0xLjcxOCwyLjU2OC0zLjkwMSwyLjU2OC02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTktNC44NTMtMi41NjgtNi41NjdjLTEuNzE0LTEuNzA5LTMuODk5LTIuNTY1LTYuNTY3LTIuNTY1SDEzNy4wNGMtMi42NjcsMC00Ljg1NCwwLjg1NS02LjU2NywyLjU2NSAgICBjLTEuNzExLDEuNzE0LTIuNTY4LDMuOTA0LTIuNTY4LDYuNTY3djE2NC40NTRjMCwyLjY2OSwwLjg1NCw0Ljg1MywyLjU2OCw2LjU3QzEzMi4xODYsMzQ2LjMxNiwxMzQuMzczLDM0Ny4xNzIsMTM3LjA0LDM0Ny4xNzJ6IiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTIxMC4xMjksMzQ3LjE3MmgxOC4yNzFjMi42NjYsMCw0Ljg1Ni0wLjg1NSw2LjU2NC0yLjU2N2MxLjcxOC0xLjcxOCwyLjU2OS0zLjkwMSwyLjU2OS02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTItNC44NTMtMi41NjktNi41NjdjLTEuNzA4LTEuNzA5LTMuODk4LTIuNTY1LTYuNTY0LTIuNTY1aC0xOC4yNzFjLTIuNjY0LDAtNC44NTQsMC44NTUtNi41NjcsMi41NjUgICAgYy0xLjcxNCwxLjcxNC0yLjU2OCwzLjkwNC0yLjU2OCw2LjU2N3YxNjQuNDU0YzAsMi42NjksMC44NTQsNC44NTMsMi41NjgsNi41N0MyMDUuMjc0LDM0Ni4zMTYsMjA3LjQ2NSwzNDcuMTcyLDIxMC4xMjksMzQ3LjE3MnogICAgIiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTI4My4yMiwzNDcuMTcyaDE4LjI2OGMyLjY2OSwwLDQuODU5LTAuODU1LDYuNTctMi41NjdjMS43MTEtMS43MTgsMi41NjItMy45MDEsMi41NjItNi41N1YxNzMuNTgxICAgIGMwLTIuNjYzLTAuODUyLTQuODUzLTIuNTYyLTYuNTY3Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2NS02LjU3LTIuNTY1SDI4My4yMmMtMi42NywwLTQuODUzLDAuODU1LTYuNTcxLDIuNTY1ICAgIGMtMS43MTEsMS43MTQtMi41NjYsMy45MDQtMi41NjYsNi41Njd2MTY0LjQ1NGMwLDIuNjY5LDAuODU1LDQuODUzLDIuNTY2LDYuNTdDMjc4LjM2NywzNDYuMzE2LDI4MC41NSwzNDcuMTcyLDI4My4yMiwzNDcuMTcyeiIgZmlsbD0iI2ZmOWNhZSIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
419
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: AXGridLayoutContainerComponent, isStandalone: true, selector: "ax-grid-layout-container", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, isEmpty: { classPropertyName: "isEmpty", publicName: "isEmpty", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onAdded: "onAdded", onRemoved: "onRemoved", onWidgetChange: "onWidgetChange", onChange: "onChange", onRender: "onRender", isEmpty: "isEmptyChange" }, queries: [{ propertyName: "gridstackItems", predicate: AXGridLayoutWidgetComponent }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content> `, isInline: true, styles: [".grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:#0000001a;margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle,.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"%23666\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 20 20\"><path d=\"m10 3 2 2H8l2-2v14l-2-2h4l-2 2\"/></svg>');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:0}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:0;left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:0}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:0;right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,top;cursor:move}.grid-stack-item.ui-draggable-disabled{cursor:not-allowed}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px #0003;opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing,.grid-stack-animate .grid-stack-item.grid-stack-placeholder{transition:left 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y=\"0\"]{top:0}.grid-stack>.grid-stack-item[gs-x=\"0\"]{left:0%}.gs-12>.grid-stack-item{width:8.333%}.gs-12>.grid-stack-item[gs-x=\"1\"]{left:8.333%}.gs-12>.grid-stack-item[gs-w=\"2\"]{width:16.667%}.gs-12>.grid-stack-item[gs-x=\"2\"]{left:16.667%}.gs-12>.grid-stack-item[gs-w=\"3\"]{width:25%}.gs-12>.grid-stack-item[gs-x=\"3\"]{left:25%}.gs-12>.grid-stack-item[gs-w=\"4\"]{width:33.333%}.gs-12>.grid-stack-item[gs-x=\"4\"]{left:33.333%}.gs-12>.grid-stack-item[gs-w=\"5\"]{width:41.667%}.gs-12>.grid-stack-item[gs-x=\"5\"]{left:41.667%}.gs-12>.grid-stack-item[gs-w=\"6\"]{width:50%}.gs-12>.grid-stack-item[gs-x=\"6\"]{left:50%}.gs-12>.grid-stack-item[gs-w=\"7\"]{width:58.333%}.gs-12>.grid-stack-item[gs-x=\"7\"]{left:58.333%}.gs-12>.grid-stack-item[gs-w=\"8\"]{width:66.667%}.gs-12>.grid-stack-item[gs-x=\"8\"]{left:66.667%}.gs-12>.grid-stack-item[gs-w=\"9\"]{width:75%}.gs-12>.grid-stack-item[gs-x=\"9\"]{left:75%}.gs-12>.grid-stack-item[gs-w=\"10\"]{width:83.333%}.gs-12>.grid-stack-item[gs-x=\"10\"]{left:83.333%}.gs-12>.grid-stack-item[gs-w=\"11\"]{width:91.667%}.gs-12>.grid-stack-item[gs-x=\"11\"]{left:91.667%}.gs-12>.grid-stack-item[gs-w=\"12\"]{width:100%}.gs-1>.grid-stack-item{width:100%}.gs-2>.grid-stack-item{width:50%}.gs-2>.grid-stack-item[gs-x=\"1\"]{left:50%}.gs-2>.grid-stack-item[gs-w=\"2\"]{width:100%}.gs-3>.grid-stack-item{width:33.333%}.gs-3>.grid-stack-item[gs-x=\"1\"]{left:33.333%}.gs-3>.grid-stack-item[gs-w=\"2\"]{width:66.667%}.gs-3>.grid-stack-item[gs-x=\"2\"]{left:66.667%}.gs-3>.grid-stack-item[gs-w=\"3\"]{width:100%}.gs-4>.grid-stack-item{width:25%}.gs-4>.grid-stack-item[gs-x=\"1\"]{left:25%}.gs-4>.grid-stack-item[gs-w=\"2\"]{width:50%}.gs-4>.grid-stack-item[gs-x=\"2\"]{left:50%}.gs-4>.grid-stack-item[gs-w=\"3\"]{width:75%}.gs-4>.grid-stack-item[gs-x=\"3\"]{left:75%}.gs-4>.grid-stack-item[gs-w=\"4\"]{width:100%}.gs-5>.grid-stack-item{width:20%}.gs-5>.grid-stack-item[gs-x=\"1\"]{left:20%}.gs-5>.grid-stack-item[gs-w=\"2\"]{width:40%}.gs-5>.grid-stack-item[gs-x=\"2\"]{left:40%}.gs-5>.grid-stack-item[gs-w=\"3\"]{width:60%}.gs-5>.grid-stack-item[gs-x=\"3\"]{left:60%}.gs-5>.grid-stack-item[gs-w=\"4\"]{width:80%}.gs-5>.grid-stack-item[gs-x=\"4\"]{left:80%}.gs-5>.grid-stack-item[gs-w=\"5\"]{width:100%}.gs-6>.grid-stack-item{width:16.667%}.gs-6>.grid-stack-item[gs-x=\"1\"]{left:16.667%}.gs-6>.grid-stack-item[gs-w=\"2\"]{width:33.333%}.gs-6>.grid-stack-item[gs-x=\"2\"]{left:33.333%}.gs-6>.grid-stack-item[gs-w=\"3\"]{width:50%}.gs-6>.grid-stack-item[gs-x=\"3\"]{left:50%}.gs-6>.grid-stack-item[gs-w=\"4\"]{width:66.667%}.gs-6>.grid-stack-item[gs-x=\"4\"]{left:66.667%}.gs-6>.grid-stack-item[gs-w=\"5\"]{width:83.333%}.gs-6>.grid-stack-item[gs-x=\"5\"]{left:83.333%}.gs-6>.grid-stack-item[gs-w=\"6\"]{width:100%}.gs-7>.grid-stack-item{width:14.286%}.gs-7>.grid-stack-item[gs-x=\"1\"]{left:14.286%}.gs-7>.grid-stack-item[gs-w=\"2\"]{width:28.571%}.gs-7>.grid-stack-item[gs-x=\"2\"]{left:28.571%}.gs-7>.grid-stack-item[gs-w=\"3\"]{width:42.857%}.gs-7>.grid-stack-item[gs-x=\"3\"]{left:42.857%}.gs-7>.grid-stack-item[gs-w=\"4\"]{width:57.143%}.gs-7>.grid-stack-item[gs-x=\"4\"]{left:57.143%}.gs-7>.grid-stack-item[gs-w=\"5\"]{width:71.429%}.gs-7>.grid-stack-item[gs-x=\"5\"]{left:71.429%}.gs-7>.grid-stack-item[gs-w=\"6\"]{width:85.714%}.gs-7>.grid-stack-item[gs-x=\"6\"]{left:85.714%}.gs-7>.grid-stack-item[gs-w=\"7\"]{width:100%}.gs-8>.grid-stack-item{width:12.5%}.gs-8>.grid-stack-item[gs-x=\"1\"]{left:12.5%}.gs-8>.grid-stack-item[gs-w=\"2\"]{width:25%}.gs-8>.grid-stack-item[gs-x=\"2\"]{left:25%}.gs-8>.grid-stack-item[gs-w=\"3\"]{width:37.5%}.gs-8>.grid-stack-item[gs-x=\"3\"]{left:37.5%}.gs-8>.grid-stack-item[gs-w=\"4\"]{width:50%}.gs-8>.grid-stack-item[gs-x=\"4\"]{left:50%}.gs-8>.grid-stack-item[gs-w=\"5\"]{width:62.5%}.gs-8>.grid-stack-item[gs-x=\"5\"]{left:62.5%}.gs-8>.grid-stack-item[gs-w=\"6\"]{width:75%}.gs-8>.grid-stack-item[gs-x=\"6\"]{left:75%}.gs-8>.grid-stack-item[gs-w=\"7\"]{width:87.5%}.gs-8>.grid-stack-item[gs-x=\"7\"]{left:87.5%}.gs-8>.grid-stack-item[gs-w=\"8\"]{width:100%}.gs-9>.grid-stack-item{width:11.111%}.gs-9>.grid-stack-item[gs-x=\"1\"]{left:11.111%}.gs-9>.grid-stack-item[gs-w=\"2\"]{width:22.222%}.gs-9>.grid-stack-item[gs-x=\"2\"]{left:22.222%}.gs-9>.grid-stack-item[gs-w=\"3\"]{width:33.333%}.gs-9>.grid-stack-item[gs-x=\"3\"]{left:33.333%}.gs-9>.grid-stack-item[gs-w=\"4\"]{width:44.444%}.gs-9>.grid-stack-item[gs-x=\"4\"]{left:44.444%}.gs-9>.grid-stack-item[gs-w=\"5\"]{width:55.556%}.gs-9>.grid-stack-item[gs-x=\"5\"]{left:55.556%}.gs-9>.grid-stack-item[gs-w=\"6\"]{width:66.667%}.gs-9>.grid-stack-item[gs-x=\"6\"]{left:66.667%}.gs-9>.grid-stack-item[gs-w=\"7\"]{width:77.778%}.gs-9>.grid-stack-item[gs-x=\"7\"]{left:77.778%}.gs-9>.grid-stack-item[gs-w=\"8\"]{width:88.889%}.gs-9>.grid-stack-item[gs-x=\"8\"]{left:88.889%}.gs-9>.grid-stack-item[gs-w=\"9\"]{width:100%}.gs-10>.grid-stack-item{width:10%}.gs-10>.grid-stack-item[gs-x=\"1\"]{left:10%}.gs-10>.grid-stack-item[gs-w=\"2\"]{width:20%}.gs-10>.grid-stack-item[gs-x=\"2\"]{left:20%}.gs-10>.grid-stack-item[gs-w=\"3\"]{width:30%}.gs-10>.grid-stack-item[gs-x=\"3\"]{left:30%}.gs-10>.grid-stack-item[gs-w=\"4\"]{width:40%}.gs-10>.grid-stack-item[gs-x=\"4\"]{left:40%}.gs-10>.grid-stack-item[gs-w=\"5\"]{width:50%}.gs-10>.grid-stack-item[gs-x=\"5\"]{left:50%}.gs-10>.grid-stack-item[gs-w=\"6\"]{width:60%}.gs-10>.grid-stack-item[gs-x=\"6\"]{left:60%}.gs-10>.grid-stack-item[gs-w=\"7\"]{width:70%}.gs-10>.grid-stack-item[gs-x=\"7\"]{left:70%}.gs-10>.grid-stack-item[gs-w=\"8\"]{width:80%}.gs-10>.grid-stack-item[gs-x=\"8\"]{left:80%}.gs-10>.grid-stack-item[gs-w=\"9\"]{width:90%}.gs-10>.grid-stack-item[gs-x=\"9\"]{left:90%}.gs-10>.grid-stack-item[gs-w=\"10\"]{width:100%}.gs-11>.grid-stack-item{width:9.091%}.gs-11>.grid-stack-item[gs-x=\"1\"]{left:9.091%}.gs-11>.grid-stack-item[gs-w=\"2\"]{width:18.182%}.gs-11>.grid-stack-item[gs-x=\"2\"]{left:18.182%}.gs-11>.grid-stack-item[gs-w=\"3\"]{width:27.273%}.gs-11>.grid-stack-item[gs-x=\"3\"]{left:27.273%}.gs-11>.grid-stack-item[gs-w=\"4\"]{width:36.364%}.gs-11>.grid-stack-item[gs-x=\"4\"]{left:36.364%}.gs-11>.grid-stack-item[gs-w=\"5\"]{width:45.455%}.gs-11>.grid-stack-item[gs-x=\"5\"]{left:45.455%}.gs-11>.grid-stack-item[gs-w=\"6\"]{width:54.545%}.gs-11>.grid-stack-item[gs-x=\"6\"]{left:54.545%}.gs-11>.grid-stack-item[gs-w=\"7\"]{width:63.636%}.gs-11>.grid-stack-item[gs-x=\"7\"]{left:63.636%}.gs-11>.grid-stack-item[gs-w=\"8\"]{width:72.727%}.gs-11>.grid-stack-item[gs-x=\"8\"]{left:72.727%}.gs-11>.grid-stack-item[gs-w=\"9\"]{width:81.818%}.gs-11>.grid-stack-item[gs-x=\"9\"]{left:81.818%}.gs-11>.grid-stack-item[gs-w=\"10\"]{width:90.909%}.gs-11>.grid-stack-item[gs-x=\"10\"]{left:90.909%}.gs-11>.grid-stack-item[gs-w=\"11\"]{width:100%}ax-grid-layout-container{display:block;border-style:solid;border-width:var(--ax-comp-grid-layout-container-border-width, 0px);border-color:rgba(var(--ax-comp-grid-layout-container-border-color, var(--ax-sys-color-border-surface)));background-color:rgba(var(--ax-comp-grid-layout-container-bg-color, transparent))}ax-grid-layout-container .grid-stack-placeholder>.placeholder-content{background-color:rgba(var(--ax-comp-grid-layout-placeholder-bg-color, var(--ax-sys-color-surface)))}ax-grid-layout-widget{display:block}.grid-stack-item{cursor:pointer;border-radius:var(--ax-comp-grid-layout-stack-item-border-radius, 0)}.grid-stack-item-content{display:flex;align-items:center;justify-content:center;border-style:solid;border-radius:var(--ax-comp-grid-layout-stack-item-content-border-radius, var(--ax-sys-border-radius));border-width:var(--ax-comp-grid-layout-stack-item-content-border-width, 1px);border-color:rgba(var(--ax-comp-grid-layout-stack-item-content-border-color, var(--ax-sys-color-border-surface)));background-color:rgba(var(--ax-comp-grid-layout-stack-item-content-bg-color, var(--ax-sys-color-surface)));overflow:auto;-webkit-user-select:none;user-select:none;text-align:center}.grid-stack-item-removing{animation:var(--ax-comp-grid-layout-stack-item-removing-animation, fadeAndBlur .5s linear forwards)}@keyframes fadeAndBlur{0%{opacity:1;filter:blur(0)}to{opacity:.8;filter:blur(5px)}}.grid-stack-trash{cursor:grabbing;min-height:var(--ax-comp-grid-layout-stack-trash-min-height, 120px);background-repeat:no-repeat;background-position:center center;background-image:var(--ax-comp-grid-layout-stack-trash-bg-image, url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjY0cHgiIGhlaWdodD0iNjRweCIgdmlld0JveD0iMCAwIDQzOC41MjkgNDM4LjUyOSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDM4LjUyOSA0MzguNTI5OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPGc+CgkJPHBhdGggZD0iTTQxNy42ODksNzUuNjU0Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2OC02LjU2My0yLjU2OGgtODguMjI0TDMwMi45MTcsMjUuNDFjLTIuODU0LTcuMDQ0LTcuOTk0LTEzLjA0LTE1LjQxMy0xNy45ODkgICAgQzI4MC4wNzgsMi40NzMsMjcyLjU1NiwwLDI2NC45NDUsMGgtOTEuMzYzYy03LjYxMSwwLTE1LjEzMSwyLjQ3My0yMi41NTQsNy40MjFjLTcuNDI0LDQuOTQ5LTEyLjU2MywxMC45NDQtMTUuNDE5LDE3Ljk4OSAgICBsLTE5Ljk4NSw0Ny42NzZoLTg4LjIyYy0yLjY2NywwLTQuODUzLDAuODU5LTYuNTY3LDIuNTY4Yy0xLjcwOSwxLjcxMy0yLjU2OCwzLjkwMy0yLjU2OCw2LjU2N3YxOC4yNzQgICAgYzAsMi42NjQsMC44NTUsNC44NTQsMi41NjgsNi41NjRjMS43MTQsMS43MTIsMy45MDQsMi41NjgsNi41NjcsMi41NjhoMjcuNDA2djI3MS44YzAsMTUuODAzLDQuNDczLDI5LjI2NiwxMy40MTgsNDAuMzk4ICAgIGM4Ljk0NywxMS4xMzksMTkuNzAxLDE2LjcwMywzMi4yNjQsMTYuNzAzaDIzNy41NDJjMTIuNTY2LDAsMjMuMzE5LTUuNzU2LDMyLjI2NS0xNy4yNjhjOC45NDUtMTEuNTIsMTMuNDE1LTI1LjE3NCwxMy40MTUtNDAuOTcxICAgIFYxMDkuNjI3aDI3LjQxMWMyLjY2MiwwLDQuODUzLTAuODU2LDYuNTYzLTIuNTY4YzEuNzA4LTEuNzA5LDIuNTctMy45LDIuNTctNi41NjRWODIuMjIxICAgIEM0MjAuMjYsNzkuNTU3LDQxOS4zOTcsNzcuMzY3LDQxNy42ODksNzUuNjU0eiBNMTY5LjMwMSwzOS42NzhjMS4zMzEtMS43MTIsMi45NS0yLjc2Miw0Ljg1My0zLjE0aDkwLjUwNCAgICBjMS45MDMsMC4zODEsMy41MjUsMS40Myw0Ljg1NCwzLjE0bDEzLjcwOSwzMy40MDRIMTU1LjMxMUwxNjkuMzAxLDM5LjY3OHogTTM0Ny4xNzMsMzgwLjI5MWMwLDQuMTg2LTAuNjY0LDguMDQyLTEuOTk5LDExLjU2MSAgICBjLTEuMzM0LDMuNTE4LTIuNzE3LDYuMDg4LTQuMTQxLDcuNzA2Yy0xLjQzMSwxLjYyMi0yLjQyMywyLjQyNy0yLjk5OCwyLjQyN0gxMDAuNDkzYy0wLjU3MSwwLTEuNTY1LTAuODA1LTIuOTk2LTIuNDI3ICAgIGMtMS40MjktMS42MTgtMi44MS00LjE4OC00LjE0My03LjcwNmMtMS4zMzEtMy41MTktMS45OTctNy4zNzktMS45OTctMTEuNTYxVjEwOS42MjdoMjU1LjgxNVYzODAuMjkxeiIgZmlsbD0iI2ZmOWNhZSIvPgoJCTxwYXRoIGQ9Ik0xMzcuMDQsMzQ3LjE3MmgxOC4yNzFjMi42NjcsMCw0Ljg1OC0wLjg1NSw2LjU2Ny0yLjU2N2MxLjcwOS0xLjcxOCwyLjU2OC0zLjkwMSwyLjU2OC02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTktNC44NTMtMi41NjgtNi41NjdjLTEuNzE0LTEuNzA5LTMuODk5LTIuNTY1LTYuNTY3LTIuNTY1SDEzNy4wNGMtMi42NjcsMC00Ljg1NCwwLjg1NS02LjU2NywyLjU2NSAgICBjLTEuNzExLDEuNzE0LTIuNTY4LDMuOTA0LTIuNTY4LDYuNTY3djE2NC40NTRjMCwyLjY2OSwwLjg1NCw0Ljg1MywyLjU2OCw2LjU3QzEzMi4xODYsMzQ2LjMxNiwxMzQuMzczLDM0Ny4xNzIsMTM3LjA0LDM0Ny4xNzJ6IiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTIxMC4xMjksMzQ3LjE3MmgxOC4yNzFjMi42NjYsMCw0Ljg1Ni0wLjg1NSw2LjU2NC0yLjU2N2MxLjcxOC0xLjcxOCwyLjU2OS0zLjkwMSwyLjU2OS02LjU3VjE3My41ODEgICAgYzAtMi42NjMtMC44NTItNC44NTMtMi41NjktNi41NjdjLTEuNzA4LTEuNzA5LTMuODk4LTIuNTY1LTYuNTY0LTIuNTY1aC0xOC4yNzFjLTIuNjY0LDAtNC44NTQsMC44NTUtNi41NjcsMi41NjUgICAgYy0xLjcxNCwxLjcxNC0yLjU2OCwzLjkwNC0yLjU2OCw2LjU2N3YxNjQuNDU0YzAsMi42NjksMC44NTQsNC44NTMsMi41NjgsNi41N0MyMDUuMjc0LDM0Ni4zMTYsMjA3LjQ2NSwzNDcuMTcyLDIxMC4xMjksMzQ3LjE3MnogICAgIiBmaWxsPSIjZmY5Y2FlIi8+CgkJPHBhdGggZD0iTTI4My4yMiwzNDcuMTcyaDE4LjI2OGMyLjY2OSwwLDQuODU5LTAuODU1LDYuNTctMi41NjdjMS43MTEtMS43MTgsMi41NjItMy45MDEsMi41NjItNi41N1YxNzMuNTgxICAgIGMwLTIuNjYzLTAuODUyLTQuODUzLTIuNTYyLTYuNTY3Yy0xLjcxMS0xLjcwOS0zLjkwMS0yLjU2NS02LjU3LTIuNTY1SDI4My4yMmMtMi42NywwLTQuODUzLDAuODU1LTYuNTcxLDIuNTY1ICAgIGMtMS43MTEsMS43MTQtMi41NjYsMy45MDQtMi41NjYsNi41Njd2MTY0LjQ1NGMwLDIuNjY5LDAuODU1LDQuODUzLDIuNTY2LDYuNTdDMjc4LjM2NywzNDYuMzE2LDI4MC41NSwzNDcuMTcyLDI4My4yMiwzNDcuMTcyeiIgZmlsbD0iI2ZmOWNhZSIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
382
420
  }
383
421
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXGridLayoutContainerComponent, decorators: [{
384
422
  type: Component,
package/fesm2022/acorex-components-grid-layout-builder.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"acorex-components-grid-layout-builder.mjs","sources":["../../../../packages/components/grid-layout-builder/src/lib/utility.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-widget.component.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-container.component.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-builder.module.ts","../../../../packages/components/grid-layout-builder/src/acorex-components-grid-layout-builder.ts"],"sourcesContent":["import { AXGridLayoutNode, AXGridLayoutOptions, AXGridLayoutWidget } from './types';\n\n// Convert AXGridLayoutWidget to GridStackWidget\nexport function convertAXGridLayoutWidgetToGridStackWidget(\n widget: AXGridLayoutWidget,\n): import('gridstack').GridStackWidget {\n return {\n id: widget.id,\n x: widget.x,\n y: widget.y,\n w: widget.width,\n h: widget.height,\n maxW: widget.maxWidth,\n maxH: widget.maxHeight,\n minW: widget.minWidth,\n minH: widget.minHeight,\n noResize: widget.disableResize,\n noMove: widget.disableDrag,\n };\n}\n\n// Convert GridStackWidget to AXGridLayoutWidget\nexport function convertGridStackWidgetToAXGridLayoutWidget(\n widget: import('gridstack').GridStackWidget,\n): AXGridLayoutWidget {\n return {\n id: widget.id,\n x: widget.x,\n y: widget.y,\n width: widget.w,\n height: widget.h,\n maxWidth: widget.maxW,\n maxHeight: widget.maxH,\n minWidth: widget.minW,\n minHeight: widget.minH,\n disableResize: widget.noResize,\n disableDrag: widget.noMove,\n };\n}\n\n// Convert AXGridLayoutNode to GridStackNode\nexport function convertAXGridLayoutNodeToGridStackNode(node: AXGridLayoutNode): import('gridstack').GridStackNode {\n return {\n id: node.id,\n x: node.x,\n y: node.y,\n w: node.width,\n h: node.height,\n maxW: node.maxWidth,\n maxH: node.maxHeight,\n minW: node.minWidth,\n minH: node.minHeight,\n noResize: node.disableResize,\n noMove: node.disableDrag,\n el: node.element,\n };\n}\n\n// Convert GridStackNode to AXGridLayoutNode\nexport function convertGridStackNodeToAXGridLayoutNode(node: import('gridstack').GridStackNode): AXGridLayoutNode {\n return {\n id: node.id,\n x: node.x,\n y: node.y,\n width: node.w,\n height: node.h,\n maxWidth: node.maxW,\n maxHeight: node.maxH,\n minWidth: node.minW,\n minHeight: node.minH,\n disableResize: node.noResize,\n disableDrag: node.noMove,\n element: node.el,\n };\n}\n\n// Convert AXGridLayoutOptions to GridStackOptions\nexport function convertAXGridLayoutOptionsToGridStackOptions(\n options: AXGridLayoutOptions,\n): import('gridstack').GridStackOptions {\n return {\n column: options.column,\n disableDrag: options.disableDrag,\n disableResize: options.disableResize,\n margin: options.gap,\n cellHeight: options.cellHeight,\n rtl: options.rtl,\n maxRow: options.maxRow,\n minRow: options.minRow,\n row: options.row,\n removable: options.removableSelector || options.removable,\n acceptWidgets: options.acceptWidgets,\n float: options.float,\n handle: options.dragHandlerSelector,\n columnOpts: { breakpoints: options?.responsiveLayout?.map((i) => ({ c: i.column, w: i.width })) },\n };\n}\n\n// Convert GridStackOptions to AXGridLayoutOptions\nexport function convertGridStackOptionsToAXGridLayoutOptions(\n options: import('gridstack').GridStackOptions,\n): AXGridLayoutOptions {\n return {\n column: options.column,\n disableDrag: options.disableDrag,\n disableResize: options.disableResize,\n gap: options.margin,\n cellHeight: options.cellHeight,\n rtl: options.rtl,\n maxRow: options.maxRow,\n minRow: options.minRow,\n row: options.row,\n removableSelector: typeof options.removable === 'string' ? options.removable : undefined,\n removable: typeof options.removable === 'boolean' ? options.removable : undefined,\n acceptWidgets: options.acceptWidgets as boolean,\n float: options.float,\n dragHandlerSelector: options.handle,\n responsiveLayout: options?.columnOpts?.breakpoints?.map((i) => ({ width: i.w, column: i.c })),\n };\n}\n\n/** remove keys which are undefined */\nexport function removeUndefinedKeys(obj) {\n const newObj = { ...obj };\n for (const key in newObj) {\n if (newObj[key] === undefined) {\n delete newObj[key];\n }\n }\n return newObj;\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n effect,\n ElementRef,\n inject,\n input,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXGridLayoutNode, AXGridLayoutWidget, AXGridLayoutWidgetElement } from './types';\nimport {\n convertAXGridLayoutWidgetToGridStackWidget,\n convertGridStackNodeToAXGridLayoutNode,\n removeUndefinedKeys,\n} from './utility';\n\n@Component({\n selector: 'ax-grid-layout-widget',\n template: `<div class=\"grid-stack-item-content\"><ng-content></ng-content></div>`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXGridLayoutWidgetComponent {\n private readonly elementRef: ElementRef<AXGridLayoutWidgetElement> = inject(ElementRef);\n\n public options = input<AXGridLayoutNode>();\n\n #eff = effect(() => {\n const options = this.options();\n\n untracked(() => {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode as import('gridstack').GridStackNode;\n if (gridstackNode?.grid) {\n gridstackNode.grid.update(\n this.elementRef.nativeElement,\n removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(options)),\n );\n }\n });\n });\n\n /**\n * Locks or unlocks the widget (prevents dragging and resizing).\n * @param state - If `true`, the widget will be locked.\n */\n public setLockable(state: boolean): void {\n this.updateWidgetOptions({ disableResize: state, disableDrag: state });\n }\n\n /**\n * Enables or disables resizing of the widget.\n * @param state - If `true`, resizing will be enabled.\n */\n public setResizable(state: boolean): void {\n this.updateWidgetOptions({ disableResize: !state });\n }\n\n /**\n * Updates the widget options.\n * @param options - The new options for the widget.\n */\n public setOptions(options: AXGridLayoutWidget): void {\n this.updateWidgetOptions(options);\n }\n\n /**\n * Returns the current options of the widget.\n * @returns The current widget options.\n */\n public getOptions(): AXGridLayoutNode {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode;\n return gridstackNode\n ? removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(gridstackNode))\n : { ...this.options(), element: this.elementRef.nativeElement };\n }\n\n /**\n * Returns the native DOM element of the widget.\n * @returns The native element.\n */\n public get element(): AXGridLayoutWidgetElement {\n return this.elementRef.nativeElement;\n }\n\n /**\n * Updates the widget options and triggers a grid update.\n * @param options - The partial options to update.\n */\n private updateWidgetOptions(options: Partial<AXGridLayoutWidget>): void {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode as import('gridstack').GridStackNode;\n if (gridstackNode?.grid) {\n gridstackNode.grid.update(\n this.elementRef.nativeElement,\n removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(options)),\n );\n }\n }\n}\n","import { NXComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n ElementRef,\n NgZone,\n OnDestroy,\n QueryList,\n ViewEncapsulation,\n afterNextRender,\n inject,\n input,\n model,\n output,\n} from '@angular/core';\nimport { Subscription } from 'rxjs';\nimport { AXGridLayoutWidgetComponent } from './grid-layout-widget.component';\nimport {\n AXGridLayout,\n AXGridLayoutContainerElement,\n AXGridLayoutEvent,\n AXGridLayoutNode,\n AXGridLayoutOptions,\n AXGridLayoutPosition,\n AXGridLayoutWidget,\n AXGridLayoutWidgetElement,\n} from './types';\nimport {\n convertAXGridLayoutNodeToGridStackNode,\n convertAXGridLayoutOptionsToGridStackOptions,\n convertAXGridLayoutWidgetToGridStackWidget,\n convertGridStackNodeToAXGridLayoutNode,\n convertGridStackOptionsToAXGridLayoutOptions,\n removeUndefinedKeys,\n} from './utility';\n\n@Component({\n selector: 'ax-grid-layout-container',\n template: `<ng-content></ng-content> `,\n styleUrl: './grid-layout-container.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXGridLayoutContainerComponent extends NXComponent implements OnDestroy {\n //#region Inputs and Outputs\n public options = input<AXGridLayoutOptions>();\n\n protected onAdded = output<AXGridLayoutEvent>();\n protected onRemoved = output<AXGridLayoutEvent>();\n protected onWidgetChange = output<AXGridLayoutEvent>();\n protected onChange = output<AXGridLayoutEvent>();\n protected isLayoutRendered = output<boolean>();\n\n protected isEmpty = model(false);\n //#endregion\n\n //#region Private Properties\n private readonly elementRef: ElementRef<AXGridLayoutContainerElement> = inject(ElementRef);\n private readonly ngZone = inject(NgZone);\n\n @ContentChildren(AXGridLayoutWidgetComponent) public gridstackItems?: QueryList<AXGridLayoutWidgetComponent>;\n\n private el = this.elementRef.nativeElement;\n private grid?: AXGridLayout;\n protected _sub: Subscription | undefined;\n //#endregion\n\n //#region Initialization\n #init = afterNextRender(() => {\n (window as any).g = this;\n this.ngZone.runOutsideAngular(async () => {\n const { GridStack } = await import('gridstack');\n const gridStackOptions = removeUndefinedKeys(convertAXGridLayoutOptionsToGridStackOptions(this.options() ?? {}));\n this.grid = GridStack.init(gridStackOptions, this.el);\n this.updateAll();\n this.hookEvents(this.grid);\n this.isLayoutRendered.emit(true);\n });\n this._sub = this.gridstackItems?.changes.subscribe(() => {\n this.updateAll();\n });\n });\n\n public ngOnDestroy(): void {\n this.unhookEvents(this.grid);\n this._sub?.unsubscribe();\n this.destroy();\n }\n //#endregion\n\n //#region Internal Methods\n private updateAll() {\n if (!this.grid) return;\n\n const arrays = this.gridstackItems?.toArray() ?? [];\n\n // If there are no items, remove all widgets first\n if (arrays.length === 0) {\n this.grid.removeAll(true);\n this.checkEmpty();\n return;\n }\n\n const layout: AXGridLayoutNode[] = [];\n arrays.forEach((item) => {\n const widgetOptions = item.getOptions();\n if (widgetOptions) {\n layout.push(removeUndefinedKeys(convertAXGridLayoutNodeToGridStackNode(widgetOptions)));\n }\n });\n\n // Clear existing widgets before loading new ones\n this.grid.removeAll(false);\n this.grid.load(layout);\n this.checkEmpty();\n }\n\n private checkEmpty() {\n if (this.grid) {\n const isEmpty = !this.getChildren().length;\n if (isEmpty === this.isEmpty()) return;\n this.isEmpty.set(isEmpty);\n }\n }\n\n private hookEvents(grid?: AXGridLayout): void {\n if (grid) {\n grid\n .on('added', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.checkEmpty();\n this.onAdded.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n })\n .on('removed', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.checkEmpty();\n this.onRemoved.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n })\n .on('change', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.onWidgetChange.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n });\n }\n }\n\n private unhookEvents(grid?: AXGridLayout) {\n if (grid) grid.offAll();\n }\n\n private _dispatchChangeEvent() {\n if (this.getChildren().length) {\n this.onChange.emit({\n sender: this,\n nodes: this.getChildren(),\n });\n }\n }\n //#endregion\n\n //#region Public Methods\n public addWidget(w: AXGridLayoutWidget, withAutoArrange = false): AXGridLayoutWidgetElement | undefined {\n if (withAutoArrange) this.compact();\n\n const gridStackWidget = removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(w));\n const node = this.grid?.addWidget(gridStackWidget)?.gridstackNode;\n if (!node) return undefined;\n\n const widgetElement: AXGridLayoutWidgetElement = node.el as AXGridLayoutWidgetElement;\n widgetElement.gridstackNode = removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node));\n\n return widgetElement;\n }\n\n public compact(layout: 'list' | 'compact' = 'compact', doSort = true): void {\n this.grid?.compact(layout, doSort);\n }\n\n public setCellHeight(val: number, update = true): void {\n this.grid?.cellHeight(val, update);\n }\n\n public setColumn(\n column: number,\n layout: 'list' | 'compact' | 'moveScale' | 'move' | 'scale' | 'none' = 'moveScale',\n ): void {\n this.grid?.column(column, layout);\n }\n\n public destroy(removeDOM = true): void {\n this.grid?.destroy(removeDOM);\n }\n\n public setMovable(state: boolean, recurse?: boolean) {\n this.grid?.enableMove(state, recurse);\n }\n\n public setResizable(state: boolean, recurse?: boolean) {\n this.grid?.enableResize(state, recurse);\n }\n\n public setFloat(val: boolean): void {\n this.grid?.float(val);\n }\n\n public setMargin(value: number | string): void {\n this.grid?.margin(value);\n }\n\n public removeWidget(el: AXGridLayoutWidgetElement, removeDOM = true, triggerEvent = true): void {\n this.grid?.removeWidget(el, removeDOM, triggerEvent);\n }\n\n public removeAll(removeDOM = true): void {\n this.grid?.removeAll(removeDOM);\n }\n\n public setAnimation(doAnimate: boolean): void {\n this.grid?.setAnimation(doAnimate);\n }\n\n public async setupDraggable(dragIn?: string | HTMLElement[], widgets?: AXGridLayoutWidget) {\n if (typeof dragIn === 'string') {\n document.querySelectorAll(dragIn).forEach((item) => {\n if (!item.classList.contains('grid-stack-item')) {\n item.classList.add('grid-stack-item');\n }\n });\n }\n const { GridStack } = await import('gridstack');\n const gridStackWidgets = widgets\n ? [removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(widgets))]\n : undefined;\n GridStack.setupDragIn(dragIn, undefined, gridStackWidgets);\n }\n\n public getOptions(): AXGridLayoutOptions {\n const opts = this.grid?.opts;\n if (!opts) return {};\n\n return removeUndefinedKeys(convertGridStackOptionsToAXGridLayoutOptions(opts));\n }\n\n public getChildren(): AXGridLayoutNode[] {\n const children = this.grid?.engine.nodes ?? [];\n return children.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n }\n public findEmptySpace(\n input: Required<Pick<AXGridLayoutPosition, 'height' | 'width'>>,\n ): Pick<AXGridLayoutPosition, 'x' | 'y'> {\n const value = { h: input.height, w: input.height } as any;\n this.grid?.engine.findEmptyPosition(value);\n return { x: value.x, y: value.y };\n }\n //#endregion\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { AXGridLayoutContainerComponent } from './grid-layout-container.component';\nimport { AXGridLayoutWidgetComponent } from './grid-layout-widget.component';\n\n@NgModule({\n imports: [CommonModule, AXGridLayoutContainerComponent, AXGridLayoutWidgetComponent],\n exports: [AXGridLayoutContainerComponent, AXGridLayoutWidgetComponent],\n})\nexport class AXGridLayoutBuilderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"acorex-components-grid-layout-builder.mjs","sources":["../../../../packages/components/grid-layout-builder/src/lib/utility.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-widget.component.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-container.component.ts","../../../../packages/components/grid-layout-builder/src/lib/grid-layout-builder.module.ts","../../../../packages/components/grid-layout-builder/src/acorex-components-grid-layout-builder.ts"],"sourcesContent":["import { AXGridLayoutNode, AXGridLayoutOptions, AXGridLayoutWidget } from './types';\n\n// Convert AXGridLayoutWidget to GridStackWidget\nexport function convertAXGridLayoutWidgetToGridStackWidget(\n widget: AXGridLayoutWidget,\n): import('gridstack').GridStackWidget {\n return {\n id: widget.id,\n x: widget.x,\n y: widget.y,\n w: widget.width,\n h: widget.height,\n maxW: widget.maxWidth,\n maxH: widget.maxHeight,\n minW: widget.minWidth,\n minH: widget.minHeight,\n noResize: widget.disableResize,\n noMove: widget.disableDrag,\n };\n}\n\n// Convert GridStackWidget to AXGridLayoutWidget\nexport function convertGridStackWidgetToAXGridLayoutWidget(\n widget: import('gridstack').GridStackWidget,\n): AXGridLayoutWidget {\n return {\n id: widget.id,\n x: widget.x,\n y: widget.y,\n width: widget.w,\n height: widget.h,\n maxWidth: widget.maxW,\n maxHeight: widget.maxH,\n minWidth: widget.minW,\n minHeight: widget.minH,\n disableResize: widget.noResize,\n disableDrag: widget.noMove,\n };\n}\n\n// Convert AXGridLayoutNode to GridStackNode\nexport function convertAXGridLayoutNodeToGridStackNode(node: AXGridLayoutNode): import('gridstack').GridStackNode {\n return {\n id: node.id,\n x: node.x,\n y: node.y,\n w: node.width,\n h: node.height,\n maxW: node.maxWidth,\n maxH: node.maxHeight,\n minW: node.minWidth,\n minH: node.minHeight,\n noResize: node.disableResize,\n noMove: node.disableDrag,\n el: node.element,\n };\n}\n\n// Convert GridStackNode to AXGridLayoutNode\nexport function convertGridStackNodeToAXGridLayoutNode(node: import('gridstack').GridStackNode): AXGridLayoutNode {\n return {\n id: node.id,\n x: node.x,\n y: node.y,\n width: node.w,\n height: node.h,\n maxWidth: node.maxW,\n maxHeight: node.maxH,\n minWidth: node.minW,\n minHeight: node.minH,\n disableResize: node.noResize,\n disableDrag: node.noMove,\n element: node.el,\n };\n}\n\n// Convert AXGridLayoutOptions to GridStackOptions\nexport function convertAXGridLayoutOptionsToGridStackOptions(\n options: AXGridLayoutOptions,\n): import('gridstack').GridStackOptions {\n return {\n column: options.column,\n disableDrag: options.disableDrag,\n disableResize: options.disableResize,\n margin: options.gap,\n cellHeight: options.cellHeight,\n rtl: options.rtl,\n maxRow: options.maxRow,\n minRow: options.minRow,\n row: options.row,\n removable: options.removableSelector || options.removable,\n acceptWidgets: options.acceptWidgets,\n float: options.float,\n handle: options.dragHandlerSelector,\n columnOpts: { breakpoints: options?.responsiveLayout?.map((i) => ({ c: i.column, w: i.width })) },\n };\n}\n\n// Convert GridStackOptions to AXGridLayoutOptions\nexport function convertGridStackOptionsToAXGridLayoutOptions(\n options: import('gridstack').GridStackOptions,\n): AXGridLayoutOptions {\n return {\n column: options.column,\n disableDrag: options.disableDrag,\n disableResize: options.disableResize,\n gap: options.margin,\n cellHeight: options.cellHeight,\n rtl: options.rtl,\n maxRow: options.maxRow,\n minRow: options.minRow,\n row: options.row,\n removableSelector: typeof options.removable === 'string' ? options.removable : undefined,\n removable: typeof options.removable === 'boolean' ? options.removable : undefined,\n acceptWidgets: options.acceptWidgets as boolean,\n float: options.float,\n dragHandlerSelector: options.handle,\n responsiveLayout: options?.columnOpts?.breakpoints?.map((i) => ({ width: i.w, column: i.c })),\n };\n}\n\n/** remove keys which are undefined */\nexport function removeUndefinedKeys(obj) {\n const newObj = { ...obj };\n for (const key in newObj) {\n if (newObj[key] === undefined) {\n delete newObj[key];\n }\n }\n return newObj;\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n effect,\n ElementRef,\n inject,\n input,\n untracked,\n ViewEncapsulation,\n} from '@angular/core';\nimport { AXGridLayoutNode, AXGridLayoutWidget, AXGridLayoutWidgetElement } from './types';\nimport {\n convertAXGridLayoutWidgetToGridStackWidget,\n convertGridStackNodeToAXGridLayoutNode,\n removeUndefinedKeys,\n} from './utility';\n\n@Component({\n selector: 'ax-grid-layout-widget',\n template: `<div class=\"grid-stack-item-content\"><ng-content></ng-content></div>`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXGridLayoutWidgetComponent {\n private readonly elementRef: ElementRef<AXGridLayoutWidgetElement> = inject(ElementRef);\n\n public options = input<AXGridLayoutNode>();\n\n #eff = effect(() => {\n const options = this.options();\n\n untracked(() => {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode as import('gridstack').GridStackNode;\n if (gridstackNode?.grid) {\n gridstackNode.grid.update(\n this.elementRef.nativeElement,\n removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(options)),\n );\n }\n });\n });\n\n /**\n * Locks or unlocks the widget (prevents dragging and resizing).\n * @param state - If `true`, the widget will be locked.\n */\n public setLockable(state: boolean): void {\n this.updateWidgetOptions({ disableResize: state, disableDrag: state });\n }\n\n /**\n * Enables or disables resizing of the widget.\n * @param state - If `true`, resizing will be enabled.\n */\n public setResizable(state: boolean): void {\n this.updateWidgetOptions({ disableResize: !state });\n }\n\n /**\n * Updates the widget options.\n * @param options - The new options for the widget.\n */\n public setOptions(options: AXGridLayoutWidget): void {\n this.updateWidgetOptions(options);\n }\n\n /**\n * Returns the current options of the widget.\n * @returns The current widget options.\n */\n public getOptions(): AXGridLayoutNode {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode;\n return gridstackNode\n ? removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(gridstackNode))\n : { ...this.options(), element: this.elementRef.nativeElement };\n }\n\n /**\n * Returns the native DOM element of the widget.\n * @returns The native element.\n */\n public get element(): AXGridLayoutWidgetElement {\n return this.elementRef.nativeElement;\n }\n\n /**\n * Updates the widget options and triggers a grid update.\n * @param options - The partial options to update.\n */\n private updateWidgetOptions(options: Partial<AXGridLayoutWidget>): void {\n const gridstackNode = this.elementRef.nativeElement.gridstackNode as import('gridstack').GridStackNode;\n if (gridstackNode?.grid) {\n gridstackNode.grid.update(\n this.elementRef.nativeElement,\n removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(options)),\n );\n }\n }\n}\n","import { NXComponent } from '@acorex/components/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n ElementRef,\n NgZone,\n OnDestroy,\n QueryList,\n ViewEncapsulation,\n afterNextRender,\n effect,\n inject,\n input,\n model,\n output,\n untracked,\n} from '@angular/core';\nimport { Subscription } from 'rxjs';\nimport { AXGridLayoutWidgetComponent } from './grid-layout-widget.component';\nimport {\n AXGridLayout,\n AXGridLayoutContainerElement,\n AXGridLayoutEvent,\n AXGridLayoutNode,\n AXGridLayoutOptions,\n AXGridLayoutPosition,\n AXGridLayoutWidget,\n AXGridLayoutWidgetElement,\n} from './types';\nimport {\n convertAXGridLayoutNodeToGridStackNode,\n convertAXGridLayoutOptionsToGridStackOptions,\n convertAXGridLayoutWidgetToGridStackWidget,\n convertGridStackNodeToAXGridLayoutNode,\n convertGridStackOptionsToAXGridLayoutOptions,\n removeUndefinedKeys,\n} from './utility';\n\n@Component({\n selector: 'ax-grid-layout-container',\n template: `<ng-content></ng-content> `,\n styleUrl: './grid-layout-container.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n})\nexport class AXGridLayoutContainerComponent extends NXComponent implements OnDestroy {\n //#region Inputs and Outputs\n public options = input<AXGridLayoutOptions>();\n\n protected onAdded = output<AXGridLayoutEvent>();\n protected onRemoved = output<AXGridLayoutEvent>();\n protected onWidgetChange = output<AXGridLayoutEvent>();\n protected onChange = output<AXGridLayoutEvent>();\n protected onRender = output<void>();\n\n protected isEmpty = model(false);\n //#endregion\n\n //#region Private Properties\n private readonly elementRef: ElementRef<AXGridLayoutContainerElement> = inject(ElementRef);\n private readonly ngZone = inject(NgZone);\n\n @ContentChildren(AXGridLayoutWidgetComponent) public gridstackItems?: QueryList<AXGridLayoutWidgetComponent>;\n\n private el = this.elementRef.nativeElement;\n private grid?: AXGridLayout;\n protected _sub: Subscription | undefined;\n private isInitialized = false;\n //#endregion\n\n //#region Initialization\n #init = afterNextRender(() => {\n this.ngZone.runOutsideAngular(async () => {\n const { GridStack } = await import('gridstack');\n const gridStackOptions = removeUndefinedKeys(convertAXGridLayoutOptionsToGridStackOptions(this.options() ?? {}));\n this.grid = GridStack.init(gridStackOptions, this.el);\n this.updateAll();\n this.hookEvents(this.grid);\n this.onRender.emit();\n this.isInitialized = true;\n });\n this._sub = this.gridstackItems?.changes.subscribe(() => {\n this.updateAll();\n });\n });\n\n // Watch for options changes\n #optionsEffect = effect(() => {\n const newOptions = this.options();\n if (this.isInitialized && this.grid && newOptions) {\n untracked(() => {\n this.ngZone.runOutsideAngular(() => {\n const gridStackOptions = removeUndefinedKeys(convertAXGridLayoutOptionsToGridStackOptions(newOptions));\n\n // Apply each option individually\n if (gridStackOptions.column !== undefined) {\n this.grid?.column(gridStackOptions.column);\n }\n\n if (gridStackOptions.cellHeight !== undefined) {\n this.grid?.cellHeight(gridStackOptions.cellHeight);\n }\n\n if (gridStackOptions.margin !== undefined) {\n this.grid?.margin(gridStackOptions.margin);\n }\n\n if (gridStackOptions.disableResize !== undefined) {\n this.grid?.enableResize(!gridStackOptions.disableResize);\n }\n\n if (gridStackOptions.disableDrag !== undefined) {\n this.grid?.enableMove(!gridStackOptions.disableDrag);\n }\n\n if (gridStackOptions.float !== undefined) {\n this.grid?.float(gridStackOptions.float);\n }\n\n if (gridStackOptions.animate !== undefined) {\n this.grid?.setAnimation(gridStackOptions.animate);\n }\n\n // Update the layout after options have been applied\n this.updateAll();\n });\n });\n }\n });\n\n public ngOnDestroy(): void {\n this.unhookEvents(this.grid);\n this._sub?.unsubscribe();\n this.destroy();\n }\n //#endregion\n\n //#region Internal Methods\n private updateAll() {\n if (!this.grid) return;\n\n const arrays = this.gridstackItems?.toArray() ?? [];\n\n // If there are no items, remove all widgets first\n if (arrays.length === 0) {\n this.grid.removeAll(true);\n this.checkEmpty();\n return;\n }\n\n const layout: AXGridLayoutNode[] = [];\n arrays.forEach((item) => {\n const widgetOptions = item.getOptions();\n if (widgetOptions) {\n layout.push(removeUndefinedKeys(convertAXGridLayoutNodeToGridStackNode(widgetOptions)));\n }\n });\n\n // Clear existing widgets before loading new ones\n this.grid.removeAll(false);\n this.grid.load(layout);\n this.checkEmpty();\n }\n\n private checkEmpty() {\n if (this.grid) {\n const isEmpty = !this.getChildren().length;\n if (isEmpty === this.isEmpty()) return;\n this.isEmpty.set(isEmpty);\n }\n }\n\n private hookEvents(grid?: AXGridLayout): void {\n if (grid) {\n grid\n .on('added', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.checkEmpty();\n this.onAdded.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n })\n .on('removed', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.checkEmpty();\n this.onRemoved.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n })\n .on('change', (event: Event, nodes: import('gridstack').GridStackNode[]) => {\n const mappedNodes = nodes.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n this.onWidgetChange.emit({ sender: this, nodes: mappedNodes });\n this._dispatchChangeEvent();\n });\n }\n }\n\n private unhookEvents(grid?: AXGridLayout) {\n if (grid) grid.offAll();\n }\n\n private _dispatchChangeEvent() {\n if (this.getChildren().length) {\n this.onChange.emit({\n sender: this,\n nodes: this.getChildren(),\n });\n }\n }\n //#endregion\n\n //#region Public Methods\n public addWidget(w: AXGridLayoutWidget, withAutoArrange = false): AXGridLayoutWidgetElement | undefined {\n if (withAutoArrange) this.compact();\n\n const gridStackWidget = removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(w));\n const node = this.grid?.addWidget(gridStackWidget)?.gridstackNode;\n if (!node) return undefined;\n\n const widgetElement: AXGridLayoutWidgetElement = node.el as AXGridLayoutWidgetElement;\n widgetElement.gridstackNode = removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node));\n\n return widgetElement;\n }\n\n public compact(layout: 'list' | 'compact' = 'compact', doSort = true): void {\n this.grid?.compact(layout, doSort);\n }\n\n public setCellHeight(val: number, update = true): void {\n this.grid?.cellHeight(val, update);\n }\n\n public setColumn(\n column: number,\n layout: 'list' | 'compact' | 'moveScale' | 'move' | 'scale' | 'none' = 'moveScale',\n ): void {\n this.grid?.column(column, layout);\n }\n\n public destroy(removeDOM = true): void {\n this.grid?.destroy(removeDOM);\n }\n\n public setMovable(state: boolean, recurse?: boolean) {\n this.grid?.enableMove(state, recurse);\n }\n\n public setResizable(state: boolean, recurse?: boolean) {\n this.grid?.enableResize(state, recurse);\n }\n\n public setFloat(val: boolean): void {\n this.grid?.float(val);\n }\n\n public setMargin(value: number | string): void {\n this.grid?.margin(value);\n }\n\n public removeWidget(el: AXGridLayoutWidgetElement, removeDOM = true, triggerEvent = true): void {\n this.grid?.removeWidget(el, removeDOM, triggerEvent);\n }\n\n public removeAll(removeDOM = true): void {\n this.grid?.removeAll(removeDOM);\n }\n\n public setAnimation(doAnimate: boolean): void {\n this.grid?.setAnimation(doAnimate);\n }\n\n public async setupDraggable(dragIn?: string | HTMLElement[], widgets?: AXGridLayoutWidget) {\n if (typeof dragIn === 'string') {\n document.querySelectorAll(dragIn).forEach((item) => {\n if (!item.classList.contains('grid-stack-item')) {\n item.classList.add('grid-stack-item');\n }\n });\n }\n const { GridStack } = await import('gridstack');\n const gridStackWidgets = widgets\n ? [removeUndefinedKeys(convertAXGridLayoutWidgetToGridStackWidget(widgets))]\n : undefined;\n GridStack.setupDragIn(dragIn, undefined, gridStackWidgets);\n }\n\n public getOptions(): AXGridLayoutOptions {\n const opts = this.grid?.opts;\n if (!opts) return {};\n\n return removeUndefinedKeys(convertGridStackOptionsToAXGridLayoutOptions(opts));\n }\n\n public getChildren(): AXGridLayoutNode[] {\n const children = this.grid?.engine.nodes ?? [];\n return children.map((node) => removeUndefinedKeys(convertGridStackNodeToAXGridLayoutNode(node)));\n }\n public findEmptySpace(\n input: Required<Pick<AXGridLayoutPosition, 'height' | 'width'>>,\n ): Pick<AXGridLayoutPosition, 'x' | 'y'> {\n const value = { h: input.height, w: input.height } as any;\n this.grid?.engine.findEmptyPosition(value);\n return { x: value.x, y: value.y };\n }\n //#endregion\n}\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport { AXGridLayoutContainerComponent } from './grid-layout-container.component';\nimport { AXGridLayoutWidgetComponent } from './grid-layout-widget.component';\n\n@NgModule({\n imports: [CommonModule, AXGridLayoutContainerComponent, AXGridLayoutWidgetComponent],\n exports: [AXGridLayoutContainerComponent, AXGridLayoutWidgetComponent],\n})\nexport class AXGridLayoutBuilderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
package/fesm2022/acorex-components-select-box.mjs CHANGED
@@ -280,8 +280,11 @@ class AXSelectBoxComponent extends classes(MXDropdownBoxBaseComponent, MXSelecti
280
280
  this.list?.refresh();
281
281
  this.close();
282
282
  }
283
+ hostClickListener() {
284
+ this.toggle();
285
+ }
283
286
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXSelectBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
284
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AXSelectBoxComponent, isStandalone: true, selector: "ax-select-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: false, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: false, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: false, isRequired: false, transformFunction: null }, textTemplate: { classPropertyName: "textTemplate", publicName: "textTemplate", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null }, minRecordsForSearch: { classPropertyName: "minRecordsForSearch", publicName: "minRecordsForSearch", isSignal: false, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: false, isRequired: false, transformFunction: null }, selectedTemplate: { classPropertyName: "selectedTemplate", publicName: "selectedTemplate", isSignal: false, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: false, isRequired: false, transformFunction: null }, loadingTemplate: { classPropertyName: "loadingTemplate", publicName: "loadingTemplate", isSignal: false, isRequired: false, transformFunction: null }, dropdownWidth: { classPropertyName: "dropdownWidth", publicName: "dropdownWidth", isSignal: false, isRequired: false, transformFunction: null }, searchBoxAutoFocus: { classPropertyName: "searchBoxAutoFocus", publicName: "searchBoxAutoFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onOpened: "onOpened", onClosed: "onClosed" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "keydown": "_handleKeydown($event)" } }, providers: [
287
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AXSelectBoxComponent, isStandalone: true, selector: "ax-select-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, minValue: { classPropertyName: "minValue", publicName: "minValue", isSignal: false, isRequired: false, transformFunction: null }, maxValue: { classPropertyName: "maxValue", publicName: "maxValue", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: false, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: false, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: false, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: false, isRequired: false, transformFunction: null }, textTemplate: { classPropertyName: "textTemplate", publicName: "textTemplate", isSignal: false, isRequired: false, transformFunction: null }, selectedItems: { classPropertyName: "selectedItems", publicName: "selectedItems", isSignal: false, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null }, minRecordsForSearch: { classPropertyName: "minRecordsForSearch", publicName: "minRecordsForSearch", isSignal: false, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: false, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: false, isRequired: false, transformFunction: null }, selectedTemplate: { classPropertyName: "selectedTemplate", publicName: "selectedTemplate", isSignal: false, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: false, isRequired: false, transformFunction: null }, loadingTemplate: { classPropertyName: "loadingTemplate", publicName: "loadingTemplate", isSignal: false, isRequired: false, transformFunction: null }, dropdownWidth: { classPropertyName: "dropdownWidth", publicName: "dropdownWidth", isSignal: false, isRequired: false, transformFunction: null }, searchBoxAutoFocus: { classPropertyName: "searchBoxAutoFocus", publicName: "searchBoxAutoFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", stateChange: "stateChange", onValueChanged: "onValueChanged", onBlur: "onBlur", onFocus: "onFocus", readonlyChange: "readonlyChange", disabledChange: "disabledChange", onOpened: "onOpened", onClosed: "onClosed" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "keydown": "_handleKeydown($event)", "click": "hostClickListener()" } }, providers: [
285
288
  { provide: AXComponent, useExisting: AXSelectBoxComponent },
286
289
  { provide: AXFocusableComponent, useExisting: AXSelectBoxComponent },
287
290
  { provide: AXValuableComponent, useExisting: AXSelectBoxComponent },
@@ -298,7 +301,7 @@ class AXSelectBoxComponent extends classes(MXDropdownBoxBaseComponent, MXSelecti
298
301
  useClass: MXSelectionBridgeService,
299
302
  },
300
303
  AXUnsubscriber,
301
- ], queries: [{ propertyName: "searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true }], viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }, { propertyName: "list", first: true, predicate: AXListComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: AXDropdownBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-dropdown-box\n [class.ax-state-multiple]=\"multiple\"\n (onOpened)=\"_handleOnOpenedEvent($event)\"\n (onClosed)=\"_handleOnClosedEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\"\n [disabled]=\"disabled\"\n [look]=\"look\"\n>\n <ng-container input>\n <ng-content select=\"ax-prefix\"> </ng-content>\n <div class=\"ax-editor ax-chips-container ax-content ax-input\" [class.ax-state-multiple]=\"multiple\" [tabindex]=\"tabIndex\" (click)=\"toggle()\">\n @if (selectedItems.length === 0) {\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n }\n @for (item of selectedItems; track $index) {\n @if (selectedTemplate) {\n <ng-template *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"></ng-template>\n } @else {\n <div class=\"ax-chips\">\n {{ getDisplayText(item) }}\n @if (!disabled && !readonly && multiple) {\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n }\n </div>\n }\n }\n </div>\n @if (selectedItems?.length && !disabled && !readonly) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n <button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-button\" (click)=\"toggle()\">\n <span\n class=\"ax-icon\"\n [ngClass]=\"{\n 'ax-icon-chevron-down': !isOpen,\n 'ax-icon-chevron-up': isOpen,\n }\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-template #search>\n <ng-content select=\"ax-search-box\"> </ng-content>\n </ng-template>\n </ng-container>\n <ng-container panel>\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\n @if (dropdown.isActionsheetStyle) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\n <ax-close-button [icon]=\"multiple ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n </ax-header>\n }\n @if (searchBox && (!minRecordsForSearch || _listDataSource.totalCount >= minRecordsForSearch || searchValue())) {\n <div class=\"ax-search-container\">\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\n </div>\n }\n @if (renderList) {\n <ax-list\n [readonly]=\"readonly\"\n [dataSource]=\"_listDataSource\"\n [multiple]=\"multiple\"\n [style.height]=\"dropdownSizes.height\"\n [valueField]=\"valueField\"\n [textField]=\"textField\"\n [textTemplate]=\"textTemplate\"\n [emptyTemplate]=\"emptyTemplate ?? empty\"\n [itemTemplate]=\"itemTemplate\"\n [loadingTemplate]=\"loadingTemplate\"\n [ngModel]=\"value\"\n (onValueChanged)=\"_handleValueChanged($event)\"\n [selectionMode]=\"'item'\"\n >\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\n </ax-list>\n }\n\n @if (isLoading()) {\n @if (loadingTemplate) {\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\n } @else {\n <div class=\"ax-select-box-loading-container\">\n <ax-loading></ax-loading>\n </div>\n }\n }\n\n <ng-content select=\"ax-footer\"> </ng-content>\n </div>\n </ng-container>\n</ax-dropdown-box>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: [".ax-editor-container.ax-fill .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surfaceest);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-flat .ax-chips,.ax-editor-container.ax-outline .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-solid .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-light-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-light-surface)}ax-select-box .ax-chips-container{outline:0px solid transparent}.ax-xs ax-select-box,ax-select-box.ax-xs{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .625rem;--ax-comp-editor-placeholder-space-x: .375rem}.ax-sm ax-select-box,ax-select-box.ax-sm{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .75rem;--ax-comp-editor-placeholder-space-x: .5rem}ax-select-box,ax-select-box.ax-md{--ax-comp-select-box-chips-padding-x: .5rem;--ax-comp-select-box-chips-padding-y: .25rem;--ax-comp-select-box-chips-font-size: .875rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-lg ax-select-box,ax-select-box.ax-lg{--ax-comp-select-box-chips-padding-x: .75rem;--ax-comp-select-box-chips-padding-y: .5rem;--ax-comp-select-box-chips-font-size: 1rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-xl ax-select-box,ax-select-box.ax-xl{--ax-comp-select-box-chips-padding-x: .875rem;--ax-comp-select-box-chips-padding-y: .75rem;--ax-comp-select-box-chips-font-size: 1.125rem;--ax-comp-editor-placeholder-space-x: .75rem}ax-select-box{display:block;width:100%;border-radius:var(--ax-sys-border-radius)}ax-select-box .ax-state-disabled{opacity:.5;cursor:not-allowed}ax-select-box .ax-state-disabled .ax-content{cursor:not-allowed}ax-select-box .ax-state-disabled .ax-editor-button{cursor:not-allowed}ax-select-box ax-dropdown-box{border-radius:inherit!important}ax-select-box ax-dropdown-box.ax-state-multiple{height:auto;min-height:var(--ax-comp-editor-height);--ax-comp-editor-space-start-size: 0}ax-select-box ax-dropdown-box.ax-state-multiple .ax-placeholder{padding:0 var(--ax-comp-editor-placeholder-space-x)}ax-select-box .ax-chips-container{display:flex;flex:1 1 0%;cursor:pointer!important;-webkit-user-select:none;user-select:none;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--ax-comp-select-box-chips-gap, .25rem);min-height:var(--ax-sys-size-base)}ax-select-box .ax-chips-container .ax-chips{display:block;overflow:hidden;text-wrap:nowrap;line-height:normal;text-overflow:ellipsis;padding:0 var(--ax-comp-editor-padding-x, .25rem);color:rgb(var(--ax-comp-select-box-chips-text-color));font-size:var(--ax-comp-select-box-chips-font-size)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips{background-color:rgb(var(--ax-comp-select-box-chips-bg-color));border-radius:var(--ax-comp-select-box-chips-border-radius, 999rem);border-width:var(--ax-comp-select-box-chips-border-width, 0px);padding:var(--ax-comp-select-box-chips-padding-y, .25rem) var(--ax-comp-select-box-chips-padding-x, .5rem)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips .ax-icon-close{cursor:pointer;margin-inline-start:var(--ax-comp-select-box-chips-padding-x)}ax-select-box .ax-chips-container .ax-selectbox-input{width:0px;opacity:0}ax-select-box .ax-chips-container.ax-state-multiple:has(.ax-chips){padding:var(--ax-comp-select-box-chips-container-padding, .25rem)}.ax-select-box-panel{height:fit-content}.ax-select-box-panel .ax-select-box-loading-container{display:flex;align-items:center;justify-content:center;padding:1rem}.ax-select-box-panel>ax-header .ax-icon-check{color:rgba(var(--ax-sys-color-primary-500))}.ax-select-box-panel>ax-header.ax-solid{border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-select-box-panel>ax-header.ax-solid ax-title{font-size:1rem;line-height:1.5rem;font-weight:500}\n"], dependencies: [{ kind: "component", type: AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: ["disabled", "look", "hasInput"], outputs: ["disabledChange", "onBlur", "onFocus", "onClick", "onOpened", "onClosed"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readOnlyChange", "onBlur", "onFocus", "onItemClick", "onScrolledIndexChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
304
+ ], queries: [{ propertyName: "searchBox", first: true, predicate: AXSearchBoxComponent, descendants: true }], viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true }, { propertyName: "list", first: true, predicate: AXListComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: AXDropdownBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-dropdown-box\n [class.ax-state-multiple]=\"multiple\"\n (onOpened)=\"_handleOnOpenedEvent($event)\"\n (onClosed)=\"_handleOnClosedEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\"\n [disabled]=\"disabled\"\n [look]=\"look\"\n>\n <ng-container input>\n <ng-content select=\"ax-prefix\"> </ng-content>\n <div\n class=\"ax-editor ax-chips-container ax-content ax-input\"\n [class.ax-state-multiple]=\"multiple\"\n [tabindex]=\"tabIndex\"\n >\n @if (selectedItems.length === 0) {\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n }\n @for (item of selectedItems; track $index) {\n @if (selectedTemplate) {\n <ng-template *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"></ng-template>\n } @else {\n <div class=\"ax-chips\">\n {{ getDisplayText(item) }}\n @if (!disabled && !readonly && multiple) {\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n }\n </div>\n }\n }\n </div>\n @if (selectedItems?.length && !disabled && !readonly) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n <button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-button\">\n <span\n class=\"ax-icon\"\n [ngClass]=\"{\n 'ax-icon-chevron-down': !isOpen,\n 'ax-icon-chevron-up': isOpen,\n }\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-template #search>\n <ng-content select=\"ax-search-box\"> </ng-content>\n </ng-template>\n </ng-container>\n <ng-container panel>\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\n @if (dropdown.isActionsheetStyle) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\n <ax-close-button [icon]=\"multiple ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n </ax-header>\n }\n @if (searchBox && (!minRecordsForSearch || _listDataSource.totalCount >= minRecordsForSearch || searchValue())) {\n <div class=\"ax-search-container\">\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\n </div>\n }\n @if (renderList) {\n <ax-list\n [readonly]=\"readonly\"\n [dataSource]=\"_listDataSource\"\n [multiple]=\"multiple\"\n [style.height]=\"dropdownSizes.height\"\n [valueField]=\"valueField\"\n [textField]=\"textField\"\n [textTemplate]=\"textTemplate\"\n [emptyTemplate]=\"emptyTemplate ?? empty\"\n [itemTemplate]=\"itemTemplate\"\n [loadingTemplate]=\"loadingTemplate\"\n [ngModel]=\"value\"\n (onValueChanged)=\"_handleValueChanged($event)\"\n [selectionMode]=\"'item'\"\n >\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\n </ax-list>\n }\n\n @if (isLoading()) {\n @if (loadingTemplate) {\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\n } @else {\n <div class=\"ax-select-box-loading-container\">\n <ax-loading></ax-loading>\n </div>\n }\n }\n\n <ng-content select=\"ax-footer\"> </ng-content>\n </div>\n </ng-container>\n</ax-dropdown-box>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: [".ax-editor-container.ax-fill .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surfaceest);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-flat .ax-chips,.ax-editor-container.ax-outline .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-solid .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-light-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-light-surface)}ax-select-box .ax-chips-container{outline:0px solid transparent}.ax-xs ax-select-box,ax-select-box.ax-xs{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .625rem;--ax-comp-editor-placeholder-space-x: .375rem}.ax-sm ax-select-box,ax-select-box.ax-sm{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .75rem;--ax-comp-editor-placeholder-space-x: .5rem}ax-select-box,ax-select-box.ax-md{--ax-comp-select-box-chips-padding-x: .5rem;--ax-comp-select-box-chips-padding-y: .25rem;--ax-comp-select-box-chips-font-size: .875rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-lg ax-select-box,ax-select-box.ax-lg{--ax-comp-select-box-chips-padding-x: .75rem;--ax-comp-select-box-chips-padding-y: .5rem;--ax-comp-select-box-chips-font-size: 1rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-xl ax-select-box,ax-select-box.ax-xl{--ax-comp-select-box-chips-padding-x: .875rem;--ax-comp-select-box-chips-padding-y: .75rem;--ax-comp-select-box-chips-font-size: 1.125rem;--ax-comp-editor-placeholder-space-x: .75rem}ax-select-box{display:block;width:100%;border-radius:var(--ax-sys-border-radius)}ax-select-box .ax-state-disabled{opacity:.5;cursor:not-allowed}ax-select-box .ax-state-disabled .ax-content{cursor:not-allowed}ax-select-box .ax-state-disabled .ax-editor-button{cursor:not-allowed}ax-select-box ax-dropdown-box{border-radius:inherit!important}ax-select-box ax-dropdown-box.ax-state-multiple{height:auto;min-height:var(--ax-comp-editor-height);--ax-comp-editor-space-start-size: 0}ax-select-box ax-dropdown-box.ax-state-multiple .ax-placeholder{padding:0 var(--ax-comp-editor-placeholder-space-x)}ax-select-box .ax-chips-container{display:flex;flex:1 1 0%;cursor:pointer!important;-webkit-user-select:none;user-select:none;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--ax-comp-select-box-chips-gap, .25rem);min-height:var(--ax-sys-size-base)}ax-select-box .ax-chips-container .ax-chips{display:block;overflow:hidden;text-wrap:nowrap;line-height:normal;text-overflow:ellipsis;padding:0 var(--ax-comp-editor-padding-x, .25rem);color:rgb(var(--ax-comp-select-box-chips-text-color));font-size:var(--ax-comp-select-box-chips-font-size)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips{background-color:rgb(var(--ax-comp-select-box-chips-bg-color));border-radius:var(--ax-comp-select-box-chips-border-radius, 999rem);border-width:var(--ax-comp-select-box-chips-border-width, 0px);padding:var(--ax-comp-select-box-chips-padding-y, .25rem) var(--ax-comp-select-box-chips-padding-x, .5rem)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips .ax-icon-close{cursor:pointer;margin-inline-start:var(--ax-comp-select-box-chips-padding-x)}ax-select-box .ax-chips-container .ax-selectbox-input{width:0px;opacity:0}ax-select-box .ax-chips-container.ax-state-multiple:has(.ax-chips){padding:var(--ax-comp-select-box-chips-container-padding, .25rem)}.ax-select-box-panel{height:fit-content}.ax-select-box-panel .ax-select-box-loading-container{display:flex;align-items:center;justify-content:center;padding:1rem}.ax-select-box-panel>ax-header .ax-icon-check{color:rgba(var(--ax-sys-color-primary-500))}.ax-select-box-panel>ax-header.ax-solid{border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-select-box-panel>ax-header.ax-solid ax-title{font-size:1rem;line-height:1.5rem;font-weight:500}\n"], dependencies: [{ kind: "component", type: AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: ["disabled", "look", "hasInput"], outputs: ["disabledChange", "onBlur", "onFocus", "onClick", "onOpened", "onClosed"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: AXListComponent, selector: "ax-list", inputs: ["id", "name", "disabled", "readonly", "valueField", "textField", "textTemplate", "disabledField", "multiple", "selectionMode", "dataSource", "itemHeight", "itemTemplate", "emptyTemplate", "loadingTemplate", "checkbox"], outputs: ["onValueChanged", "disabledChange", "readOnlyChange", "onBlur", "onFocus", "onItemClick", "onScrolledIndexChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
302
305
  }
303
306
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AXSelectBoxComponent, decorators: [{
304
307
  type: Component,
@@ -359,7 +362,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
359
362
  AXLoadingComponent,
360
363
  AsyncPipe,
361
364
  AXTranslatorPipe,
362
- ], template: "<ax-dropdown-box\n [class.ax-state-multiple]=\"multiple\"\n (onOpened)=\"_handleOnOpenedEvent($event)\"\n (onClosed)=\"_handleOnClosedEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\"\n [disabled]=\"disabled\"\n [look]=\"look\"\n>\n <ng-container input>\n <ng-content select=\"ax-prefix\"> </ng-content>\n <div class=\"ax-editor ax-chips-container ax-content ax-input\" [class.ax-state-multiple]=\"multiple\" [tabindex]=\"tabIndex\" (click)=\"toggle()\">\n @if (selectedItems.length === 0) {\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n }\n @for (item of selectedItems; track $index) {\n @if (selectedTemplate) {\n <ng-template *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"></ng-template>\n } @else {\n <div class=\"ax-chips\">\n {{ getDisplayText(item) }}\n @if (!disabled && !readonly && multiple) {\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n }\n </div>\n }\n }\n </div>\n @if (selectedItems?.length && !disabled && !readonly) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n <button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-button\" (click)=\"toggle()\">\n <span\n class=\"ax-icon\"\n [ngClass]=\"{\n 'ax-icon-chevron-down': !isOpen,\n 'ax-icon-chevron-up': isOpen,\n }\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-template #search>\n <ng-content select=\"ax-search-box\"> </ng-content>\n </ng-template>\n </ng-container>\n <ng-container panel>\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\n @if (dropdown.isActionsheetStyle) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\n <ax-close-button [icon]=\"multiple ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n </ax-header>\n }\n @if (searchBox && (!minRecordsForSearch || _listDataSource.totalCount >= minRecordsForSearch || searchValue())) {\n <div class=\"ax-search-container\">\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\n </div>\n }\n @if (renderList) {\n <ax-list\n [readonly]=\"readonly\"\n [dataSource]=\"_listDataSource\"\n [multiple]=\"multiple\"\n [style.height]=\"dropdownSizes.height\"\n [valueField]=\"valueField\"\n [textField]=\"textField\"\n [textTemplate]=\"textTemplate\"\n [emptyTemplate]=\"emptyTemplate ?? empty\"\n [itemTemplate]=\"itemTemplate\"\n [loadingTemplate]=\"loadingTemplate\"\n [ngModel]=\"value\"\n (onValueChanged)=\"_handleValueChanged($event)\"\n [selectionMode]=\"'item'\"\n >\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\n </ax-list>\n }\n\n @if (isLoading()) {\n @if (loadingTemplate) {\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\n } @else {\n <div class=\"ax-select-box-loading-container\">\n <ax-loading></ax-loading>\n </div>\n }\n }\n\n <ng-content select=\"ax-footer\"> </ng-content>\n </div>\n </ng-container>\n</ax-dropdown-box>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: [".ax-editor-container.ax-fill .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surfaceest);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-flat .ax-chips,.ax-editor-container.ax-outline .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-solid .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-light-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-light-surface)}ax-select-box .ax-chips-container{outline:0px solid transparent}.ax-xs ax-select-box,ax-select-box.ax-xs{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .625rem;--ax-comp-editor-placeholder-space-x: .375rem}.ax-sm ax-select-box,ax-select-box.ax-sm{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .75rem;--ax-comp-editor-placeholder-space-x: .5rem}ax-select-box,ax-select-box.ax-md{--ax-comp-select-box-chips-padding-x: .5rem;--ax-comp-select-box-chips-padding-y: .25rem;--ax-comp-select-box-chips-font-size: .875rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-lg ax-select-box,ax-select-box.ax-lg{--ax-comp-select-box-chips-padding-x: .75rem;--ax-comp-select-box-chips-padding-y: .5rem;--ax-comp-select-box-chips-font-size: 1rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-xl ax-select-box,ax-select-box.ax-xl{--ax-comp-select-box-chips-padding-x: .875rem;--ax-comp-select-box-chips-padding-y: .75rem;--ax-comp-select-box-chips-font-size: 1.125rem;--ax-comp-editor-placeholder-space-x: .75rem}ax-select-box{display:block;width:100%;border-radius:var(--ax-sys-border-radius)}ax-select-box .ax-state-disabled{opacity:.5;cursor:not-allowed}ax-select-box .ax-state-disabled .ax-content{cursor:not-allowed}ax-select-box .ax-state-disabled .ax-editor-button{cursor:not-allowed}ax-select-box ax-dropdown-box{border-radius:inherit!important}ax-select-box ax-dropdown-box.ax-state-multiple{height:auto;min-height:var(--ax-comp-editor-height);--ax-comp-editor-space-start-size: 0}ax-select-box ax-dropdown-box.ax-state-multiple .ax-placeholder{padding:0 var(--ax-comp-editor-placeholder-space-x)}ax-select-box .ax-chips-container{display:flex;flex:1 1 0%;cursor:pointer!important;-webkit-user-select:none;user-select:none;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--ax-comp-select-box-chips-gap, .25rem);min-height:var(--ax-sys-size-base)}ax-select-box .ax-chips-container .ax-chips{display:block;overflow:hidden;text-wrap:nowrap;line-height:normal;text-overflow:ellipsis;padding:0 var(--ax-comp-editor-padding-x, .25rem);color:rgb(var(--ax-comp-select-box-chips-text-color));font-size:var(--ax-comp-select-box-chips-font-size)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips{background-color:rgb(var(--ax-comp-select-box-chips-bg-color));border-radius:var(--ax-comp-select-box-chips-border-radius, 999rem);border-width:var(--ax-comp-select-box-chips-border-width, 0px);padding:var(--ax-comp-select-box-chips-padding-y, .25rem) var(--ax-comp-select-box-chips-padding-x, .5rem)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips .ax-icon-close{cursor:pointer;margin-inline-start:var(--ax-comp-select-box-chips-padding-x)}ax-select-box .ax-chips-container .ax-selectbox-input{width:0px;opacity:0}ax-select-box .ax-chips-container.ax-state-multiple:has(.ax-chips){padding:var(--ax-comp-select-box-chips-container-padding, .25rem)}.ax-select-box-panel{height:fit-content}.ax-select-box-panel .ax-select-box-loading-container{display:flex;align-items:center;justify-content:center;padding:1rem}.ax-select-box-panel>ax-header .ax-icon-check{color:rgba(var(--ax-sys-color-primary-500))}.ax-select-box-panel>ax-header.ax-solid{border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-select-box-panel>ax-header.ax-solid ax-title{font-size:1rem;line-height:1.5rem;font-weight:500}\n"] }]
365
+ ], template: "<ax-dropdown-box\n [class.ax-state-multiple]=\"multiple\"\n (onOpened)=\"_handleOnOpenedEvent($event)\"\n (onClosed)=\"_handleOnClosedEvent($event)\"\n (focus)=\"emitOnFocusEvent($event)\"\n (blur)=\"emitOnBlurEvent($event)\"\n [disabled]=\"disabled\"\n [look]=\"look\"\n>\n <ng-container input>\n <ng-content select=\"ax-prefix\"> </ng-content>\n <div\n class=\"ax-editor ax-chips-container ax-content ax-input\"\n [class.ax-state-multiple]=\"multiple\"\n [tabindex]=\"tabIndex\"\n >\n @if (selectedItems.length === 0) {\n <div class=\"ax-placeholder\" role=\"textbox\" area-readonly=\"true\">\n {{ placeholder }}\n </div>\n }\n @for (item of selectedItems; track $index) {\n @if (selectedTemplate) {\n <ng-template *ngTemplateOutlet=\"selectedTemplate; context: { $implicit: { data: item } }\"></ng-template>\n } @else {\n <div class=\"ax-chips\">\n {{ getDisplayText(item) }}\n @if (!disabled && !readonly && multiple) {\n <span class=\"ax-icon ax-icon-close\" (click)=\"_handleBadgeRemove($event, item)\"> </span>\n }\n </div>\n }\n }\n </div>\n @if (selectedItems?.length && !disabled && !readonly) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n <button type=\"button\" [disabled]=\"disabled\" [tabIndex]=\"-1\" class=\"ax-editor-button\">\n <span\n class=\"ax-icon\"\n [ngClass]=\"{\n 'ax-icon-chevron-down': !isOpen,\n 'ax-icon-chevron-up': isOpen,\n }\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"> </ng-content>\n <ng-template #search>\n <ng-content select=\"ax-search-box\"> </ng-content>\n </ng-template>\n </ng-container>\n <ng-container panel>\n <div #panel class=\"ax-select-box-panel\" [style.min-width]=\"dropdownSizes.width\">\n @if (dropdown.isActionsheetStyle) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption || placeholder || 'selectbox.popover.title' | translate | async }}</ax-title>\n <ax-close-button [icon]=\"multiple ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n </ax-header>\n }\n @if (searchBox && (!minRecordsForSearch || _listDataSource.totalCount >= minRecordsForSearch || searchValue())) {\n <div class=\"ax-search-container\">\n <ng-template [ngTemplateOutlet]=\"search\"></ng-template>\n </div>\n }\n @if (renderList) {\n <ax-list\n [readonly]=\"readonly\"\n [dataSource]=\"_listDataSource\"\n [multiple]=\"multiple\"\n [style.height]=\"dropdownSizes.height\"\n [valueField]=\"valueField\"\n [textField]=\"textField\"\n [textTemplate]=\"textTemplate\"\n [emptyTemplate]=\"emptyTemplate ?? empty\"\n [itemTemplate]=\"itemTemplate\"\n [loadingTemplate]=\"loadingTemplate\"\n [ngModel]=\"value\"\n (onValueChanged)=\"_handleValueChanged($event)\"\n [selectionMode]=\"'item'\"\n >\n <ng-template #empty> {{ 'no-result-found' | translate | async }} </ng-template>\n </ax-list>\n }\n\n @if (isLoading()) {\n @if (loadingTemplate) {\n <ng-template *ngTemplateOutlet=\"loadingTemplate\"></ng-template>\n } @else {\n <div class=\"ax-select-box-loading-container\">\n <ax-loading></ax-loading>\n </div>\n }\n }\n\n <ng-content select=\"ax-footer\"> </ng-content>\n </div>\n </ng-container>\n</ax-dropdown-box>\n<ng-content select=\"ax-validation-rule\"> </ng-content>\n", styles: [".ax-editor-container.ax-fill .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surfaceest);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-flat .ax-chips,.ax-editor-container.ax-outline .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-surface-high)}.ax-editor-container.ax-solid .ax-chips{--ax-comp-select-box-chips-bg-color: var(--ax-sys-color-light-surface);--ax-comp-select-box-chips-text-color: var(--ax-sys-color-on-light-surface)}ax-select-box .ax-chips-container{outline:0px solid transparent}.ax-xs ax-select-box,ax-select-box.ax-xs{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .625rem;--ax-comp-editor-placeholder-space-x: .375rem}.ax-sm ax-select-box,ax-select-box.ax-sm{--ax-comp-select-box-chips-padding-x: .25rem;--ax-comp-select-box-chips-padding-y: .125rem;--ax-comp-select-box-chips-font-size: .75rem;--ax-comp-editor-placeholder-space-x: .5rem}ax-select-box,ax-select-box.ax-md{--ax-comp-select-box-chips-padding-x: .5rem;--ax-comp-select-box-chips-padding-y: .25rem;--ax-comp-select-box-chips-font-size: .875rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-lg ax-select-box,ax-select-box.ax-lg{--ax-comp-select-box-chips-padding-x: .75rem;--ax-comp-select-box-chips-padding-y: .5rem;--ax-comp-select-box-chips-font-size: 1rem;--ax-comp-editor-placeholder-space-x: .75rem}.ax-xl ax-select-box,ax-select-box.ax-xl{--ax-comp-select-box-chips-padding-x: .875rem;--ax-comp-select-box-chips-padding-y: .75rem;--ax-comp-select-box-chips-font-size: 1.125rem;--ax-comp-editor-placeholder-space-x: .75rem}ax-select-box{display:block;width:100%;border-radius:var(--ax-sys-border-radius)}ax-select-box .ax-state-disabled{opacity:.5;cursor:not-allowed}ax-select-box .ax-state-disabled .ax-content{cursor:not-allowed}ax-select-box .ax-state-disabled .ax-editor-button{cursor:not-allowed}ax-select-box ax-dropdown-box{border-radius:inherit!important}ax-select-box ax-dropdown-box.ax-state-multiple{height:auto;min-height:var(--ax-comp-editor-height);--ax-comp-editor-space-start-size: 0}ax-select-box ax-dropdown-box.ax-state-multiple .ax-placeholder{padding:0 var(--ax-comp-editor-placeholder-space-x)}ax-select-box .ax-chips-container{display:flex;flex:1 1 0%;cursor:pointer!important;-webkit-user-select:none;user-select:none;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:var(--ax-comp-select-box-chips-gap, .25rem);min-height:var(--ax-sys-size-base)}ax-select-box .ax-chips-container .ax-chips{display:block;overflow:hidden;text-wrap:nowrap;line-height:normal;text-overflow:ellipsis;padding:0 var(--ax-comp-editor-padding-x, .25rem);color:rgb(var(--ax-comp-select-box-chips-text-color));font-size:var(--ax-comp-select-box-chips-font-size)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips{background-color:rgb(var(--ax-comp-select-box-chips-bg-color));border-radius:var(--ax-comp-select-box-chips-border-radius, 999rem);border-width:var(--ax-comp-select-box-chips-border-width, 0px);padding:var(--ax-comp-select-box-chips-padding-y, .25rem) var(--ax-comp-select-box-chips-padding-x, .5rem)}ax-select-box .ax-chips-container.ax-state-multiple .ax-chips .ax-icon-close{cursor:pointer;margin-inline-start:var(--ax-comp-select-box-chips-padding-x)}ax-select-box .ax-chips-container .ax-selectbox-input{width:0px;opacity:0}ax-select-box .ax-chips-container.ax-state-multiple:has(.ax-chips){padding:var(--ax-comp-select-box-chips-container-padding, .25rem)}.ax-select-box-panel{height:fit-content}.ax-select-box-panel .ax-select-box-loading-container{display:flex;align-items:center;justify-content:center;padding:1rem}.ax-select-box-panel>ax-header .ax-icon-check{color:rgba(var(--ax-sys-color-primary-500))}.ax-select-box-panel>ax-header.ax-solid{border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-select-box-panel>ax-header.ax-solid ax-title{font-size:1rem;line-height:1.5rem;font-weight:500}\n"] }]
363
366
  }], propDecorators: { dataSource: [{
364
367
  type: Input
365
368
  }], placeholder: [{
@@ -393,6 +396,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
393
396
  }], _handleKeydown: [{
394
397
  type: HostListener,
395
398
  args: ['keydown', ['$event']]
399
+ }], hostClickListener: [{
400
+ type: HostListener,
401
+ args: ['click']
396
402
  }] } });
397
403
 
398
404
  class AXSelectBoxModule {