@sd-angular/core 1.0.95 → 1.0.98

package/bundles/sd-angular-core-editor.umd.min.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../node_modules/tslib/tslib.es6.js","../../../../projects/sd-core/editor/src/lib/constant.ts","../../../../projects/sd-core/editor/src/lib/editor.component.ts","../../../../projects/sd-core/editor/src/lib/editor.module.ts"],"names":["Object","create","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","value","get","__classPrivateFieldSet","set","Constants","ARE_YOU_WANT_TO_DELETE","ACTIVE","IN_ACTIVE","APPROVE","UN_APPROVE","ACCEPT_SIZE_IMAGE","ACCEPT_TYPE_IMAGE","PAGE_TYPE_NEW","PAGE_TYPE_EDIT","SAVE","SAVE_AND_CONTINUE","IMAGE_SIZE","SUCCESS","IMPORT_SUCCESSFULLY","ERROR","FAILED","FILE","NONE","NOT_EXIST_ID_OR_LINK","FEATURE_IS_PENDING","NOT_SUPPORT_FILE_IMAGE","NOT_SUPPORT_FILE_IMPORT","NETWORK_ERROR","SORT_BY","name","DESC","FORM_ERRORS","Id","textSearch","ImportLogId","SortBy","Reverse","VALIDATION_MESSAGES","ValidateMessageConstants","TITLE_REQUIRED","TITLE_MAXLENGTH","TITLE_PATTERN","CREATED_AT_REQUIRED","SHOW_ON_HOME_REQUIRED","DISPLAY_NUMBER_REQUIRED","CONTENT_TYPE_REQUIRED","DISCOUNT_PERCENT_REQUIRED","DISCOUNT_PERCENT_MAX","DISCOUNT_PERCENT_MIN","PROMOTION_FORM","title","createdAt","displayNumber","showOnHome","discountPercent","isActive","ctaLabelName","ctaDeepLink","tags","required","maxlength","pattern","max","min","SdEditor","ref","sdApiService","_this","this","_name","uuid.v4","id","_subscription","Subscription","_model","modelChange","EventEmitter","placeholder","styles","height","formControl","FormControl","domain","_form","enableHTMLButton","showHtmlEditor","quillConfig","toolbar","container","header","list","script","indent","direction","size","color","background","font","align","mention","allowedChars","mentionDenotationChars","source","searchTerm","renderList","mentionChar","mentionValues","values","length","matches","i","toLowerCase","indexOf","push","keyboard","bindings","enter","key","handler","range","context","textLength","sdChange","_updateValidator","clearValidators","clearAsyncValidators","validators","Validators","minlength","minLength","maxLength","setValidators","updateValueAndValidity","editorInit","quill","quillEvent","self","getModule","addHandler","fileInput","querySelector","document","createElement","setAttribute","classList","add","addEventListener","files","getSelection","formData","FormData","append","enable","_uploadImage","appendChild","click","onModelChange","val","setValue","modelHTML","onClickShowHtmlEditor","urlUploadImage","post","then","resp","dangerouslyPasteHTML","index","_a","data","imageUrl","_b","publish_url","url","_c","_d","content","getContents","setContents","setSelection","defineProperty","prototype","emitEvent","detectChanges","disable","NgForm","form","ngOnInit","addControl","console","log","ngAfterViewInit","valueChanges","subscribe","emit","ngOnDestroy","removeControl","unsubscribe","Component","args","selector","template","ChangeDetectorRef","SdApiService","ViewChild","Input","Output","NgModule","declarations","imports","CommonModule","FormsModule","ReactiveFormsModule","QuillModule","forRoot","SdTranslateModule","SdButtonModule","SdTextareaModule","SdApiModule","exports","providers"],"mappings":"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","sourcesContent":["/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n    extendStatics = Object.setPrototypeOf ||\r\n        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n    return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n    if (typeof b !== \"function\" && b !== null)\r\n        throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n    extendStatics(d, b);\r\n    function __() { this.constructor = d; }\r\n    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n    __assign = Object.assign || function __assign(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n        }\r\n        return t;\r\n    }\r\n    return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n    if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n    return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n    return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n    if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (_) try {\r\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n    if (k2 === undefined) k2 = k;\r\n    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });\r\n}) : (function(o, m, k, k2) {\r\n    if (k2 === undefined) k2 = k;\r\n    o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n    var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n    if (m) return m.call(o);\r\n    if (o && typeof o.length === \"number\") return {\r\n        next: function () {\r\n            if (o && i >= o.length) o = void 0;\r\n            return { value: o && o[i++], done: !o };\r\n        }\r\n    };\r\n    throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n    var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n    if (!m) return o;\r\n    var i = m.call(o), r, ar = [], e;\r\n    try {\r\n        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n    }\r\n    catch (error) { e = { error: error }; }\r\n    finally {\r\n        try {\r\n            if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n        }\r\n        finally { if (e) throw e.error; }\r\n    }\r\n    return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n    for (var ar = [], i = 0; i < arguments.length; i++)\r\n        ar = ar.concat(__read(arguments[i]));\r\n    return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n    for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n            r[k] = a[j];\r\n    return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n    return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n    if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n    var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n    return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n    function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n    function fulfill(value) { resume(\"next\", value); }\r\n    function reject(value) { resume(\"throw\", value); }\r\n    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n    var i, p;\r\n    return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n    function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n    if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n    var m = o[Symbol.asyncIterator], i;\r\n    return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n    if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n    return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n    o[\"default\"] = v;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n    if (mod && mod.__esModule) return mod;\r\n    var result = {};\r\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\r\n    __setModuleDefault(result, mod);\r\n    return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n    return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n    if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n    if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n    return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n    if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n    if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n    if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n    return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n","export const Constants = {\r\n    ARE_YOU_WANT_TO_DELETE: 'Are you sure you want to delete?',\r\n    ACTIVE: 'active',\r\n    IN_ACTIVE: 'inactive',\r\n    APPROVE: 'approve',\r\n    UN_APPROVE: 'unapprove',\r\n    ACCEPT_SIZE_IMAGE: 'Logo only accept image with size <= 2MB',\r\n    ACCEPT_TYPE_IMAGE:\r\n      'image/png, image/gif, image/jpeg, image/bmp, image/x-icon',\r\n    PAGE_TYPE_NEW: 'new',\r\n    PAGE_TYPE_EDIT: 'edit',\r\n    SAVE: 'saveOb',\r\n    SAVE_AND_CONTINUE: 'saveAndContOb',\r\n    IMAGE_SIZE: 2048000,\r\n    SUCCESS: 'Success',\r\n    IMPORT_SUCCESSFULLY: 'Import successfully!',\r\n    ERROR: 'Error',\r\n    FAILED: 'fail',\r\n    FILE: 'file',\r\n    NONE: 'none',\r\n    NOT_EXIST_ID_OR_LINK: 'This ID/Link is not existing',\r\n    FEATURE_IS_PENDING: 'This feature is pending',\r\n    NOT_SUPPORT_FILE_IMAGE: 'File upload is not supported.',\r\n    NOT_SUPPORT_FILE_IMPORT: 'File import is not supported.',\r\n    NETWORK_ERROR: 'Network Error',\r\n    SORT_BY: [\r\n      {\r\n        value: 0,\r\n        name: 'Created Date'\r\n      },\r\n      {\r\n        value: 1,\r\n        name: 'Title'\r\n      }\r\n    ],\r\n    DESC: [\r\n      {\r\n        value: true,\r\n        name: 'Descending'\r\n      },\r\n      {\r\n        value: false,\r\n        name: 'Ascending'\r\n      }\r\n    ],\r\n    FORM_ERRORS: {\r\n        Id: '',\r\n        textSearch: '',\r\n        ImportLogId: '',\r\n        SortBy: '',\r\n        Reverse: '',\r\n      },\r\n    VALIDATION_MESSAGES: {}\r\n};\r\n\r\nexport const PROMOTION_PERMISSIONS = ['ListPromotion', 'AddNewPromotion', 'EditPromotion',\r\n  'ActiveOrInactivePromotion', 'RemovePromotion', 'ImportPromotion', 'ExportPromotion'];\r\n\r\nexport const ValidateMessageConstants = {\r\n    TITLE_REQUIRED: 'Title is required',\r\n    TITLE_MAXLENGTH: 'Title is not more than 55 characters',\r\n    TITLE_PATTERN: 'Title is required',\r\n\r\n    CREATED_AT_REQUIRED: 'Created At is required',\r\n\r\n    SHOW_ON_HOME_REQUIRED: 'Show On Home is required',\r\n\r\n    DISPLAY_NUMBER_REQUIRED: 'Display Number is required',\r\n\r\n    CONTENT_TYPE_REQUIRED: 'Content Type is required',\r\n\r\n    DISCOUNT_PERCENT_REQUIRED: 'Discount percent is required',\r\n    DISCOUNT_PERCENT_MAX: 'Max discount percent is 100, cannot input greater',\r\n    DISCOUNT_PERCENT_MIN: 'Min discount percent is 0, cannot input lower'\r\n};\r\n\r\nexport const PROMOTION_FORM = {\r\n  FORM_ERRORS: {\r\n    title: '',\r\n    createdAt: '',\r\n    displayNumber: '',\r\n    showOnHome: '',\r\n    discountPercent: '',\r\n    isActive: '',\r\n    ctaLabelName: '',\r\n    ctaDeepLink: '',\r\n    tags: ''\r\n  },\r\n  VALIDATION_MESSAGES: {\r\n    title: {\r\n      required: ValidateMessageConstants.TITLE_REQUIRED,\r\n      maxlength: ValidateMessageConstants.TITLE_MAXLENGTH,\r\n      pattern: ValidateMessageConstants.TITLE_PATTERN\r\n    },\r\n    createdAt: {\r\n      required: ValidateMessageConstants.CREATED_AT_REQUIRED\r\n    },\r\n    showOnHome: {\r\n      required: ValidateMessageConstants.SHOW_ON_HOME_REQUIRED\r\n    },\r\n    displayNumber: {\r\n      required: ValidateMessageConstants.DISPLAY_NUMBER_REQUIRED\r\n    },\r\n    discountPercent: {\r\n      required: ValidateMessageConstants.DISCOUNT_PERCENT_REQUIRED,\r\n      max: ValidateMessageConstants.DISCOUNT_PERCENT_MAX,\r\n      min: ValidateMessageConstants.DISCOUNT_PERCENT_MIN\r\n    },\r\n    tags: {\r\n      required: ValidateMessageConstants.CONTENT_TYPE_REQUIRED\r\n    }\r\n  }\r\n};\r\n","import {\r\n  Component,\r\n  ViewChild,\r\n  Input,\r\n  OnInit,\r\n  Output,\r\n  EventEmitter,\r\n  ChangeDetectorRef,\r\n  AfterViewInit, OnDestroy\r\n} from '@angular/core';\r\nimport {QuillEditorComponent} from 'ngx-quill';\r\nimport * as uuid from 'uuid';\r\nimport {FormControl, FormGroup, NgForm, ValidatorFn, Validators} from '@angular/forms';\r\nimport {Constants} from './constant';\r\nimport {Subscription} from 'rxjs';\r\nimport {SdApiService} from '@sd-angular/core/api';\r\nimport 'quill-mention';\r\n\r\n@Component({\r\n  selector: 'sd-editor',\r\n  templateUrl: './editor.component.html',\r\n  styleUrls: ['./editor.component.scss'],\r\n})\r\nexport class SdEditor implements OnInit, AfterViewInit, OnDestroy {\r\n  #name = `N${uuid.v4()}`;\r\n  id: string = `I${uuid.v4()}`;\r\n  #subscription = new Subscription();\r\n  @ViewChild('editor') editor: QuillEditorComponent;\r\n  @Input() label: string;\r\n  #model: string;\r\n  @Input() set model(val: string) {\r\n    this.#model = val;\r\n    this.modelHTML = val;\r\n    this.formControl.setValue(this.#model, {\r\n      emitEvent: false\r\n    });\r\n    this.ref.detectChanges();\r\n  }\r\n\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.formControl.disable();\r\n    } else {\r\n      this.formControl.enable();\r\n    }\r\n  }\r\n\r\n  required = false;\r\n\r\n  @Input() set pRequired(val: boolean | '') {\r\n    this.required = (val === '') || val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  minlength: number;\r\n\r\n  @Input('minlength') set _minlength(val: number) {\r\n    this.minlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  maxlength: number;\r\n\r\n  @Input('maxlength') set _maxlength(val: number) {\r\n    this.maxlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  @Output() modelChange = new EventEmitter<string>();\r\n\r\n  @Input() placeholder: string = '';\r\n\r\n  @Input() styles: any = {height: '250px'};\r\n\r\n  formControl = new FormControl();\r\n\r\n  @Input() domain = '';\r\n  @Input() urlUploadImage: string;\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n\r\n  @Input() toolbar: any;\r\n  @Input() enableHTMLButton = false;\r\n  showHtmlEditor = false;\r\n  modelHTML: string;\r\n\r\n  quillEvent: any;\r\n  @Input() mentionValues: { id: string, value: string, link?: string }[];\r\n\r\n  quillConfig = {\r\n    // toolbar: '.toolbar',\r\n    toolbar: {\r\n      container: [\r\n        ['bold', 'italic', 'underline', 'strike'],        // toggled buttons\r\n        ['blockquote', 'code-block'],\r\n\r\n        [{'header': 1}, {'header': 2}],               // custom button values\r\n        [{'list': 'ordered'}, {'list': 'bullet'}],\r\n        [{'script': 'sub'}, {'script': 'super'}],      // superscript/subscript\r\n        [{'indent': '-1'}, {'indent': '+1'}],          // outdent/indent\r\n        [{'direction': 'rtl'}],                         // text direction\r\n\r\n        [{'size': ['small', false, 'large', 'huge']}],  // custom dropdown\r\n        [{'header': [1, 2, 3, 4, 5, 6, false]}],\r\n\r\n        [{'color': []}, {'background': []}],          // dropdown with defaults from theme\r\n        [{'font': []}],\r\n        [{'align': []}],\r\n\r\n        ['clean'],                                         // remove formatting button\r\n\r\n        ['link', 'image', 'video']                         // link and image, video\r\n      ]\r\n    },\r\n    mention: {\r\n      allowedChars: /^[A-Za-z0-9\\sÅÄÖåäö._-]*$/,\r\n      mentionDenotationChars: ['@'],\r\n      source: (searchTerm, renderList, mentionChar) => {\r\n        if (this.mentionValues) {\r\n          let values;\r\n          if (mentionChar === '@') {\r\n            values = this.mentionValues;\r\n          } else {\r\n            values = [];\r\n          }\r\n\r\n          if (searchTerm.length === 0) {\r\n            renderList(values, searchTerm);\r\n          } else {\r\n            const matches = [];\r\n            // tslint:disable-next-line:prefer-for-of\r\n            for (let i = 0; i < values.length; i++) {\r\n              // tslint:disable-next-line:no-bitwise\r\n              if (~values[i].value.toLowerCase().indexOf(searchTerm.toLowerCase())) {\r\n                matches.push(values[i]);\r\n              }\r\n            }\r\n            renderList(matches, searchTerm);\r\n          }\r\n        }\r\n      },\r\n    },\r\n    keyboard: {\r\n      bindings: {\r\n        enter: {\r\n          key: 13,\r\n          handler: (range, context) => {\r\n            return true;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  };\r\n\r\n  textLength: number = 0;\r\n  @Output() sdChange = new EventEmitter<string>();\r\n\r\n  constructor(\r\n    private ref: ChangeDetectorRef,\r\n    private sdApiService: SdApiService\r\n  ) {\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#name, this.formControl);\r\n    if (this.toolbar) {\r\n      this.quillConfig.toolbar.container = this.toolbar;\r\n      console.log('toolbar', this.quillConfig);\r\n    }\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    this.#subscription.add(this.formControl.valueChanges.subscribe((val) => {\r\n      this.modelChange.emit(val);\r\n      this.sdChange.emit(val);\r\n    }));\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  #updateValidator = () => {\r\n    this.formControl.clearValidators();\r\n    this.formControl.clearAsyncValidators();\r\n    const validators: ValidatorFn[] = [];\r\n    if (this.required) {\r\n      validators.push(Validators.required);\r\n    }\r\n    if (this.minlength > 0) {\r\n      validators.push(Validators.minLength(this.minlength));\r\n    }\r\n    if (this.maxlength > 0) {\r\n      validators.push(Validators.maxLength(this.maxlength));\r\n    }\r\n    this.formControl.setValidators(validators);\r\n    this.formControl.updateValueAndValidity();\r\n  }\r\n\r\n  editorInit = (quill) => {\r\n    this.quillEvent = quill;\r\n    // const txtArea = document.createElement('textarea');\r\n    // txtArea.style.cssText =\r\n    //   'width: 100%;margin: 0px;background: rgb(29, 29, 29);' +\r\n    //   'box-sizing: border-box;color: rgb(204, 204, 204);' +\r\n    //   'font-size: 15px;outline: none;padding: 20px;' +\r\n    //   'line-height: 24px;font-family: Consolas, Menlo, Monaco, &quot;Courier New&quot;, monospace;' +\r\n    //   'position: absolute;top: 0;bottom: 0;border: none;display:none';\r\n\r\n    // const htmlEditor = quill.addContainer('ql-custom');\r\n    // htmlEditor.appendChild(txtArea);\r\n\r\n    // const myEditor = quill.container;\r\n    // quill.on('text-change', (delta, oldDelta, source) => {\r\n    //   const html = myEditor.children[0].innerHTML;\r\n    //   txtArea.value = html;\r\n    //   // if (quill.getLength() > this.maxlength) {\r\n    //   //   quill.deleteText(this.maxlength, quill.getLength());\r\n    //   // }\r\n    //   // this.formControl.setValue(html);\r\n    // });\r\n\r\n    const self = this;\r\n    quill.getModule('toolbar').addHandler('image', function () {\r\n      let fileInput = this.container.querySelector('input.ql-image[type=file]');\r\n\r\n      if (fileInput == null) {\r\n        fileInput = document.createElement('input');\r\n        fileInput.setAttribute('type', Constants.FILE);\r\n        fileInput.setAttribute('accept', 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon');\r\n        fileInput.classList.add('ql-image');\r\n        fileInput.addEventListener('change', () => {\r\n          const files = fileInput.files;\r\n          const range = this.quill.getSelection(true);\r\n          if (!files || !files.length) {\r\n            return;\r\n          }\r\n\r\n          const formData = new FormData();\r\n          formData.append(Constants.FILE, files[0]);\r\n\r\n          this.quill.enable(false);\r\n          /*this.apiService.post(this.domain + this.urlUploadImage, formData).subscribe((resp: any) => {\r\n            this.quill.enable(true);\r\n            this.quill.editor.insertEmbed(range.index, 'image', resp.data.imageUrl || resp.data.publish_url ||  resp.url);\r\n            const content = this.quill.getContents();\r\n            this.quill.setContents(content);\r\n            this.quill.setSelection(range.index + 1, 'silent');\r\n            fileInput.value = '';\r\n          });*/\r\n          self.#uploadImage(formData, quill, range, fileInput);\r\n        });\r\n        this.container.appendChild(fileInput);\r\n      }\r\n      fileInput.click();\r\n    });\r\n  }\r\n\r\n  onModelChange = (val: string) => {\r\n    this.formControl.setValue(val);\r\n    this.modelHTML = val;\r\n  }\r\n\r\n  onClickShowHtmlEditor = () => {\r\n    this.showHtmlEditor = !this.showHtmlEditor;\r\n  }\r\n\r\n  #uploadImage = (formData, quill, range, fileInput) => {\r\n    if (!this.urlUploadImage) {\r\n      this.urlUploadImage = '/partner/v2/merchandise/file/uploaduserfile';\r\n    }\r\n    // this.domain = 'https://api-commerce-qc.vinid.dev';\r\n    this.sdApiService.post(this.urlUploadImage, formData).then((resp: any) => {\r\n      quill.enable(true);\r\n      // quill.editor.insertEmbed(range.index, 'image', resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '');\r\n      quill.getModule('clipboard').dangerouslyPasteHTML(range.index, '<a target=\"_blank\" href=\"' + (resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '')\r\n        + '\"><img src=\"' + (resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '') + '\" alt=\"c-image-editor-quill\"></a>', 'user');\r\n      // quill.insertText();\r\n      const content = quill.getContents();\r\n      quill.setContents(content);\r\n      quill.setSelection(range.index + 1, 'user');\r\n      fileInput.value = '';\r\n    });\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { QuillModule } from 'ngx-quill';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { SdEditor } from './editor.component';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport {SdButtonModule} from '@sd-angular/core/button';\r\nimport {SdTextareaModule} from '@sd-angular/core/textarea';\r\nimport {SdApiModule, SdApiService} from '@sd-angular/core/api';\r\n\r\n@NgModule({\r\n  declarations: [SdEditor],\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    QuillModule.forRoot(),\r\n    SdTranslateModule,\r\n    SdButtonModule,\r\n    SdTextareaModule,\r\n    SdApiModule\r\n  ],\r\n  exports: [SdEditor],\r\n  providers: [],\r\n})\r\nexport class SdEditorModule { }\r\n"]}
+{"version":3,"sources":["../../../../node_modules/tslib/tslib.es6.js","../../../../projects/sd-core/editor/src/lib/constant.ts","../../../../projects/sd-core/editor/src/lib/editor.component.ts","../../../../projects/sd-core/editor/src/lib/editor.module.ts"],"names":["Object","create","__classPrivateFieldGet","receiver","state","kind","f","TypeError","has","call","value","get","__classPrivateFieldSet","set","Constants","ARE_YOU_WANT_TO_DELETE","ACTIVE","IN_ACTIVE","APPROVE","UN_APPROVE","ACCEPT_SIZE_IMAGE","ACCEPT_TYPE_IMAGE","PAGE_TYPE_NEW","PAGE_TYPE_EDIT","SAVE","SAVE_AND_CONTINUE","IMAGE_SIZE","SUCCESS","IMPORT_SUCCESSFULLY","ERROR","FAILED","FILE","NONE","NOT_EXIST_ID_OR_LINK","FEATURE_IS_PENDING","NOT_SUPPORT_FILE_IMAGE","NOT_SUPPORT_FILE_IMPORT","NETWORK_ERROR","SORT_BY","name","DESC","FORM_ERRORS","Id","textSearch","ImportLogId","SortBy","Reverse","VALIDATION_MESSAGES","ValidateMessageConstants","TITLE_REQUIRED","TITLE_MAXLENGTH","TITLE_PATTERN","CREATED_AT_REQUIRED","SHOW_ON_HOME_REQUIRED","DISPLAY_NUMBER_REQUIRED","CONTENT_TYPE_REQUIRED","DISCOUNT_PERCENT_REQUIRED","DISCOUNT_PERCENT_MAX","DISCOUNT_PERCENT_MIN","PROMOTION_FORM","title","createdAt","displayNumber","showOnHome","discountPercent","isActive","ctaLabelName","ctaDeepLink","tags","required","maxlength","pattern","max","min","SdEditor","ref","sdApiService","_this","this","_name","uuid.v4","id","_subscription","Subscription","_model","modelChange","EventEmitter","placeholder","styles","height","formControl","FormControl","domain","_form","enableHTMLButton","showHtmlEditor","quillConfig","toolbar","container","header","list","script","indent","direction","size","color","background","font","align","mention","allowedChars","mentionDenotationChars","source","searchTerm","renderList","mentionChar","mentionValues","values","length","matches","i","toLowerCase","indexOf","push","keyboard","bindings","enter","key","handler","range","context","textLength","sdChange","_updateValidator","clearValidators","clearAsyncValidators","validators","Validators","minlength","minLength","maxLength","setValidators","updateValueAndValidity","editorInit","quill","quillEvent","self","getModule","addHandler","fileInput","querySelector","document","createElement","setAttribute","classList","add","addEventListener","files","getSelection","formData","FormData","append","enable","_uploadImage","appendChild","click","onModelChange","val","setValue","modelHTML","onClickShowHtmlEditor","urlUploadImage","post","then","resp","dangerouslyPasteHTML","index","_a","data","imageUrl","_b","publish_url","url","_c","_d","content","getContents","setContents","setSelection","defineProperty","prototype","emitEvent","detectChanges","disable","NgForm","form","ngOnInit","addControl","console","log","ngAfterViewInit","valueChanges","subscribe","emit","ngOnDestroy","removeControl","unsubscribe","Component","args","selector","template","ChangeDetectorRef","SdApiService","ViewChild","Input","Output","NgModule","declarations","imports","CommonModule","FormsModule","ReactiveFormsModule","QuillModule","forRoot","SdTranslateModule","SdButtonModule","SdTextareaModule","SdApiModule","exports","providers"],"mappings":"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","sourcesContent":["/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation.\r\n\r\nPermission to use, copy, modify, and/or distribute this software for any\r\npurpose with or without fee is hereby granted.\r\n\r\nTHE SOFTWARE IS PROVIDED \"AS IS\" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH\r\nREGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY\r\nAND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,\r\nINDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM\r\nLOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR\r\nOTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR\r\nPERFORMANCE OF THIS SOFTWARE.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n    extendStatics = Object.setPrototypeOf ||\r\n        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n        function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };\r\n    return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n    if (typeof b !== \"function\" && b !== null)\r\n        throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");\r\n    extendStatics(d, b);\r\n    function __() { this.constructor = d; }\r\n    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n    __assign = Object.assign || function __assign(t) {\r\n        for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n            s = arguments[i];\r\n            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n        }\r\n        return t;\r\n    }\r\n    return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n    var t = {};\r\n    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n        t[p] = s[p];\r\n    if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\r\n            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))\r\n                t[p[i]] = s[p[i]];\r\n        }\r\n    return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n    if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n    return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n    return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n    if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\r\n    return new (P || (P = Promise))(function (resolve, reject) {\r\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\r\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n    });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n    return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n    function verb(n) { return function (v) { return step([n, v]); }; }\r\n    function step(op) {\r\n        if (f) throw new TypeError(\"Generator is already executing.\");\r\n        while (_) try {\r\n            if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n            if (y = 0, t) op = [op[0] & 2, t.value];\r\n            switch (op[0]) {\r\n                case 0: case 1: t = op; break;\r\n                case 4: _.label++; return { value: op[1], done: false };\r\n                case 5: _.label++; y = op[1]; op = [0]; continue;\r\n                case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n                default:\r\n                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n                    if (t[2]) _.ops.pop();\r\n                    _.trys.pop(); continue;\r\n            }\r\n            op = body.call(thisArg, _);\r\n        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n    }\r\n}\r\n\r\nexport var __createBinding = Object.create ? (function(o, m, k, k2) {\r\n    if (k2 === undefined) k2 = k;\r\n    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });\r\n}) : (function(o, m, k, k2) {\r\n    if (k2 === undefined) k2 = k;\r\n    o[k2] = m[k];\r\n});\r\n\r\nexport function __exportStar(m, o) {\r\n    for (var p in m) if (p !== \"default\" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);\r\n}\r\n\r\nexport function __values(o) {\r\n    var s = typeof Symbol === \"function\" && Symbol.iterator, m = s && o[s], i = 0;\r\n    if (m) return m.call(o);\r\n    if (o && typeof o.length === \"number\") return {\r\n        next: function () {\r\n            if (o && i >= o.length) o = void 0;\r\n            return { value: o && o[i++], done: !o };\r\n        }\r\n    };\r\n    throw new TypeError(s ? \"Object is not iterable.\" : \"Symbol.iterator is not defined.\");\r\n}\r\n\r\nexport function __read(o, n) {\r\n    var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n    if (!m) return o;\r\n    var i = m.call(o), r, ar = [], e;\r\n    try {\r\n        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n    }\r\n    catch (error) { e = { error: error }; }\r\n    finally {\r\n        try {\r\n            if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n        }\r\n        finally { if (e) throw e.error; }\r\n    }\r\n    return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spread() {\r\n    for (var ar = [], i = 0; i < arguments.length; i++)\r\n        ar = ar.concat(__read(arguments[i]));\r\n    return ar;\r\n}\r\n\r\n/** @deprecated */\r\nexport function __spreadArrays() {\r\n    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;\r\n    for (var r = Array(s), k = 0, i = 0; i < il; i++)\r\n        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)\r\n            r[k] = a[j];\r\n    return r;\r\n}\r\n\r\nexport function __spreadArray(to, from, pack) {\r\n    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {\r\n        if (ar || !(i in from)) {\r\n            if (!ar) ar = Array.prototype.slice.call(from, 0, i);\r\n            ar[i] = from[i];\r\n        }\r\n    }\r\n    return to.concat(ar || Array.prototype.slice.call(from));\r\n}\r\n\r\nexport function __await(v) {\r\n    return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n    if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n    var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n    return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n    function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n    function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n    function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n    function fulfill(value) { resume(\"next\", value); }\r\n    function reject(value) { resume(\"throw\", value); }\r\n    function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n    var i, p;\r\n    return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n    function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n    if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n    var m = o[Symbol.asyncIterator], i;\r\n    return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n    if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n    return cooked;\r\n};\r\n\r\nvar __setModuleDefault = Object.create ? (function(o, v) {\r\n    Object.defineProperty(o, \"default\", { enumerable: true, value: v });\r\n}) : function(o, v) {\r\n    o[\"default\"] = v;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n    if (mod && mod.__esModule) return mod;\r\n    var result = {};\r\n    if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\r\n    __setModuleDefault(result, mod);\r\n    return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n    return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n\r\nexport function __classPrivateFieldGet(receiver, state, kind, f) {\r\n    if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a getter\");\r\n    if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot read private member from an object whose class did not declare it\");\r\n    return kind === \"m\" ? f : kind === \"a\" ? f.call(receiver) : f ? f.value : state.get(receiver);\r\n}\r\n\r\nexport function __classPrivateFieldSet(receiver, state, value, kind, f) {\r\n    if (kind === \"m\") throw new TypeError(\"Private method is not writable\");\r\n    if (kind === \"a\" && !f) throw new TypeError(\"Private accessor was defined without a setter\");\r\n    if (typeof state === \"function\" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError(\"Cannot write private member to an object whose class did not declare it\");\r\n    return (kind === \"a\" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;\r\n}\r\n","export const Constants = {\r\n    ARE_YOU_WANT_TO_DELETE: 'Are you sure you want to delete?',\r\n    ACTIVE: 'active',\r\n    IN_ACTIVE: 'inactive',\r\n    APPROVE: 'approve',\r\n    UN_APPROVE: 'unapprove',\r\n    ACCEPT_SIZE_IMAGE: 'Logo only accept image with size <= 2MB',\r\n    ACCEPT_TYPE_IMAGE:\r\n      'image/png, image/gif, image/jpeg, image/bmp, image/x-icon',\r\n    PAGE_TYPE_NEW: 'new',\r\n    PAGE_TYPE_EDIT: 'edit',\r\n    SAVE: 'saveOb',\r\n    SAVE_AND_CONTINUE: 'saveAndContOb',\r\n    IMAGE_SIZE: 2048000,\r\n    SUCCESS: 'Success',\r\n    IMPORT_SUCCESSFULLY: 'Import successfully!',\r\n    ERROR: 'Error',\r\n    FAILED: 'fail',\r\n    FILE: 'file',\r\n    NONE: 'none',\r\n    NOT_EXIST_ID_OR_LINK: 'This ID/Link is not existing',\r\n    FEATURE_IS_PENDING: 'This feature is pending',\r\n    NOT_SUPPORT_FILE_IMAGE: 'File upload is not supported.',\r\n    NOT_SUPPORT_FILE_IMPORT: 'File import is not supported.',\r\n    NETWORK_ERROR: 'Network Error',\r\n    SORT_BY: [\r\n      {\r\n        value: 0,\r\n        name: 'Created Date'\r\n      },\r\n      {\r\n        value: 1,\r\n        name: 'Title'\r\n      }\r\n    ],\r\n    DESC: [\r\n      {\r\n        value: true,\r\n        name: 'Descending'\r\n      },\r\n      {\r\n        value: false,\r\n        name: 'Ascending'\r\n      }\r\n    ],\r\n    FORM_ERRORS: {\r\n        Id: '',\r\n        textSearch: '',\r\n        ImportLogId: '',\r\n        SortBy: '',\r\n        Reverse: '',\r\n      },\r\n    VALIDATION_MESSAGES: {}\r\n};\r\n\r\nexport const PROMOTION_PERMISSIONS = ['ListPromotion', 'AddNewPromotion', 'EditPromotion',\r\n  'ActiveOrInactivePromotion', 'RemovePromotion', 'ImportPromotion', 'ExportPromotion'];\r\n\r\nexport const ValidateMessageConstants = {\r\n    TITLE_REQUIRED: 'Title is required',\r\n    TITLE_MAXLENGTH: 'Title is not more than 55 characters',\r\n    TITLE_PATTERN: 'Title is required',\r\n\r\n    CREATED_AT_REQUIRED: 'Created At is required',\r\n\r\n    SHOW_ON_HOME_REQUIRED: 'Show On Home is required',\r\n\r\n    DISPLAY_NUMBER_REQUIRED: 'Display Number is required',\r\n\r\n    CONTENT_TYPE_REQUIRED: 'Content Type is required',\r\n\r\n    DISCOUNT_PERCENT_REQUIRED: 'Discount percent is required',\r\n    DISCOUNT_PERCENT_MAX: 'Max discount percent is 100, cannot input greater',\r\n    DISCOUNT_PERCENT_MIN: 'Min discount percent is 0, cannot input lower'\r\n};\r\n\r\nexport const PROMOTION_FORM = {\r\n  FORM_ERRORS: {\r\n    title: '',\r\n    createdAt: '',\r\n    displayNumber: '',\r\n    showOnHome: '',\r\n    discountPercent: '',\r\n    isActive: '',\r\n    ctaLabelName: '',\r\n    ctaDeepLink: '',\r\n    tags: ''\r\n  },\r\n  VALIDATION_MESSAGES: {\r\n    title: {\r\n      required: ValidateMessageConstants.TITLE_REQUIRED,\r\n      maxlength: ValidateMessageConstants.TITLE_MAXLENGTH,\r\n      pattern: ValidateMessageConstants.TITLE_PATTERN\r\n    },\r\n    createdAt: {\r\n      required: ValidateMessageConstants.CREATED_AT_REQUIRED\r\n    },\r\n    showOnHome: {\r\n      required: ValidateMessageConstants.SHOW_ON_HOME_REQUIRED\r\n    },\r\n    displayNumber: {\r\n      required: ValidateMessageConstants.DISPLAY_NUMBER_REQUIRED\r\n    },\r\n    discountPercent: {\r\n      required: ValidateMessageConstants.DISCOUNT_PERCENT_REQUIRED,\r\n      max: ValidateMessageConstants.DISCOUNT_PERCENT_MAX,\r\n      min: ValidateMessageConstants.DISCOUNT_PERCENT_MIN\r\n    },\r\n    tags: {\r\n      required: ValidateMessageConstants.CONTENT_TYPE_REQUIRED\r\n    }\r\n  }\r\n};\r\n","import {\r\n  Component,\r\n  ViewChild,\r\n  Input,\r\n  OnInit,\r\n  Output,\r\n  EventEmitter,\r\n  ChangeDetectorRef,\r\n  AfterViewInit, OnDestroy\r\n} from '@angular/core';\r\nimport {QuillEditorComponent} from 'ngx-quill';\r\nimport * as uuid from 'uuid';\r\nimport {FormControl, FormGroup, NgForm, ValidatorFn, Validators} from '@angular/forms';\r\nimport {Constants} from './constant';\r\nimport {Subscription} from 'rxjs';\r\nimport {SdApiService} from '@sd-angular/core/api';\r\nimport 'quill-mention';\r\n\r\n@Component({\r\n  selector: 'sd-editor',\r\n  templateUrl: './editor.component.html',\r\n  styleUrls: ['./editor.component.scss'],\r\n})\r\nexport class SdEditor implements OnInit, AfterViewInit, OnDestroy {\r\n  #name = `N${uuid.v4()}`;\r\n  id: string = `I${uuid.v4()}`;\r\n  #subscription = new Subscription();\r\n  @ViewChild('editor') editor: QuillEditorComponent;\r\n  @Input() label: string;\r\n  #model: string;\r\n  @Input() set model(val: string) {\r\n    this.#model = val;\r\n    this.modelHTML = val;\r\n    this.formControl.setValue(this.#model, {\r\n      emitEvent: false\r\n    });\r\n    this.ref.detectChanges();\r\n  }\r\n\r\n  @Input() set disabled(val: boolean | '') {\r\n    val = (val === '') || val;\r\n    if (val) {\r\n      this.formControl.disable();\r\n    } else {\r\n      this.formControl.enable();\r\n    }\r\n  }\r\n\r\n  required = false;\r\n\r\n  @Input() set pRequired(val: boolean | '') {\r\n    this.required = (val === '') || val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  minlength: number;\r\n\r\n  @Input('minlength') set _minlength(val: number) {\r\n    this.minlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  maxlength: number;\r\n\r\n  @Input('maxlength') set _maxlength(val: number) {\r\n    this.maxlength = +val;\r\n    this.#updateValidator();\r\n  }\r\n\r\n  @Output() modelChange = new EventEmitter<string>();\r\n\r\n  @Input() placeholder: string = '';\r\n\r\n  @Input() styles: any = {height: '250px'};\r\n\r\n  formControl = new FormControl();\r\n\r\n  @Input() domain = '';\r\n  @Input() urlUploadImage: string;\r\n  #form: FormGroup;\r\n  @Input() set form(val: NgForm | FormGroup) {\r\n    if (val) {\r\n      if (val instanceof NgForm) {\r\n        this.#form = val.form;\r\n      } else {\r\n        this.#form = val;\r\n      }\r\n    }\r\n  }\r\n\r\n  @Input() toolbar: any;\r\n  @Input() enableHTMLButton = false;\r\n  showHtmlEditor = false;\r\n  modelHTML: string;\r\n\r\n  quillEvent: any;\r\n  @Input() mentionValues: { id: string, value: string, link?: string }[];\r\n\r\n  quillConfig = {\r\n    // toolbar: '.toolbar',\r\n    toolbar: {\r\n      container: [\r\n        ['bold', 'italic', 'underline', 'strike'],        // toggled buttons\r\n        ['blockquote', 'code-block'],\r\n\r\n        [{'header': 1}, {'header': 2}],               // custom button values\r\n        [{'list': 'ordered'}, {'list': 'bullet'}],\r\n        [{'script': 'sub'}, {'script': 'super'}],      // superscript/subscript\r\n        [{'indent': '-1'}, {'indent': '+1'}],          // outdent/indent\r\n        [{'direction': 'rtl'}],                         // text direction\r\n\r\n        [{'size': ['small', false, 'large', 'huge']}],  // custom dropdown\r\n        [{'header': [1, 2, 3, 4, 5, 6, false]}],\r\n\r\n        [{'color': []}, {'background': []}],          // dropdown with defaults from theme\r\n        [{'font': []}],\r\n        [{'align': []}],\r\n\r\n        ['clean'],                                         // remove formatting button\r\n\r\n        ['link', 'image', 'video']                         // link and image, video\r\n      ]\r\n    },\r\n    mention: {\r\n      allowedChars: /^[A-Za-z0-9\\sÅÄÖåäö._-]*$/,\r\n      mentionDenotationChars: ['@'],\r\n      source: (searchTerm, renderList, mentionChar) => {\r\n        if (this.mentionValues) {\r\n          let values;\r\n          if (mentionChar === '@') {\r\n            values = this.mentionValues;\r\n          } else {\r\n            values = [];\r\n          }\r\n\r\n          if (searchTerm.length === 0) {\r\n            renderList(values, searchTerm);\r\n          } else {\r\n            const matches = [];\r\n            // tslint:disable-next-line:prefer-for-of\r\n            for (let i = 0; i < values.length; i++) {\r\n              // tslint:disable-next-line:no-bitwise\r\n              if (~values[i].value.toLowerCase().indexOf(searchTerm.toLowerCase())) {\r\n                matches.push(values[i]);\r\n              }\r\n            }\r\n            renderList(matches, searchTerm);\r\n          }\r\n        }\r\n      },\r\n    },\r\n    keyboard: {\r\n      bindings: {\r\n        enter: {\r\n          key: 13,\r\n          handler: (range, context) => {\r\n            return true;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  };\r\n\r\n  textLength: number = 0;\r\n  @Output() sdChange = new EventEmitter<string>();\r\n\r\n  constructor(\r\n    private ref: ChangeDetectorRef,\r\n    private sdApiService: SdApiService\r\n  ) {\r\n  }\r\n\r\n  ngOnInit() {\r\n    this.#form?.addControl(this.#name, this.formControl);\r\n    if (this.toolbar) {\r\n      this.quillConfig.toolbar.container = this.toolbar;\r\n      console.log('toolbar', this.quillConfig);\r\n    }\r\n  }\r\n\r\n  ngAfterViewInit() {\r\n    this.#subscription.add(this.formControl.valueChanges.subscribe((val) => {\r\n      this.modelChange.emit(val);\r\n      this.sdChange.emit(val);\r\n    }));\r\n  }\r\n\r\n  ngOnDestroy() {\r\n    this.#form?.removeControl(this.#name);\r\n    this.#subscription.unsubscribe();\r\n  }\r\n\r\n  #updateValidator = () => {\r\n    this.formControl.clearValidators();\r\n    this.formControl.clearAsyncValidators();\r\n    const validators: ValidatorFn[] = [];\r\n    if (this.required) {\r\n      validators.push(Validators.required);\r\n    }\r\n    if (this.minlength > 0) {\r\n      validators.push(Validators.minLength(this.minlength));\r\n    }\r\n    if (this.maxlength > 0) {\r\n      validators.push(Validators.maxLength(this.maxlength));\r\n    }\r\n    this.formControl.setValidators(validators);\r\n    this.formControl.updateValueAndValidity();\r\n  }\r\n\r\n  editorInit = (quill) => {\r\n    this.quillEvent = quill;\r\n    // const txtArea = document.createElement('textarea');\r\n    // txtArea.style.cssText =\r\n    //   'width: 100%;margin: 0px;background: rgb(29, 29, 29);' +\r\n    //   'box-sizing: border-box;color: rgb(204, 204, 204);' +\r\n    //   'font-size: 15px;outline: none;padding: 20px;' +\r\n    //   'line-height: 24px;font-family: Consolas, Menlo, Monaco, &quot;Courier New&quot;, monospace;' +\r\n    //   'position: absolute;top: 0;bottom: 0;border: none;display:none';\r\n\r\n    // const htmlEditor = quill.addContainer('ql-custom');\r\n    // htmlEditor.appendChild(txtArea);\r\n\r\n    // const myEditor = quill.container;\r\n    // quill.on('text-change', (delta, oldDelta, source) => {\r\n    //   const html = myEditor.children[0].innerHTML;\r\n    //   txtArea.value = html;\r\n    //   // if (quill.getLength() > this.maxlength) {\r\n    //   //   quill.deleteText(this.maxlength, quill.getLength());\r\n    //   // }\r\n    //   // this.formControl.setValue(html);\r\n    // });\r\n\r\n    const self = this;\r\n    quill.getModule('toolbar').addHandler('image', function () {\r\n      let fileInput = this.container.querySelector('input.ql-image[type=file]');\r\n\r\n      if (fileInput == null) {\r\n        fileInput = document.createElement('input');\r\n        fileInput.setAttribute('type', Constants.FILE);\r\n        fileInput.setAttribute('accept', 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon');\r\n        fileInput.classList.add('ql-image');\r\n        fileInput.addEventListener('change', () => {\r\n          const files = fileInput.files;\r\n          const range = this.quill.getSelection(true);\r\n          if (!files || !files.length) {\r\n            return;\r\n          }\r\n\r\n          const formData = new FormData();\r\n          formData.append(Constants.FILE, files[0]);\r\n\r\n          this.quill.enable(false);\r\n          /*this.apiService.post(this.domain + this.urlUploadImage, formData).subscribe((resp: any) => {\r\n            this.quill.enable(true);\r\n            this.quill.editor.insertEmbed(range.index, 'image', resp.data.imageUrl || resp.data.publish_url ||  resp.url);\r\n            const content = this.quill.getContents();\r\n            this.quill.setContents(content);\r\n            this.quill.setSelection(range.index + 1, 'silent');\r\n            fileInput.value = '';\r\n          });*/\r\n          self.#uploadImage(formData, quill, range, fileInput);\r\n        });\r\n        this.container.appendChild(fileInput);\r\n      }\r\n      fileInput.click();\r\n    });\r\n  }\r\n\r\n  onModelChange = (val: string) => {\r\n    this.formControl.setValue(val);\r\n    this.modelHTML = val;\r\n  }\r\n\r\n  onClickShowHtmlEditor = () => {\r\n    this.showHtmlEditor = !this.showHtmlEditor;\r\n  }\r\n\r\n  #uploadImage = (formData, quill, range, fileInput) => {\r\n    if (!this.urlUploadImage) {\r\n      this.urlUploadImage = '/partner/v2/merchandise/file/uploaduserfile';\r\n    }\r\n    // this.domain = 'https://api-commerce-qc.vinid.dev';\r\n    this.sdApiService.post(this.urlUploadImage, formData).then((resp: any) => {\r\n      quill.enable(true);\r\n      // quill.editor.insertEmbed(range.index, 'image', resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '');\r\n      quill.getModule('clipboard').dangerouslyPasteHTML(range.index, '<a target=\"_blank\" href=\"' + (resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '')\r\n        + '\"><img src=\"' + (resp?.data?.imageUrl || resp?.data?.publish_url || resp?.url || '') + '\" alt=\"c-image-editor-quill\"></a>', 'user');\r\n      // quill.insertText();\r\n      const content = quill.getContents();\r\n      quill.setContents(content);\r\n      quill.setSelection(range.index + 1, 'user');\r\n      fileInput.value = '';\r\n    });\r\n  }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { QuillModule } from 'ngx-quill';\r\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { SdEditor } from './editor.component';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdTranslateModule } from '@sd-angular/core/translate';\r\nimport {SdButtonModule} from '@sd-angular/core/button';\r\nimport {SdTextareaModule} from '@sd-angular/core/textarea';\r\nimport {SdApiModule, SdApiService} from '@sd-angular/core/api';\r\n\r\n@NgModule({\r\n  declarations: [SdEditor],\r\n  imports: [\r\n    CommonModule,\r\n    FormsModule,\r\n    ReactiveFormsModule,\r\n    QuillModule.forRoot(),\r\n    SdTranslateModule,\r\n    SdButtonModule,\r\n    SdTextareaModule,\r\n    SdApiModule\r\n  ],\r\n  exports: [SdEditor],\r\n  providers: [],\r\n})\r\nexport class SdEditorModule { }\r\n"]}

