mirror of
https://github.com/home-assistant/frontend.git
synced 2025-08-02 14:07:55 +00:00
Use next icon
This commit is contained in:
parent
c2d4873ac3
commit
d0f3eed49e
@ -1,20 +1,3 @@
|
|||||||
import {
|
|
||||||
mdiAirHumidifier,
|
|
||||||
mdiBrightness5,
|
|
||||||
mdiFan,
|
|
||||||
mdiFormDropdown,
|
|
||||||
mdiFormTextbox,
|
|
||||||
mdiMenu,
|
|
||||||
mdiRobotMower,
|
|
||||||
mdiShield,
|
|
||||||
mdiSunThermometer,
|
|
||||||
mdiSwapVertical,
|
|
||||||
mdiThermometer,
|
|
||||||
mdiThermostat,
|
|
||||||
mdiTuneVariant,
|
|
||||||
mdiVacuum,
|
|
||||||
mdiWaterPercent,
|
|
||||||
} from "@mdi/js";
|
|
||||||
import type { HassEntity } from "home-assistant-js-websocket";
|
import type { HassEntity } from "home-assistant-js-websocket";
|
||||||
import {
|
import {
|
||||||
CSSResultGroup,
|
CSSResultGroup,
|
||||||
@ -34,30 +17,6 @@ import { createCardFeatureElement } from "../create-element/create-card-feature-
|
|||||||
import type { LovelaceCardFeature } from "../types";
|
import type { LovelaceCardFeature } from "../types";
|
||||||
import type { LovelaceCardFeatureConfig } from "./types";
|
import type { LovelaceCardFeatureConfig } from "./types";
|
||||||
|
|
||||||
const SHOW_ICON = true;
|
|
||||||
|
|
||||||
const ICONS: Record<LovelaceCardFeatureConfig["type"], string> = {
|
|
||||||
"alarm-modes": mdiShield,
|
|
||||||
"climate-hvac-modes": mdiThermostat,
|
|
||||||
"climate-preset-modes": mdiTuneVariant,
|
|
||||||
"cover-open-close": mdiSwapVertical,
|
|
||||||
"cover-position": mdiMenu,
|
|
||||||
"cover-tilt": mdiSwapVertical,
|
|
||||||
"cover-tilt-position": mdiMenu,
|
|
||||||
"fan-speed": mdiFan,
|
|
||||||
"humidifier-modes": mdiTuneVariant,
|
|
||||||
"humidifier-toggle": mdiAirHumidifier,
|
|
||||||
"lawn-mower-commands": mdiRobotMower,
|
|
||||||
"light-brightness": mdiBrightness5,
|
|
||||||
"light-color-temp": mdiSunThermometer,
|
|
||||||
"numeric-input": mdiFormTextbox,
|
|
||||||
"select-options": mdiFormDropdown,
|
|
||||||
"target-humidity": mdiWaterPercent,
|
|
||||||
"target-temperature": mdiThermometer,
|
|
||||||
"vacuum-commands": mdiVacuum,
|
|
||||||
"water-heater-operation-modes": mdiThermostat,
|
|
||||||
};
|
|
||||||
|
|
||||||
@customElement("hui-card-features")
|
@customElement("hui-card-features")
|
||||||
export class HuiCardFeatures extends LitElement {
|
export class HuiCardFeatures extends LitElement {
|
||||||
@property({ attribute: false }) public hass!: HomeAssistant;
|
@property({ attribute: false }) public hass!: HomeAssistant;
|
||||||
@ -110,14 +69,6 @@ export class HuiCardFeatures extends LitElement {
|
|||||||
this._currentFeatureIndex = newIndex;
|
this._currentFeatureIndex = newIndex;
|
||||||
}
|
}
|
||||||
|
|
||||||
private get _nextFeatureIndex() {
|
|
||||||
const newIndex = this._currentFeatureIndex + 1;
|
|
||||||
if (this.features?.length && newIndex >= this.features.length) {
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
return newIndex;
|
|
||||||
}
|
|
||||||
|
|
||||||
protected render() {
|
protected render() {
|
||||||
if (!this.features) {
|
if (!this.features) {
|
||||||
return nothing;
|
return nothing;
|
||||||
@ -125,7 +76,6 @@ export class HuiCardFeatures extends LitElement {
|
|||||||
|
|
||||||
if (this.layout?.type === "compact") {
|
if (this.layout?.type === "compact") {
|
||||||
const currentFeature = this.features[this._currentFeatureIndex];
|
const currentFeature = this.features[this._currentFeatureIndex];
|
||||||
const nextFeature = this.features[this._nextFeatureIndex];
|
|
||||||
return html`
|
return html`
|
||||||
<div class="container horizontal">
|
<div class="container horizontal">
|
||||||
${this.renderFeature(currentFeature, this.stateObj)}
|
${this.renderFeature(currentFeature, this.stateObj)}
|
||||||
@ -136,13 +86,7 @@ export class HuiCardFeatures extends LitElement {
|
|||||||
@click=${this._next}
|
@click=${this._next}
|
||||||
.label=${"Next"}
|
.label=${"Next"}
|
||||||
>
|
>
|
||||||
${ICONS[nextFeature.type] && SHOW_ICON
|
<ha-icon-next></ha-icon-next>
|
||||||
? html`
|
|
||||||
<ha-svg-icon
|
|
||||||
.path=${ICONS[nextFeature.type]}
|
|
||||||
></ha-svg-icon>
|
|
||||||
`
|
|
||||||
: html`<ha-icon-next></ha-icon-next>`}
|
|
||||||
</ha-control-button>
|
</ha-control-button>
|
||||||
`
|
`
|
||||||
: nothing}
|
: nothing}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user