@vaadin/login 24.1.0-alpha8 → 24.1.0-beta1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/login",
3
- "version": "24.1.0-alpha8",
3
+ "version": "24.1.0-beta1",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -37,14 +37,14 @@
37
37
  "dependencies": {
38
38
  "@open-wc/dedupe-mixin": "^1.3.0",
39
39
  "@polymer/polymer": "^3.0.0",
40
- "@vaadin/button": "24.1.0-alpha8",
41
- "@vaadin/component-base": "24.1.0-alpha8",
42
- "@vaadin/overlay": "24.1.0-alpha8",
43
- "@vaadin/password-field": "24.1.0-alpha8",
44
- "@vaadin/text-field": "24.1.0-alpha8",
45
- "@vaadin/vaadin-lumo-styles": "24.1.0-alpha8",
46
- "@vaadin/vaadin-material-styles": "24.1.0-alpha8",
47
- "@vaadin/vaadin-themable-mixin": "24.1.0-alpha8"
40
+ "@vaadin/button": "24.1.0-beta1",
41
+ "@vaadin/component-base": "24.1.0-beta1",
42
+ "@vaadin/overlay": "24.1.0-beta1",
43
+ "@vaadin/password-field": "24.1.0-beta1",
44
+ "@vaadin/text-field": "24.1.0-beta1",
45
+ "@vaadin/vaadin-lumo-styles": "24.1.0-beta1",
46
+ "@vaadin/vaadin-material-styles": "24.1.0-beta1",
47
+ "@vaadin/vaadin-themable-mixin": "24.1.0-beta1"
48
48
  },
49
49
  "devDependencies": {
50
50
  "@esm-bundle/chai": "^4.3.4",
@@ -55,5 +55,5 @@
55
55
  "web-types.json",
56
56
  "web-types.lit.json"
57
57
  ],
58
- "gitHead": "1996d6f496a68cefc4c370c45a5d1995c3276c0b"
58
+ "gitHead": "f0ddb6576073a6af05ab29867bc5ec82e334f9d7"
59
59
  }
@@ -65,6 +65,7 @@ class LoginForm extends LoginMixin(ElementMixin(ThemableMixin(PolymerElement)))
65
65
  <vaadin-text-field
66
66
  name="username"
67
67
  label="[[i18n.form.username]]"
68
+ error-message="[[i18n.errorMessage.username]]"
68
69
  id="vaadinLoginUsername"
69
70
  required
70
71
  on-keydown="_handleInputKeydown"
@@ -79,6 +80,7 @@ class LoginForm extends LoginMixin(ElementMixin(ThemableMixin(PolymerElement)))
79
80
  <vaadin-password-field
80
81
  name="password"
81
82
  label="[[i18n.form.password]]"
83
+ error-message="[[i18n.errorMessage.password]]"
82
84
  id="vaadinLoginPassword"
83
85
  required
84
86
  on-keydown="_handleInputKeydown"
@@ -177,7 +179,7 @@ class LoginForm extends LoginMixin(ElementMixin(ThemableMixin(PolymerElement)))
177
179
  const nextInput =
178
180
  inputActive.id === 'vaadinLoginUsername' ? this.$.vaadinLoginPassword : this.$.vaadinLoginUsername;
