@vaadin/custom-field 23.2.0-alpha3 → 23.2.0-alpha4

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.
Files changed (4) hide show
  1. package/package.json +26 -20
  2. package/src/vaadin-custom-field.d.ts +2 -2
  3. package/web-types.json +210 -0
  4. package/web-types.lit.json +104 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/custom-field",
3
- "version": "23.2.0-alpha3",
3
+ "version": "23.2.0-alpha4",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -23,7 +23,9 @@
23
23
  "src",
24
24
  "theme",
25
25
  "vaadin-*.d.ts",
26
- "vaadin-*.js"
26
+ "vaadin-*.js",
27
+ "web-types.json",
28
+ "web-types.lit.json"
27
29
  ],
28
30
  "keywords": [
29
31
  "Vaadin",
@@ -33,28 +35,32 @@
33
35
  ],
34
36
  "dependencies": {
35
37
  "@polymer/polymer": "^3.0.0",
36
- "@vaadin/component-base": "23.2.0-alpha3",
37
- "@vaadin/field-base": "23.2.0-alpha3",
38
- "@vaadin/vaadin-lumo-styles": "23.2.0-alpha3",
39
- "@vaadin/vaadin-material-styles": "23.2.0-alpha3",
40
- "@vaadin/vaadin-themable-mixin": "23.2.0-alpha3"
38
+ "@vaadin/component-base": "23.2.0-alpha4",
39
+ "@vaadin/field-base": "23.2.0-alpha4",
40
+ "@vaadin/vaadin-lumo-styles": "23.2.0-alpha4",
41
+ "@vaadin/vaadin-material-styles": "23.2.0-alpha4",
42
+ "@vaadin/vaadin-themable-mixin": "23.2.0-alpha4"
41
43
  },
42
44
  "devDependencies": {
43
45
  "@esm-bundle/chai": "^4.3.4",
44
- "@vaadin/combo-box": "23.2.0-alpha3",
45
- "@vaadin/date-picker": "23.2.0-alpha3",
46
- "@vaadin/email-field": "23.2.0-alpha3",
47
- "@vaadin/form-layout": "23.2.0-alpha3",
48
- "@vaadin/list-box": "23.2.0-alpha3",
49
- "@vaadin/number-field": "23.2.0-alpha3",
50
- "@vaadin/password-field": "23.2.0-alpha3",
51
- "@vaadin/polymer-legacy-adapter": "23.2.0-alpha3",
52
- "@vaadin/select": "23.2.0-alpha3",
46
+ "@vaadin/combo-box": "23.2.0-alpha4",
47
+ "@vaadin/date-picker": "23.2.0-alpha4",
48
+ "@vaadin/email-field": "23.2.0-alpha4",
49
+ "@vaadin/form-layout": "23.2.0-alpha4",
50
+ "@vaadin/list-box": "23.2.0-alpha4",
51
+ "@vaadin/number-field": "23.2.0-alpha4",
52
+ "@vaadin/password-field": "23.2.0-alpha4",
53
+ "@vaadin/polymer-legacy-adapter": "23.2.0-alpha4",
54
+ "@vaadin/select": "23.2.0-alpha4",
53
55
  "@vaadin/testing-helpers": "^0.3.2",
54
- "@vaadin/text-area": "23.2.0-alpha3",
55
- "@vaadin/text-field": "23.2.0-alpha3",
56
- "@vaadin/time-picker": "23.2.0-alpha3",
56
+ "@vaadin/text-area": "23.2.0-alpha4",
57
+ "@vaadin/text-field": "23.2.0-alpha4",
58
+ "@vaadin/time-picker": "23.2.0-alpha4",
57
59
  "sinon": "^13.0.2"
58
60
  },
59
- "gitHead": "06e5875be93ca50da2846dafc65a8531010c0576"
61
+ "web-types": [
62
+ "web-types.json",
63
+ "web-types.lit.json"
64
+ ],
65
+ "gitHead": "cbf5f1d0f38ac9b81c65cf9ef5660182e176e598"
60
66
  }
