@libs-ui/components-table 0.2.357-0 → 0.2.357-10

package/README.md

@@ -55,8 +55,8 @@ export class YourComponent {}
   class="h-full block"
   style="display: block; height: 100%"
   [headerRight]="headerStandard"
-  [httpRequestData]="userRequestConfig()"
-  (outSort)="handlerSort($event)"
+  [httpRequestData]="userRequestConfigStandard()"
+  (outSort)="onSort($event)"
 />
 ```
 
@@ -64,10 +64,12 @@ export class YourComponent {}
 import { LibsUiComponentsTableComponent, ITableHeaderConfig, ISortEvent } from '@libs-ui/components-table';
 import { IHttpRequestConfig } from '@libs-ui/services-http-request';
 import { IAvatarConfig } from '@libs-ui/components-avatar';
+import { HttpParams } from '@angular/common/http';
 import { signal } from '@angular/core';
 import { of } from 'rxjs';
 
-readonly headerStandard: Array<ITableHeaderConfig> = [
+// 1. Cấu hình cột hiển thị — dùng cho [headerRight]="headerStandard"
+readonly headerStandard: ITableHeaderConfig[] = [
   {
     label: 'ID',
     orderby: 'id',
@@ -84,11 +86,16 @@ readonly headerStandard: Array<ITableHeaderConfig> = [
         field: 'staff_info',
         instance: 'avatar',
         getAvatarConfig: (data) => {
-          if (!data.value()) return of(undefined as unknown as IAvatarConfig);
+          const staffInfo = data.value();
+          // Không có staff_info → ẩn avatar (trả false để @if của lib ẩn ô)
+          if (!staffInfo) {
+            return of(false as unknown as IAvatarConfig);
+          }
+          // Có staff_info → hiển thị avatar (linkAvatar rỗng thì tự fallback chữ initials)
           return of({
-            linkAvatar: data.value().link_avatar,
-            idGenColor: data.value().username,
-            textAvatar: data.value().name,
+            linkAvatar: staffInfo.link_avatar,
+            idGenColor: staffInfo.username,
+            textAvatar: staffInfo.name,
             size: 32,
           });
         },
@@ -102,17 +109,38 @@ readonly headerStandard: Array<ITableHeaderConfig> = [
     ngClass: { 'w-1/5': true },
     colTemplateConfig: [{ cssWrapper: 'font-semibold', fieldsConfig: [{ field: 'name' }] }],
   },
+  {
+    label: 'Role',
+    ngClass: { 'w-1/5': true },
+    colTemplateConfig: [{ cssWrapper: '', fieldsConfig: [{ field: 'role' }] }],
+  },
+  {
+    label: 'Status',
+    ngClass: { 'w-1/5': true },
+    colTemplateConfig: [{
+      cssWrapper: '',
+      fieldsConfig: [{
+        field: 'status',
+        instance: 'button-status',
+        parseValue: (data) => of({
+          type: data.value === 'Active' ? 'green' : 'gray',
+          label: data.value,
+        }),
+      }],
+    }],
+  },
 ];
 
-readonly userRequestConfig = signal<IHttpRequestConfig>({
-  objectInstance: new MockUserTableService(),
+// 2. Cấu hình service gọi API lấy dữ liệu — dùng cho [httpRequestData]="userRequestConfigStandard()"
+readonly userRequestConfigStandard = signal<IHttpRequestConfig>({
+  objectInstance: new UserTableService(), // service có method list() trả về danh sách
   functionName: 'list',
   argumentsValue: [new HttpParams()],
 });
 
-handlerSort(event: ISortEvent): void {
-  event.stopPropagation();
-  console.log('Sort changed:', event.sort);
+// 3. Handler nhận sự kiện sort — dùng cho (outSort)="onSort($event)"
+onSort(event: ISortEvent): void {
+  console.log('Sorting changed:', event);
 }
 ```
 
@@ -132,22 +160,33 @@ handlerSort(event: ISortEvent): void {
     showInputGotoPage: true,
     numberPageDisplay: 5
   }"
-  (outSort)="handlerSort($event)"
+  (outSort)="onSort($event)"
 />
 ```
 
 ```typescript
