fix: table scoped slots

Author: vis97c

packages/common-helpers/src/locale/en.ts

@@ -141,6 +141,7 @@ export const localeForm: tLocaleForm = {
 export const localeTable: tLocaleTable = {
 	table_see_values: "See {name}",
 	table_see_name: 'See: "{name}"',
+	table_hide_name: 'Hide: "{name}"',
 	table_create_new: "Create new",
 	table_create_new_name: 'Create new "{name}"',
 	table_quantity: "Quantity: {count}",

packages/common-helpers/src/locale/es.ts

@@ -142,6 +142,7 @@ export const localeForm: tLocaleForm = {
 export const localeTable: tLocaleTable = {
 	table_see_values: "Ver {name}",
 	table_see_name: 'Ver: "{name}"',
+	table_hide_name: 'Ocultar: "{name}"',
 	table_create_new: "Crear nuevo",
 	table_create_new_name: 'Crear nuevo "{name}"',
 	table_quantity: "Cantidad: {count}",

packages/common-types/src/locale.ts

@@ -209,6 +209,8 @@ export type tLocaleTable = {
 	table_see_values: string;
 	/** @example "See: \"{name}\"" */
 	table_see_name: string;
+	/** @example "Hide: \"{name}\"" */
+	table_hide_name: string;
 	/** @example "Create new" */
 	table_create_new: string;
 	/** @example "Crear nuevo" */

packages/components-vue/src/components/table/Body.vue

@@ -197,12 +197,17 @@
 								:size="size"
 								:active="showChildren(nodeIndex, node)"
 								:tooltip="
-									t('table_see_name', {
-										name:
-											childrenName ||
-											childrenCountKey ||
-											String(node.id ?? nodeIndex).split('/')[0],
-									})
+									t(
+										showChildren(nodeIndex, node)
+											? 'table_hide_name'
+											: 'table_see_name',
+										{
+											name:
+												childrenName ||
+												childrenCountKey ||
+												String(node.id ?? nodeIndex).split('/')[0],
+										}
+									)
 								"
 								tooltip-position="right"
 								:disabled="!childrenCount(node) || showNodeChildren?.(node)"

packages/components-vue/src/components/table/Simple.vue

@@ -9,17 +9,22 @@
 			:class="[{ '--nested': nested }, themeClasses]"
 		>
 			<TableHead v-bind="childrenProps" :with-default-slot="!!$slots.default">
-				<slot v-if="$slots.headActions" name="headActions"></slot>
+				<template v-if="$slots.headActions" #headActions="headScope">
+					<slot name="headActions" v-bind="headScope"></slot>
+				</template>
 			</TableHead>
 			<TableBody v-bind="childrenProps">
-				<template v-if="$slots.default" #default>
-					<slot name="default"></slot>
+				<template v-if="$slots.default" #default="defaultScope">
+					<slot name="default" v-bind="defaultScope"></slot>
 				</template>
-				<template v-if="$slots.modifyActions" #modifyActions>
-					<slot name="modifyActions"></slot>
+				<template v-if="$slots.modifyActions" #modifyActions="modifyScope">
+					<slot name="modifyActions" v-bind="modifyScope"></slot>
 				</template>
-				<template v-if="$slots.modifyDropdownActions" #modifyDropdownActions>
-					<slot name="modifyDropdownActions"></slot>
+				<template
+					v-if="$slots.modifyDropdownActions"
+					#modifyDropdownActions="modifyDropdownScope"
+				>
+					<slot name="modifyDropdownActions" v-bind="modifyDropdownScope"></slot>
 				</template>
 			</TableBody>
 		</table>

packages/components-vue/src/composables/theme.ts

@@ -85,7 +85,7 @@ export default function useTheme(props: iAllUseThemeProps, themeAsUnion?: boolea
 
 		return tooltipText
 			? {
-					"arial-label": tooltipText,
+					"aria-label": tooltipText,
 					"data-tooltip": tooltipText,
 					"data-tooltip-position": props.tooltipPosition,
 					"data-tooltip-text": props.tooltipAsText ?? true,

packages/styles/src/base/_initialize.scss

@@ -49,6 +49,16 @@
 			text-shadow: inherit;
 		}
 
+		p {
+			a {
+				@layer defaults {
+					&:hover {
+						opacity: 0.7;
+					}
+				}
+			}
+		}
+
 		// broken asset fallback styles
 		img,
 		iframe {

packages/styles/src/base/_reset.scss

@@ -137,19 +137,6 @@
 				pointer-events: none;
 			}
 		}
-		h1,
-		h2,
-		h3,
-		h4,
-		h5,
-		h6 {
-			@layer defaults {
-				&,
-				* {
-					// @defaults txtWrap
-				}
-			}
-		}
 
 		// basic transition
 		//

packages/styles/src/components/action/_module.scss

@@ -13,6 +13,7 @@
 		border-style: solid;
 		text-shadow: none;
 		font-size: 1em;
+		opacity: 1;
 	}
 }