package/src/vaadin-custom-field.d.ts CHANGED
@@ -161,13 +161,13 @@ declare class CustomField extends FieldMixin(FocusMixin(ThemableMixin(ElementMix
161
161
  addEventListener<K extends keyof CustomFieldEventMap>(
162
162
  type: K,
163
163
  listener: (this: CustomField, ev: CustomFieldEventMap[K]) => void,
164
- options?: boolean | AddEventListenerOptions,
164
+ options?: AddEventListenerOptions | boolean,
165
165
  ): void;
166
166
 
167
167
  removeEventListener<K extends keyof CustomFieldEventMap>(
168
168
  type: K,
169
169
  listener: (this: CustomField, ev: CustomFieldEventMap[K]) => void,
170
- options?: boolean | EventListenerOptions,
170
+ options?: EventListenerOptions | boolean,
171
171
  ): void;
172
172
  }
173
173
 
package/web-types.json ADDED
@@ -0,0 +1,210 @@
1
+ {
2
+ "$schema": "https://json.schemastore.org/web-types",
3
+ "name": "@vaadin/custom-field",
4
+ "version": "23.2.0-alpha4",
5
+ "description-markup": "markdown",
6
+ "contributions": {
7
+ "html": {
8
+ "elements": [
9
+ {
10
+ "name": "vaadin-custom-field",
11
+ "description": "`<vaadin-custom-field>` is a web component for wrapping multiple components as a single field.\n\n```\n<vaadin-custom-field label=\"Appointment time\">\n <vaadin-date-picker></vaadin-date-picker>\n <vaadin-time-picker></vaadin-time-picker>\n</vaadin-custom-field>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`invalid` | Set when the element is invalid | :host\n`focused` | Set when the element is focused | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/ds/customization/styling-components) documentation.",
12
+ "attributes": [
13
+ {
14
+ "name": "label",
15
+ "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
16
+ "value": {
17
+ "type": [
18
+ "string",
19
+ "null",
20
+ "undefined"
21
+ ]
22
+ }
23
+ },
24
+ {
25
+ "name": "invalid",
26
+ "description": "Set to true when the field is invalid.",
27
+ "value": {
28
+ "type": [
29
+ "boolean",
30
+ "null",
31
+ "undefined"
32
+ ]
33
+ }
34
+ },
35
+ {
36
+ "name": "required",
37
+ "description": "Specifies that the user must fill in a value.",
38
+ "value": {
39
+ "type": [
40
+ "boolean",
41
+ "null",
42
+ "undefined"
43
+ ]
44
+ }
45
+ },
46
+ {
47
+ "name": "error-message",
48
+ "description": "Error to show when the field is invalid.",
49
+ "value": {
50
+ "type": [
51
+ "string",
52
+ "null",
53
+ "undefined"
54
+ ]
55
+ }
56
+ },
57
+ {
58
+ "name": "helper-text",
59
+ "description": "String used for the helper text.",
60
+ "value": {
61
+ "type": [
62
+ "string",
63
+ "null",
64
+ "undefined"
65
+ ]
66
+ }
67
+ },
68
+ {
69
+ "name": "name",
70
+ "description": "The name of the control, which is submitted with the form data.",
71
+ "value": {
72
+ "type": [
73
+ "string",
74
+ "null",
75
+ "undefined"
76
+ ]
77
+ }
78
+ },
79
+ {
80
+ "name": "value",
81
+ "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.0-alpha4/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
82
+ "value": {
83
+ "type": [
84
+ "string",
85
+ "null",
86
+ "undefined"
87
+ ]
88
+ }
89
+ },
90
+ {
91
+ "name": "theme",
92
+ "description": "The theme variants to apply to the component.",
93
+ "value": {
94
+ "type": [
95
+ "string",
96
+ "null",
97
+ "undefined"
98
+ ]
99
+ }
100
+ }
101
+ ],
102
+ "js": {
103
+ "properties": [
104
+ {
105
+ "name": "label",
106
+ "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
107
+ "value": {
108
+ "type": [
109
+ "string",
110
+ "null",
111
+ "undefined"
112
+ ]
113
+ }
114
+ },
115
+ {
116
+ "name": "invalid",
117
+ "description": "Set to true when the field is invalid.",
118
+ "value": {
119
+ "type": [
120
+ "boolean",
121
+ "null",
122
+ "undefined"
123
+ ]
124
+ }
125
+ },
126
+ {
127
+ "name": "required",
128
+ "description": "Specifies that the user must fill in a value.",
129
+ "value": {
130
+ "type": [
131
+ "boolean",
132
+ "null",
133
+ "undefined"
134
+ ]
135
+ }
136
+ },
137
+ {
138
+ "name": "errorMessage",
139
+ "description": "Error to show when the field is invalid.",
140
+ "value": {
141
+ "type": [
142
+ "string",
143
+ "null",
144
+ "undefined"
145
+ ]
146
+ }
147
+ },
148
+ {
149
+ "name": "helperText",
150
+ "description": "String used for the helper text.",
151
+ "value": {
152
+ "type": [
153
+ "string",
154
+ "null",
155
+ "undefined"
156
+ ]
157
+ }
158
+ },
159
+ {
160
+ "name": "name",
161
+ "description": "The name of the control, which is submitted with the form data.",
162
+ "value": {
163
+ "type": [
164
+ "string",
165
+ "null",
166
+ "undefined"
167
+ ]
168
+ }
169
+ },
170
+ {
171
+ "name": "value",
172
+ "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.0-alpha4/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
173
+ "value": {
174
+ "type": [
175
+ "string",
176
+ "null",
177
+ "undefined"
178
+ ]
179
+ }
180
+ },
181
+ {
182
+ "name": "i18n",
183
+ "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure:\n\n```\n{\n // A function to format given `Array` as\n // component value. Array is list of all internal values\n // in the order of their presence in the DOM\n // This function is called each time the internal input\n // value is changed.\n formatValue: inputValues => {\n // returns a representation of the given array of values\n // in the form of string with delimiter characters\n },\n\n // A function to parse the given value to an `Array` in the format\n // of the list of all internal values\n // in the order of their presence in the DOM\n // This function is called when value of the\n // custom field is set.\n parseValue: value => {\n // returns the array of values from parsed value string.\n }\n}\n```",
184
+ "value": {
185
+ "type": [
186
+ "CustomFieldI18n"
187
+ ]
188
+ }
189
+ }
190
+ ],
191
+ "events": [
192
+ {
193
+ "name": "validated",
194
+ "description": "Fired whenever the field is validated."
195
+ },
196
+ {
197
+ "name": "change",
198
+ "description": "Fired when the user commits a value change for any of the internal inputs."
199
+ },
200
+ {
201
+ "name": "value-changed",
202
+ "description": "Fired when the `value` property changes."
203
+ }
204
+ ]
205
+ }
206
+ }
207
+ ]
208
+ }
209
+ }
210
+ }
package/web-types.lit.json ADDED
@@ -0,0 +1,104 @@
1
+ {
2
+ "$schema": "https://json.schemastore.org/web-types",
3
+ "name": "@vaadin/custom-field",
4
+ "version": "23.2.0-alpha4",
5
+ "description-markup": "markdown",
6
+ "framework": "lit",
7
+ "framework-config": {
8
+ "enable-when": {
9
+ "node-packages": [
10
+ "lit"
11
+ ]
12
+ }
13
+ },
14
+ "contributions": {
15
+ "html": {
16
+ "elements": [
17
+ {
18
+ "name": "vaadin-custom-field",
19
+ "description": "`<vaadin-custom-field>` is a web component for wrapping multiple components as a single field.\n\n```\n<vaadin-custom-field label=\"Appointment time\">\n <vaadin-date-picker></vaadin-date-picker>\n <vaadin-time-picker></vaadin-time-picker>\n</vaadin-custom-field>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n---------------------|----------------\n`label` | The slotted label element wrapper\n`helper-text` | The slotted helper text element wrapper\n`error-message` | The slotted error message element wrapper\n`required-indicator` | The `required` state indicator element\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n--------------------|-------------------------------------------|------------\n`disabled` | Set when the element is disabled | :host\n`invalid` | Set when the element is invalid | :host\n`focused` | Set when the element is focused | :host\n`has-label` | Set when the element has a label | :host\n`has-value` | Set when the element has a value | :host\n`has-helper` | Set when the element has helper text | :host\n`has-error-message` | Set when the element has an error message | :host\n\nSee [Styling Components](https://vaadin.com/docs/latest/ds/customization/styling-components) documentation.",
20
+ "extension": true,
21
+ "attributes": [
22
+ {
23
+ "name": "?invalid",
24
+ "description": "Set to true when the field is invalid.",
25
+ "value": {
26
+ "kind": "expression"
27
+ }
28
+ },
29
+ {
30
+ "name": "?required",
31
+ "description": "Specifies that the user must fill in a value.",
32
+ "value": {
33
+ "kind": "expression"
34
+ }
35
+ },
36
+ {
37
+ "name": ".label",
38
+ "description": "The label text for the input node.\nWhen no light dom defined via [slot=label], this value will be used.",
39
+ "value": {
40
+ "kind": "expression"
41
+ }
42
+ },
43
+ {
44
+ "name": ".errorMessage",
45
+ "description": "Error to show when the field is invalid.",
46
+ "value": {
47
+ "kind": "expression"
48
+ }
49
+ },
50
+ {
51
+ "name": ".helperText",
52
+ "description": "String used for the helper text.",
53
+ "value": {
54
+ "kind": "expression"
55
+ }
56
+ },
57
+ {
58
+ "name": ".name",
59
+ "description": "The name of the control, which is submitted with the form data.",
60
+ "value": {
61
+ "kind": "expression"
62
+ }
63
+ },
64
+ {
65
+ "name": ".value",
66
+ "description": "The value of the field. When wrapping several inputs, it will contain `\\t`\n(Tab character) as a delimiter indicating parts intended to be used as the\ncorresponding inputs values. Use the [`i18n`](https://cdn.vaadin.com/vaadin-web-components/23.2.0-alpha4/#/elements/vaadin-custom-field#property-i18n)\nproperty to customize this behavior.",
67
+ "value": {
68
+ "kind": "expression"
69
+ }
70
+ },
71
+ {
72
+ "name": ".i18n",
73
+ "description": "The object used to localize this component.\nTo change the default localization, replace the entire\n_i18n_ object or just the property you want to modify.\n\nThe object has the following JSON structure:\n\n```\n{\n // A function to format given `Array` as\n // component value. Array is list of all internal values\n // in the order of their presence in the DOM\n // This function is called each time the internal input\n // value is changed.\n formatValue: inputValues => {\n // returns a representation of the given array of values\n // in the form of string with delimiter characters\n },\n\n // A function to parse the given value to an `Array` in the format\n // of the list of all internal values\n // in the order of their presence in the DOM\n // This function is called when value of the\n // custom field is set.\n parseValue: value => {\n // returns the array of values from parsed value string.\n }\n}\n```",
74
+ "value": {
75
+ "kind": "expression"
76
+ }
77
+ },
78
+ {
79
+ "name": "@validated",
80
+ "description": "Fired whenever the field is validated.",
81
+ "value": {
82
+ "kind": "expression"
83
+ }
84
+ },
85
+ {
86
+ "name": "@change",
87
+ "description": "Fired when the user commits a value change for any of the internal inputs.",
88
+ "value": {
89
+ "kind": "expression"
90
+ }
91
+ },
92
+ {
93
+ "name": "@value-changed",
94
+ "description": "Fired when the `value` property changes.",
95
+ "value": {
96
+ "kind": "expression"
97
+ }
98
+ }
99
+ ]
100
+ }
101
+ ]
102
+ }
103
+ }
104
+ }