@sd-angular/core 19.0.40 → 19.0.41

package/components/table/src/components/desktop-cell/desktop-cell.component.d.ts

@@ -9,7 +9,7 @@ export declare class DesktopCellComponent {
     column: import("@angular/core").InputSignal<SdTableColumn>;
     item: import("@angular/core").InputSignal<SdTableItem<any>>;
     cellDef: import("@angular/core").InputSignal<Record<string, SdTableCellDefDirective<any>>>;
-    value: import("@angular/core").Signal<unknown>;
+    value: import("@angular/core").Signal<any>;
     key: import("@angular/core").Signal<any>;
     autoId: import("@angular/core").Signal<string>;
     truncateEnable: import("@angular/core").Signal<boolean | undefined>;

package/components/table/src/services/field-value.util.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Reads a row value by table field (`column.field`, group field) for every table read path.
+ *
+ * why (NSP-5745): `@sdcorejs/utils` 1.2 parses property paths strictly and throws
+ * `UnsafePropertyPathError` for a segment with whitespace or a path with leading/trailing
+ * whitespace. Tables whose columns come from backend data (for example import headers such as
+ * "Số phòng ngủ" or "Loại sản phẩm*") then failed the whole read with "Không thể tải dữ liệu".
+ *
+ * A path that utils accepts keeps the exact `getNestedValue` result. A path that utils rejects
+ * falls back to the 1.1.x dot-split lookup, restricted to own data properties (no inherited
+ * values, no getters), never through a prototype-sensitive segment and never into a prototype
+ * object.
+ */
+export declare function resolveFieldValue<T = any>(source: unknown, field: unknown): T | undefined;

package/fesm2022/sd-angular-core-components-table.mjs

@@ -1477,6 +1477,91 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
                     ], providers: [ConfigService], template: "@let _configuration = configuration();\n@let _autoId = autoId();\n\n<sd-modal width=\"sm\" [title]=\"'core.component.table.setup' | translate\" #modal>\n  @if (_configuration) {\n    <div class=\"c-container\">\n      <div class=\"c-table\" style=\"max-height: 70vh\">\n        <table\n          mat-table\n          [dataSource]=\"_configuration.columns!\"\n          cdkDropList\n          [cdkDropListData]=\"_configuration.columns\"\n          (cdkDropListDropped)=\"dropTable($event)\">\n          <ng-container matColumnDef=\"invisible\">\n            <th mat-header-cell class=\"c-th text-center px-4\" *matHeaderCellDef style=\"width: 96px\">\n              {{ 'core.component.form-builder.display' | translate }}\n            </th>\n            <td class=\"text-center px-4\" mat-cell *matCellDef=\"let item\">\n              <div class=\"d-flex\" style=\"gap: 8px\">\n                <div class=\"c-handle\" (mousedown)=\"handleMouseDown()\" (mouseup)=\"handleMouseUp()\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#5f6368\">\n                    <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n                    <path\n                      d=\"M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\" />\n                  </svg>\n                </div>\n                <sd-switch [model]=\"!item.invisible\" (modelChange)=\"item.invisible = !item.invisible\" />\n              </div>\n            </td>\n          </ng-container>\n          <ng-container matColumnDef=\"title\">\n            <th mat-header-cell class=\"c-th px-4\" *matHeaderCellDef>\n              {{ 'core.component.table.column-header' | translate }}\n            </th>\n            <td class=\"px-4\" mat-cell *matCellDef=\"let item\">\n              <sd-input [clearable]=\"true\" class=\"py-4\" size=\"sm\" [placeholder]=\"item?.origin?.title\" [(model)]=\"item.title\" hideInlineError></sd-input>\n            </td>\n          </ng-container>\n          <ng-container matColumnDef=\"width\">\n            <th mat-header-cell class=\"c-th px-4\" *matHeaderCellDef style=\"width: 80px\">\n              {{ 'core.component.table.width' | translate }}\n            </th>\n            <td class=\"px-4\" mat-cell *matCellDef=\"let item\">\n              <sd-input class=\"py-4\" size=\"sm\" [placeholder]=\"item?.origin?.width\" [(model)]=\"item.width\" hideInlineError></sd-input>\n            </td>\n          </ng-container>\n          <ng-container matColumnDef=\"fixed\">\n            <th mat-header-cell class=\"c-th text-center px-4\" *matHeaderCellDef style=\"width: 80px\">\n              {{ 'core.component.table.fixed' | translate }}\n            </th>\n            <td class=\"text-center px-4\" mat-cell *matCellDef=\"let item\">\n              <sd-switch [(model)]=\"item.fixed\" />\n            </td>\n          </ng-container>\n\n          <ng-container matColumnDef=\"truncate\">\n            <th mat-header-cell class=\"c-th text-center px-4\" *matHeaderCellDef style=\"width: 100px\">\n              {{ 'core.component.table.char-limit' | translate }}\n            </th>\n            <td class=\"text-center px-4\" mat-cell *matCellDef=\"let item\">\n              <sd-switch [(model)]=\"item.truncate\" />\n            </td>\n          </ng-container>\n\n          <tr mat-header-row *matHeaderRowDef=\"['invisible', 'title', 'width', 'fixed', 'truncate']; sticky: true\"></tr>\n          <tr\n            mat-row\n            *matRowDef=\"let row; columns: ['invisible', 'title', 'width', 'fixed', 'truncate']\"\n            cdkDrag\n            [cdkDragData]=\"row\"\n            cdkDragLockAxis=\"y\"\n            [cdkDragDisabled]=\"dragDisabled\">\n          </tr>\n        </table>\n      </div>\n    </div>\n  }\n  <ng-container sdFooter>\n    <sd-button [autoId]=\"_autoId ? _autoId + '-config-skip' : null\" class=\"mr-8\" (click)=\"close()\" [title]=\"'core.component.table.skip' | translate\" color=\"secondary\"> </sd-button>\n    <sd-button [autoId]=\"_autoId ? _autoId + '-config-reset' : null\" class=\"mr-8\" (click)=\"onReset()\" [title]=\"'core.component.form-builder.default' | translate\" color=\"primary\"> </sd-button>\n    <sd-button [autoId]=\"_autoId ? _autoId + '-config-apply' : null\" (click)=\"onSave()\" [title]=\"'core.component.table.apply' | translate\" type=\"fill\" color=\"primary\"> </sd-button>\n  </ng-container>\n</sd-modal>\n", styles: [".c-table{position:relative;overflow:auto}.c-table table{width:100%}.c-table .c-th{font-weight:500;font-size:14px;line-height:20px;color:#000}.c-container{position:relative;min-height:200px}.c-handle{color:#ccc;cursor:move}\n"] }]
         }], ctorParameters: () => [] });
 