-import { LibsUiComponentsTableComponent, ITableHeaderConfig } from '@libs-ui/components-table';
-import { signal } from '@angular/core';
+import { LibsUiComponentsTableComponent, ITableHeaderConfig, ISortEvent } from '@libs-ui/components-table';
 import { HttpParams } from '@angular/common/http';
+import { signal } from '@angular/core';
 
+// [headerRight]="headerStandard" — cấu hình cột dùng lại từ ví dụ "Standard Table" phía trên.
+
+// 1. Cấu hình service — activityLoadData="'click-pagination'" bật chế độ phân trang.
+// service.list() nhận params { page, pageSize } và trả về paging metadata.
 readonly userRequestConfigPagination = signal({
-  objectInstance: new MockUserTableService(),
+  objectInstance: new UserTableService(),
   functionName: 'list',
   argumentsValue: [new HttpParams()],
 });
-// MockUserTableService.list() nhận params { page, pageSize }
-// và phải trả về: { data: [...], paging: { page, pageSize, total_items, total_pages } }
+
+// 2. paginationSetting — cấu hình trực tiếp trên template, tuỳ chỉnh giao diện phân trang.
+//    [paginationSetting]="{ showTotalPage: true, showInputGotoPage: true, numberPageDisplay: 5 }"
+//    showTotalPage: hiện tổng số trang | showInputGotoPage: hiện ô nhập trang | numberPageDisplay: số nút trang
+
+// 3. Handler nhận sự kiện sort — dùng cho (outSort)="onSort($event)"
+onSort(event: ISortEvent): void {
+  console.log('Sorting changed:', event);
+}
 ```
 
 ---
@@ -251,38 +290,29 @@ import {
   ITableHeaderConfig,
   IConfigTemplateItemCollapseExpand,
   TYPE_NEW_DATA_TABLE,
+  TYPE_ITEM_DATA_TABLE,
 } from '@libs-ui/components-table';
 import { convertObjectToSignal } from '@libs-ui/utils';
-import { of } from 'rxjs';
+import { TYPE_OBJECT } from '@libs-ui/interfaces-types';
 
-kpiHeadersLeft: Array<ITableHeaderConfig> = KpiReportHeadersConfig(toggleExpand).slice(0, 1);
-kpiHeadersRight: Array<ITableHeaderConfig> = KpiReportHeadersConfig(toggleExpand).slice(1);
-kpiExpandConfig: IConfigTemplateItemCollapseExpand = {
-  fieldGetDataExpand: 'expand_data',
-  colTemplateConfig: [{
-    cssWrapper: 'flex w-full',
-    fieldsConfig: [{
-      field: 'children',
-      parseValue: (data) => {
-        const rows = data.value() || [];
-        const html = rows.map((r: any) => `<div class="p-2">${r.name}</div>`).join('');
-        return of(`<div class="bg-gray-50 p-4">${html}</div>`);
-      },
-    }],
-  }],
-};
-kpiData: TYPE_NEW_DATA_TABLE = {
-  data: convertObjectToSignal([
-    { id: 1, name: 'KPI 1', specificExpand: false, expand_data: [{ children: [{ name: 'Sub KPI A' }] }] },
-  ]),
-};
+// Cấu hình cột đầy đủ (KpiReportHeadersConfig) — cột đầu ghim trái, còn lại cuộn phải.
+// onToggleExpand: bật/tắt cờ 'specificExpand' trên item khi user bấm nút mở rộng dòng.
+const kpiAllHeaders = KpiReportHeadersConfig((item: TYPE_ITEM_DATA_TABLE) => {
+  item.update((val: TYPE_OBJECT) => ({ ...val, specificExpand: !val['specificExpand'] }));
+});
 
-toggleExpand(item: any): void {
-  item.update((val: any) => ({ ...val, specificExpand: !val.specificExpand }));
-}
+// [headerLeft]="kpiHeadersLeft" / [headerRight]="kpiHeadersRight"
+readonly kpiHeadersLeft: Array<ITableHeaderConfig> = kpiAllHeaders.slice(0, 1);
+readonly kpiHeadersRight: Array<ITableHeaderConfig> = kpiAllHeaders.slice(1);
+
+// [configTemplateItemCollapseExpand]="kpiExpandConfig" — cấu hình render HTML mở rộng của dòng
+readonly kpiExpandConfig: IConfigTemplateItemCollapseExpand = KpiReportExpandConfig();
+
+// [newData]="kpiData"
+readonly kpiData: TYPE_NEW_DATA_TABLE = { data: convertObjectToSignal(KpiReportMockData()) };
 ```
 
