@@ -11,13 +10,17 @@ description: "Represents the default options for the table that can be configure
filterColumnActiveByDefault: boolean;
editionMode: OTableEditionMode;
detailMode: OTableDetailMode;
- rowHeight: ORowHeight,
- showChartsOnDemandOption: boolean;
+ rowHeight: ORowHeight;
+ selectionOnRowClick: boolean;
+ showChartOnDemandOption: boolean;
showReportOnDemandOption: boolean;
- loading: { threshold: number, minVisible: number };
- selectionOnRowClick?: boolean;
+ loading: {
+ threshold: number;
+ minVisibleRows: number;
+ };
horizontalScroll: boolean;
- };
+ showHeaderTooltip: boolean;
+ };
@@ -89,6 +92,13 @@ attributes: [{
default : "{threshold:300 , minVisibleRows: 300}",
required : "",
description : "Configuration object for loading strategy."
- }
+},
+{
+ name: "showHeaderTooltip",
+ type: "boolean",
+ default : "false",
+ required : "",
+ description : "Indicates whether to show or not the tooltip on header cells."
+}
]
diff --git a/assets/images/components/tabla/header-tooltip-icon.png b/assets/images/components/tabla/header-tooltip-icon.png
new file mode 100644
index 000000000..debb1e7ce
Binary files /dev/null and b/assets/images/components/tabla/header-tooltip-icon.png differ
diff --git a/docs/components/data/35-o-table.component.md b/docs/components/data/35-o-table.component.md
index bc96f5a74..9abd28ca5 100644
--- a/docs/components/data/35-o-table.component.md
+++ b/docs/components/data/35-o-table.component.md
@@ -1338,6 +1338,98 @@ Table allows multiple columns sorting by default. Using the `multiple-sort` inpu
A column is sorted when user clicks on its header. If the multiple sorting is active the previously sorted columns keeps its state, otherwise the previously sorted column returns to its original state.
+Aquí la propuesta del apartado nuevo para la documentación:
+
+---
+
+### Header tooltip
+
+The `o-table` component provides several ways to configure tooltips on column headers, from global configuration to individual column customization.
+
+**Basic usage**
+
+Enable a tooltip for all column headers at once using the `show-header-tooltip` input on the table. This will display the column title as the tooltip text on hover.
+
+```html
+
+
+
+
+
+```
+
+**Custom tooltip per column**
+
+Use `header-tooltip` on each `o-table-column` to define a specific tooltip text, optionally combined with a Material icon using `header-tooltip-icon`.
+
+```html
+
+
+
+
+
+
+
+```
+
+![Header tooltip icon in o-table-column]({{ "/assets/images/components/tabla/header-tooltip-icon.png" | absolute_url }}){: .comp-example-img}
+
+**Custom tooltip styling**
+
+Use `header-tooltip-class` to apply a custom CSS class to the tooltip, allowing full control over its appearance.
+
+```html
+
+
+```
+
+```scss
+// styles.scss
+.my-custom-tooltip {
+ background-color: #333;
+ color: #fff;
+ font-size: 13px;
+ max-width: 250px;
+}
+```
+
+**Global configuration**
+
+To apply `showHeaderTooltip` globally across all `o-table` instances in the application, use `O_TABLE_GLOBAL_CONFIG`:
+
+```typescript
+// app.module.ts
+import { O_TABLE_GLOBAL_CONFIG } from 'ontimize-web-ngx';
+
+@NgModule({
+ providers: [
+ {
+ provide: O_TABLE_GLOBAL_CONFIG,
+ useValue: {
+ showHeaderTooltip: true
+ }
+ }
+ ]
+})
+export class AppModule { }
+```
+
+**Priority order**
+
+When multiple tooltip configurations are present simultaneously, the following priority order applies — higher levels override lower ones:
+
+```
+1. header-tooltip (o-table-column level) ← highest priority
+2. show-header-tooltip (o-table level)
+3. showHeaderTooltip (OTableGlobalConfig) ← lowest priority
+```
+
### Tooltip in columns
The `o-table` component provides a text that is displayed when the user hovers over an column.
diff --git a/docs/components/data/image.png b/docs/components/data/image.png
new file mode 100644
index 000000000..debb1e7ce
Binary files /dev/null and b/docs/components/data/image.png differ