package/bundles/sd-angular-core-grid-material.umd.js

@@ -2795,8 +2795,8 @@
                     }
                     return false;
                 }).map(function (item) {
-                    var editorStatus = item.editorStatus, editorHandlerRow = item.editorHandlerRow, editorHandlerColumn = item.editorHandlerColumn, expandDetail = item.expandDetail, isExpanded = item.isExpanded, isExpanding = item.isExpanding, isSelected = item.isSelected, originItem = item.originItem, result = __rest(item, ["editorStatus", "editorHandlerRow", "editorHandlerColumn", "expandDetail", "isExpanded", "isExpanding", "isSelected", "originItem"]);
-                    return Object.assign(Object.assign({}, result), { editorErrorMessage: item.editorErrorMessage });
+                    var editorStatus = item.editorStatus, editorHandlerRow = item.editorHandlerRow, editorHandlerColumn = item.editorHandlerColumn, editorErrorMessage = item.editorErrorMessage, expandDetail = item.expandDetail, isExpanded = item.isExpanded, isExpanding = item.isExpanding, isSelected = item.isSelected, originItem = item.originItem, sdId = item.sdId, selectable = item.selectable, actions = item.actions, groupedActions = item.groupedActions, sdGroup = item.sdGroup, result = __rest(item, ["editorStatus", "editorHandlerRow", "editorHandlerColumn", "editorErrorMessage", "expandDetail", "isExpanded", "isExpanding", "isSelected", "originItem", "sdId", "selectable", "actions", "groupedActions", "sdGroup"]);
+                    return Object.assign(Object.assign({}, result), { editorErrorMessage: editorErrorMessage });
                 });
             },
             enumerable: false,
