@sd-angular/core 0.0.927 → 0.0.928

package/esm2015/grid-material/src/lib/models/grid.model.js

@@ -1,2 +1,2 @@
 export {};
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZC5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9uZ2hpYXR0MTUvRGVza3RvcC9Xb3JraW5nLzFNRy9saWItY29yZS11aS9wcm9qZWN0cy9zZC1jb3JlL2dyaWQtbWF0ZXJpYWwvIiwic291cmNlcyI6WyJzcmMvbGliL21vZGVscy9ncmlkLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcclxuZXhwb3J0IGludGVyZmFjZSBFZGl0b3JIYW5kbGVyIHtcclxuICBbY29sdW1uOiBzdHJpbmddOiB7XHJcbiAgICB2aXNpYmxlPzogYm9vbGVhbiB8ICdjcmVhdGUnIHwgJ3VwZGF0ZScsXHJcbiAgICBpdGVtcz86IGFueVtdIHwgT2JzZXJ2YWJsZTxhbnlbXT5cclxuICB9O1xyXG59XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIFNkSXRlbSB7XHJcbiAgaXNTZWxlY3RlZD86IGJvb2xlYW47XHJcbiAgaXNFeHBhbmRlZD86IGJvb2xlYW47XHJcbiAgaXNFeHBhbmRpbmc/OiBib29sZWFuO1xyXG4gIGV4cGFuZERldGFpbD86IGFueTtcclxuICBlZGl0b3JTdGF0dXM/OiAnY3JlYXRlJyB8ICd1cGRhdGUnO1xyXG4gIC8vIGVkaXRvckhhbmRsZXI/OiBFZGl0b3JIYW5kbGVyICYge1xyXG4gIC8vICAgZGlzYWJsZWQ/OiBib29sZWFuO1xyXG4gIC8vICAgZXJyb3JNZXNzYWdlPzogc3RyaW5nO1xyXG4gIC8vICAgc2F2aW5nPzogYm9vbGVhbjtcclxuICAvLyB9O1xyXG4gIGVkaXRvckhhbmRsZXJSb3c/OiBFZGl0b3JIYW5kbGVyUm93LFxyXG4gIGVkaXRvckhhbmRsZXJDb2x1bW4/OiB7XHJcbiAgICBba2V5OiBzdHJpbmddOiB7XHJcbiAgICAgIHZpc2libGU6IGJvb2xlYW47XHJcbiAgICAgIGVycm9yTWVzc2FnZT86IHN0cmluZztcclxuICAgIH1cclxuICB9XHJcbn1cclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgRWRpdG9ySGFuZGxlclJvdyB7XHJcbiAgdmlzaWJsZTogYm9vbGVhbjtcclxuICBzdGF0dXM/OiAnY3JlYXRlJyB8ICd1cGRhdGUnO1xyXG4gIGVkaXRhYmxlPzogYm9vbGVhbjtcclxuICByZW1vdmFibGU/OiBib29sZWFuO1xyXG4gIGVycm9yTWVzc2FnZT86IHN0cmluZztcclxuICBpc0lubGluZT86IGJvb2xlYW47XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIHNhdmluZz86IGJvb2xlYW47XHJcbn1cclxuXHJcbmV4cG9ydCB0eXBlIFNkR3JpZE1hdGVyaWFsSXRlbTxUID0gYW55PiA9IFQgJiBTZEl0ZW07XHJcblxyXG5cclxuXHJcbi8vIGV4cG9ydCBpbnRlcmZhY2UgU2RHcmlkTWF0ZXJpYWxJdGVtPFQgPSBhbnk+IHtcclxuLy8gICBpc1NlbGVjdGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGluZz86IGJvb2xlYW47XHJcbi8vICAgZXhwYW5kRGV0YWlsPzogYW55O1xyXG4vLyB9XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRJdGVtIHtcclxuICBibGlua2VyPzogYW55O1xyXG4gIG9yaWdpbkl0ZW0/OiBhbnk7XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIGlzQ2hlY2tlZD86IGJvb2xlYW47XHJcbiAgZWRpdGluZ1N0YXR1cz86ICdjcmVhdGUnIHwgJ3VwZGF0ZSc7XHJcbiAgZWRpdG9ySGFuZGxlcj86IEVkaXRvckhhbmRsZXIgJiB7XHJcbiAgICBkaXNhYmxlZD86IGJvb2xlYW47XHJcbiAgICBlcnJvck1lc3NhZ2U/OiBzdHJpbmc7XHJcbiAgICBzYXZpbmc/OiBib29sZWFuO1xyXG4gIH07XHJcbiAgc3ViSW5mb3JtYXRpb24/OiB7XHJcbiAgICBpc09wZW5lZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRlZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xyXG4gICAgc3ViSXRlbXM/OiBhbnlbXTtcclxuICB9O1xyXG4gIFtrZXk6IHN0cmluZ106IGFueTtcclxufSJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZC5tb2RlbC5qcyIsInNvdXJjZVJvb3QiOiJDOi9Vc2Vycy9uZ2hpYXR0MTUvRGVza3RvcC9Xb3JraW5nLzFNRy9saWItY29yZS11aS9wcm9qZWN0cy9zZC1jb3JlL2dyaWQtbWF0ZXJpYWwvIiwic291cmNlcyI6WyJzcmMvbGliL21vZGVscy9ncmlkLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSBcInJ4anNcIjtcclxuZXhwb3J0IGludGVyZmFjZSBFZGl0b3JIYW5kbGVyIHtcclxuICBbY29sdW1uOiBzdHJpbmddOiB7XHJcbiAgICB2aXNpYmxlPzogYm9vbGVhbiB8ICdjcmVhdGUnIHwgJ3VwZGF0ZScsXHJcbiAgICBpdGVtcz86IGFueVtdIHwgT2JzZXJ2YWJsZTxhbnlbXT5cclxuICB9O1xyXG59XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIFNkSXRlbSB7XHJcbiAgaXNTZWxlY3RlZD86IGJvb2xlYW47XHJcbiAgaXNFeHBhbmRlZD86IGJvb2xlYW47XHJcbiAgaXNFeHBhbmRpbmc/OiBib29sZWFuO1xyXG4gIGV4cGFuZERldGFpbD86IGFueTtcclxuICBlZGl0b3JTdGF0dXM/OiAnY3JlYXRlJyB8ICd1cGRhdGUnO1xyXG4gIC8vIGVkaXRvckhhbmRsZXI/OiBFZGl0b3JIYW5kbGVyICYge1xyXG4gIC8vICAgZGlzYWJsZWQ/OiBib29sZWFuO1xyXG4gIC8vICAgZXJyb3JNZXNzYWdlPzogc3RyaW5nO1xyXG4gIC8vICAgc2F2aW5nPzogYm9vbGVhbjtcclxuICAvLyB9O1xyXG4gIGVkaXRvckhhbmRsZXJSb3c/OiBFZGl0b3JIYW5kbGVyUm93LFxyXG4gIGVkaXRvckhhbmRsZXJDb2x1bW4/OiB7XHJcbiAgICBba2V5OiBzdHJpbmddOiB7XHJcbiAgICAgIHZpc2libGU6IGJvb2xlYW47XHJcbiAgICAgIGVycm9yTWVzc2FnZT86IHN0cmluZztcclxuICAgIH1cclxuICB9XHJcbn1cclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgRWRpdG9ySGFuZGxlclJvdyB7XHJcbiAgc3RhdHVzPzogJ2NyZWF0ZScgfCAndXBkYXRlJztcclxuICBlZGl0YWJsZT86IGJvb2xlYW47XHJcbiAgcmVtb3ZhYmxlPzogYm9vbGVhbjtcclxuICBzYXZhYmxlPzogYm9vbGVhbjtcclxuICBjYW5jZWxhYmxlPzogYm9vbGVhbjtcclxuICBlcnJvck1lc3NhZ2U/OiBzdHJpbmc7XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIHNhdmluZz86IGJvb2xlYW47XHJcbn1cclxuXHJcbmV4cG9ydCB0eXBlIFNkR3JpZE1hdGVyaWFsSXRlbTxUID0gYW55PiA9IFQgJiBTZEl0ZW07XHJcblxyXG5cclxuXHJcbi8vIGV4cG9ydCBpbnRlcmZhY2UgU2RHcmlkTWF0ZXJpYWxJdGVtPFQgPSBhbnk+IHtcclxuLy8gICBpc1NlbGVjdGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGVkPzogYm9vbGVhbjtcclxuLy8gICBpc0V4cGFuZGluZz86IGJvb2xlYW47XHJcbi8vICAgZXhwYW5kRGV0YWlsPzogYW55O1xyXG4vLyB9XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIEdyaWRJdGVtIHtcclxuICBibGlua2VyPzogYW55O1xyXG4gIG9yaWdpbkl0ZW0/OiBhbnk7XHJcbiAgdGVtcG9yYXJ5PzogYW55O1xyXG4gIGlzQ2hlY2tlZD86IGJvb2xlYW47XHJcbiAgZWRpdGluZ1N0YXR1cz86ICdjcmVhdGUnIHwgJ3VwZGF0ZSc7XHJcbiAgZWRpdG9ySGFuZGxlcj86IEVkaXRvckhhbmRsZXIgJiB7XHJcbiAgICBkaXNhYmxlZD86IGJvb2xlYW47XHJcbiAgICBlcnJvck1lc3NhZ2U/OiBzdHJpbmc7XHJcbiAgICBzYXZpbmc/OiBib29sZWFuO1xyXG4gIH07XHJcbiAgc3ViSW5mb3JtYXRpb24/OiB7XHJcbiAgICBpc09wZW5lZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRlZD86IGJvb2xlYW47XHJcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xyXG4gICAgc3ViSXRlbXM/OiBhbnlbXTtcclxuICB9O1xyXG4gIFtrZXk6IHN0cmluZ106IGFueTtcclxufSJdfQ==

package/esm2015/grid-material/src/lib/pipes/editor-handler-row.pipe.js

@@ -1,11 +1,9 @@
 import { Pipe } from '@angular/core';
 export class SdEditorHandlerRowPipe {
-    transform(item, gridOption) {
+    transform(status, item, gridOption) {
         const { editor } = gridOption;
         if (!editor) {
-            return {
-                visible: false
-            };
+            return null;
         }
         let isDisabled = false;
         if (typeof (editor === null || editor === void 0 ? void 0 : editor.disabled) === 'function') {
@@ -14,21 +12,21 @@ export class SdEditorHandlerRowPipe {
         else {
             isDisabled = editor === null || editor === void 0 ? void 0 : editor.disabled;
         }
+        if (isDisabled) {
+            return null;
+        }
         if (editor.type === 'inline') {
             const removable = editor.removable;
-            if (typeof (removable) === 'function') {
-                item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, removable: removable(item), isInline: true });
-                return item.editorHandlerRow;
-            }
-            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, removable: removable, isInline: true });
-            return item.editorHandlerRow;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: false, removable: status === 'update' && (typeof (removable) === 'function' ? removable(item) : removable), savable: false, cancelable: status === 'create' });
+        }
+        else if (editor.type === 'focus') {
+            const editable = editor.editable;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: !status && (typeof (editable) === 'function' ? editable(item) : editable), removable: false, savable: !!status, cancelable: !!status });
         }
