From eb923d275021f1d0ba3b97c9cd59a2f6165dbc0c Mon Sep 17 00:00:00 2001
From: callmeroot <anoushka.jha.che21@itbhu.ac.in>
Date: Thu, 5 Sep 2024 23:07:39 +0530
Subject: [PATCH] Added header align same as content alignment

---
 lib/KTable/index.vue | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/lib/KTable/index.vue b/lib/KTable/index.vue
index f81a89d73..b8546f56c 100644
--- a/lib/KTable/index.vue
+++ b/lib/KTable/index.vue
@@ -26,7 +26,8 @@
               :style="[getHeaderStyle(header),
                        isColumnSortActive(index) ? { color: $themeBrand.primary.v_1000 } : { color: $themePalette.grey.v_800 },
                        { backgroundColor: $themePalette.white } ,
-                       isColumnFocused(index) ? { backgroundColor: $themePalette.grey.v_50 } : {}]"
+                       isColumnFocused(index) ? { backgroundColor: $themePalette.grey.v_50 } : {},
+                       { textAlign: getTextAlign(header.dataType) }]"
               role="columnheader"
               data-focus="true"
               :aria-colindex="index + 1"
@@ -90,7 +91,12 @@
 <script>
 
   import { ref, computed, watch } from '@vue/composition-api';
-  import useSorting, { SORT_ORDER_ASC, SORT_ORDER_DESC, DATA_TYPE_OTHERS } from './useSorting';
+  import useSorting, {
+    SORT_ORDER_ASC,
+    SORT_ORDER_DESC,
+    DATA_TYPE_OTHERS,
+    DATA_TYPE_NUMERIC,
+  } from './useSorting';
   import KTableGridItem from './KTableGridItem.vue';
 
   export default {
@@ -497,6 +503,16 @@
           }
         });
       },
+      getTextAlign(dataType) {
+        const alignLtr = dataType === DATA_TYPE_NUMERIC ? 'right' : 'left';
+        if (this.isRtl && alignLtr === 'right') {
+          return 'left';
+        }
+        if (this.isRtl && alignLtr === 'left') {
+          return 'right';
+        }
+        return alignLtr;
+      },
     },
   };