pkp/pkp-lib#9744 Code cleanup on the table component and stats-page s…

…tories file

src/components/Container/StatsPage.stories.js

@@ -114,8 +114,8 @@ const EditorialStatsPageWithDataAndTemplate = {
 			<div class="pkpStats__content">
 				<div class="pkpStats__table" role="region" aria-live="polite">
 					<PkpTable
-						labelled-by="editorialActivityTabelLabel"
 						class="pkpTable--editorialStats"
+						labelled-by="editorialActivityTabelLabel"
 					>
 						<TableHeader>
 							<TableColumn v-for="(column, columnIndex) in tableColumns" :key="column.name" :id="column.name">
@@ -126,7 +126,7 @@ const EditorialStatsPageWithDataAndTemplate = {
 							<TableRow v-for="(row, index) in tableRows" :key="index">
 								<TableCell>
 									{{ row.name }}
-									 <Tooltip
+									<Tooltip
 										v-if="row.description"
 										:label="'Description for ' + row.name"
 										:tooltip="row.description"
@@ -560,7 +560,7 @@ const PublicationStatsPageWithDataAndTemplate = {
 						</TableHeader>
 						<TableBody>
 							<TableRow v-for="(row) in items" :key="row.key">
-								<TableCell>{{ row.object.fullTitle.en}}</TableCell>
+								<TableCell>{{ row.object.fullTitle.en }}</TableCell>
 								<TableCell>{{ row.abstractViews }}</TableCell>
 								<TableCell>{{ row.galleyViews }}</TableCell>
 								<TableCell>{{ row.pdfViews }}</TableCell>

src/components/TableNext/Table.vue

@@ -3,7 +3,7 @@
 		v-if="slots.label || slots.description || slots['top-controls']"
 		class="flex justify-between bg-default p-4"
 	>
-		<div>
+		<div v-if="slots.label || slots.description">
 			<span v-if="slots.label" :id="labelId" class="text-xl-bold">
 				<slot name="label" />
 			</span>
@@ -48,9 +48,9 @@ function onSort(columnId) {
 const props = defineProps({
 	/** Table description for screen reader users */
 	ariaLabel: {type: String, default: null},
-	/** This value will be used as the `aria-labelledby` attribute for the table if there's no template "label" provided. */
+	/** This value will be used as the `aria-labelledby` attribute for the table if there's no slot/template "label" provided. */
 	labelledBy: {type: String, default: null},
-	/** This value will be used as the `aria-describedby` attribute for the table if there's no template "description" provided. */
+	/** This value will be used as the `aria-describedby` attribute for the table if there's no slot/template "description" provided. */
 	describedBy: {type: String, default: null},
 	/**
 	 * {column: String, direction: String}, use useSorting composable to control sortDescriptor