-> ⚠️ **Collapse/Expand**: Mỗi item trong `data` phải có trường `specificExpand: boolean` để điều hướng state ẩn/hiện. Trường dữ liệu mở rộng được khai báo qua `fieldGetDataExpand`.
+> ⚠️ **Collapse/Expand**: Mỗi item trong `data` phải có trường `specificExpand: boolean` để điều hướng state ẩn/hiện. Trường dữ liệu mở rộng được khai báo qua `fieldGetDataExpand` (mặc định `'expand_data'`).
 
 ---
 
@@ -384,31 +414,35 @@ import { LibsUiComponentsTableComponent, ITableHeaderConfig, TYPE_NEW_DATA_TABLE
 import { convertObjectToSignal } from '@libs-ui/utils';
 import { TYPE_OBJECT } from '@libs-ui/interfaces-types';
 
-readonly COL_COUNT = 1000;
-readonly ROW_COUNT = 30;
+const PERF_COL_COUNT = 1000;
+const PERF_ROW_COUNT = 30;
 
-public handlerGetWidthItem = async () => 64; // px — phải khớp min-w / max-w trong ngClass header
-
-readonly headerPerformanceStress: Array<ITableHeaderConfig> = Array.from(
-  { length: this.COL_COUNT },
-  (_, i) => ({
+function buildPerformanceStressHeaders(): Array<ITableHeaderConfig> {
+  return Array.from({ length: PERF_COL_COUNT }, (_, i) => ({
     label: `C${i + 1}`,
     ngClass: { 'shrink-0 min-w-[64px] max-w-[64px]': true },
     colTemplateConfig: [{
       cssWrapper: 'text-xs font-mono truncate max-w-[64px]',
       fieldsConfig: [{ field: `f${i}` }],
     }],
-  })
-);
+  }));
+}
 
+function buildPerformanceStressRows(): Array<TYPE_OBJECT> {
+  return Array.from({ length: PERF_ROW_COUNT }, (_, row) => {
+    const rowObj: TYPE_OBJECT = { id: row + 1 };
+    for (let c = 0; c < PERF_COL_COUNT; c++) {
+      rowObj[`f${c}`] = `${row + 1}-${c + 1}`;
+    }
+    return rowObj;
+  });
+}
+
+// ${PERF_COL_COUNT} cột × ${PERF_ROW_COUNT} dòng — đo FPS / Scripting time trong Performance.
+public handlerGetWidthItem = async () => 64; // Kích thước cột px thực tế
+readonly headerPerformanceStress = buildPerformanceStressHeaders();
 readonly dataPerformanceStress: TYPE_NEW_DATA_TABLE = {
-  data: convertObjectToSignal(
-    Array.from({ length: this.ROW_COUNT }, (_, row) => {
-      const obj: TYPE_OBJECT = { id: row + 1 };
-      for (let c = 0; c < this.COL_COUNT; c++) obj[`f${c}`] = `${row + 1}-${c + 1}`;
-      return obj;
-    })
-  ),
+  data: convertObjectToSignal(buildPerformanceStressRows()),
 };
 ```
 
@@ -438,41 +472,48 @@ import { LibsUiComponentsTableComponent, ITableHeaderConfig, TYPE_NEW_DATA_TABLE
 import { convertObjectToSignal } from '@libs-ui/utils';
 import { TYPE_OBJECT } from '@libs-ui/interfaces-types';
 
-readonly RIGHT_COL_COUNT = 3000;
-readonly ROW_COUNT = 50;
-
-public handlerGetWidthItem = async () => 64;
-
-readonly headerLeftPinnedScroll: Array<ITableHeaderConfig> = [
-  {
-    label: 'ID',
-    ngClass: { 'shrink-0 min-w-[80px] max-w-[80px]': true },
-    colTemplateConfig: [{ cssWrapper: 'text-xs font-mono text-gray-500 truncate max-w-[80px]', fieldsConfig: [{ field: 'id' }] }],
-  },
-  {
-    label: 'Name',
-    ngClass: { 'shrink-0 min-w-[160px] max-w-[160px]': true },
-    colTemplateConfig: [{ cssWrapper: 'text-xs font-semibold truncate max-w-[160px]', fieldsConfig: [{ field: 'name' }] }],
-  },
-];
+const PINNED_SCROLL_RIGHT_COL_COUNT = 3000;
+const PINNED_SCROLL_ROW_COUNT = 50;
+
+function buildPinnedScrollHeaderLeft(): Array<ITableHeaderConfig> {
+  return [
+    {
+      label: 'ID',
+      ngClass: { 'shrink-0 min-w-[80px] max-w-[80px]': true },
+      colTemplateConfig: [{ cssWrapper: 'text-xs font-mono text-gray-500 truncate max-w-[80px]', fieldsConfig: [{ field: 'id' }] }],
+    },
+    {
+      label: 'Name',
+      ngClass: { 'shrink-0 min-w-[160px] max-w-[160px]': true },
+      colTemplateConfig: [{ cssWrapper: 'text-xs font-semibold truncate max-w-[160px]', fieldsConfig: [{ field: 'name' }] }],
+    },
+  ];
+}
 
-readonly headerRightPinnedScroll: Array<ITableHeaderConfig> = Array.from(
-  { length: this.RIGHT_COL_COUNT },
-  (_, i) => ({
+function buildPinnedScrollHeaderRight(): Array<ITableHeaderConfig> {
+  return Array.from({ length: PINNED_SCROLL_RIGHT_COL_COUNT }, (_, i) => ({
     label: `M${i + 1}`,
     ngClass: { 'shrink-0 min-w-[64px] max-w-[64px]': true },
     colTemplateConfig: [{ cssWrapper: 'text-xs font-mono truncate max-w-[64px]', fieldsConfig: [{ field: `m${i}` }] }],
-  })
-);
+  }));
+}
 
+function buildPinnedScrollRows(): Array<TYPE_OBJECT> {
+  return Array.from({ length: PINNED_SCROLL_ROW_COUNT }, (_, row) => {
+    const rowObj: TYPE_OBJECT = { id: row + 1, name: `User ${row + 1}` };
+    for (let c = 0; c < PINNED_SCROLL_RIGHT_COL_COUNT; c++) {
+      rowObj[`m${c}`] = `${row + 1}-${c + 1}`;
+    }
+    return rowObj;
+  });
+}
+
+// Ghim 2 cột bên trái (ID, Name) + ${PINNED_SCROLL_RIGHT_COL_COUNT} cột bên phải dùng virtual scroll cột ngang.
+public handlerGetWidthItem = async () => 64; // Kích thước cột px thực tế (khớp min-w / max-w trong header)
+readonly headerLeftPinnedScroll = buildPinnedScrollHeaderLeft();
+readonly headerRightPinnedScroll = buildPinnedScrollHeaderRight();
 readonly dataPinnedScroll: TYPE_NEW_DATA_TABLE = {
-  data: convertObjectToSignal(
-    Array.from({ length: this.ROW_COUNT }, (_, row) => {
-      const obj: TYPE_OBJECT = { id: row + 1, name: `User ${row + 1}` };
-      for (let c = 0; c < this.RIGHT_COL_COUNT; c++) obj[`m${c}`] = `${row + 1}-${c + 1}`;
-      return obj;
-    })
-  ),
+  data: convertObjectToSignal(buildPinnedScrollRows()),
 };
 ```
 
@@ -744,14 +785,6 @@ const requestConfig: IHttpRequestConfig = {
 
 ---
 
-## Demo
-
-```bash
-npx nx serve core-ui
-```
-
-Truy cập: `http://localhost:4500/table`
-
 ## License
 
 MIT

package/esm2022/interfaces/function-control-event.interface.mjs

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvdGFibGUvc3JjL2ludGVyZmFjZXMvZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFdyaXRhYmxlU2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBWaXJ0dWFsU2Nyb2xsZXJDb21wb25lbnQgfSBmcm9tICdAaWhhcmJlY2svbmd4LXZpcnR1YWwtc2Nyb2xsZXInO1xuaW1wb3J0IHsgVFlQRV9PQkpFQ1QgfSBmcm9tICdAbGlicy11aS9pbnRlcmZhY2VzLXR5cGVzJztcbmltcG9ydCB7IFRZUEVfREFUQV9UQUJMRSwgVFlQRV9JVEVNX0RBVEFfVEFCTEUgfSBmcm9tICcuL3RhYmxlLnR5cGUnO1xuXG5leHBvcnQgaW50ZXJmYWNlIElUYWJsZUZ1bmN0aW9uQ29udHJvbEV2ZW50IHtcbiAgcmVzZXQ6IChjbGVhclNvcnQ/OiBib29sZWFuKSA9PiB2b2lkO1xuICBjYWxsQXBpQnlTZXJ2aWNlOiAoZmlyc3RDYWxsOiBib29sZWFuLCByZXNldEFmdGVyQ2FsbEFwaT86IGJvb2xlYW4sIGlzQ2hhbmdlUGFnZT86IGJvb2xlYW4pID0+IHZvaWQ7XG4gIHJlc2V0U2Nyb2xsOiAoc2Nyb2xsUG9zaXRpb25MZWZ0PzogbnVtYmVyLCBzY3JvbGxQb3NpdGlvblRvcD86IG51bWJlcikgPT4gdm9pZDtcbiAgcmVtb3ZlSXRlbXM6IChrZXlzOiBBcnJheTx1bmtub3duPiwgaWdub3JlUmVDYWxsRm9vdGVyPzogYm9vbGVhbiwgYXV0b0NvdW50TmV3SXRlbT86IGJvb2xlYW4pID0+IHZvaWQ7XG4gIGFkZEl0ZW1zOiAoaXRlbXM6IFRZUEVfREFUQV9UQUJMRSwgYWRkRmlyc3Q6IGJvb2xlYW4sIGlnbm9yZUhpZ2h0TGlnaHQ/OiBib29sZWFuLCBpZ25vcmVSZUNhbGxGb290ZXI/OiBib29sZWFuLCBhdXRvQ291bnROZXdJdGVtPzogYm9vbGVhbikgPT4gdm9pZDtcbiAgZ2V0U2Nyb2xsQ29udGFpbmVyOiAoKSA9PiBWaXJ0dWFsU2Nyb2xsZXJDb21wb25lbnQ7XG4gIGhpZGVUb29sQmFyQm90dG9tOiAoKSA9PiB2b2lkO1xuICByZXNldEtleVNlbGVjdGVkOiAoKSA9PiB2b2lkO1xuICBkZXRlY3RDaGFuZ2VzOiAoKSA9PiB2b2lkO1xuICBzZXRDb3VudFBhZ2luZ1N0b3JlOiAoY291bnQ6IG51bWJlcikgPT4gdm9pZDtcbiAgZ2V0Q291bnQ6ICgpID0+IG51bWJlcjtcbiAgZ2V0U3RvcmU6ICgpID0+IEFycmF5PFdyaXRhYmxlU2lnbmFsPFRZUEVfT0JKRUNUPj47XG4gIGdldEl0ZW1zOiAoKSA9PiBBcnJheTxXcml0YWJsZVNpZ25hbDxUWVBFX09CSkVDVD4+O1xuICBoaWdodExpZ2h0SXRlbTogKGl0ZW1zOiBBcnJheTxUWVBFX0lURU1fREFUQV9UQUJMRT4pID0+IFByb21pc2U8dm9pZD47XG4gIGNoYW5nZVBhZ2luYXRpb246IChwYWdlPzpudW1iZXIpID0+IFByb21pc2U8dm9pZD47XG59XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvdGFibGUvc3JjL2ludGVyZmFjZXMvZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFdyaXRhYmxlU2lnbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBWaXJ0dWFsU2Nyb2xsZXJDb21wb25lbnQgfSBmcm9tICdAaWhhcmJlY2svbmd4LXZpcnR1YWwtc2Nyb2xsZXInO1xuaW1wb3J0IHsgVFlQRV9PQkpFQ1QgfSBmcm9tICdAbGlicy11aS9pbnRlcmZhY2VzLXR5cGVzJztcbmltcG9ydCB7IFRZUEVfREFUQV9UQUJMRSwgVFlQRV9JVEVNX0RBVEFfVEFCTEUgfSBmcm9tICcuL3RhYmxlLnR5cGUnO1xuXG5leHBvcnQgaW50ZXJmYWNlIElUYWJsZUZ1bmN0aW9uQ29udHJvbEV2ZW50IHtcbiAgcmVzZXQ6IChjbGVhclNvcnQ/OiBib29sZWFuKSA9PiB2b2lkO1xuICBjYWxsQXBpQnlTZXJ2aWNlOiAoZmlyc3RDYWxsOiBib29sZWFuLCByZXNldEFmdGVyQ2FsbEFwaT86IGJvb2xlYW4sIGlzQ2hhbmdlUGFnZT86IGJvb2xlYW4pID0+IHZvaWQ7XG4gIHJlc2V0U2Nyb2xsOiAoc2Nyb2xsUG9zaXRpb25MZWZ0PzogbnVtYmVyLCBzY3JvbGxQb3NpdGlvblRvcD86IG51bWJlcikgPT4gdm9pZDtcbiAgcmVtb3ZlSXRlbXM6IChrZXlzOiBBcnJheTx1bmtub3duPiwgaWdub3JlUmVDYWxsRm9vdGVyPzogYm9vbGVhbiwgYXV0b0NvdW50TmV3SXRlbT86IGJvb2xlYW4pID0+IHZvaWQ7XG4gIGFkZEl0ZW1zOiAoaXRlbXM6IFRZUEVfREFUQV9UQUJMRSwgYWRkRmlyc3Q6IGJvb2xlYW4sIGlnbm9yZUhpZ2h0TGlnaHQ/OiBib29sZWFuLCBpZ25vcmVSZUNhbGxGb290ZXI/OiBib29sZWFuLCBhdXRvQ291bnROZXdJdGVtPzogYm9vbGVhbikgPT4gdm9pZDtcbiAgZ2V0U2Nyb2xsQ29udGFpbmVyOiAoKSA9PiBWaXJ0dWFsU2Nyb2xsZXJDb21wb25lbnQ7XG4gIGhpZGVUb29sQmFyQm90dG9tOiAoKSA9PiB2b2lkO1xuICByZXNldEtleVNlbGVjdGVkOiAoKSA9PiB2b2lkO1xuICBkZXRlY3RDaGFuZ2VzOiAoKSA9PiB2b2lkO1xuICBzZXRDb3VudFBhZ2luZ1N0b3JlOiAoY291bnQ6IG51bWJlcikgPT4gdm9pZDtcbiAgZ2V0Q291bnQ6ICgpID0+IG51bWJlcjtcbiAgZ2V0U3RvcmU6ICgpID0+IEFycmF5PFdyaXRhYmxlU2lnbmFsPFRZUEVfT0JKRUNUPj47XG4gIGdldEl0ZW1zOiAoKSA9PiBBcnJheTxXcml0YWJsZVNpZ25hbDxUWVBFX09CSkVDVD4+O1xuICBoaWdodExpZ2h0SXRlbTogKGl0ZW1zOiBBcnJheTxUWVBFX0lURU1fREFUQV9UQUJMRT4pID0+IFByb21pc2U8dm9pZD47XG4gIGNoYW5nZVBhZ2luYXRpb246IChwYWdlPzogbnVtYmVyKSA9PiBQcm9taXNlPHZvaWQ+O1xuICBnZXRJbmRleEJ5SXRlbTogKGl0ZW06IFRZUEVfSVRFTV9EQVRBX1RBQkxFKSA9PiBQcm9taXNlPG51bWJlcj47XG59XG4iXX0=