-        const editable = editor.editable;
-        if (typeof (editable) === 'function') {
-            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, editable: editable(item), isInline: false });
-            return item.editorHandlerRow;
+        else if (editor.type === 'popup') {
+            const editable = editor.editable;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: !status && (typeof (editable) === 'function' ? editable(item) : editable), removable: false, savable: false, cancelable: false });
         }
-        item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, editable: editable, isInline: false });
         return item.editorHandlerRow;
     }
 }
@@ -37,4 +35,4 @@ SdEditorHandlerRowPipe.decorators = [
                 name: 'sdEditorHandlerRow'
             },] }
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLWhhbmRsZXItcm93LnBpcGUuanMiLCJzb3VyY2VSb290IjoiQzovVXNlcnMvbmdoaWF0dDE1L0Rlc2t0b3AvV29ya2luZy8xTUcvbGliLWNvcmUtdWkvcHJvamVjdHMvc2QtY29yZS9ncmlkLW1hdGVyaWFsLyIsInNvdXJjZXMiOlsic3JjL2xpYi9waXBlcy9lZGl0b3ItaGFuZGxlci1yb3cucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFpQixNQUFNLGVBQWUsQ0FBQztBQU1wRCxNQUFNLE9BQU8sc0JBQXNCO0lBQ2pDLFNBQVMsQ0FBQyxJQUFZLEVBQUUsVUFBZ0M7UUFDdEQsTUFBTSxFQUFFLE1BQU0sRUFBRSxHQUFHLFVBQVUsQ0FBQztRQUM5QixJQUFHLENBQUMsTUFBTSxFQUFFO1lBQ1YsT0FBTztnQkFDTCxPQUFPLEVBQUUsS0FBSzthQUNmLENBQUE7U0FDRjtRQUNELElBQUksVUFBVSxHQUFHLEtBQUssQ0FBQztRQUN2QixJQUFJLE9BQU8sQ0FBQyxNQUFNLGFBQU4sTUFBTSx1QkFBTixNQUFNLENBQUUsUUFBUSxDQUFDLEtBQUssVUFBVSxFQUFFO1lBQzVDLFVBQVUsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1NBQ3BDO2FBQU07WUFDTCxVQUFVLEdBQUcsTUFBTSxhQUFOLE1BQU0sdUJBQU4sTUFBTSxDQUFFLFFBQVEsQ0FBQztTQUMvQjtRQUNELElBQUksTUFBTSxDQUFDLElBQUksS0FBSyxRQUFRLEVBQUU7WUFDNUIsTUFBTSxTQUFTLEdBQUcsTUFBTSxDQUFDLFNBQVMsQ0FBQztZQUNuQyxJQUFJLE9BQU8sQ0FBQyxTQUFTLENBQUMsS0FBSyxVQUFVLEVBQUU7Z0JBQ3JDLElBQUksQ0FBQyxnQkFBZ0IsbUNBQ2hCLElBQUksQ0FBQyxnQkFBZ0IsS0FDeEIsT0FBTyxFQUFFLENBQUMsVUFBVSxFQUNwQixTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxFQUMxQixRQUFRLEVBQUUsSUFBSSxHQUNmLENBQUE7Z0JBQ0QsT0FBTyxJQUFJLENBQUMsZ0JBQWdCLENBQUM7YUFDOUI7WUFDRCxJQUFJLENBQUMsZ0JBQWdCLG1DQUNoQixJQUFJLENBQUMsZ0JBQWdCLEtBQ3hCLE9BQU8sRUFBRSxDQUFDLFVBQVUsRUFDcEIsU0FBUyxFQUFFLFNBQVMsRUFDcEIsUUFBUSxFQUFFLElBQUksR0FDZixDQUFBO1lBQ0QsT0FBTyxJQUFJLENBQUMsZ0JBQWdCLENBQUM7U0FDOUI7UUFDRCxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDO1FBQ2pDLElBQUksT0FBTyxDQUFDLFFBQVEsQ0FBQyxLQUFLLFVBQVUsRUFBRTtZQUNwQyxJQUFJLENBQUMsZ0JBQWdCLG1DQUNoQixJQUFJLENBQUMsZ0JBQWdCLEtBQ3hCLE9BQU8sRUFBRSxDQUFDLFVBQVUsRUFDcEIsUUFBUSxFQUFFLFFBQVEsQ0FBQyxJQUFJLENBQUMsRUFDeEIsUUFBUSxFQUFFLEtBQUssR0FDaEIsQ0FBQTtZQUNELE9BQU8sSUFBSSxDQUFDLGdCQUFnQixDQUFDO1NBQzlCO1FBQ0QsSUFBSSxDQUFDLGdCQUFnQixtQ0FDaEIsSUFBSSxDQUFDLGdCQUFnQixLQUN4QixPQUFPLEVBQUUsQ0FBQyxVQUFVLEVBQ3BCLFFBQVEsRUFBRSxRQUFRLEVBQ2xCLFFBQVEsRUFBRSxLQUFLLEdBQ2hCLENBQUE7UUFDRCxPQUFPLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQztJQUMvQixDQUFDOzs7WUFyREYsSUFBSSxTQUFDO2dCQUNKLElBQUksRUFBRSxvQkFBb0I7YUFDM0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBQaXBlLCBQaXBlVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFNkR3JpZE1hdGVyaWFsT3B0aW9uIH0gZnJvbSAnLi4vbW9kZWxzL2dyaWQtb3B0aW9uLm1vZGVsJztcclxuaW1wb3J0IHsgRWRpdG9ySGFuZGxlclJvdywgU2RJdGVtIH0gZnJvbSAnLi4vbW9kZWxzL2dyaWQubW9kZWwnO1xyXG5AUGlwZSh7XHJcbiAgbmFtZTogJ3NkRWRpdG9ySGFuZGxlclJvdydcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkRWRpdG9ySGFuZGxlclJvd1BpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcclxuICB0cmFuc2Zvcm0oaXRlbTogU2RJdGVtLCBncmlkT3B0aW9uOiBTZEdyaWRNYXRlcmlhbE9wdGlvbik6IEVkaXRvckhhbmRsZXJSb3cge1xyXG4gICAgY29uc3QgeyBlZGl0b3IgfSA9IGdyaWRPcHRpb247XHJcbiAgICBpZighZWRpdG9yKSB7XHJcbiAgICAgIHJldHVybiB7XHJcbiAgICAgICAgdmlzaWJsZTogZmFsc2VcclxuICAgICAgfVxyXG4gICAgfVxyXG4gICAgbGV0IGlzRGlzYWJsZWQgPSBmYWxzZTtcclxuICAgIGlmICh0eXBlb2YgKGVkaXRvcj8uZGlzYWJsZWQpID09PSAnZnVuY3Rpb24nKSB7XHJcbiAgICAgIGlzRGlzYWJsZWQgPSBlZGl0b3IuZGlzYWJsZWQoaXRlbSk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICBpc0Rpc2FibGVkID0gZWRpdG9yPy5kaXNhYmxlZDtcclxuICAgIH1cclxuICAgIGlmIChlZGl0b3IudHlwZSA9PT0gJ2lubGluZScpIHtcclxuICAgICAgY29uc3QgcmVtb3ZhYmxlID0gZWRpdG9yLnJlbW92YWJsZTtcclxuICAgICAgaWYgKHR5cGVvZiAocmVtb3ZhYmxlKSA9PT0gJ2Z1bmN0aW9uJykge1xyXG4gICAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdyA9IHtcclxuICAgICAgICAgIC4uLml0ZW0uZWRpdG9ySGFuZGxlclJvdyxcclxuICAgICAgICAgIHZpc2libGU6ICFpc0Rpc2FibGVkLFxyXG4gICAgICAgICAgcmVtb3ZhYmxlOiByZW1vdmFibGUoaXRlbSksXHJcbiAgICAgICAgICBpc0lubGluZTogdHJ1ZVxyXG4gICAgICAgIH1cclxuICAgICAgICByZXR1cm4gaXRlbS5lZGl0b3JIYW5kbGVyUm93O1xyXG4gICAgICB9XHJcbiAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdyA9IHtcclxuICAgICAgICAuLi5pdGVtLmVkaXRvckhhbmRsZXJSb3csXHJcbiAgICAgICAgdmlzaWJsZTogIWlzRGlzYWJsZWQsXHJcbiAgICAgICAgcmVtb3ZhYmxlOiByZW1vdmFibGUsXHJcbiAgICAgICAgaXNJbmxpbmU6IHRydWVcclxuICAgICAgfVxyXG4gICAgICByZXR1cm4gaXRlbS5lZGl0b3JIYW5kbGVyUm93O1xyXG4gICAgfVxyXG4gICAgY29uc3QgZWRpdGFibGUgPSBlZGl0b3IuZWRpdGFibGU7XHJcbiAgICBpZiAodHlwZW9mIChlZGl0YWJsZSkgPT09ICdmdW5jdGlvbicpIHtcclxuICAgICAgaXRlbS5lZGl0b3JIYW5kbGVyUm93ID0ge1xyXG4gICAgICAgIC4uLml0ZW0uZWRpdG9ySGFuZGxlclJvdyxcclxuICAgICAgICB2aXNpYmxlOiAhaXNEaXNhYmxlZCxcclxuICAgICAgICBlZGl0YWJsZTogZWRpdGFibGUoaXRlbSksXHJcbiAgICAgICAgaXNJbmxpbmU6IGZhbHNlXHJcbiAgICAgIH1cclxuICAgICAgcmV0dXJuIGl0ZW0uZWRpdG9ySGFuZGxlclJvdztcclxuICAgIH1cclxuICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdyA9IHtcclxuICAgICAgLi4uaXRlbS5lZGl0b3JIYW5kbGVyUm93LFxyXG4gICAgICB2aXNpYmxlOiAhaXNEaXNhYmxlZCxcclxuICAgICAgZWRpdGFibGU6IGVkaXRhYmxlLFxyXG4gICAgICBpc0lubGluZTogZmFsc2VcclxuICAgIH1cclxuICAgIHJldHVybiBpdGVtLmVkaXRvckhhbmRsZXJSb3c7XHJcbiAgfVxyXG59XHJcbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLWhhbmRsZXItcm93LnBpcGUuanMiLCJzb3VyY2VSb290IjoiQzovVXNlcnMvbmdoaWF0dDE1L0Rlc2t0b3AvV29ya2luZy8xTUcvbGliLWNvcmUtdWkvcHJvamVjdHMvc2QtY29yZS9ncmlkLW1hdGVyaWFsLyIsInNvdXJjZXMiOlsic3JjL2xpYi9waXBlcy9lZGl0b3ItaGFuZGxlci1yb3cucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsSUFBSSxFQUFpQixNQUFNLGVBQWUsQ0FBQztBQU1wRCxNQUFNLE9BQU8sc0JBQXNCO0lBQ2pDLFNBQVMsQ0FBQyxNQUEyQixFQUFFLElBQVksRUFBRSxVQUFnQztRQUNuRixNQUFNLEVBQUUsTUFBTSxFQUFFLEdBQUcsVUFBVSxDQUFDO1FBQzlCLElBQUksQ0FBQyxNQUFNLEVBQUU7WUFDWCxPQUFPLElBQUksQ0FBQztTQUNiO1FBQ0QsSUFBSSxVQUFVLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLElBQUksT0FBTyxDQUFDLE1BQU0sYUFBTixNQUFNLHVCQUFOLE1BQU0sQ0FBRSxRQUFRLENBQUMsS0FBSyxVQUFVLEVBQUU7WUFDNUMsVUFBVSxHQUFHLE1BQU0sQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUM7U0FDcEM7YUFBTTtZQUNMLFVBQVUsR0FBRyxNQUFNLGFBQU4sTUFBTSx1QkFBTixNQUFNLENBQUUsUUFBUSxDQUFDO1NBQy9CO1FBQ0QsSUFBRyxVQUFVLEVBQUU7WUFDYixPQUFPLElBQUksQ0FBQztTQUNiO1FBQ0QsSUFBSSxNQUFNLENBQUMsSUFBSSxLQUFLLFFBQVEsRUFBRTtZQUM1QixNQUFNLFNBQVMsR0FBRyxNQUFNLENBQUMsU0FBUyxDQUFDO1lBQ25DLElBQUksQ0FBQyxnQkFBZ0IsbUNBQ2hCLElBQUksQ0FBQyxnQkFBZ0IsS0FDeEIsUUFBUSxFQUFFLEtBQUssRUFDZixTQUFTLEVBQUUsTUFBTSxLQUFLLFFBQVEsSUFBSSxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsS0FBSyxVQUFVLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLEVBQ25HLE9BQU8sRUFBRSxLQUFLLEVBQ2QsVUFBVSxFQUFFLE1BQU0sS0FBSyxRQUFRLEdBQ2hDLENBQUE7U0FDRjthQUFNLElBQUksTUFBTSxDQUFDLElBQUksS0FBSyxPQUFPLEVBQUU7WUFDbEMsTUFBTSxRQUFRLEdBQUcsTUFBTSxDQUFDLFFBQVEsQ0FBQztZQUNqQyxJQUFJLENBQUMsZ0JBQWdCLG1DQUNoQixJQUFJLENBQUMsZ0JBQWdCLEtBQ3hCLFFBQVEsRUFBRSxDQUFDLE1BQU0sSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsS0FBSyxVQUFVLENBQUMsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLEVBQ25GLFNBQVMsRUFBRSxLQUFLLEVBQ2hCLE9BQU8sRUFBRSxDQUFDLENBQUMsTUFBTSxFQUNqQixVQUFVLEVBQUUsQ0FBQyxDQUFDLE1BQU0sR0FDckIsQ0FBQTtTQUNGO2FBQU0sSUFBSSxNQUFNLENBQUMsSUFBSSxLQUFLLE9BQU8sRUFBRTtZQUNsQyxNQUFNLFFBQVEsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDO1lBQ2pDLElBQUksQ0FBQyxnQkFBZ0IsbUNBQ2hCLElBQUksQ0FBQyxnQkFBZ0IsS0FDeEIsUUFBUSxFQUFFLENBQUMsTUFBTSxJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxLQUFLLFVBQVUsQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsRUFDbkYsU0FBUyxFQUFFLEtBQUssRUFDaEIsT0FBTyxFQUFFLEtBQUssRUFDZCxVQUFVLEVBQUUsS0FBSyxHQUNsQixDQUFBO1NBQ0Y7UUFDRCxPQUFPLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQztJQUMvQixDQUFDOzs7WUEvQ0YsSUFBSSxTQUFDO2dCQUNKLElBQUksRUFBRSxvQkFBb0I7YUFDM0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBQaXBlLCBQaXBlVHJhbnNmb3JtIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFNkR3JpZE1hdGVyaWFsT3B0aW9uIH0gZnJvbSAnLi4vbW9kZWxzL2dyaWQtb3B0aW9uLm1vZGVsJztcclxuaW1wb3J0IHsgRWRpdG9ySGFuZGxlclJvdywgU2RJdGVtIH0gZnJvbSAnLi4vbW9kZWxzL2dyaWQubW9kZWwnO1xyXG5AUGlwZSh7XHJcbiAgbmFtZTogJ3NkRWRpdG9ySGFuZGxlclJvdydcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkRWRpdG9ySGFuZGxlclJvd1BpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcclxuICB0cmFuc2Zvcm0oc3RhdHVzOiAnY3JlYXRlJyB8ICd1cGRhdGUnLCBpdGVtOiBTZEl0ZW0sIGdyaWRPcHRpb246IFNkR3JpZE1hdGVyaWFsT3B0aW9uKTogRWRpdG9ySGFuZGxlclJvdyB7XHJcbiAgICBjb25zdCB7IGVkaXRvciB9ID0gZ3JpZE9wdGlvbjtcclxuICAgIGlmICghZWRpdG9yKSB7XHJcbiAgICAgIHJldHVybiBudWxsO1xyXG4gICAgfVxyXG4gICAgbGV0IGlzRGlzYWJsZWQgPSBmYWxzZTtcclxuICAgIGlmICh0eXBlb2YgKGVkaXRvcj8uZGlzYWJsZWQpID09PSAnZnVuY3Rpb24nKSB7XHJcbiAgICAgIGlzRGlzYWJsZWQgPSBlZGl0b3IuZGlzYWJsZWQoaXRlbSk7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICBpc0Rpc2FibGVkID0gZWRpdG9yPy5kaXNhYmxlZDtcclxuICAgIH1cclxuICAgIGlmKGlzRGlzYWJsZWQpIHtcclxuICAgICAgcmV0dXJuIG51bGw7XHJcbiAgICB9XHJcbiAgICBpZiAoZWRpdG9yLnR5cGUgPT09ICdpbmxpbmUnKSB7XHJcbiAgICAgIGNvbnN0IHJlbW92YWJsZSA9IGVkaXRvci5yZW1vdmFibGU7XHJcbiAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdyA9IHtcclxuICAgICAgICAuLi5pdGVtLmVkaXRvckhhbmRsZXJSb3csXHJcbiAgICAgICAgZWRpdGFibGU6IGZhbHNlLFxyXG4gICAgICAgIHJlbW92YWJsZTogc3RhdHVzID09PSAndXBkYXRlJyAmJiAodHlwZW9mIChyZW1vdmFibGUpID09PSAnZnVuY3Rpb24nID8gcmVtb3ZhYmxlKGl0ZW0pIDogcmVtb3ZhYmxlKSxcclxuICAgICAgICBzYXZhYmxlOiBmYWxzZSxcclxuICAgICAgICBjYW5jZWxhYmxlOiBzdGF0dXMgPT09ICdjcmVhdGUnXHJcbiAgICAgIH1cclxuICAgIH0gZWxzZSBpZiAoZWRpdG9yLnR5cGUgPT09ICdmb2N1cycpIHtcclxuICAgICAgY29uc3QgZWRpdGFibGUgPSBlZGl0b3IuZWRpdGFibGU7XHJcbiAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdyA9IHtcclxuICAgICAgICAuLi5pdGVtLmVkaXRvckhhbmRsZXJSb3csXHJcbiAgICAgICAgZWRpdGFibGU6ICFzdGF0dXMgJiYgKHR5cGVvZiAoZWRpdGFibGUpID09PSAnZnVuY3Rpb24nID8gZWRpdGFibGUoaXRlbSkgOiBlZGl0YWJsZSksXHJcbiAgICAgICAgcmVtb3ZhYmxlOiBmYWxzZSxcclxuICAgICAgICBzYXZhYmxlOiAhIXN0YXR1cyxcclxuICAgICAgICBjYW5jZWxhYmxlOiAhIXN0YXR1c1xyXG4gICAgICB9XHJcbiAgICB9IGVsc2UgaWYgKGVkaXRvci50eXBlID09PSAncG9wdXAnKSB7XHJcbiAgICAgIGNvbnN0IGVkaXRhYmxlID0gZWRpdG9yLmVkaXRhYmxlO1xyXG4gICAgICBpdGVtLmVkaXRvckhhbmRsZXJSb3cgPSB7XHJcbiAgICAgICAgLi4uaXRlbS5lZGl0b3JIYW5kbGVyUm93LFxyXG4gICAgICAgIGVkaXRhYmxlOiAhc3RhdHVzICYmICh0eXBlb2YgKGVkaXRhYmxlKSA9PT0gJ2Z1bmN0aW9uJyA/IGVkaXRhYmxlKGl0ZW0pIDogZWRpdGFibGUpLFxyXG4gICAgICAgIHJlbW92YWJsZTogZmFsc2UsXHJcbiAgICAgICAgc2F2YWJsZTogZmFsc2UsXHJcbiAgICAgICAgY2FuY2VsYWJsZTogZmFsc2VcclxuICAgICAgfVxyXG4gICAgfVxyXG4gICAgcmV0dXJuIGl0ZW0uZWRpdG9ySGFuZGxlclJvdztcclxuICB9XHJcbn1cclxuIl19