+/** Segments that must never be traversed, matching the `@sdcorejs/utils` 1.2 safe-key rule. */
+const PROTOTYPE_SEGMENTS = new Set(['__proto__', 'prototype', 'constructor']);
+/** Upper bound for the per-field cache; column/group fields are a small, stable set in practice. */
+const MAX_CACHED_FIELDS = 1000;
+/** `true` when `@sdcorejs/utils` rejects the field as a property path. */
+const rejectedFields = new Map();
+/**
+ * Reads a row value by table field (`column.field`, group field) for every table read path.
+ *
+ * why (NSP-5745): `@sdcorejs/utils` 1.2 parses property paths strictly and throws
+ * `UnsafePropertyPathError` for a segment with whitespace or a path with leading/trailing
+ * whitespace. Tables whose columns come from backend data (for example import headers such as
+ * "Số phòng ngủ" or "Loại sản phẩm*") then failed the whole read with "Không thể tải dữ liệu".
+ *
+ * A path that utils accepts keeps the exact `getNestedValue` result. A path that utils rejects
+ * falls back to the 1.1.x dot-split lookup, restricted to own data properties (no inherited
+ * values, no getters), never through a prototype-sensitive segment and never into a prototype
+ * object.
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function resolveFieldValue(source, field) {
+    if (!isTraversable(source))
+        return undefined;
+    if (typeof field !== 'string' || field === '')
+        return undefined;
+    if (isRejectedPath(field))
+        return readOwnDotPath(source, field);
+    try {
+        return Utilities.getNestedValue(source, field);
+    }
+    catch {
+        // why: for an accepted path utils 1.2.4 only throws when the traversal meets a prototype
+        // object, which this resolver never reads (same result as the fallback).
+        return undefined;
+    }
+}
+/**
+ * Detects a path that `@sdcorejs/utils` rejects, once per field.
+ *
+ * why: matching `instanceof UnsafePropertyPathError` is unreliable. `@sdcorejs/utils/fns` and
+ * `@sdcorejs/utils/errors` each ship their own copy of the class, and an application bundler
+ * renames one of them, so the brand check fails in bundled apps. An empty own-property root can
+ * only make `getNestedValue` throw for the path itself, so the probe needs no error type. The
+ * cache also keeps sort/filter loops from paying for a thrown exception on every row.
+ */
+function isRejectedPath(field) {
+    const cached = rejectedFields.get(field);
+    if (cached !== undefined)
+        return cached;
+    let rejected = false;
+    try {
+        Utilities.getNestedValue({}, field);
+    }
+    catch {
+        rejected = true;
+    }
+    if (rejectedFields.size >= MAX_CACHED_FIELDS)
+        rejectedFields.clear();
+    rejectedFields.set(field, rejected);
+    return rejected;
+}
+function readOwnDotPath(source, field) {
+    let current = source;
+    for (const segment of field.split('.')) {
+        if (PROTOTYPE_SEGMENTS.has(segment))
+            return undefined;
+        if (!isTraversable(current))
+            return undefined;
+        const descriptor = Object.getOwnPropertyDescriptor(current, segment);
+        if (!descriptor || !('value' in descriptor))
+            return undefined;
+        current = descriptor.value;
+    }
+    return isPrototypeObject(current) ? undefined : current;
+}
+/** Non-null object or function that is not a built-in prototype object. */
+function isTraversable(value) {
+    if (value === null || (typeof value !== 'object' && typeof value !== 'function'))
+        return false;
+    return !isPrototypeObject(value);
+}
+function isPrototypeObject(value) {
+    return value === Object.prototype || value === Function.prototype;
+}
+
 class ToStringPipe {
     transform(value) {
         return value !== null && value !== undefined ? String(value) : '';
@@ -1547,7 +1632,7 @@ class DesktopCellComponent {
     item = input.required();
     cellDef = input.required({});
     value = computed(() => {
-        return Utilities.getNestedValue(this.item()?.data, this.column()?.field);
+        return resolveFieldValue(this.item()?.data, this.column()?.field);
     });
     key = computed(() => {
         const data = this.item()?.data;
@@ -2344,12 +2429,12 @@ class SdGroupPipe {
         const collapsible = !!group.collapsible;
         const defaultExpanded = !group.defaultCollapsed;
         // Bucket items theo combined field-value hash.
-        // Field hỗ trợ dot-notation (vd 'customer.id') — resolve qua getNestedValue.
+        // Field hỗ trợ dot-notation (vd 'customer.id') và key có khoảng trắng (NSP-5745) — resolve qua resolveFieldValue.
         const buckets = new Map();
         for (const item of items) {
             const values = {};
             for (const f of fields)
-                values[f] = Utilities.getNestedValue(item.data, f);
+                values[f] = resolveFieldValue(item.data, f);
             const key = Utilities.hash(values);
             let bucket = buckets.get(key);
             if (!bucket) {
@@ -2657,11 +2742,11 @@ class TableExportService {
                 for (const item of exportItems) {
                     const obj = {};
                     const handle = async (exportColumn) => {
-                        obj[exportColumn.field] = Utilities.getNestedValue(item, exportColumn.field);
+                        obj[exportColumn.field] = resolveFieldValue(item, exportColumn.field);
                         const column = allColumns.find(e => e.field === exportColumn.field);
                         const exportedColumn = allExportedColumns.find(e => e.field === exportColumn.field);
                         if (exportedColumn?.transform) {
-                            obj[exportedColumn.field] = exportedColumn.transform(Utilities.getNestedValue(item, exportedColumn.field), item);
+                            obj[exportedColumn.field] = exportedColumn.transform(resolveFieldValue(item, exportedColumn.field), item);
                             return;
                         }
                         if (!column)
@@ -2676,7 +2761,7 @@ class TableExportService {
                         }
                         if (!columns.some(e => e.field === column.field))
                             return;
-                        const itemValue = Utilities.getNestedValue(item, column.field);
+                        const itemValue = resolveFieldValue(item, column.field);
                         const fieldStr = column.field;
                         if (column.transform) {
                             const transform = column.transform(itemValue, item, { isExport: true });
@@ -2934,7 +3019,7 @@ class TableFormatService {
                 const { option: { views, valueField, displayField }, } = column;
                 cacheObjValues[fieldStr] = cacheObjValues[fieldStr] || {};
                 const values = ArrayUtilities.distinct(items
-                    .map(item => Utilities.getNestedValue(item.data, fieldStr))
+                    .map(item => resolveFieldValue(item.data, fieldStr))
                     .filter(val => val?.toString())
                     .reduce((current, next) => [...current, ...(Array.isArray(next) ? next : [next])], [])
                     .filter(val => !Object.keys(cacheObjValues[fieldStr]).includes(val)));
@@ -2958,7 +3043,16 @@ class TableFormatService {
             // Format dữ liệu cho từng hàng
             for (const item of items) {
                 const rowData = item.data;
-                const value = Utilities.getNestedValue(rowData, fieldStr);
+                // why: đọc giá trị cũng thuộc phạm vi một ô (NSP-5745) — lỗi bất ngờ khi đọc field chỉ làm ô
+                // hiện rỗng, không được biến lượt đọc thành công thành "Không thể tải dữ liệu".
+                let value;
+                try {
+                    value = resolveFieldValue(rowData, fieldStr);
+                }
+                catch (error) {
+                    report(error);
+                    value = undefined;
+                }
                 item.meta.display[fieldStr] = {
                     badge: undefined,
                     cellStyle: column.align === 'right' ? { 'text-align': 'right!important' } : undefined,
@@ -3161,7 +3255,7 @@ const matchesColumnFilter = (data, columns = [], rawColumnFilter = {}) => {
     for (const column of columns) {
         const { field, type } = column;
         const filterValue = (rawColumnFilter[field] || '').toString().trim().toLowerCase();
-        const rawColVal = Utilities.getNestedValue(data, field);
+        const rawColVal = resolveFieldValue(data, field);
         const columnValue = (rawColVal || '').toString().trim().toLowerCase();
         if (filterValue) {
             if (!columnValue && type !== 'datetime' && type !== 'date' && type !== 'time') {
@@ -3261,8 +3355,8 @@ const filterLocalItems = (localItems, option, filterInfo) => {
         if (column) {
             const { type, field } = column;
             items.sort((tableItemCurrent, tableItemNext) => {
-                const dataVal = Utilities.getNestedValue(resolveItemData(tableItemCurrent), field);
-                const nextVal = Utilities.getNestedValue(resolveItemData(tableItemNext), field);
+                const dataVal = resolveFieldValue(resolveItemData(tableItemCurrent), field);
+                const nextVal = resolveFieldValue(resolveItemData(tableItemNext), field);
                 return compareLocalValues(dataVal, nextVal, type, orderDirection);
             });
         }