@acorex-platform/framework-client 2.0.0-next.12 → 2.0.0-next.14

package/fesm2022/acorex-platform-framework-client-layout-widget-core.mjs

@@ -2115,8 +2115,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
             type: Injectable
         }] });
 
-const AXP_WIDGET_COLUMN_AUTO_FIT = new InjectionToken('AXP_WIDGET_COLUMN_AUTO_FIT');
-
 //#region ----   Imports   ----
 /**
  * Injection token for widget definition providers.
@@ -2202,6 +2200,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                 }]
         }] });
 
+const AXP_WIDGET_COLUMN_AUTO_FIT = new InjectionToken('AXP_WIDGET_COLUMN_AUTO_FIT');
+
 class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
     constructor() {
         super(...arguments);
@@ -2277,9 +2277,6 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
         this.loadingRow.set(row);
         await this.grid.expandRow(row);
         this.loadingRow.set(null);
-        this.contentAutoFitSettled = false;
-        this.contentAutoFitShouldSettle = false;
-        this.scheduleContentAutoFit();
         // if (row.data?.__meta__?.expanded === undefined) {
         //   this.width = `${parseInt(this.width as string) + 24}px`;
         // }
@@ -2336,7 +2333,9 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
             return this.normalizeColumnAlignment(align);
         }
         if (typeof align === 'object' && !Array.isArray(align)) {
-            const raw = side === 'header' ? align.header : align.cell;
+            const raw = side === 'header'
+                ? align.header
+                : align.cell;
             return this.normalizeColumnAlignment(raw);
         }
         return 'start';
@@ -2392,7 +2391,12 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
                 },
             ],
         });
-        this.width = this.mergedOptions().width === 'auto' ? 'auto' : this.customWidth ? this.customWidth : (this.mergedOptions().width ?? '200px');
+        this.width =
+            this.mergedOptions().width === 'auto'
+                ? 'auto'
+                : this.customWidth
+                    ? this.customWidth
+                    : (this.mergedOptions().width ?? '200px');
         this.allowResizing = this.mergedOptions().allowResizing !== false;
         this.allowSorting = this.sortEnabled;
         this.syncAutoWidthIntent();
@@ -2456,7 +2460,9 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
             return;
         }
         this.bandLocaleWatchStarted = true;
-        this.translation.langChanges$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(() => {
+        this.translation.langChanges$
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => {
             if (this.isBand && this.bandCaptionI18nKey) {
                 this.resolveBandCaption();
             }
@@ -2467,7 +2473,8 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
             return;
         }
         this.caption = text;
-        const topLevel = this.grid.topLevelColumnsList;
+        const topLevel = this.grid
+            .topLevelColumnsList;
         if (topLevel) {
             topLevel.set([...topLevel()]);
         }
@@ -2499,7 +2506,9 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
         // Use a hash of key properties instead of full JSON.stringify
         // This is much faster for large objects
         const keyProps = ['id', 'code', 'name', 'title'];
-        const keyValues = keyProps.map((prop) => data?.[prop]).filter((v) => v != null);
+        const keyValues = keyProps
+            .map((prop) => data?.[prop])
+            .filter((v) => v != null);
         if (keyValues.length > 0) {
             return `row-${keyValues.join('-')}`;
         }
@@ -2550,8 +2559,7 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
         if (!isPlatformBrowser(this.platformId) || !this.autoWidthColumn || this.contentAutoFitSettled) {
             return;
         }
-        const allowSettle = this.expandHandler !== true;
-        this.contentAutoFitShouldSettle = this.contentAutoFitShouldSettle || (request?.settle === true && allowSettle);
+        this.contentAutoFitShouldSettle = this.contentAutoFitShouldSettle || request?.settle === true;
         if (this.contentAutoFitTimer != null) {
             clearTimeout(this.contentAutoFitTimer);
         }
@@ -2723,13 +2731,23 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
         [class.flex]="!sortEnabled"
         [class.items-center]="!sortEnabled"
         [class.axp-widget-column-header--sortable]="sortEnabled"
-        [class.axp-widget-column-header--sort-at-start]="sortEnabled && getHeaderTextAlign() === 'end'"
-        [class.axp-widget-column-header--sort-active]="headerSortDirection === 'asc' || headerSortDirection === 'desc'"
+        [class.axp-widget-column-header--sort-at-start]="
+          sortEnabled && getHeaderTextAlign() === 'end'
+        "
+        [class.axp-widget-column-header--sort-active]="
+          headerSortDirection === 'asc' || headerSortDirection === 'desc'
+        "
         [class.gap-1]="!sortEnabled"
-        [style.justify-content]="sortEnabled ? 'flex-start' : getHeaderJustifyContent()"
+        [style.justify-content]="
+          sortEnabled ? 'flex-start' : getHeaderJustifyContent()
+        "
         (click)="onHeaderClick($event)"
       >
-        <span class="axp-widget-column-header__caption truncate" [class.axp-widget-column-header__caption--with-sort]="sortEnabled" [style.text-align]="sortEnabled ? getHeaderTextAlign() : null">
+        <span
+          class="axp-widget-column-header__caption truncate"
+          [class.axp-widget-column-header__caption--with-sort]="sortEnabled"
+          [style.text-align]="sortEnabled ? getHeaderTextAlign() : null"
+        >
           @if (isBand) {
             {{ caption }}
           } @else {
@@ -2739,40 +2757,84 @@ class AXPWidgetColumnRendererComponent extends AXDataTableColumnComponent {
         @if (sortEnabled) {
           <span class="axp-widget-column-header__sort">
             @if (headerSortPriority !== undefined && headerSortPriority > 1) {
-              <span class="axp-widget-column-header__sort-priority text-xs opacity-70">{{ headerSortPriority }}</span>
+              <span
+                class="axp-widget-column-header__sort-priority text-xs opacity-70"
+                >{{ headerSortPriority }}</span
+              >
             }
-            <i class="fa-solid fa-arrow-up-long text-neutral-400" [class.text-primary]="headerSortDirection === 'asc'"></i>
-            <i class="fa-solid fa-arrow-down-long text-neutral-400" [class.text-primary]="headerSortDirection === 'desc'"></i>
+            <i
+              class="fa-solid fa-arrow-up-long text-neutral-400"
+              [class.text-primary]="headerSortDirection === 'asc'"
+            ></i>
+            <i
+              class="fa-solid fa-arrow-down-long text-neutral-400"
+              [class.text-primary]="headerSortDirection === 'desc'"
+            ></i>
           </span>
         }
       </div>
     </ng-template>
     <ng-template #cell let-row>
       @if (expandHandler) {
-        <div class="ax-data-table-nested-indent w-full" [attr.data-level]="row.data?.__meta__?.level || 0">
+        <div
+          class="ax-data-table-nested-indent w-full"
+          [attr.data-level]="row.data?.__meta__?.level || 0"
+        >
           @if (hasExpandableRow(row)) {
-            <div (click)="handleExpandRow(row, $event)" class="ax-expand-handler" id="ax-expand-handler-container">
+            <div
+              (click)="handleExpandRow(row, $event)"
+              class="ax-expand-handler"
+              id="ax-expand-handler-container"
+            >
               @if (loadingRow() === row) {
-                <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
+                <i
+                  class="fas fa-spinner-third animate-twSpin animate-infinite"
+                ></i>
               } @else {
                 @if (row.data?.__meta__?.expanded) {
-                  <i [class]="customCollapseIcon || 'far fa-minus-square text-md opacity-75'"></i>
+                  <i
+                    [class]="
+                      customCollapseIcon ||
+                      'far fa-minus-square text-md opacity-75'
+                    "
+                  ></i>
                 } @else {
-                  <i [class]="customExpandIcon || 'far fa-plus-square text-md  opacity-75'"></i>
+                  <i
+                    [class]="
+                      customExpandIcon || 'far fa-plus-square text-md  opacity-75'
+                    "
+                  ></i>
                 }
               }
             </div>
           }
           @if (component && row?.data) {
             <div class="ax-data-table-cell-text min-w-0 flex-1">
-              <ng-container *ngComponentOutlet="component; injector: getRowInjector(row.data); inputs: getInputs(row.data)"></ng-container>
+              <ng-container
+                *ngComponentOutlet="
+                  component;
+                  injector: getRowInjector(row.data);
+                  inputs: getInputs(row.data)
+                "
+              ></ng-container>
             </div>
           }
         </div>
       } @else {
-        <div class="w-full min-w-0 max-w-full" [class.flex]="getCellUseFlexLayout()" [class.items-center]="getCellUseFlexLayout()" [style.justify-content]="getCellJustifyContent()">
+        <div
+          class="w-full min-w-0 max-w-full"
+          [class.flex]="getCellUseFlexLayout()"
+          [class.items-center]="getCellUseFlexLayout()"
+          [style.justify-content]="getCellJustifyContent()"
+        >
           @if (component && row?.data) {
-            <ng-container *ngComponentOutlet="component; injector: getRowInjector(row.data); inputs: getInputs(row.data)"></ng-container>
+            <ng-container
+              *ngComponentOutlet="
+                component;
+                injector: getRowInjector(row.data);
+                inputs: getInputs(row.data)
+              "
+            ></ng-container>
           }
         </div>
       }
@@ -2790,13 +2852,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         [class.flex]="!sortEnabled"
         [class.items-center]="!sortEnabled"
         [class.axp-widget-column-header--sortable]="sortEnabled"
-        [class.axp-widget-column-header--sort-at-start]="sortEnabled && getHeaderTextAlign() === 'end'"
-        [class.axp-widget-column-header--sort-active]="headerSortDirection === 'asc' || headerSortDirection === 'desc'"
+        [class.axp-widget-column-header--sort-at-start]="
+          sortEnabled && getHeaderTextAlign() === 'end'
+        "
+        [class.axp-widget-column-header--sort-active]="
+          headerSortDirection === 'asc' || headerSortDirection === 'desc'
+        "
         [class.gap-1]="!sortEnabled"
-        [style.justify-content]="sortEnabled ? 'flex-start' : getHeaderJustifyContent()"
+        [style.justify-content]="
+          sortEnabled ? 'flex-start' : getHeaderJustifyContent()
+        "
         (click)="onHeaderClick($event)"
       >
-        <span class="axp-widget-column-header__caption truncate" [class.axp-widget-column-header__caption--with-sort]="sortEnabled" [style.text-align]="sortEnabled ? getHeaderTextAlign() : null">
+        <span
+          class="axp-widget-column-header__caption truncate"
+          [class.axp-widget-column-header__caption--with-sort]="sortEnabled"
+          [style.text-align]="sortEnabled ? getHeaderTextAlign() : null"
+        >
           @if (isBand) {
             {{ caption }}
           } @else {
@@ -2806,40 +2878,84 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         @if (sortEnabled) {
           <span class="axp-widget-column-header__sort">
             @if (headerSortPriority !== undefined && headerSortPriority > 1) {
-              <span class="axp-widget-column-header__sort-priority text-xs opacity-70">{{ headerSortPriority }}</span>
+              <span
+                class="axp-widget-column-header__sort-priority text-xs opacity-70"
+                >{{ headerSortPriority }}</span
+              >
             }
-            <i class="fa-solid fa-arrow-up-long text-neutral-400" [class.text-primary]="headerSortDirection === 'asc'"></i>
-            <i class="fa-solid fa-arrow-down-long text-neutral-400" [class.text-primary]="headerSortDirection === 'desc'"></i>
+            <i
+              class="fa-solid fa-arrow-up-long text-neutral-400"
+              [class.text-primary]="headerSortDirection === 'asc'"
+            ></i>
+            <i
+              class="fa-solid fa-arrow-down-long text-neutral-400"
+              [class.text-primary]="headerSortDirection === 'desc'"
+            ></i>
           </span>
         }
       </div>
     </ng-template>
     <ng-template #cell let-row>
       @if (expandHandler) {
-        <div class="ax-data-table-nested-indent w-full" [attr.data-level]="row.data?.__meta__?.level || 0">
+        <div
+          class="ax-data-table-nested-indent w-full"
+          [attr.data-level]="row.data?.__meta__?.level || 0"
+        >
           @if (hasExpandableRow(row)) {
-            <div (click)="handleExpandRow(row, $event)" class="ax-expand-handler" id="ax-expand-handler-container">
+            <div
+              (click)="handleExpandRow(row, $event)"
+              class="ax-expand-handler"
+              id="ax-expand-handler-container"
+            >
               @if (loadingRow() === row) {
-                <i class="fas fa-spinner-third animate-twSpin animate-infinite"></i>
+                <i
+                  class="fas fa-spinner-third animate-twSpin animate-infinite"
+                ></i>
               } @else {
                 @if (row.data?.__meta__?.expanded) {
-                  <i [class]="customCollapseIcon || 'far fa-minus-square text-md opacity-75'"></i>
+                  <i
+                    [class]="
+                      customCollapseIcon ||
+                      'far fa-minus-square text-md opacity-75'
+                    "
+                  ></i>
                 } @else {
-                  <i [class]="customExpandIcon || 'far fa-plus-square text-md  opacity-75'"></i>
+                  <i
+                    [class]="
+                      customExpandIcon || 'far fa-plus-square text-md  opacity-75'
+                    "
+                  ></i>
                 }
               }
             </div>
           }
           @if (component && row?.data) {
             <div class="ax-data-table-cell-text min-w-0 flex-1">
-              <ng-container *ngComponentOutlet="component; injector: getRowInjector(row.data); inputs: getInputs(row.data)"></ng-container>
+              <ng-container
+                *ngComponentOutlet="
+                  component;
+                  injector: getRowInjector(row.data);
+                  inputs: getInputs(row.data)
+                "
+              ></ng-container>
             </div>
           }
         </div>
       } @else {
-        <div class="w-full min-w-0 max-w-full" [class.flex]="getCellUseFlexLayout()" [class.items-center]="getCellUseFlexLayout()" [style.justify-content]="getCellJustifyContent()">
+        <div
+          class="w-full min-w-0 max-w-full"
+          [class.flex]="getCellUseFlexLayout()"
+          [class.items-center]="getCellUseFlexLayout()"
+          [style.justify-content]="getCellJustifyContent()"
+        >
           @if (component && row?.data) {
-            <ng-container *ngComponentOutlet="component; injector: getRowInjector(row.data); inputs: getInputs(row.data)"></ng-container>
+            <ng-container
+              *ngComponentOutlet="
+                component;
+                injector: getRowInjector(row.data);
+                inputs: getInputs(row.data)
+              "
+            ></ng-container>
           }
         </div>
       }