diff --git a/src/panels/lovelace/editor/config-elements/hui-calendar-card-editor.ts b/src/panels/lovelace/editor/config-elements/hui-calendar-card-editor.ts
index b9b736c783..2c231738ee 100644
--- a/src/panels/lovelace/editor/config-elements/hui-calendar-card-editor.ts
+++ b/src/panels/lovelace/editor/config-elements/hui-calendar-card-editor.ts
@@ -28,10 +28,13 @@ import { configElementStyle } from "./config-elements-style";
const cardConfigStruct = object({
type: string(),
title: optional(union([string(), boolean()])),
+ initial_view: optional(string()),
theme: optional(string()),
entities: array(string()),
});
+const views = ["dayGridMonth", "dayGridDay", "listWeek"];
+
@customElement("hui-calendar-card-editor")
export class HuiCalendarCardEditor extends LitElement
implements LovelaceCardEditor {
@@ -51,6 +54,10 @@ export class HuiCalendarCardEditor extends LitElement
return this._config!.title || "";
}
+ get _initial_view(): string {
+ return this._config!.initial_view || "dayGridMonth";
+ }
+
get _theme(): string {
return this._config!.theme || "";
}
@@ -74,16 +81,41 @@ export class HuiCalendarCardEditor extends LitElement
.configValue=${"title"}
@value-changed=${this._valueChanged}
>
-
+
+
+ ${views.map((view) => {
+ return html`
+ ${this.hass!.localize(
+ `ui.panel.lovelace.editor.card.calendar.views.${view}`
+ )}
+
+ `;
+ })}
+
+
+
- ${"Calendar Entities" +
+ ${this.hass.localize(
+ "ui.panel.lovelace.editor.card.calendar.calendar_entities"
+ ) +
" (" +
this.hass!.localize("ui.panel.lovelace.editor.card.config.required") +
")"}
@@ -125,6 +157,23 @@ export class HuiCalendarCardEditor extends LitElement
fireEvent(this, "config-changed", { config: this._config });
}
+
+ private _viewChanged(ev: CustomEvent): void {
+ if (!this._config || !this.hass) {
+ return;
+ }
+
+ if (ev.detail.item.view === "") {
+ this._config = { ...this._config };
+ delete this._config.initial_view;
+ } else {
+ this._config = {
+ ...this._config,
+ initial_view: ev.detail.item.view,
+ };
+ }
+ fireEvent(this, "config-changed", { config: this._config });
+ }
}
declare global {
diff --git a/src/translations/en.json b/src/translations/en.json
index 85fa6823ad..a253639cf8 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -2245,7 +2245,14 @@
},
"calendar": {
"name": "Calendar",
- "description": "The Calendar card displays a calendar including day, week and list views"
+ "description": "The Calendar card displays a calendar including day, week and list views",
+ "inital_view": "Initial View",
+ "calendar_entities": "Calendar Entities",
+ "views": {
+ "dayGridMonth": "Month",
+ "dayGridDay": "Day",
+ "listWeek": "List"
+ }
},
"conditional": {
"name": "Conditional",