${kendo.ui.icon($(''), icon)}${groupName}
`,\n\n _detailsTemplate: ({ description }) => `${description || ' '}`,\n\n _setEditable: function(value) {\n const that = this;\n that.options.editable = value;\n },\n\n _processOptions: function(options) {\n const that = this;\n\n kendo.type(options.editMode) === \"boolean\" && !options.editMode ? that._setEditable(false) : that._setEditable(\"incell\");\n if (isNullorUndefined(options.toolbar)) {\n options.toolbar = that.options.defaultTools;\n }\n that._extendColumnOptions(options);\n },\n\n _extendColumnOptions: function(options) {\n const that = this;\n if (!options.columns) {\n return;\n }\n that.options.columns[0] = extend(true, options.columns.fieldColumn, that.options.columns[0]);\n that.options.columns[1] = extend(true, options.columns.valueColumn, that.options.columns[1]);\n delete options.columns;\n },\n\n _processSettings: function(obj, settings) {\n const that = this;\n settings.forEach((item) => {\n if (obj[item.field]) {\n extend(obj[item.field], item);\n\n if (obj[item.field].items) {\n that._processSettings(obj[item.field].value, obj[item.field].items);\n }\n }\n });\n },\n\n _processModel: function() {\n const that = this,\n model = that.options.model,\n options = that.options;\n\n let flatData = that._flatten(model);\n that._setDefaults(flatData);\n that._processSettings(flatData, options.items );\n\n return asArray(flatData);\n },\n\n _createDataSource: function() {\n const that = this,\n dataSource = new PropertyGridDataSource({\n data: that._processedModel,\n serverGrouping: false,\n schema: {\n model: {\n id: \"id\",\n parentId: \"parentId\",\n expanded: true,\n fields: {\n field: { editable: false },\n value: { editable: true }\n }\n },\n }\n });\n\n that.options.dataSource = dataSource;\n },\n\n _flatten: function(model) {\n let id = 1;\n\n function appendNested(result, key, nestedKeys, nestedObject, collectionIdx) {\n if (!isNullorUndefined(collectionIdx)) {\n nestedKeys.forEach (nestedKey => {\n result[`${key}.${collectionIdx}.${nestedKey}`] = nestedObject[nestedKey];\n result[`${key}.${collectionIdx}.${nestedKey}`].parentId = result[`${key}.${collectionIdx}`].id;\n });\n } else {\n nestedKeys.forEach (nestedKey => {\n result[`${key}.${nestedKey}`] = nestedObject[nestedKey];\n });\n }\n }\n\n function flattenCollection(result, obj, key, parentId) {\n const collection = obj[key];\n\n result[key] = {\n id: id++,\n parentId: parentId,\n propType: \"Array\",\n field: key,\n value: collection,\n };\n\n for (let i = 0; i < collection.length; i++) {\n const nested = typeof collection[i] === \"object\" ?\n flattenObject(collection[i], result[key].id) :\n collection[i];\n\n result[`${key}.${i}`] = {\n id: id++,\n parentId: result[key].id,\n propType: typeof obj[key],\n field: `${key}[${i}]`,\n value: nested\n };\n\n if (typeof collection[i] === \"object\") {\n const nestedKeys = Object.keys(nested);\n appendNested(result, key, nestedKeys, nested, i);\n }\n }\n }\n\n function flattenObject(obj, parentId) {\n const result = {},\n keys = Object.keys(obj || { } );\n\n keys.forEach ((key) => {\n if (isNullorUndefined(obj[key])) {\n result[key] = {\n id: id++,\n parentId: parentId,\n propType: typeof obj[key],\n field: key,\n value: obj[key]\n };\n } else if (isCollection(obj[key])) {\n flattenCollection(result, obj, key, parentId);\n } else if (isComplexObject(obj[key])) {\n let tempId = id++;\n const nestedObject = flattenObject(obj[key], tempId);\n const nestedKeys = Object.keys(nestedObject);\n\n result[key] = {\n id: tempId,\n parentId: parentId,\n propType: typeof obj[key],\n field: key,\n value: nestedObject,\n };\n\n appendNested(result, key, nestedKeys, nestedObject);\n } else {\n let parsed = kendo.parseDate(obj[key].toString());\n result[key] = {\n id: id++,\n parentId: parentId,\n propType: parsed != null ? typeof parsed : typeof obj[key],\n field: key,\n value: parsed != null ? parsed : obj[key]\n };\n }\n });\n\n return result;\n }\n\n return flattenObject(model, null);\n },\n\n _setDefaults: function(obj) {\n const that = this;\n\n Object.keys(obj).forEach(key => {\n if (that.options.groupable && !obj[key].group) {\n obj[key].group = that.options.messages.defaultGroupName;\n }\n that._setDefaultEditor(obj[key]);\n });\n },\n\n _setDefaultEditor: function(obj) {\n const that = this,\n type = kendo.type(obj.value);\n switch (type) {\n case \"date\":\n obj.editor = that.defaultEditors.date;\n break;\n case \"boolean\":\n obj.editor = that.defaultEditors.boolean;\n break;\n case \"number\":\n obj.editor = that.defaultEditors.number;\n break;\n default:\n obj.editor = that.defaultEditors.string;\n break;\n }\n },\n\n _createIncellEditor: function(cell, options) {\n const that = this;\n let column = extend({}, options.columns[0]);\n options.model.fields.value.validation = options.model.validation ? options.model.validation.toJSON() : {};\n delete column.parentColumn;\n\n return new DynamicInCellEditor(cell, extend({}, {\n fieldRenderer: that._cellContent.bind(that),\n appendTo: that.wrapper,\n clearContainer: false,\n target: that,\n columns: [column],\n model: options.model,\n change: options.change\n }));\n },\n\n _createDirtyTemplate: function(model) {\n const that = this;\n let templateSettings = that._customTemplateSettings();\n let dirtyIndicator = function(data) {\n return '';\n };\n let templateFunction = function(data) {\n return (dirtyIndicator() + kendo.template(model.template)(model));\n };\n\n return kendo.template(templateFunction, templateSettings).bind({ columnTemplate: model.template });\n },\n\n _cellContent: function(column, model) {\n const that = this,\n incellEditing = that._isIncellEditable(),\n isValueColumn = column.field == \"value\";\n let value, dirtyIndicator, template;\n\n if (isValueColumn && model.template) {\n template = model.dirty ? that._createDirtyTemplate(model) : kendo.template(model.template);\n value = template(model);\n } else if (column.field) {\n value = model.get(column.field);\n dirtyIndicator = incellEditing ? column.dirtyIndicatorTemplate(model) : \"\";\n if (!isNullorUndefined(value)) {\n if (model.format) {\n value = kendo.format(model.format, value);\n }\n\n value = dirtyIndicator + value;\n } else {\n value = dirtyIndicator;\n }\n } else if (isNullorUndefined(value)) {\n value = \"\";\n }\n\n if (model.template) {\n return kendoHtmlElement(value);\n } else {\n if (incellEditing) {\n return isEditable(model.value) && isValueColumn ? that._editableCellContent(value) : kendoHtmlElement(value);\n } else {\n return kendoTextElement(value);\n }\n }\n },\n\n _editableCellContent: function(value) {\n let bTag = kendoDomElement(\"b\");\n let content = kendoHtmlElement(value);\n bTag.children.push(content);\n return bTag;\n },\n\n _generateGroupRow: function(item) {\n const that = this;\n let groupRowContent = (kendo.template(that._groupContentTemplate)({\n groupName: item.value,\n action: item.visible ? COLLAPSE : EXPAND,\n icon: item.visible ? COLLAPSE_ICON : EXPAND_ICON\n }));\n let tdElement = kendoDomElement(TD, { className: \"k-table-td\", class: \"k-table-td\", colSpan: \"3\" , role: \"gridcell\", \"aria-expanded\": item.visible, visible: true }, [kendo.dom.html(groupRowContent)] );\n let trElement = kendoDomElement(TR, { className: \"k-table-group-row k-grouping-row k-table-row\", role: \"row\" , \"data-uid\": item.uid }, [tdElement] );\n return trElement;\n },\n\n _generateDetailsBox: function() {\n const that = this;\n let tdElement = kendoDomElement(TD, { className: \"k-table-td\", class: \"k-table-td\", colSpan: that.grouped ? 3 : 2 , role: \"gridcell\", visible: true }, [kendo.dom.html(\" \")] );\n let trElement = kendoDomElement(TR, {\n className: `k-details-box k-bottom k-sticky k-footer-template k-table-row ${!that.visibleDetails ? 'k-hidden' : ''}`,\n role: \"row\"\n }, [tdElement] );\n return trElement;\n },\n\n _renderRows: function(options, data, columns, selected, childrenMap, viewChildrenMap, hasFooterTemplate) {\n const that = this;\n let selectedRow = selected.length ? selected : that._selectedRowUid;\n let rows = [];\n if (that.grouped) {\n if (that.table.find(\">colgroup>col.k-group-col\").length === 0) {\n that.table.find(\">colgroup\").prepend('