From b9b1fd8e6aa1e70e86d6ffd8ad0ea10894bbdfc8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Fri, 1 Sep 2023 13:06:53 +0300
Subject: [PATCH] Refactor #4306

---
 components/lib/basecomponent/BaseComponent.vue |  2 +-
 components/lib/datatable/DataTable.d.ts        | 16 ++++++++++++++++
 components/lib/datatable/TableBody.vue         |  8 ++++----
 3 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/components/lib/basecomponent/BaseComponent.vue b/components/lib/basecomponent/BaseComponent.vue
index d9ad7e7d7..ff1c206da 100644
--- a/components/lib/basecomponent/BaseComponent.vue
+++ b/components/lib/basecomponent/BaseComponent.vue
@@ -470,7 +470,7 @@ export default {
                 self,
                 globalPT,
                 key !== 'transition' && {
-                    ...(key === 'root' && this.$.type.name === this.$options.hostName && { [`${datasetPrefix}name`]: ObjectUtils.toFlatCase(this.$.type.name) }),
+                    ...(key === 'root' && { [`${datasetPrefix}name`]: ObjectUtils.toFlatCase(this.$.type.name) }),
                     [`${datasetPrefix}section`]: ObjectUtils.toFlatCase(key)
                 }
             );
diff --git a/components/lib/datatable/DataTable.d.ts b/components/lib/datatable/DataTable.d.ts
index a74c73358..682e06a6c 100755
--- a/components/lib/datatable/DataTable.d.ts
+++ b/components/lib/datatable/DataTable.d.ts
@@ -603,6 +603,10 @@ export interface DataTablePassThroughOptions {
      * Used to pass attributes to the rowgroup header's DOM element.
      */
     rowGroupHeader?: DataTablePassThroughOptionType;
+    /**
+     * Used to pass attributes to the rowgroup header cell's DOM element.
+     */
+    rowGroupHeaderCell?: DataTablePassThroughOptionType;
     /**
      * Used to pass attributes to the body row's DOM element.
      */
@@ -611,14 +615,26 @@ export interface DataTablePassThroughOptions {
      * Used to pass attributes to the row expansion's DOM element.
      */
     rowExpansion?: DataTablePassThroughOptionType;
+    /**
+     * Used to pass attributes to the row expansion cell's DOM element.
+     */
+    rowExpansionCell?: DataTablePassThroughOptionType;
     /**
      * Used to pass attributes to the rowgroup footer's DOM element.
      */
     rowGroupFooter?: DataTablePassThroughOptionType;
+    /**
+     * Used to pass attributes to the rowgroup footer cell's DOM element.
+     */
+    rowGroupFooterCell?: DataTablePassThroughOptionType;
     /**
      * Used to pass attributes to the empty message's DOM element.
      */
     emptyMessage?: DataTablePassThroughOptionType;
+    /**
+     * Used to pass attributes to the empty message cell's DOM element.
+     */
+    emptyMessageCell?: DataTablePassThroughOptionType;
     /**
      * Used to pass attributes to the tfoot's DOM element.
      */
diff --git a/components/lib/datatable/TableBody.vue b/components/lib/datatable/TableBody.vue
index 94e6bd99b..4c438d5d2 100755
--- a/components/lib/datatable/TableBody.vue
+++ b/components/lib/datatable/TableBody.vue
@@ -10,7 +10,7 @@
                     role="row"
                     v-bind="ptm('rowGroupHeader')"
                 >
-                    <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }" data-pc-section="bodycell">
+                    <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('bodycell'), ...ptm('rowGroupHeaderCell') }">
                         <button v-if="expandableRowGroups" :class="cx('rowGroupToggler')" @click="onRowGroupToggle($event, rowData)" type="button" v-bind="ptm('rowGroupToggler')">
                             <component v-if="templates['rowgrouptogglericon']" :is="templates['rowgrouptogglericon']" :expanded="isRowGroupExpanded(rowData)" />
                             <template v-else>
@@ -91,7 +91,7 @@
                     role="row"
                     v-bind="ptm('rowExpansion')"
                 >
-                    <td :colspan="columnsLength" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
+                    <td :colspan="columnsLength" v-bind="{ ...getColumnPT('bodycell'), ...ptm('rowExpansionCell') }">
                         <component :is="templates['expansion']" :data="rowData" :index="getRowIndex(index)" />
                     </td>
                 </tr>
@@ -102,14 +102,14 @@
                     role="row"
                     v-bind="ptm('rowGroupFooter')"
                 >
-                    <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('root'), ...getColumnPT('footerCell') }" data-pc-section="footercell">
+                    <td :colspan="columnsLength - 1" v-bind="{ ...getColumnPT('bodycell'), ...ptm('rowGroupFooterCell') }">
                         <component :is="templates['groupfooter']" :data="rowData" :index="getRowIndex(index)" />
                     </td>
                 </tr>
             </template>
         </template>
         <tr v-else :class="cx('emptyMessage')" role="row" v-bind="ptm('emptyMessage')">
-            <td :colspan="columnsLength" v-bind="{ ...getColumnPT('root'), ...getColumnPT('bodyCell') }">
+            <td :colspan="columnsLength" v-bind="{ ...getColumnPT('bodycell'), ...ptm('emptyMessageCell') }">
                 <component v-if="templates.empty" :is="templates.empty" />
             </td>
         </tr>