Merge pull request #975 from dermotduffy/submenu-button
Fix menu alignment issue for 'opposing' buttons
This commit is contained in:
+10
-12
@@ -5,7 +5,7 @@ import {
|
|||||||
LitElement,
|
LitElement,
|
||||||
PropertyValues,
|
PropertyValues,
|
||||||
TemplateResult,
|
TemplateResult,
|
||||||
unsafeCSS
|
unsafeCSS,
|
||||||
} from 'lit';
|
} from 'lit';
|
||||||
import { customElement, property, state } from 'lit/decorators.js';
|
import { customElement, property, state } from 'lit/decorators.js';
|
||||||
import { classMap } from 'lit/directives/class-map.js';
|
import { classMap } from 'lit/directives/class-map.js';
|
||||||
@@ -19,13 +19,13 @@ import type {
|
|||||||
MenuButton,
|
MenuButton,
|
||||||
MenuConfig,
|
MenuConfig,
|
||||||
MenuItem,
|
MenuItem,
|
||||||
StateParameters
|
StateParameters,
|
||||||
} from '../types.js';
|
} from '../types.js';
|
||||||
import {
|
import {
|
||||||
convertActionToFrigateCardCustomAction,
|
convertActionToFrigateCardCustomAction,
|
||||||
frigateCardHandleActionConfig,
|
frigateCardHandleActionConfig,
|
||||||
frigateCardHasAction,
|
frigateCardHasAction,
|
||||||
getActionConfigGivenAction
|
getActionConfigGivenAction,
|
||||||
} from '../utils/action.js';
|
} from '../utils/action.js';
|
||||||
import { FRIGATE_ICON_SVG_PATH } from '../camera-manager/frigate/icon.js';
|
import { FRIGATE_ICON_SVG_PATH } from '../camera-manager/frigate/icon.js';
|
||||||
import { refreshDynamicStateParameters } from '../utils/ha';
|
import { refreshDynamicStateParameters } from '../utils/ha';
|
||||||
@@ -226,9 +226,6 @@ export class FrigateCardMenu extends LitElement {
|
|||||||
* @returns A rendered template or void.
|
* @returns A rendered template or void.
|
||||||
*/
|
*/
|
||||||
protected _renderButton(button: MenuButton): TemplateResult | void {
|
protected _renderButton(button: MenuButton): TemplateResult | void {
|
||||||
if (button.enabled === false) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (button.type === 'custom:frigate-card-menu-submenu') {
|
if (button.type === 'custom:frigate-card-menu-submenu') {
|
||||||
return html` <frigate-card-submenu
|
return html` <frigate-card-submenu
|
||||||
.hass=${this.hass}
|
.hass=${this.hass}
|
||||||
@@ -306,16 +303,17 @@ export class FrigateCardMenu extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// If the hidden menu isn't expanded, only show the Frigate button.
|
// If the hidden menu isn't expanded, only show the Frigate button.
|
||||||
const matchingButtons =
|
const matchingButtons = (
|
||||||
style !== 'hidden' || this.expanded
|
style !== 'hidden' || this.expanded
|
||||||
? this.buttons.filter(
|
? this.buttons.filter(
|
||||||
(button) => !button.alignment || button.alignment === 'matching',
|
(button) => !button.alignment || button.alignment === 'matching',
|
||||||
)
|
)
|
||||||
: this.buttons.filter((button) => button.icon === FRIGATE_BUTTON_MENU_ICON);
|
: this.buttons.filter((button) => button.icon === FRIGATE_BUTTON_MENU_ICON)
|
||||||
|
).filter((button) => !!button.enabled)
|
||||||
|
|
||||||
const opposingButtons =
|
const opposingButtons =
|
||||||
style !== 'hidden' || this.expanded
|
style !== 'hidden' || this.expanded
|
||||||
? this.buttons.filter((button) => button.alignment === 'opposing')
|
? this.buttons.filter((button) => button.alignment === 'opposing' && button.enabled)
|
||||||
: [];
|
: [];
|
||||||
|
|
||||||
const matchingStyle = {
|
const matchingStyle = {
|
||||||
@@ -342,7 +340,7 @@ export class FrigateCardMenu extends LitElement {
|
|||||||
}
|
}
|
||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
"frigate-card-menu": FrigateCardMenu
|
'frigate-card-menu': FrigateCardMenu;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user