179
181
  if (inputActive.validate()) {
180
- if (nextInput.validate()) {
182
+ if (nextInput.checkValidity()) {
181
183
  this.submit();
182
184
  } else {
183
185
  nextInput.focus();
@@ -16,6 +16,8 @@ export interface LoginI18n {
16
16
  errorMessage: {
17
17
  title: string;
18
18
  message: string;
19
+ username: string;
20
+ password: string;
19
21
  };
20
22
  header?: {
21
23
  title?: string;
@@ -82,7 +84,9 @@ export declare class LoginMixinClass {
82
84
  * },
83
85
  * errorMessage: {
84
86
  * title: 'Incorrect username or password',
85
- * message: 'Check that you have entered the correct username and password and try again.'
87
+ * message: 'Check that you have entered the correct username and password and try again.',
88
+ * username: 'Username is required',
89
+ * password: 'Password is required'
86
90
  * },
87
91
  * additionalInformation: 'In case you need to provide some additional info for the user.'
88
92
  * }
@@ -102,7 +102,9 @@ export const LoginMixin = (superClass) =>
102
102
  * },
103
103
  * errorMessage: {
104
104
  * title: 'Incorrect username or password',
105
- * message: 'Check that you have entered the correct username and password and try again.'
105
+ * message: 'Check that you have entered the correct username and password and try again.',
106
+ * username: 'Username is required',
107
+ * password: 'Password is required'
106
108
  * },
107
109
  * additionalInformation: 'In case you need to provide some additional info for the user.'
108
110
  * }
@@ -125,6 +127,8 @@ export const LoginMixin = (superClass) =>
125
127
  errorMessage: {
126
128
  title: 'Incorrect username or password',
127
129
  message: 'Check that you have entered the correct username and password and try again.',
130
+ username: 'Username is required',
131
+ password: 'Password is required',
128
132
  },
129
133
  };
130
134
  },
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/login",
4
- "version": "24.1.0-alpha8",
4
+ "version": "24.1.0-beta1",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -118,7 +118,7 @@
118
118
  },
