-
+ >
`
- : html``}
+ @change=${this._inputChanged}
+ >`}
`
)
: html`
@@ -145,7 +144,7 @@ export class HaBlueprintScriptEditor extends LitElement {
ev.stopPropagation();
const target = ev.target as any;
const key = target.key;
- const value = ev.detail.value;
+ const value = ev.detail?.value ?? target.value;
if (
(this.config.use_blueprint.input &&
this.config.use_blueprint.input[key] === value) ||
diff --git a/src/panels/profile/ha-change-password-card.ts b/src/panels/profile/ha-change-password-card.ts
index 4ba20e8478..e0ad18412a 100644
--- a/src/panels/profile/ha-change-password-card.ts
+++ b/src/panels/profile/ha-change-password-card.ts
@@ -1,5 +1,4 @@
import "@material/mwc-button";
-import "@polymer/paper-input/paper-input";
import {
css,
CSSResultGroup,
@@ -11,8 +10,10 @@ import {
import { customElement, property, state } from "lit/decorators";
import "../../components/ha-card";
import "../../components/ha-circular-progress";
+import "../../components/ha-textfield";
import { haStyle } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
+import "../../components/ha-alert";
@customElement("ha-change-password-card")
class HaChangePasswordCard extends LitElement {
@@ -24,11 +25,11 @@ class HaChangePasswordCard extends LitElement {
@state() private _errorMsg?: string;
- @state() private _currentPassword?: string;
+ @state() private _currentPassword = "";
- @state() private _password?: string;
+ @state() private _password = "";
- @state() private _passwordConfirm?: string;
+ @state() private _passwordConfirm = "";
protected render(): TemplateResult {
return html`
@@ -40,46 +41,48 @@ class HaChangePasswordCard extends LitElement {
>
${this._errorMsg
- ? html`
${this._errorMsg}
`
+ ? html`
${this._errorMsg}`
: ""}
${this._statusMsg
- ? html`
${this._statusMsg}
`
+ ? html`
${this._statusMsg}`
: ""}
-
+ >
${this._currentPassword
- ? html`
-
+ `
+ >`
: ""}
@@ -101,16 +104,16 @@ class HaChangePasswordCard extends LitElement {
`;
}
- private _currentPasswordChanged(ev: CustomEvent) {
- this._currentPassword = ev.detail.value;
+ private _currentPasswordChanged(ev) {
+ this._currentPassword = ev.target.value;
}
- private _newPasswordChanged(ev: CustomEvent) {
- this._password = ev.detail.value;
+ private _newPasswordChanged(ev) {
+ this._password = ev.target.value;
}
- private _newPasswordConfirmChanged(ev: CustomEvent) {
- this._passwordConfirm = ev.detail.value;
+ private _newPasswordConfirmChanged(ev) {
+ this._passwordConfirm = ev.target.value;
}
protected firstUpdated(changedProps: PropertyValues) {
@@ -162,23 +165,21 @@ class HaChangePasswordCard extends LitElement {
this._statusMsg = this.hass.localize(
"ui.panel.profile.change_password.success"
);
- this._currentPassword = undefined;
- this._password = undefined;
- this._passwordConfirm = undefined;
+ this._currentPassword = "";
+ this._password = "";
+ this._passwordConfirm = "";
}
static get styles(): CSSResultGroup {
return [
haStyle,
css`
- .error {
- color: var(--error-color);
- }
- .status {
- color: var(--primary-color);
+ ha-textfield {
+ margin-top: 8px;
+ display: block;
}
#currentPassword {
- margin-top: -8px;
+ margin-top: 0;
}
`,
];
diff --git a/src/panels/profile/ha-pick-theme-row.ts b/src/panels/profile/ha-pick-theme-row.ts
index 214cc20515..d9fe4f78c2 100644
--- a/src/panels/profile/ha-pick-theme-row.ts
+++ b/src/panels/profile/ha-pick-theme-row.ts
@@ -1,5 +1,6 @@
import "@material/mwc-button/mwc-button";
-import "@polymer/paper-input/paper-input";
+import "@material/mwc-list/mwc-list-item";
+import "@material/mwc-select/mwc-select";
import {
css,
CSSResultGroup,
@@ -14,14 +15,13 @@ import "../../components/ha-formfield";
import "../../components/ha-radio";
import type { HaRadio } from "../../components/ha-radio";
import "../../components/ha-settings-row";
+import "../../components/ha-textfield";
import {
- DEFAULT_PRIMARY_COLOR,
DEFAULT_ACCENT_COLOR,
+ DEFAULT_PRIMARY_COLOR,
} from "../../resources/ha-style";
import { HomeAssistant } from "../../types";
import { documentationUrl } from "../../util/documentation-url";
-import "@material/mwc-select/mwc-select";
-import "@material/mwc-list/mwc-list-item";
@customElement("ha-pick-theme-row")
export class HaPickThemeRow extends LitElement {
@@ -115,8 +115,8 @@ export class HaPickThemeRow extends LitElement {
${curTheme === "default"
- ? html`
-
+
-
+
+ >
${themeSettings?.primaryColor || themeSettings?.accentColor
? html`
${this.hass.localize("ui.panel.profile.themes.reset")}
@@ -228,7 +228,8 @@ export class HaPickThemeRow extends LitElement {
align-items: center;
flex-grow: 1;
}
- paper-input {
+ ha-textfield {
+ --text-field-padding: 8px;
min-width: 75px;
flex-grow: 1;
margin: 0 4px;