package/esm2015/grid-material/src/lib/pipes/editor-validate.pipe.js

@@ -5,9 +5,8 @@ export class SdEditorValidatePipe {
         this.delay = 1000; // Sau khoảng thời gian delay nếu không có thay đổi thì thì mới bắt đầu thực hiện validate
     }
     transform(value, item, validate) {
-        var _a;
         return __awaiter(this, void 0, void 0, function* () {
-            if (!((_a = item.editorHandlerRow) === null || _a === void 0 ? void 0 : _a.visible)) {
+            if (!item.editorHandlerRow) {
                 return true;
             }
             this.previous = new Date();
@@ -38,4 +37,4 @@ SdEditorValidatePipe.decorators = [
                 name: 'sdEditorValidate'
             },] }
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLXZhbGlkYXRlLnBpcGUuanMiLCJzb3VyY2VSb290IjoiQzovVXNlcnMvbmdoaWF0dDE1L0Rlc2t0b3AvV29ya2luZy8xTUcvbGliLWNvcmUtdWkvcHJvamVjdHMvc2QtY29yZS9ncmlkLW1hdGVyaWFsLyIsInNvdXJjZXMiOlsic3JjL2xpYi9waXBlcy9lZGl0b3ItdmFsaWRhdGUucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFLcEQsTUFBTSxPQUFPLG9CQUFvQjtJQUhqQztRQUtVLFVBQUssR0FBRyxJQUFJLENBQUMsQ0FBQywwRkFBMEY7SUF5QmxILENBQUM7SUF4Qk8sU0FBUyxDQUFDLEtBQWEsRUFBRSxJQUFZLEVBQUUsUUFBZ0U7OztZQUMzRyxJQUFJLFFBQUMsSUFBSSxDQUFDLGdCQUFnQiwwQ0FBRSxPQUFPLENBQUEsRUFBRTtnQkFDbkMsT0FBTyxJQUFJLENBQUM7YUFDYjtZQUNELElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxJQUFJLEVBQUUsQ0FBQztZQUMzQixNQUFNLElBQUksT0FBTyxDQUFDLE9BQU8sQ0FBQyxFQUFFLENBQUMsVUFBVSxDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztZQUM5RCxNQUFNLEdBQUcsR0FBRyxJQUFJLElBQUksRUFBRSxDQUFDO1lBQ3ZCLE1BQU0sR0FBRyxHQUFHLEdBQUcsQ0FBQyxPQUFPLEVBQUUsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ3BELElBQUksR0FBRyxHQUFHLElBQUksQ0FBQyxLQUFLLEVBQUU7Z0JBQ3BCLE9BQU8sSUFBSSxDQUFDO2FBQ2I7WUFDRCxJQUFJLENBQUMsUUFBUSxFQUFFO2dCQUNiLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO2dCQUMxQyxPQUFPLElBQUksQ0FBQzthQUNiO1lBQ0QsTUFBTSxNQUFNLEdBQUcsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQzlCLElBQUksTUFBTSxZQUFZLE9BQU8sRUFBRTtnQkFDN0IsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksR0FBRyxNQUFNLE1BQU0sQ0FBQztnQkFDbEQsT0FBTyxJQUFJLENBQUM7YUFDYjtpQkFBTTtnQkFDTCxJQUFJLENBQUMsZ0JBQWdCLENBQUMsWUFBWSxHQUFHLE1BQU0sQ0FBQztnQkFDNUMsT0FBTyxJQUFJLENBQUM7YUFDYjs7S0FDRjs7O1lBN0JGLElBQUksU0FBQztnQkFDSixJQUFJLEVBQUUsa0JBQWtCO2FBQ3pCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUGlwZSwgUGlwZVRyYW5zZm9ybSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBTZEdyaWRNYXRlcmlhbEl0ZW0sIFNkSXRlbSB9IGZyb20gJy4uL21vZGVscy9ncmlkLm1vZGVsJztcclxuQFBpcGUoe1xyXG4gIG5hbWU6ICdzZEVkaXRvclZhbGlkYXRlJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgU2RFZGl0b3JWYWxpZGF0ZVBpcGUgaW1wbGVtZW50cyBQaXBlVHJhbnNmb3JtIHtcclxuICBwcml2YXRlIHByZXZpb3VzOiBEYXRlO1xyXG4gIHByaXZhdGUgZGVsYXkgPSAxMDAwOyAvLyBTYXUga2hv4bqjbmcgdGjhu51pIGdpYW4gZGVsYXkgbuG6v3Uga2jDtG5nIGPDsyB0aGF5IMSR4buVaSB0aMOsIHRow6wgbeG7m2kgYuG6r3QgxJHhuqd1IHRo4buxYyBoaeG7h24gdmFsaWRhdGVcclxuICBhc3luYyB0cmFuc2Zvcm0odmFsdWU6IHN0cmluZywgaXRlbTogU2RJdGVtLCB2YWxpZGF0ZTogKGl0ZW06IFNkR3JpZE1hdGVyaWFsSXRlbSkgPT4gc3RyaW5nIHwgUHJvbWlzZTxzdHJpbmc+KTogUHJvbWlzZTxib29sZWFuPiB7XHJcbiAgICBpZiAoIWl0ZW0uZWRpdG9ySGFuZGxlclJvdz8udmlzaWJsZSkge1xyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH1cclxuICAgIHRoaXMucHJldmlvdXMgPSBuZXcgRGF0ZSgpO1xyXG4gICAgYXdhaXQgbmV3IFByb21pc2UocmVzb2x2ZSA9PiBzZXRUaW1lb3V0KHJlc29sdmUsIHRoaXMuZGVsYXkpKTtcclxuICAgIGNvbnN0IG5vdyA9IG5ldyBEYXRlKCk7XHJcbiAgICBjb25zdCBkaWYgPSBub3cuZ2V0VGltZSgpIC0gdGhpcy5wcmV2aW91cy5nZXRUaW1lKCk7XHJcbiAgICBpZiAoZGlmIDwgdGhpcy5kZWxheSkge1xyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH1cclxuICAgIGlmICghdmFsaWRhdGUpIHtcclxuICAgICAgaXRlbS5lZGl0b3JIYW5kbGVyUm93LmVycm9yTWVzc2FnZSA9IG51bGw7XHJcbiAgICAgIHJldHVybiB0cnVlO1xyXG4gICAgfVxyXG4gICAgY29uc3QgcmVzdWx0ID0gdmFsaWRhdGUoaXRlbSk7XHJcbiAgICBpZiAocmVzdWx0IGluc3RhbmNlb2YgUHJvbWlzZSkge1xyXG4gICAgICBpdGVtLmVkaXRvckhhbmRsZXJSb3cuZXJyb3JNZXNzYWdlID0gYXdhaXQgcmVzdWx0O1xyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH0gZWxzZSB7XHJcbiAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdy5lcnJvck1lc3NhZ2UgPSByZXN1bHQ7XHJcbiAgICAgIHJldHVybiB0cnVlO1xyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdG9yLXZhbGlkYXRlLnBpcGUuanMiLCJzb3VyY2VSb290IjoiQzovVXNlcnMvbmdoaWF0dDE1L0Rlc2t0b3AvV29ya2luZy8xTUcvbGliLWNvcmUtdWkvcHJvamVjdHMvc2QtY29yZS9ncmlkLW1hdGVyaWFsLyIsInNvdXJjZXMiOlsic3JjL2xpYi9waXBlcy9lZGl0b3ItdmFsaWRhdGUucGlwZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFLcEQsTUFBTSxPQUFPLG9CQUFvQjtJQUhqQztRQUtVLFVBQUssR0FBRyxJQUFJLENBQUMsQ0FBQywwRkFBMEY7SUF5QmxILENBQUM7SUF4Qk8sU0FBUyxDQUFDLEtBQWEsRUFBRSxJQUFZLEVBQUUsUUFBZ0U7O1lBQzNHLElBQUksQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLEVBQUU7Z0JBQzFCLE9BQU8sSUFBSSxDQUFDO2FBQ2I7WUFDRCxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksSUFBSSxFQUFFLENBQUM7WUFDM0IsTUFBTSxJQUFJLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDLFVBQVUsQ0FBQyxPQUFPLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7WUFDOUQsTUFBTSxHQUFHLEdBQUcsSUFBSSxJQUFJLEVBQUUsQ0FBQztZQUN2QixNQUFNLEdBQUcsR0FBRyxHQUFHLENBQUMsT0FBTyxFQUFFLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNwRCxJQUFJLEdBQUcsR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFO2dCQUNwQixPQUFPLElBQUksQ0FBQzthQUNiO1lBQ0QsSUFBSSxDQUFDLFFBQVEsRUFBRTtnQkFDYixJQUFJLENBQUMsZ0JBQWdCLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQztnQkFDMUMsT0FBTyxJQUFJLENBQUM7YUFDYjtZQUNELE1BQU0sTUFBTSxHQUFHLFFBQVEsQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUM5QixJQUFJLE1BQU0sWUFBWSxPQUFPLEVBQUU7Z0JBQzdCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxZQUFZLEdBQUcsTUFBTSxNQUFNLENBQUM7Z0JBQ2xELE9BQU8sSUFBSSxDQUFDO2FBQ2I7aUJBQU07Z0JBQ0wsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksR0FBRyxNQUFNLENBQUM7Z0JBQzVDLE9BQU8sSUFBSSxDQUFDO2FBQ2I7UUFDSCxDQUFDO0tBQUE7OztZQTdCRixJQUFJLFNBQUM7Z0JBQ0osSUFBSSxFQUFFLGtCQUFrQjthQUN6QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFBpcGUsIFBpcGVUcmFuc2Zvcm0gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgU2RHcmlkTWF0ZXJpYWxJdGVtLCBTZEl0ZW0gfSBmcm9tICcuLi9tb2RlbHMvZ3JpZC5tb2RlbCc7XHJcbkBQaXBlKHtcclxuICBuYW1lOiAnc2RFZGl0b3JWYWxpZGF0ZSdcclxufSlcclxuZXhwb3J0IGNsYXNzIFNkRWRpdG9yVmFsaWRhdGVQaXBlIGltcGxlbWVudHMgUGlwZVRyYW5zZm9ybSB7XHJcbiAgcHJpdmF0ZSBwcmV2aW91czogRGF0ZTtcclxuICBwcml2YXRlIGRlbGF5ID0gMTAwMDsgLy8gU2F1IGtob+G6o25nIHRo4budaSBnaWFuIGRlbGF5IG7hur91IGtow7RuZyBjw7MgdGhheSDEkeG7lWkgdGjDrCB0aMOsIG3hu5tpIGLhuq90IMSR4bqndSB0aOG7sWMgaGnhu4duIHZhbGlkYXRlXHJcbiAgYXN5bmMgdHJhbnNmb3JtKHZhbHVlOiBzdHJpbmcsIGl0ZW06IFNkSXRlbSwgdmFsaWRhdGU6IChpdGVtOiBTZEdyaWRNYXRlcmlhbEl0ZW0pID0+IHN0cmluZyB8IFByb21pc2U8c3RyaW5nPik6IFByb21pc2U8Ym9vbGVhbj4ge1xyXG4gICAgaWYgKCFpdGVtLmVkaXRvckhhbmRsZXJSb3cpIHtcclxuICAgICAgcmV0dXJuIHRydWU7XHJcbiAgICB9XHJcbiAgICB0aGlzLnByZXZpb3VzID0gbmV3IERhdGUoKTtcclxuICAgIGF3YWl0IG5ldyBQcm9taXNlKHJlc29sdmUgPT4gc2V0VGltZW91dChyZXNvbHZlLCB0aGlzLmRlbGF5KSk7XHJcbiAgICBjb25zdCBub3cgPSBuZXcgRGF0ZSgpO1xyXG4gICAgY29uc3QgZGlmID0gbm93LmdldFRpbWUoKSAtIHRoaXMucHJldmlvdXMuZ2V0VGltZSgpO1xyXG4gICAgaWYgKGRpZiA8IHRoaXMuZGVsYXkpIHtcclxuICAgICAgcmV0dXJuIHRydWU7XHJcbiAgICB9XHJcbiAgICBpZiAoIXZhbGlkYXRlKSB7XHJcbiAgICAgIGl0ZW0uZWRpdG9ySGFuZGxlclJvdy5lcnJvck1lc3NhZ2UgPSBudWxsO1xyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH1cclxuICAgIGNvbnN0IHJlc3VsdCA9IHZhbGlkYXRlKGl0ZW0pO1xyXG4gICAgaWYgKHJlc3VsdCBpbnN0YW5jZW9mIFByb21pc2UpIHtcclxuICAgICAgaXRlbS5lZGl0b3JIYW5kbGVyUm93LmVycm9yTWVzc2FnZSA9IGF3YWl0IHJlc3VsdDtcclxuICAgICAgcmV0dXJuIHRydWU7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICBpdGVtLmVkaXRvckhhbmRsZXJSb3cuZXJyb3JNZXNzYWdlID0gcmVzdWx0O1xyXG4gICAgICByZXR1cm4gdHJ1ZTtcclxuICAgIH1cclxuICB9XHJcbn1cclxuIl19

package/fesm2015/sd-angular-core-grid-material.js

@@ -1698,19 +1698,19 @@ class SdGridMaterial {
             (_a = editor.onAdd) === null || _a === void 0 ? void 0 : _a.call(editor, item);
             // Đưa item lên dòng đầu tiên nếu type khác popup
             if (editor.type !== 'popup') {
+                if (type === 'local') {
+                    this.localItems = [item, ...this.items];
+                }
                 this.items = [item, ...this.items];
-                // if (type === 'local') {
-                //   this.items = [item, ...this.items];
-                //   // this.items.splice(0, 0, item);
-                // } else {
-                // }
-                // this.viewItems.splice(0, 0, item);
             }
-            this.onUpdate(item, false);
+            item.editorStatus = 'create';
+            item.editorHandlerRow = {
+                temporary: Object.assign({}, item)
+            };
         };
-        this.onUpdate = (item, isModified) => {
-            const { editor, columns } = this.gridOption;
-            item.editorStatus = isModified ? 'update' : 'create';
+        this.onUpdate = (item) => {
+            const { editor } = this.gridOption;
+            item.editorStatus = 'update';
             item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { temporary: Object.assign({}, item) });
             // this.generateEditorHanlder(item);
             if (editor.type === 'popup') {
@@ -1764,28 +1764,25 @@ class SdGridMaterial {
             const { editor } = this.gridOption;
             if (editor.type === 'inline') {
                 if (this.gridOption.type === 'local') {
-                    const idx1 = this.items.indexOf(item);
-                    this.items.splice(idx1, 1);
+                    const idx2 = this.localItems.indexOf(item);
+                    this.localItems.splice(idx2, 1);
                 }
-                // const idx2 = this.viewItems.indexOf(item);
-                // this.viewItems.splice(idx2, 1);
-                return;
+                const idx1 = this.items.indexOf(item);
+                this.items.splice(idx1, 1);
             }
-            if (item.editorStatus === 'create') {
-                if (editor.type !== 'popup') {
+            if (editor.type === 'focus') {
+                if (item.editorStatus === 'create') {
+                    if (this.gridOption.type === 'local') {
+                        this.localItems.splice(0, 1);
+                    }
                     this.items.splice(0, 1);
-                    // if (this.gridOption.type === 'local') {
-                    //   this.items.splice(0, 1);
-                    // }
-                    // this.viewItems.splice(0, 1);
+                }
+                else {
+                    Object.assign(item, item.editorHandlerRow.temporary);
                 }
             }
-            else {
-                Object.assign(item, item.editorHandlerRow.temporary);
-                item.editorStatus = undefined;
-                // this.generateEditorHanlder(item);
-                this.ref.detectChanges();
-            }
+            item.editorStatus = undefined;
+            this.ref.detectChanges();
         };
     }
     set _gridFilter(gridFilter) {
@@ -1847,7 +1844,7 @@ _paginator = new WeakMap(), _sort = new WeakMap(), _subscription$1 = new WeakMap
 SdGridMaterial.decorators = [
     { type: Component, args: [{
                 selector: 'sd-grid-material',
-                template: "<ng-container *ngIf=\"gridConfigurationObserver | async as gridConfiguration\">\r\n  <ng-container *ngIf=\"\r\n      gridConfiguration\r\n        | sdGridConfigurationResult\r\n          : gridOption\r\n          : sdSubInformation as configuration\r\n    \">\r\n    <ng-container *ngIf=\"!gridOption.filter?.disabled\">\r\n      <sd-grid-filter [filter]=\"gridOption?.filter\" [columns]=\"configuration.firstColumns\" [filterDefs]=\"filterDefs\">\r\n      </sd-grid-filter>\r\n    </ng-container>\r\n    <div class=\"c-container {{ gridOption?.style?.grid }}\" [ngClass]=\"{ 'mat-elevation-z2': gridOption?.shadow }\">\r\n      <div class=\"c-loading\" *ngIf=\"isLoading\">\r\n        <mat-spinner *ngIf=\"isLoading\"></mat-spinner>\r\n      </div>\r\n      <ng-container>\r\n        <div class=\"c-table\" [ngStyle]=\"{\r\n            'max-height': gridOption?.maxHeight,\r\n            'min-height': 'gridOption?.minHeight'\r\n          }\">\r\n          <table *ngIf=\"items?.length; else elseEmpty\" mat-table [dataSource]=\"items\" matSort\r\n            [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n            (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n            <ng-container matColumnDef=\"sdSubInformation\" sticky>\r\n              <td class=\"p-0\" mat-cell *matCellDef=\"let item\" [attr.colspan]=\"configuration.displayedColumns.length\">\r\n                <div *ngIf=\"sdSubInformation?.templateRef\" [@detailExpand]=\"item.isExpanded ? 'expanded' : 'collapsed'\">\r\n                  <ng-container *ngIf=\"item.isExpanded\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        sdSubInformation.templateRef;\r\n                        context: { item: item }\r\n                      \">\r\n                    </ng-container>\r\n                  </ng-container>\r\n                </div>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdSubInformationAction\" stickyEnd>\r\n              <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              <td mat-cell *matCellDef=\"let element\">\r\n                <button *ngIf=\"!element.isExpanding\" mat-icon-button aria-label=\"Expand & Collapse\"\r\n                  (click)=\"onExpand(element)\">\r\n                  <mat-icon *ngIf=\"!element.isExpanded\">expand_more</mat-icon>\r\n                  <mat-icon *ngIf=\"element.isExpanded\">expand_less</mat-icon>\r\n                </button>\r\n                <div *ngIf=\"element.isExpanding\" class=\"lds-ring\">\r\n                  <div></div>\r\n                  <div></div>\r\n                  <div></div>\r\n                  <div></div>\r\n                </div>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdSelection\" sticky>\r\n              <th class=\"text-center px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n                  [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\" [disabled]=\"\r\n                    items | selectionDisableSelectAll: gridOption?.selection\r\n                  \">\r\n                </mat-checkbox>\r\n              </th>\r\n              <td class=\"text-center px-15\" mat-cell *matCellDef=\"let item\" style=\"min-width: 50px; max-width: 50px\">\r\n                <mat-checkbox class=\"c-selection\" color=\"primary\" [(ngModel)]=\"item.isSelected\"\r\n                  (change)=\"onSelect(item)\" [disabled]=\"\r\n                    selectedItems | selectionDisable: item:gridOption?.selection\r\n                  \">\r\n                </mat-checkbox>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdEditor\">\r\n              <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                <button\r\n                  *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n                  (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n                  <mat-icon class=\"c-icon\">add</mat-icon>\r\n                </button>\r\n              </th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *sdLet=\"item | sdEditorHandlerRow:gridOption as editorHandler\">\r\n                  <ng-container *ngIf=\"editorHandler.visible\">\r\n                    <ng-container *ngIf=\"editorHandler.isInline;else notInline\">\r\n                      <button *ngIf=\"editorHandler.removable\" class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\"\r\n                        mat-icon-button>\r\n                        <mat-icon class=\"c-icon\">delete</mat-icon>\r\n                      </button>\r\n                    </ng-container>\r\n                    <ng-template #notInline>\r\n                      <ng-container *ngIf=\"!item.editorStatus\">\r\n                        <button *ngIf=\"item.editorHandlerRow.editable\" class=\"mx-2\" (click)=\"onUpdate(item, true)\" aria-hidden=\"true\"\r\n                          mat-icon-button>\r\n                          <mat-icon class=\"c-icon\">edit</mat-icon>\r\n                        </button>\r\n                      </ng-container>\r\n                      <ng-container *ngIf=\"item.editorStatus\">\r\n                        <button class=\"mx-2\" (click)=\"onSave(item)\" aria-hidden=\"true\" mat-icon-button>\r\n                          <mat-icon class=\"c-icon\">save</mat-icon>\r\n                        </button>\r\n                        <button class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\" mat-icon-button>\r\n                          <mat-icon class=\"c-icon\">close</mat-icon>\r\n                        </button>\r\n                      </ng-container>\r\n\r\n                    </ng-template>\r\n                  </ng-container>\r\n\r\n                </ng-container>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdCommand\">\r\n              <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-command [commands]=\"gridOption.commands\" [item]=\"item\"></sd-desktop-command>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\" [matColumnDef]=\"column.field\"\r\n              [sticky]=\"configuration.fixedColumn[column.field]\">\r\n              <th mat-header-cell *matHeaderCellDef cdkDrag class=\"px-8 py-8 c-th\"\r\n                [ngStyle]=\"{ 'min-width': column.width }\" [attr.rowspan]=\"\r\n                  configuration.multipleHeader && column.type !== 'children-col'\r\n                    ? 2\r\n                    : 1\r\n                \" [attr.colspan]=\"\r\n                  column.type === 'children-col' ? column.children?.length : 1\r\n                \">\r\n                <div>\r\n                  <div aria-hidden=\"false\" role=\"presentation\" mat-sort-header [disabled]=\"\r\n                      !column.sortable || column.type === 'children-col'\r\n                    \" [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                  <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        inlineColumn;\r\n                        context: { column: column }\r\n                      \"></ng-container>\r\n                  </div>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *ngIf=\"cellDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      cellDef[column.field].templateRef;\r\n                      context: { item: item, column: column, idx: i }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n                <sd-desktop-cell *ngIf=\"!cellDef[column.field]\" [key]=\"key\" [column]=\"column\" [item]=\"item\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-cell>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                <ng-container *ngIf=\"footerDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      footerDef[column.field].templateRef;\r\n                      context: { items: items, column: column }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let column of configuration.secondColumns; let i = index\"\r\n              [matColumnDef]=\"column.field\">\r\n              <th mat-header-cell *matHeaderCellDef mat-sort-header class=\"c-th px-8\"\r\n                [ngStyle]=\"{ 'min-width': column.width }\">\r\n                <div>\r\n                  <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                  <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        inlineColumn;\r\n                        context: { column: column }\r\n                      \"></ng-container>\r\n                  </div>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *ngIf=\"cellDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      cellDef[column.field].templateRef;\r\n                      context: { item: item, column: column, idx: i }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n                <sd-desktop-cell *ngIf=\"!cellDef[column.field]\" [key]=\"key\" [column]=\"column\" [item]=\"item\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-cell>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                <ng-container *ngIf=\"footerDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      footerDef[column.field].templateRef;\r\n                      context: { items: items, column: column }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n              </td>\r\n            </ng-container>\r\n            <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\"></tr>\r\n            <ng-container *ngIf=\"configuration.secondHeaders?.length\">\r\n              <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n              </tr>\r\n            </ng-container>\r\n            <tr mat-row *matRowDef=\"let row; columns: configuration.displayedColumns\" matRipple class=\"c-row\"></tr>\r\n            <tr mat-row *matRowDef=\"let row; columns: ['sdSubInformation']\" class=\"c-detail-row\"></tr>\r\n            <ng-container *ngIf=\"hasFooter && configuration.displayedFooters?.length\">\r\n              <tr mat-footer-row *matFooterRowDef=\"configuration.displayedFooters; sticky: true\"></tr>\r\n            </ng-container>\r\n          </table>\r\n          <ng-template #elseEmpty>\r\n            <table mat-table [dataSource]=\"[{}]\">\r\n              <ng-container matColumnDef=\"sdSelection\" sticky>\r\n                <th class=\"px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdEditor\">\r\n                <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                  <button\r\n                    *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n                    (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n                    <mat-icon class=\"c-icon\">add</mat-icon>\r\n                  </button>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdCommand\">\r\n                <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdSubInformationAction\">\r\n                <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdEmpty\">\r\n                <td class=\"c-empty\" mat-cell *matCellDef=\"let item\"\r\n                  [attr.colspan]=\"configuration.displayedColumns.length\">\r\n                  <ng-container *ngIf=\"sdEmptyData?.templateRef; else sdEmptyDataNoRef\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        sdEmptyData.templateRef;\r\n                        context: { item: item }\r\n                      \">\r\n                    </ng-container>\r\n                  </ng-container>\r\n                  <ng-template #sdEmptyDataNoRef>\r\n                    <mat-icon fontSet=\"material-icons-outlined\">leaderboard</mat-icon>\r\n                  </ng-template>\r\n                </td>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.columns\" [matColumnDef]=\"column.field\"\r\n                [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n                  <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.firstColumns\" [matColumnDef]=\"column.field\"\r\n                [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\"\r\n                  [attr.rowspan]=\"\r\n                    configuration.multipleHeader &&\r\n                    column.type !== 'children-col'\r\n                      ? 2\r\n                      : 1\r\n                  \" [attr.colspan]=\"\r\n                    column.type === 'children-col' ? column.children?.length : 1\r\n                  \">\r\n                  <div>\r\n                    <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                    <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                      <ng-container *ngTemplateOutlet=\"\r\n                          inlineColumn;\r\n                          context: { column: column }\r\n                        \"></ng-container>\r\n                    </div>\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.secondColumns\" [matColumnDef]=\"column.field\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n                  <div>\r\n                    <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                    <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                      <ng-container *ngTemplateOutlet=\"\r\n                          inlineColumn;\r\n                          context: { column: column }\r\n                        \"></ng-container>\r\n                    </div>\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\">\r\n              </tr>\r\n              <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n              </tr>\r\n              <tr mat-row *matRowDef=\"let row; columns: ['sdEmpty']\"></tr>\r\n            </table>\r\n          </ng-template>\r\n        </div>\r\n      </ng-container>\r\n      <div class=\"c-paginator\">\r\n        <div class=\"c-action\">\r\n          <sd-button *ngIf=\"\r\n              !gridOption.filter?.disabled && !gridOption.filter?.inlineColumn\r\n            \" class=\"mr-10\" [title]=\"'Filter' | sdTranslate\" icon=\"filter_alt\" size=\"sm\" (action)=\"gridFilter.open()\"\r\n            type=\"link\">\r\n          </sd-button>\r\n          <sd-button *ngIf=\"gridOption.reload?.visible\" class=\"mr-10\" [title]=\"'Reload' | sdTranslate\" icon=\"refresh\"\r\n            size=\"sm\" (action)=\"reload()\" [disabled]=\"!items?.length\" type=\"link\">\r\n          </sd-button>\r\n          <ng-container *ngIf=\"gridOption.export?.visible && items?.length\">\r\n            <ng-container *ngIf=\"isExporting; else unExporting\">\r\n              <sd-button class=\"mr-10\" [loading]=\"isExporting\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\"\r\n                size=\"sm\" type=\"link\">\r\n              </sd-button>\r\n            </ng-container>\r\n            <ng-template #unExporting>\r\n              <sd-button class=\"mr-10\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\" size=\"sm\"\r\n                [matMenuTriggerFor]=\"menu\" type=\"link\">\r\n              </sd-button>\r\n            </ng-template>\r\n\r\n            <mat-menu #menu=\"matMenu\">\r\n              <button *ngIf=\"gridOption.export?.visibleExcel !== false\" mat-menu-item\r\n                (click)=\"sdPopupExport.exportDefault()\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n                <span> {{ \"Export excel\" | sdTranslate }}</span>\r\n              </button>\r\n              <button *ngIf=\"gridOption.export?.visibleCSV !== false\" mat-menu-item\r\n                (click)=\"sdPopupExport.exportDefault(true)\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n                <span> {{ \"Export CSV\" | sdTranslate }}</span>\r\n              </button>\r\n              <button *ngIf=\"gridOption.export?.key\" mat-menu-item (click)=\"sdPopupExport.open()\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">settings</mat-icon>\r\n                <span> {{ \"Configure\" | sdTranslate }}</span>\r\n              </button>\r\n            </mat-menu>\r\n          </ng-container>\r\n          <sd-button *ngIf=\"gridOption.config?.visible\" class=\"mr-10\" [title]=\"'Configure' | sdTranslate\"\r\n            icon=\"settings\" size=\"sm\" (action)=\"popupGridConfiguration.open()\" type=\"link\">\r\n          </sd-button>\r\n        </div>\r\n        <mat-paginator [class.d-none]=\"gridOption.paginate?.hidden\" [length]=\"total\"\r\n          [pageSize]=\"gridOption.paginate?.pageSize\" [pageSizeOptions]=\"gridOption.paginate?.pages\"\r\n          [showFirstLastButtons]=\"gridOption.paginate?.showFirstLastButtons\"></mat-paginator>\r\n      </div>\r\n    </div>\r\n    <sd-popup-export *ngIf=\"gridOption.export?.visible\" [gridOption]=\"gridOption\" (export)=\"onExport($event)\"\r\n      #sdPopupExport>\r\n    </sd-popup-export>\r\n    <sd-popup-grid-configuration [gridOption]=\"gridOption\" [key]=\"key\" #popupGridConfiguration>\r\n    </sd-popup-grid-configuration>\r\n  </ng-container>\r\n</ng-container>\r\n<ng-template #inlineColumn let-column=\"column\">\r\n  <ng-container *ngIf=\"\r\n      column.type === 'string' ||\r\n        column.type === 'number' ||\r\n        column.type === 'bool' ||\r\n        column.type === 'values' ||\r\n        column.type === 'date' ||\r\n        column.type === 'datetime' ||\r\n        column.type === 'time';\r\n      else noFilter\r\n    \">\r\n    <sd-input *ngIf=\"column.type === 'string'\" size=\"sm\" type=\"text\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-input *ngIf=\"column.type === 'number'\" size=\"sm\" type=\"number\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-select *ngIf=\"column.type === 'bool'\" size=\"sm\" [items]=\"[\r\n        { value: '1', display: column.option?.displayOnTrue || 'True' },\r\n        { value: '0', display: column.option?.displayOnFalse || 'False' }\r\n      ]\" valueField=\"value\" displayField=\"display\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-select>\r\n    <sd-select *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection !== 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\" [multiple]=\"\r\n        column?.option?.selection === 'MULTIPLE' ||\r\n        column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\r\n      \" [filtered]=\"column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\">\r\n    </sd-select>\r\n    <sd-autocomplete *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection === 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-autocomplete>\r\n    <sd-date-time *ngIf=\"\r\n        column.type === 'date' ||\r\n        column.type === 'datetime' ||\r\n        column.type === 'time'\r\n      \" size=\"sm\" [(model)]=\"columnFilter[column.field]\" [type]=\"column.type\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-date-time>\r\n  </ng-container>\r\n  <ng-template #noFilter>\r\n    <sd-input type=\"text\" disabled> </sd-input>\r\n  </ng-template>\r\n</ng-template>\r\n\r\n<sd-quick-action *ngIf=\"\r\n    selectedItems\r\n      | selectionActionFilter: gridOption?.selection?.actions as actions\r\n  \" [isOpened]=\"actions?.length\">\r\n  <div sdMessage>\r\n    <strong class=\"text-info\">{{ selectedItems.length }}</strong>\r\n    {{ gridOption?.selection?.message || (\"selected rows\" | sdTranslate) }}\r\n  </div>\r\n  <div class=\"d-flex align-items-center\" sdAction>\r\n    <ng-container *ngFor=\"let action of actions\">\r\n      <sd-button *ngIf=\"action.click\" class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon\"\r\n        [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n        [title]=\"action.title\" size=\"sm\" (action)=\"action.click(selectedItems)\"></sd-button>\r\n      <ng-container *ngIf=\"action.children?.length\">\r\n        <sd-button class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon || 'more_vert'\"\r\n          [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n          [title]=\"action.title\" size=\"sm\" [matMenuTriggerFor]=\"menu\">\r\n        </sd-button>\r\n        <mat-menu #menu=\"matMenu\">\r\n          <span>\r\n            <button *ngFor=\"let childAction of action.children\" mat-menu-item (click)=\"childAction.click(selectedItems)\"\r\n              [disabled]=\"childAction.disabled\">\r\n              <mat-icon [fontSet]=\"childAction.fontSet\" class=\"c-icon\">{{ childAction.icon }}\r\n              </mat-icon>\r\n              <span> {{ childAction.title }}</span>\r\n            </button>\r\n          </span>\r\n        </mat-menu>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</sd-quick-action>",
+                template: "<ng-container *ngIf=\"gridConfigurationObserver | async as gridConfiguration\">\r\n  <ng-container *ngIf=\"\r\n      gridConfiguration\r\n        | sdGridConfigurationResult\r\n          : gridOption\r\n          : sdSubInformation as configuration\r\n    \">\r\n    <ng-container *ngIf=\"!gridOption.filter?.disabled\">\r\n      <sd-grid-filter [filter]=\"gridOption?.filter\" [columns]=\"configuration.firstColumns\" [filterDefs]=\"filterDefs\">\r\n      </sd-grid-filter>\r\n    </ng-container>\r\n    <div class=\"c-container {{ gridOption?.style?.grid }}\" [ngClass]=\"{ 'mat-elevation-z2': gridOption?.shadow }\">\r\n      <div class=\"c-loading\" *ngIf=\"isLoading\">\r\n        <mat-spinner *ngIf=\"isLoading\"></mat-spinner>\r\n      </div>\r\n      <ng-container>\r\n        <div class=\"c-table\" [ngStyle]=\"{\r\n            'max-height': gridOption?.maxHeight,\r\n            'min-height': 'gridOption?.minHeight'\r\n          }\">\r\n          <table *ngIf=\"items?.length; else elseEmpty\" mat-table [dataSource]=\"items\" matSort\r\n            [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n            (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n            <ng-container matColumnDef=\"sdSubInformation\" sticky>\r\n              <td class=\"p-0\" mat-cell *matCellDef=\"let item\" [attr.colspan]=\"configuration.displayedColumns.length\">\r\n                <div *ngIf=\"sdSubInformation?.templateRef\" [@detailExpand]=\"item.isExpanded ? 'expanded' : 'collapsed'\">\r\n                  <ng-container *ngIf=\"item.isExpanded\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        sdSubInformation.templateRef;\r\n                        context: { item: item }\r\n                      \">\r\n                    </ng-container>\r\n                  </ng-container>\r\n                </div>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdSubInformationAction\" stickyEnd>\r\n              <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              <td mat-cell *matCellDef=\"let element\">\r\n                <button *ngIf=\"!element.isExpanding\" mat-icon-button aria-label=\"Expand & Collapse\"\r\n                  (click)=\"onExpand(element)\">\r\n                  <mat-icon *ngIf=\"!element.isExpanded\">expand_more</mat-icon>\r\n                  <mat-icon *ngIf=\"element.isExpanded\">expand_less</mat-icon>\r\n                </button>\r\n                <div *ngIf=\"element.isExpanding\" class=\"lds-ring\">\r\n                  <div></div>\r\n                  <div></div>\r\n                  <div></div>\r\n                  <div></div>\r\n                </div>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdSelection\" sticky>\r\n              <th class=\"text-center px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n                  [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\" [disabled]=\"\r\n                    items | selectionDisableSelectAll: gridOption?.selection\r\n                  \">\r\n                </mat-checkbox>\r\n              </th>\r\n              <td class=\"text-center px-15\" mat-cell *matCellDef=\"let item\" style=\"min-width: 50px; max-width: 50px\">\r\n                <mat-checkbox class=\"c-selection\" color=\"primary\" [(ngModel)]=\"item.isSelected\"\r\n                  (change)=\"onSelect(item)\" [disabled]=\"\r\n                    selectedItems | selectionDisable: item:gridOption?.selection\r\n                  \">\r\n                </mat-checkbox>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdEditor\">\r\n              <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                <button\r\n                  *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n                  (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n                  <mat-icon class=\"c-icon\">add</mat-icon>\r\n                </button>\r\n              </th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *sdLet=\"item.editorStatus | sdEditorHandlerRow:item:gridOption as editorHandler\">\r\n                  <div *ngIf=\"editorHandler\" class=\"d-flex align-items-center justify-content-center\">\r\n                    <button *ngIf=\"editorHandler.editable\" class=\"mx-2\" (click)=\"onUpdate(item)\" aria-hidden=\"true\"\r\n                      mat-icon-button>\r\n                      <mat-icon class=\"c-icon\">edit</mat-icon>\r\n                    </button>\r\n                    <button *ngIf=\"editorHandler.removable\" class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\"\r\n                      mat-icon-button>\r\n                      <mat-icon class=\"c-icon\">delete</mat-icon>\r\n                    </button>\r\n                    <button *ngIf=\"editorHandler.savable\" class=\"mx-2\" (click)=\"onSave(item)\" aria-hidden=\"true\"\r\n                      mat-icon-button>\r\n                      <mat-icon class=\"c-icon\">save</mat-icon>\r\n                    </button>\r\n                    <button *ngIf=\"editorHandler.cancelable\" class=\"mx-2\" (click)=\"onCancel(item)\" aria-hidden=\"true\"\r\n                      mat-icon-button>\r\n                      <mat-icon class=\"c-icon\">close</mat-icon>\r\n                    </button>\r\n                  </div>\r\n                </ng-container>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdCommand\">\r\n              <th class=\"px-8 py-8\" mat-header-cell *matHeaderCellDef style=\"width: 50px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-command [commands]=\"gridOption.commands\" [item]=\"item\"></sd-desktop-command>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\" [matColumnDef]=\"column.field\"\r\n              [sticky]=\"configuration.fixedColumn[column.field]\">\r\n              <th mat-header-cell *matHeaderCellDef cdkDrag class=\"px-8 py-8 c-th\"\r\n                [ngStyle]=\"{ 'min-width': column.width }\" [attr.rowspan]=\"\r\n                  configuration.multipleHeader && column.type !== 'children-col'\r\n                    ? 2\r\n                    : 1\r\n                \" [attr.colspan]=\"\r\n                  column.type === 'children-col' ? column.children?.length : 1\r\n                \">\r\n                <div>\r\n                  <div aria-hidden=\"false\" role=\"presentation\" mat-sort-header [disabled]=\"\r\n                      !column.sortable || column.type === 'children-col'\r\n                    \" [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                  <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        inlineColumn;\r\n                        context: { column: column }\r\n                      \"></ng-container>\r\n                  </div>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *ngIf=\"cellDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      cellDef[column.field].templateRef;\r\n                      context: { item: item, column: column, idx: i }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n                <sd-desktop-cell *ngIf=\"!cellDef[column.field]\" [key]=\"key\" [column]=\"column\" [item]=\"item\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-cell>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                <ng-container *ngIf=\"footerDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      footerDef[column.field].templateRef;\r\n                      context: { items: items, column: column }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container *ngFor=\"let column of configuration.secondColumns; let i = index\"\r\n              [matColumnDef]=\"column.field\">\r\n              <th mat-header-cell *matHeaderCellDef mat-sort-header class=\"c-th px-8\"\r\n                [ngStyle]=\"{ 'min-width': column.width }\">\r\n                <div>\r\n                  <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                  <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        inlineColumn;\r\n                        context: { column: column }\r\n                      \"></ng-container>\r\n                  </div>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <ng-container *ngIf=\"cellDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      cellDef[column.field].templateRef;\r\n                      context: { item: item, column: column, idx: i }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n                <sd-desktop-cell *ngIf=\"!cellDef[column.field]\" [key]=\"key\" [column]=\"column\" [item]=\"item\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-cell>\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef>\r\n                <ng-container *ngIf=\"footerDef[column.field]\">\r\n                  <ng-container *ngTemplateOutlet=\"\r\n                      footerDef[column.field].templateRef;\r\n                      context: { items: items, column: column }\r\n                    \">\r\n                  </ng-container>\r\n                </ng-container>\r\n              </td>\r\n            </ng-container>\r\n            <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\"></tr>\r\n            <ng-container *ngIf=\"configuration.secondHeaders?.length\">\r\n              <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n              </tr>\r\n            </ng-container>\r\n            <tr mat-row *matRowDef=\"let row; columns: configuration.displayedColumns\" matRipple class=\"c-row\"></tr>\r\n            <tr mat-row *matRowDef=\"let row; columns: ['sdSubInformation']\" class=\"c-detail-row\"></tr>\r\n            <ng-container *ngIf=\"hasFooter && configuration.displayedFooters?.length\">\r\n              <tr mat-footer-row *matFooterRowDef=\"configuration.displayedFooters; sticky: true\"></tr>\r\n            </ng-container>\r\n          </table>\r\n          <ng-template #elseEmpty>\r\n            <table mat-table [dataSource]=\"[{}]\">\r\n              <ng-container matColumnDef=\"sdSelection\" sticky>\r\n                <th class=\"px-15\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdEditor\">\r\n                <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                  <button\r\n                    *ngIf=\"gridOption.editor?.addable && (!gridOption.editor.limit || gridOption.editor.limit > items.length)\"\r\n                    (click)=\"onCreate()\" aria-hidden=\"true\" mat-icon-button>\r\n                    <mat-icon class=\"c-icon\">add</mat-icon>\r\n                  </button>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdCommand\">\r\n                <th class=\"px-8\" mat-header-cell *matHeaderCellDef style=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdSubInformationAction\">\r\n                <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 1px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\"></th>\r\n              </ng-container>\r\n              <ng-container matColumnDef=\"sdEmpty\">\r\n                <td class=\"c-empty\" mat-cell *matCellDef=\"let item\"\r\n                  [attr.colspan]=\"configuration.displayedColumns.length\">\r\n                  <ng-container *ngIf=\"sdEmptyData?.templateRef; else sdEmptyDataNoRef\">\r\n                    <ng-container *ngTemplateOutlet=\"\r\n                        sdEmptyData.templateRef;\r\n                        context: { item: item }\r\n                      \">\r\n                    </ng-container>\r\n                  </ng-container>\r\n                  <ng-template #sdEmptyDataNoRef>\r\n                    <mat-icon fontSet=\"material-icons-outlined\">leaderboard</mat-icon>\r\n                  </ng-template>\r\n                </td>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.columns\" [matColumnDef]=\"column.field\"\r\n                [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n                  <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.firstColumns\" [matColumnDef]=\"column.field\"\r\n                [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\"\r\n                  [attr.rowspan]=\"\r\n                    configuration.multipleHeader &&\r\n                    column.type !== 'children-col'\r\n                      ? 2\r\n                      : 1\r\n                  \" [attr.colspan]=\"\r\n                    column.type === 'children-col' ? column.children?.length : 1\r\n                  \">\r\n                  <div>\r\n                    <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                    <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                      <ng-container *ngTemplateOutlet=\"\r\n                          inlineColumn;\r\n                          context: { column: column }\r\n                        \"></ng-container>\r\n                    </div>\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.secondColumns\" [matColumnDef]=\"column.field\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\" [ngStyle]=\"{ 'min-width': column.width }\">\r\n                  <div>\r\n                    <div [innerHTML]=\"column.titleHtml || column.title\"></div>\r\n                    <div class=\"c-inline-column\" *ngIf=\"gridOption.filter?.inlineColumn\">\r\n                      <ng-container *ngTemplateOutlet=\"\r\n                          inlineColumn;\r\n                          context: { column: column }\r\n                        \"></ng-container>\r\n                    </div>\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <tr class=\"c-first-header\" mat-header-row *matHeaderRowDef=\"configuration.firstHeaders; sticky: true\">\r\n              </tr>\r\n              <tr class=\"c-second-header\" mat-header-row *matHeaderRowDef=\"configuration.secondHeaders; sticky: true\">\r\n              </tr>\r\n              <tr mat-row *matRowDef=\"let row; columns: ['sdEmpty']\"></tr>\r\n            </table>\r\n          </ng-template>\r\n        </div>\r\n      </ng-container>\r\n      <div class=\"c-paginator\">\r\n        <div class=\"c-action\">\r\n          <sd-button *ngIf=\"\r\n              !gridOption.filter?.disabled && !gridOption.filter?.inlineColumn\r\n            \" class=\"mr-10\" [title]=\"'Filter' | sdTranslate\" icon=\"filter_alt\" size=\"sm\" (action)=\"gridFilter.open()\"\r\n            type=\"link\">\r\n          </sd-button>\r\n          <sd-button *ngIf=\"gridOption.reload?.visible\" class=\"mr-10\" [title]=\"'Reload' | sdTranslate\" icon=\"refresh\"\r\n            size=\"sm\" (action)=\"reload()\" [disabled]=\"!items?.length\" type=\"link\">\r\n          </sd-button>\r\n          <ng-container *ngIf=\"gridOption.export?.visible && items?.length\">\r\n            <ng-container *ngIf=\"isExporting; else unExporting\">\r\n              <sd-button class=\"mr-10\" [loading]=\"isExporting\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\"\r\n                size=\"sm\" type=\"link\">\r\n              </sd-button>\r\n            </ng-container>\r\n            <ng-template #unExporting>\r\n              <sd-button class=\"mr-10\" [title]=\"exportTitle | sdTranslate\" icon=\"get_app\" size=\"sm\"\r\n                [matMenuTriggerFor]=\"menu\" type=\"link\">\r\n              </sd-button>\r\n            </ng-template>\r\n\r\n            <mat-menu #menu=\"matMenu\">\r\n              <button *ngIf=\"gridOption.export?.visibleExcel !== false\" mat-menu-item\r\n                (click)=\"sdPopupExport.exportDefault()\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n                <span> {{ \"Export excel\" | sdTranslate }}</span>\r\n              </button>\r\n              <button *ngIf=\"gridOption.export?.visibleCSV !== false\" mat-menu-item\r\n                (click)=\"sdPopupExport.exportDefault(true)\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">file_download</mat-icon>\r\n                <span> {{ \"Export CSV\" | sdTranslate }}</span>\r\n              </button>\r\n              <button *ngIf=\"gridOption.export?.key\" mat-menu-item (click)=\"sdPopupExport.open()\" type=\"button\">\r\n                <mat-icon fontSet=\"material-icons-outlined\">settings</mat-icon>\r\n                <span> {{ \"Configure\" | sdTranslate }}</span>\r\n              </button>\r\n            </mat-menu>\r\n          </ng-container>\r\n          <sd-button *ngIf=\"gridOption.config?.visible\" class=\"mr-10\" [title]=\"'Configure' | sdTranslate\"\r\n            icon=\"settings\" size=\"sm\" (action)=\"popupGridConfiguration.open()\" type=\"link\">\r\n          </sd-button>\r\n        </div>\r\n        <mat-paginator [class.d-none]=\"gridOption.paginate?.hidden\" [length]=\"total\"\r\n          [pageSize]=\"gridOption.paginate?.pageSize\" [pageSizeOptions]=\"gridOption.paginate?.pages\"\r\n          [showFirstLastButtons]=\"gridOption.paginate?.showFirstLastButtons\"></mat-paginator>\r\n      </div>\r\n    </div>\r\n    <sd-popup-export *ngIf=\"gridOption.export?.visible\" [gridOption]=\"gridOption\" (export)=\"onExport($event)\"\r\n      #sdPopupExport>\r\n    </sd-popup-export>\r\n    <sd-popup-grid-configuration [gridOption]=\"gridOption\" [key]=\"key\" #popupGridConfiguration>\r\n    </sd-popup-grid-configuration>\r\n  </ng-container>\r\n</ng-container>\r\n<ng-template #inlineColumn let-column=\"column\">\r\n  <ng-container *ngIf=\"\r\n      column.type === 'string' ||\r\n        column.type === 'number' ||\r\n        column.type === 'bool' ||\r\n        column.type === 'values' ||\r\n        column.type === 'date' ||\r\n        column.type === 'datetime' ||\r\n        column.type === 'time';\r\n      else noFilter\r\n    \">\r\n    <sd-input *ngIf=\"column.type === 'string'\" size=\"sm\" type=\"text\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-input *ngIf=\"column.type === 'number'\" size=\"sm\" type=\"number\" [(model)]=\"columnFilter[column.field]\"\r\n      (keyupEnter)=\"onFilterChange()\" [disabled]=\"column.filter?.disabled\">\r\n    </sd-input>\r\n    <sd-select *ngIf=\"column.type === 'bool'\" size=\"sm\" [items]=\"[\r\n        { value: '1', display: column.option?.displayOnTrue || 'True' },\r\n        { value: '0', display: column.option?.displayOnFalse || 'False' }\r\n      ]\" valueField=\"value\" displayField=\"display\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-select>\r\n    <sd-select *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection !== 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\" [multiple]=\"\r\n        column?.option?.selection === 'MULTIPLE' ||\r\n        column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\r\n      \" [filtered]=\"column?.option?.selection === 'MULTIPLEAUTOCOMPLETE'\">\r\n    </sd-select>\r\n    <sd-autocomplete *ngIf=\"\r\n        column.type === 'values' && column?.option?.selection === 'AUTOCOMPLETE'\r\n      \" size=\"sm\" [items]=\"column.option.items\" [valueField]=\"column.option.valueField\"\r\n      [displayField]=\"column.option.displayField\" [(model)]=\"columnFilter[column.field]\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-autocomplete>\r\n    <sd-date-time *ngIf=\"\r\n        column.type === 'date' ||\r\n        column.type === 'datetime' ||\r\n        column.type === 'time'\r\n      \" size=\"sm\" [(model)]=\"columnFilter[column.field]\" [type]=\"column.type\" (sdChange)=\"onFilterChange()\"\r\n      [disabled]=\"column.filter?.disabled\">\r\n    </sd-date-time>\r\n  </ng-container>\r\n  <ng-template #noFilter>\r\n    <sd-input type=\"text\" disabled> </sd-input>\r\n  </ng-template>\r\n</ng-template>\r\n\r\n<sd-quick-action *ngIf=\"\r\n    selectedItems\r\n      | selectionActionFilter: gridOption?.selection?.actions as actions\r\n  \" [isOpened]=\"actions?.length\">\r\n  <div sdMessage>\r\n    <strong class=\"text-info\">{{ selectedItems.length }}</strong>\r\n    {{ gridOption?.selection?.message || (\"selected rows\" | sdTranslate) }}\r\n  </div>\r\n  <div class=\"d-flex align-items-center\" sdAction>\r\n    <ng-container *ngFor=\"let action of actions\">\r\n      <sd-button *ngIf=\"action.click\" class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon\"\r\n        [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n        [title]=\"action.title\" size=\"sm\" (action)=\"action.click(selectedItems)\"></sd-button>\r\n      <ng-container *ngIf=\"action.children?.length\">\r\n        <sd-button class=\"ml-5\" [tooltip]=\"action.tooltip\" [icon]=\"action.icon || 'more_vert'\"\r\n          [color]=\"action.color || 'secondary'\" [type]=\"action.type || 'light'\" [fontSet]=\"action.fontSet\"\r\n          [title]=\"action.title\" size=\"sm\" [matMenuTriggerFor]=\"menu\">\r\n        </sd-button>\r\n        <mat-menu #menu=\"matMenu\">\r\n          <span>\r\n            <button *ngFor=\"let childAction of action.children\" mat-menu-item (click)=\"childAction.click(selectedItems)\"\r\n              [disabled]=\"childAction.disabled\">\r\n              <mat-icon [fontSet]=\"childAction.fontSet\" class=\"c-icon\">{{ childAction.icon }}\r\n              </mat-icon>\r\n              <span> {{ childAction.title }}</span>\r\n            </button>\r\n          </span>\r\n        </mat-menu>\r\n      </ng-container>\r\n    </ng-container>\r\n  </div>\r\n</sd-quick-action>",
                 animations: [
                     trigger('detailExpand', [
                         state('collapsed', style({ height: '0', minHeight: '0', visibility: 'hidden' })),
@@ -2718,12 +2715,10 @@ SdDesktopCellEditor.propDecorators = {
 };
 
 class SdEditorHandlerRowPipe {
-    transform(item, gridOption) {
+    transform(status, item, gridOption) {
         const { editor } = gridOption;
         if (!editor) {
-            return {
-                visible: false
-            };
+            return null;
         }
         let isDisabled = false;
         if (typeof (editor === null || editor === void 0 ? void 0 : editor.disabled) === 'function') {
@@ -2732,21 +2727,21 @@ class SdEditorHandlerRowPipe {
         else {
             isDisabled = editor === null || editor === void 0 ? void 0 : editor.disabled;
         }
+        if (isDisabled) {
+            return null;
+        }
         if (editor.type === 'inline') {
             const removable = editor.removable;
-            if (typeof (removable) === 'function') {
-                item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, removable: removable(item), isInline: true });
-                return item.editorHandlerRow;
-            }
-            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, removable: removable, isInline: true });
-            return item.editorHandlerRow;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: false, removable: status === 'update' && (typeof (removable) === 'function' ? removable(item) : removable), savable: false, cancelable: status === 'create' });
+        }
+        else if (editor.type === 'focus') {
+            const editable = editor.editable;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: !status && (typeof (editable) === 'function' ? editable(item) : editable), removable: false, savable: !!status, cancelable: !!status });
         }
-        const editable = editor.editable;
-        if (typeof (editable) === 'function') {
-            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, editable: editable(item), isInline: false });
-            return item.editorHandlerRow;
+        else if (editor.type === 'popup') {
+            const editable = editor.editable;
+            item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { editable: !status && (typeof (editable) === 'function' ? editable(item) : editable), removable: false, savable: false, cancelable: false });
         }
-        item.editorHandlerRow = Object.assign(Object.assign({}, item.editorHandlerRow), { visible: !isDisabled, editable: editable, isInline: false });
         return item.editorHandlerRow;
     }
 }
@@ -2795,9 +2790,8 @@ class SdEditorValidatePipe {
         this.delay = 1000; // Sau khoảng thời gian delay nếu không có thay đổi thì thì mới bắt đầu thực hiện validate
     }
     transform(value, item, validate) {
-        var _a;
         return __awaiter(this, void 0, void 0, function* () {
-            if (!((_a = item.editorHandlerRow) === null || _a === void 0 ? void 0 : _a.visible)) {
+            if (!item.editorHandlerRow) {
                 return true;
             }
             this.previous = new Date();