119
119
  {
120
120
  "name": "i18n",
121
- "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
121
+ "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.',\n username: 'Username is required',\n password: 'Password is required'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
122
122
  "value": {
123
123
  "type": [
124
124
  "LoginI18n"
@@ -148,7 +148,7 @@
148
148
  },
149
149
  {
150
150
  "name": "vaadin-login-overlay",
151
- "description": "`<vaadin-login-overlay>` is a wrapper of the `<vaadin-login-form>` which opens a login form in an overlay and\nhaving an additional `brand` part for application title and description. Using `<vaadin-login-overlay>` allows\npassword managers to work with login form.\n\n```\n<vaadin-login-overlay opened></vaadin-login-overlay>\n```\n\n### Styling\n\nThe component doesn't have a shadowRoot, so the `<form>` and input fields can be styled from a global scope.\nUse `<vaadin-login-overlay-wrapper>` and `<vaadin-login-form-wrapper>` to apply styles.\n\nThe following shadow DOM parts of the `<vaadin-login-overlay-wrapper>` are available for styling:\n\nPart name | Description\n----------------|---------------------------------------------------------|\n`card` | Container for the entire component's content\n`brand` | Container for application title and description\n`form` | Container for the `<vaadin-login-form>` component\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.\n\nSee [`<vaadin-login-form>`](https://cdn.vaadin.com/vaadin-web-components/24.1.0-alpha8/#/elements/vaadin-login-form)\ndocumentation for `<vaadin-login-form-wrapper>` stylable parts.",
151
+ "description": "`<vaadin-login-overlay>` is a wrapper of the `<vaadin-login-form>` which opens a login form in an overlay and\nhaving an additional `brand` part for application title and description. Using `<vaadin-login-overlay>` allows\npassword managers to work with login form.\n\n```\n<vaadin-login-overlay opened></vaadin-login-overlay>\n```\n\n### Styling\n\nThe component doesn't have a shadowRoot, so the `<form>` and input fields can be styled from a global scope.\nUse `<vaadin-login-overlay-wrapper>` and `<vaadin-login-form-wrapper>` to apply styles.\n\nThe following shadow DOM parts of the `<vaadin-login-overlay-wrapper>` are available for styling:\n\nPart name | Description\n----------------|---------------------------------------------------------|\n`card` | Container for the entire component's content\n`brand` | Container for application title and description\n`form` | Container for the `<vaadin-login-form>` component\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.\n\nSee [`<vaadin-login-form>`](https://cdn.vaadin.com/vaadin-web-components/24.1.0-beta1/#/elements/vaadin-login-form)\ndocumentation for `<vaadin-login-form-wrapper>` stylable parts.",
152
152
  "attributes": [
153
153
  {
154
154
  "name": "action",
@@ -296,7 +296,7 @@
296
296
  },
297
297
  {
298
298
  "name": "i18n",
299
- "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
299
+ "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.',\n username: 'Username is required',\n password: 'Password is required'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
300
300
  "value": {
301
301
  "type": [
302
302
  "LoginI18n"
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/login",
4
- "version": "24.1.0-alpha8",
4
+ "version": "24.1.0-beta1",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -56,7 +56,7 @@
56
56
  },
57
57
  {
58
58
  "name": ".i18n",
59
- "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
59
+ "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.',\n username: 'Username is required',\n password: 'Password is required'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
60
60
  "value": {
61
61
  "kind": "expression"
62
62
  }
@@ -93,7 +93,7 @@
93
93
  },
94
94
  {
95
95
  "name": "vaadin-login-overlay",
96
- "description": "`<vaadin-login-overlay>` is a wrapper of the `<vaadin-login-form>` which opens a login form in an overlay and\nhaving an additional `brand` part for application title and description. Using `<vaadin-login-overlay>` allows\npassword managers to work with login form.\n\n```\n<vaadin-login-overlay opened></vaadin-login-overlay>\n```\n\n### Styling\n\nThe component doesn't have a shadowRoot, so the `<form>` and input fields can be styled from a global scope.\nUse `<vaadin-login-overlay-wrapper>` and `<vaadin-login-form-wrapper>` to apply styles.\n\nThe following shadow DOM parts of the `<vaadin-login-overlay-wrapper>` are available for styling:\n\nPart name | Description\n----------------|---------------------------------------------------------|\n`card` | Container for the entire component's content\n`brand` | Container for application title and description\n`form` | Container for the `<vaadin-login-form>` component\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.\n\nSee [`<vaadin-login-form>`](https://cdn.vaadin.com/vaadin-web-components/24.1.0-alpha8/#/elements/vaadin-login-form)\ndocumentation for `<vaadin-login-form-wrapper>` stylable parts.",
96
+ "description": "`<vaadin-login-overlay>` is a wrapper of the `<vaadin-login-form>` which opens a login form in an overlay and\nhaving an additional `brand` part for application title and description. Using `<vaadin-login-overlay>` allows\npassword managers to work with login form.\n\n```\n<vaadin-login-overlay opened></vaadin-login-overlay>\n```\n\n### Styling\n\nThe component doesn't have a shadowRoot, so the `<form>` and input fields can be styled from a global scope.\nUse `<vaadin-login-overlay-wrapper>` and `<vaadin-login-form-wrapper>` to apply styles.\n\nThe following shadow DOM parts of the `<vaadin-login-overlay-wrapper>` are available for styling:\n\nPart name | Description\n----------------|---------------------------------------------------------|\n`card` | Container for the entire component's content\n`brand` | Container for application title and description\n`form` | Container for the `<vaadin-login-form>` component\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/custom-theme/styling-components) documentation.\n\nSee [`<vaadin-login-form>`](https://cdn.vaadin.com/vaadin-web-components/24.1.0-beta1/#/elements/vaadin-login-form)\ndocumentation for `<vaadin-login-form-wrapper>` stylable parts.",
97
97
  "extension": true,
98
98
  "attributes": [
99
99
  {
@@ -140,7 +140,7 @@
140
140
  },
141
141
  {
142
142
  "name": ".i18n",
143
- "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
143
+ "description": "The object used to localize this component.\nFor changing the default localization, change the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure (by default it doesn't include `additionalInformation`\nand `header` sections, `header` can be added to override `title` and `description` properties\nin `vaadin-login-overlay`):\n\n```\n{\n header: {\n title: 'App name',\n description: 'Inspiring application description'\n },\n form: {\n title: 'Log in',\n username: 'Username',\n password: 'Password',\n submit: 'Log in',\n forgotPassword: 'Forgot password'\n },\n errorMessage: {\n title: 'Incorrect username or password',\n message: 'Check that you have entered the correct username and password and try again.',\n username: 'Username is required',\n password: 'Password is required'\n },\n additionalInformation: 'In case you need to provide some additional info for the user.'\n}\n```",
144
144
  "value": {
145
145
  "kind": "expression"
146
146
  }