@@ -2805,7 +2805,7 @@
         Object.defineProperty(SdGridMaterial.prototype, "gridItems", {
             get: function () {
                 return this.items.map(function (item) {
-                    var editorStatus = item.editorStatus, editorHandlerRow = item.editorHandlerRow, editorHandlerColumn = item.editorHandlerColumn, expandDetail = item.expandDetail, isExpanded = item.isExpanded, isExpanding = item.isExpanding, isSelected = item.isSelected, originItem = item.originItem, result = __rest(item, ["editorStatus", "editorHandlerRow", "editorHandlerColumn", "expandDetail", "isExpanded", "isExpanding", "isSelected", "originItem"]);
+                    var editorStatus = item.editorStatus, editorHandlerRow = item.editorHandlerRow, editorHandlerColumn = item.editorHandlerColumn, editorErrorMessage = item.editorErrorMessage, expandDetail = item.expandDetail, isExpanded = item.isExpanded, isExpanding = item.isExpanding, isSelected = item.isSelected, originItem = item.originItem, sdId = item.sdId, selectable = item.selectable, actions = item.actions, groupedActions = item.groupedActions, sdGroup = item.sdGroup, result = __rest(item, ["editorStatus", "editorHandlerRow", "editorHandlerColumn", "editorErrorMessage", "expandDetail", "isExpanded", "isExpanding", "isSelected", "originItem", "sdId", "selectable", "actions", "groupedActions", "sdGroup"]);
                     return result;
                 });
             },
@@ -2825,7 +2825,7 @@
     SdGridMaterial.decorators = [
         { type: core.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\" sdScroll [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 | sdGroup:gridOption\" matSort\r\n            [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n            (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n\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                <ng-container *ngIf=\"items | selectionVisibleSelectAll: gridOption?.selection | async\">\r\n                  <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n                    [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\">\r\n                  </mat-checkbox>\r\n                </ng-container>\r\n\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                <ng-container *ngIf=\"item | selectionVisible:gridOption?.selection\">\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                </ng-container>\r\n\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdEditorValidation\">\r\n              <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 2px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n              </th>\r\n              <td class=\"p-0 position-relative\" mat-cell *matCellDef=\"let item; index as idx\">\r\n                <sd-desktop-editor-validation [sdId]=\"item.sdId\" [item]=\"item\" [items]=\"items\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-editor-validation>\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 class=\"c-btn-add\"\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\">add</mat-icon>\r\n                </button>\r\n              </th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item; index as idx\">\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)=\"onRemove(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 matColumnDef=\"sdGroup\">\r\n              <th mat-header-cell *matHeaderCellDef class=\"px-8 py-8\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n              </th>\r\n              <td class=\"p-0\" mat-cell *matCellDef=\"let item\"\r\n                [attr.colspan]=\"!item?.sdGroup ? 1 : configuration.displayedColumns.length\">\r\n                <div [innerHtml]=\"item?.sdGroup?.htmlTemplate | safeHtml\">\r\n                </div>\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': configuration.firstColumns[i].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                    \" [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\"\r\n                    [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n                  </div>\r\n                  <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n                    [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n                  </sd-column-inline-filter>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-cell *ngIf=\"!item?.sdGroup\" [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\"\r\n                  [column]=\"column\" [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                  </div>\r\n                  <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n                    [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n                  </sd-column-inline-filter>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n                  [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [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\"\r\n              [class.selected]=\"row.isSelected\" [style]=\"row | sdStyleRowCss:gridOption\"></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=\"sdEditorValidation\">\r\n                <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 4px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                </th>\r\n                <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\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=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                  <button class=\"c-btn-add\"\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\">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 matColumnDef=\"sdGroup\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"px-8 py-8\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                </th>\r\n                <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\r\n                </td>\r\n                <td mat-footer-cell *matFooterCellDef></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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\"\r\n                [matColumnDef]=\"column.field\" [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\"\r\n                  [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                      [class.text-center]=\"column.align === 'center'\"\r\n                      [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n                    </div>\r\n                    <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n                      [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n                      (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                      [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                    </div>\r\n                    <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n                      [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n                      (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\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<sd-grid-quick-action [gridOption]=\"gridOption\" [selectedItems]=\"selectedItems\" (clear)=\"onClearSelection()\">\r\n</sd-grid-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\" sdScroll [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 | sdGroup:gridOption\" matSort\r\n            [matSortDisabled]=\"!gridOption.sortable\" cdkDropList cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListDisabled]=\"!gridOption.dropDragColumnEnable\"\r\n            (cdkDropListDropped)=\"drop($event, configuration.displayedColumns)\" multiTemplateDataRows>\r\n\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                <ng-container *ngIf=\"items | selectionVisibleSelectAll: gridOption?.selection | async\">\r\n                  <mat-checkbox *ngIf=\"!gridOption.selection?.single\" class=\"c-selection\" color=\"primary\"\r\n                    [(ngModel)]=\"isSelectAll\" (change)=\"onSelectAll()\">\r\n                  </mat-checkbox>\r\n                </ng-container>\r\n\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                <ng-container *ngIf=\"item | selectionVisible:gridOption?.selection\">\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                </ng-container>\r\n\r\n              </td>\r\n              <td mat-footer-cell *matFooterCellDef></td>\r\n            </ng-container>\r\n            <ng-container matColumnDef=\"sdEditorValidation\">\r\n              <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 2px\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n              </th>\r\n              <td class=\"p-0 position-relative\" mat-cell *matCellDef=\"let item; index as idx\">\r\n                <sd-desktop-editor-validation [sdId]=\"item.sdId\" [item]=\"item\" [items]=\"items\"\r\n                  [gridOption]=\"gridOption\">\r\n                </sd-desktop-editor-validation>\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 class=\"c-btn-add\"\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\">add</mat-icon>\r\n                </button>\r\n              </th>\r\n              <td class=\"px-8\" mat-cell *matCellDef=\"let item; index as idx\">\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)=\"onRemove(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 matColumnDef=\"sdGroup\">\r\n              <th mat-header-cell *matHeaderCellDef class=\"px-8 py-8\"\r\n                [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n              </th>\r\n              <td class=\"p-0\" mat-cell *matCellDef=\"let item\"\r\n                [attr.colspan]=\"!item?.sdGroup ? 1 : configuration.displayedColumns.length\">\r\n                <div [innerHtml]=\"item?.sdGroup?.htmlTemplate | safeHtml\">\r\n                </div>\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': configuration.firstColumns[i].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                    \" [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\"\r\n                    [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n                  </div>\r\n                  <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n                    [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n                  </sd-column-inline-filter>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-cell *ngIf=\"!item?.sdGroup\" [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\"\r\n                  [column]=\"column\" [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                  </div>\r\n                  <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\" [value]=\"columnFilter[column.field]\"\r\n                    [columnFilter]=\"columnFilter\" [column]=\"column\" (filterChange)=\"onFilterChange()\">\r\n                  </sd-column-inline-filter>\r\n                </div>\r\n              </th>\r\n              <td class=\"c-td px-8\" mat-cell *matCellDef=\"let item\">\r\n                <sd-desktop-cell [sdId]=\"item.sdId\" [key]=\"key\" [value]=\"item[column.field]\" [column]=\"column\"\r\n                  [item]=\"item\" [idx]=\"i\" [cellDef]=\"cellDef\" [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            <ng-container *ngIf=\"!gridOption.group\">\r\n              <tr mat-row *matRowDef=\"let row; columns: configuration.displayedColumns\" matRipple class=\"c-row\"\r\n                  [class.selected]=\"row.isSelected\" [style]=\"row | sdStyleRowCss:gridOption\"></tr>\r\n            </ng-container>\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=\"sdEditorValidation\">\r\n                <th class=\"p-0\" mat-header-cell *matHeaderCellDef style=\"width: 4px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                </th>\r\n                <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\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=\"min-width: 50px; max-width: 50px\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                  <button class=\"c-btn-add\"\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\">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 matColumnDef=\"sdGroup\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"px-8 py-8\"\r\n                  [attr.rowspan]=\"configuration.multipleHeader ? 2 : 1\">\r\n                </th>\r\n                <td class=\"p-0\" mat-cell *matCellDef=\"let item\">\r\n                </td>\r\n                <td mat-footer-cell *matFooterCellDef></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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                    [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                  </div>\r\n                </th>\r\n              </ng-container>\r\n              <ng-container *ngFor=\"let column of configuration.firstColumns; let i = index\"\r\n                [matColumnDef]=\"column.field\" [sticky]=\"configuration.fixedColumn[column.field]\">\r\n                <th mat-header-cell *matHeaderCellDef class=\"c-th px-8 py-8\"\r\n                  [ngStyle]=\"{ 'min-width': configuration.firstColumns[i].width }\" [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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                      [class.text-center]=\"column.align === 'center'\"\r\n                      [innerHTML]=\"configuration.firstColumns[i].titleHtml || configuration.firstColumns[i].title\">\r\n                    </div>\r\n                    <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n                      [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n                      (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\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 [class.text-right]=\"column.align === 'right' || (!column.align && column.type === 'number')\"\r\n                      [class.text-center]=\"column.align === 'center'\" [innerHTML]=\"column.titleHtml || column.title\">\r\n                    </div>\r\n                    <sd-column-inline-filter *ngIf=\"gridOption.filter?.inlineColumn\"\r\n                      [value]=\"columnFilter[column.field]\" [columnFilter]=\"columnFilter\" [column]=\"column\"\r\n                      (filterChange)=\"onFilterChange()\"></sd-column-inline-filter>\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<sd-grid-quick-action [gridOption]=\"gridOption\" [selectedItems]=\"selectedItems\" (clear)=\"onClearSelection()\">\r\n</sd-grid-quick-action>\r\n",
                     animations: [
                         animations.trigger('detailExpand', [
                             animations.state('collapsed', animations.style({ height: '0', minHeight: '0', visibility: 'hidden' })),
@@ -3311,7 +3311,7 @@
         { type: core.Component, args: [{
                     selector: 'sd-desktop-command',
                     template: "<ng-container *ngIf=\"item | commandFilter:commands | async; $implicit as filteredCommands\">\r\n  <ng-container *ngFor=\"let command of filteredCommands\">\r\n    <ng-container *ngIf=\"command?.click; else elseChildren\">\r\n      <button (click)=\"command.click(item)\" [matTooltip]=\"command.title | commandTitle:item\" aria-hidden=\"true\"\r\n        [disabled]=\"item | commandDisable:command\" mat-icon-button>\r\n        <mat-icon class=\"c-icon\" [fontSet]=\"command.fontSet\">{{command | commandIcon:item}}</mat-icon>\r\n      </button>\r\n    </ng-container>\r\n    <ng-template #elseChildren>\r\n      <button [matMenuTriggerFor]=\"menu\" aria-hidden=\"true\" mat-icon-button>\r\n        <mat-icon *ngIf=\"command?.icon\" class=\"c-icon\" [fontSet]=\"command.fontSet\">{{command | commandIcon:item}}\r\n        </mat-icon>\r\n        <mat-icon *ngIf=\"!command?.icon\" class=\"c-icon\">more_vert</mat-icon>\r\n      </button>\r\n      <mat-menu #menu=\"matMenu\">\r\n        <span>\r\n          <button *ngFor=\"let childCommand of command.children\" mat-menu-item (click)=\"childCommand.click(item)\"\r\n            [disabled]=\"item | commandDisable:childCommand\">\r\n            <ng-container *ngIf=\"!childCommand.htmlTemplate\">\r\n              <mat-icon [fontSet]=\"command.fontSet\" class=\"c-icon\">{{childCommand | commandIcon:item}}\r\n              </mat-icon>\r\n              <span> {{childCommand | commandTitle:item}}</span>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"childCommand.htmlTemplate\">\r\n              <div [innerHTML]=\"childCommand.htmlTemplate(item)\"></div>\r\n            </ng-container>\r\n          </button>\r\n        </span>\r\n      </mat-menu>\r\n    </ng-template>\r\n  </ng-container>\r\n</ng-container>\r\n",
-                    styles: [":host{align-items:center;display:flex;justify-content:center}mat-icon.c-icon{color:rgba(0,0,0,.54)!important}"]
+                    styles: [":host{align-items:center;display:flex}mat-icon.c-icon{color:rgba(0,0,0,.54)!important}"]
                 },] }
     ];
     SdDesktopCommand.ctorParameters = function () { return []; };