mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-16 05:46:35 +00:00
Intercept default search shortcut and focus our search input on data table pages (#23209)
Intercept default search shortcut on data table pages
This commit is contained in:
parent
ce5ce37de7
commit
bf624f5ca7
@ -39,9 +39,10 @@ import type { HomeAssistant, Route } from "../types";
|
||||
import "./hass-tabs-subpage";
|
||||
import type { PageNavigation } from "./hass-tabs-subpage";
|
||||
import { showDataTableSettingsDialog } from "../components/data-table/show-dialog-data-table-settings";
|
||||
import { KeyboardShortcutMixin } from "../mixins/keyboard-shortcut-mixin";
|
||||
|
||||
@customElement("hass-tabs-subpage-data-table")
|
||||
export class HaTabsSubpageDataTable extends LitElement {
|
||||
export class HaTabsSubpageDataTable extends KeyboardShortcutMixin(LitElement) {
|
||||
@property({ attribute: false }) public hass!: HomeAssistant;
|
||||
|
||||
@property({ attribute: false }) public localizeFunc?: LocalizeFunc;
|
||||
@ -189,6 +190,14 @@ export class HaTabsSubpageDataTable extends LitElement {
|
||||
|
||||
@query("#sort-by-menu") private _sortByMenu!: HaMenu;
|
||||
|
||||
@query("search-input-outlined") private _searchInput!: HTMLElement;
|
||||
|
||||
protected supportedShortcuts(): SupportedShortcuts {
|
||||
return {
|
||||
f: () => this._searchInput.focus(),
|
||||
};
|
||||
}
|
||||
|
||||
private _showPaneController = new ResizeController(this, {
|
||||
callback: (entries) => entries[0]?.contentRect.width > 750,
|
||||
});
|
||||
|
@ -1,26 +1,35 @@
|
||||
import type { LitElement } from "lit";
|
||||
import type { Constructor } from "../types";
|
||||
|
||||
declare global {
|
||||
interface SupportedShortcuts {
|
||||
[key: string]: () => void;
|
||||
}
|
||||
}
|
||||
|
||||
export const KeyboardShortcutMixin = <T extends Constructor<LitElement>>(
|
||||
superClass: T
|
||||
) =>
|
||||
class extends superClass {
|
||||
private _keydownEvent = (event: KeyboardEvent) => {
|
||||
if ((event.ctrlKey || event.metaKey) && event.key === "s") {
|
||||
const supportedShortcuts = this.supportedShortcuts();
|
||||
if ((event.ctrlKey || event.metaKey) && event.key in supportedShortcuts) {
|
||||
event.preventDefault();
|
||||
this.handleKeyboardSave();
|
||||
supportedShortcuts[event.key]();
|
||||
}
|
||||
};
|
||||
|
||||
public connectedCallback() {
|
||||
super.connectedCallback();
|
||||
this.addEventListener("keydown", this._keydownEvent);
|
||||
window.addEventListener("keydown", this._keydownEvent);
|
||||
}
|
||||
|
||||
public disconnectedCallback() {
|
||||
this.removeEventListener("keydown", this._keydownEvent);
|
||||
window.removeEventListener("keydown", this._keydownEvent);
|
||||
super.disconnectedCallback();
|
||||
}
|
||||
|
||||
protected handleKeyboardSave() {}
|
||||
protected supportedShortcuts(): SupportedShortcuts {
|
||||
return {};
|
||||
}
|
||||
};
|
||||
|
@ -852,8 +852,10 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) {
|
||||
ev.detail.callback(this._config);
|
||||
}
|
||||
|
||||
protected handleKeyboardSave() {
|
||||
this._saveAutomation();
|
||||
protected supportedShortcuts(): SupportedShortcuts {
|
||||
return {
|
||||
s: () => this._saveAutomation(),
|
||||
};
|
||||
}
|
||||
|
||||
static get styles(): CSSResultGroup {
|
||||
|
@ -1215,8 +1215,10 @@ export class HaSceneEditor extends SubscribeMixin(
|
||||
}
|
||||
}
|
||||
|
||||
protected handleKeyboardSave() {
|
||||
this._saveScene();
|
||||
protected supportedShortcuts(): SupportedShortcuts {
|
||||
return {
|
||||
s: () => this._saveScene(),
|
||||
};
|
||||
}
|
||||
|
||||
private get _sceneAreaIdWithUpdates(): string | undefined | null {
|
||||
|
@ -818,8 +818,10 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
|
||||
}
|
||||
}
|
||||
|
||||
protected handleKeyboardSave() {
|
||||
this._saveScript();
|
||||
protected supportedShortcuts(): SupportedShortcuts {
|
||||
return {
|
||||
s: () => this._saveScript(),
|
||||
};
|
||||
}
|
||||
|
||||
static get styles(): CSSResultGroup {
|
||||
|
Loading…
x
Reference in New Issue
Block a user