Add title when text in datatable doesnt fit (#20590)

This commit is contained in:
Bram Kragten 2024-04-23 13:50:44 +02:00 committed by GitHub
parent 8239f6dd60
commit 8ab61b5468
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -450,6 +450,8 @@ export class HaDataTable extends LitElement {
}
return html`
<div
@mouseover=${this._setTitle}
@focus=${this._setTitle}
role=${column.main ? "rowheader" : "cell"}
class="mdc-data-table__cell ${classMap({
"mdc-data-table__cell--flex": column.type === "flex",
@ -675,6 +677,13 @@ export class HaDataTable extends LitElement {
fireEvent(this, "row-click", { id: rowId }, { bubbles: false });
};
private _setTitle(ev: Event) {
const target = ev.currentTarget as HTMLElement;
if (target.scrollWidth > target.offsetWidth) {
target.setAttribute("title", target.innerText);
}
}
private _checkedRowsChanged() {
// force scroller to update, change it's items
if (this._items.length) {