fix: table: fix loading compare and updates default spinner size and …

…position (#627)

* fix: table: fix loading compare and updates default spinner size and position

* chore: table�: inherit spinner div height

src/components/Table/Styles/table.module.scss

@@ -700,6 +700,13 @@
   }
 }
 
+.table-spinner {
+  align-items: center;
+  display: flex;
+  height: inherit;
+  justify-content: center;
+}
+
 .table-filter-dropdown {
   &-tree {
     padding: 8px 8px 0;

src/components/Table/Table.stories.tsx

@@ -101,6 +101,10 @@ export default {
     onRowHoverLeave: {
       action: 'onMouseLeave',
     },
+    loading: {
+      options: [true, false],
+      control: { type: 'inline-radio' },
+    },
   },
 } as ComponentMeta<typeof Component>;
 
@@ -1409,6 +1413,7 @@ const tableArgs: Object = {
   bordered: true,
   classNames: 'my-table-class',
   id: 'myTableId',
+  loading: false,
   columns: basicCols,
   dataSource: data,
   pagination: {

src/components/Table/Table.tsx

@@ -687,10 +687,18 @@ function InternalTable<RecordType extends object = any>(
     }
   }
 
-  if (typeof loading === 'boolean') {
-    return <Spinner size={SpinnerSize.Large} />;
+  if (typeof loading === 'boolean' && loading) {
+    return (
+      <div className={styles.tableSpinner}>
+        <Spinner />
+      </div>
+    );
   } else if (typeof loading === 'object') {
-    return <Spinner size={SpinnerSize.Large} />;
+    return (
+      <div className={styles.tableSpinner}>
+        <Spinner {...loading} />
+      </div>
+    );
   }
 
   const renderEmpty = (