@vaadin/multi-select-combo-box 25.3.0-dev.3a3c2d7d2a → 25.3.0

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 (12) hide show
  1. package/custom-elements.json +177 -54
  2. package/package.json +15 -15
  3. package/src/vaadin-multi-select-combo-box-chip.js +1 -0
  4. package/src/vaadin-multi-select-combo-box-item.js +4 -1
  5. package/src/vaadin-multi-select-combo-box-mixin.d.ts +0 -14
  6. package/src/vaadin-multi-select-combo-box-mixin.js +59 -122
  7. package/src/vaadin-multi-select-combo-box-overlay.js +1 -0
  8. package/src/vaadin-multi-select-combo-box-scroller.js +7 -3
  9. package/src/vaadin-multi-select-combo-box.d.ts +53 -6
  10. package/src/vaadin-multi-select-combo-box.js +54 -6
  11. package/web-types.json +47 -13
  12. package/web-types.lit.json +20 -6
package/web-types.json CHANGED
@@ -1,18 +1,27 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/multi-select-combo-box",
4
- "version": "25.3.0-dev.3a3c2d7d2a",
4
+ "version": "25.3.0",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
8
8
  "elements": [
9
9
  {
10
10
  "name": "vaadin-multi-select-combo-box",
11
- "description": "`<vaadin-multi-select-combo-box>` is a web component that wraps `<vaadin-combo-box>` and extends\nits functionality to allow selecting multiple items, in addition to basic features.\n\n```html\n<vaadin-multi-select-combo-box id=\"comboBox\"></vaadin-multi-select-combo-box>\n```\n```js\nconst comboBox = document.querySelector('#comboBox');\ncomboBox.items = ['apple', 'banana', 'lemon', 'orange'];\ncomboBox.selectedItems = ['lemon', 'orange'];\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-----------------------|----------------\n`chips` | The element that wraps slotted chips for selected items\n`label` | The label element\n`input-field` | The element that wraps prefix, value and suffix\n`field-button` | Set on both clear and toggle buttons\n`clear-button` | The clear button\n`error-message` | The error message element\n`helper-text` | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n`toggle-button` | The toggle button\n`overlay` | The overlay container\n`content` | The overlay content\n`loader` | The loading indicator shown while loading items\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------------|-----------------\n`disabled` | Set to a disabled element\n`has-value` | Set when the element has a value\n`has-label` | Set when the element has a label\n`has-helper` | Set when the element has helper text or slot\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n`invalid` | Set when the element is invalid\n`focused` | Set when the element is focused\n`focus-ring` | Set when the element is keyboard focused\n`loading` | Set when loading items from the data provider\n`opened` | Set when the dropdown is open\n`readonly` | Set to a readonly element\n\nThe following custom CSS properties are available for styling:\n\nCustom property | Description | Default\n-----------------------------------------------------|----------------------------|--------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n`--vaadin-multi-select-combo-box-overlay-width` | Width of the overlay | `auto`\n`--vaadin-multi-select-combo-box-overlay-max-height` | Max height of the overlay | `65vh`\n`--vaadin-multi-select-combo-box-input-min-width` | Min width of the input | `4em`\n\n### Internal components\n\nIn addition to `<vaadin-multi-select-combo-box>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-multi-select-combo-box-chip>`\n- `<vaadin-multi-select-combo-box-item>` - has the same API as `<vaadin-item>`.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
11
+ "description": "`<vaadin-multi-select-combo-box>` is a web component that wraps `<vaadin-combo-box>` and extends\nits functionality to allow selecting multiple items, in addition to basic features.\n\n```html\n<vaadin-multi-select-combo-box id=\"comboBox\"></vaadin-multi-select-combo-box>\n```\n```js\nconst comboBox = document.querySelector('#comboBox');\ncomboBox.items = ['apple', 'banana', 'lemon', 'orange'];\ncomboBox.selectedItems = ['lemon', 'orange'];\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-----------------------|----------------\n`chips` | The element that wraps slotted chips for selected items\n`label` | The label element\n`input-field` | The element that wraps prefix, value and suffix\n`field-button` | Set on both clear and toggle buttons\n`clear-button` | The clear button\n`error-message` | The error message element\n`helper-text` | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n`toggle-button` | The toggle button\n`overlay` | The overlay container\n`content` | The overlay content\n`loader` | The loading indicator shown while loading items\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------------|-----------------\n`disabled` | Set to a disabled element\n`has-value` | Set when the element has a value\n`has-label` | Set when the element has a label\n`has-helper` | Set when the element has helper text or slot\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n`invalid` | Set when the element is invalid\n`focused` | Set when the element is focused\n`focus-ring` | Set when the element is keyboard focused\n`loading` | Set when loading items from the data provider\n`opened` | Set when the dropdown is open\n`readonly` | Set to a readonly element\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:-------------------------------------------------------|\n| `--vaadin-chip-background` |\n| `--vaadin-chip-border-color` |\n| `--vaadin-chip-border-radius` |\n| `--vaadin-chip-border-width` |\n| `--vaadin-chip-font-size` |\n| `--vaadin-chip-font-weight` |\n| `--vaadin-chip-gap` |\n| `--vaadin-chip-height` |\n| `--vaadin-chip-padding` |\n| `--vaadin-chip-remove-button-text-color` |\n| `--vaadin-chip-text-color` |\n| `--vaadin-field-default-width` |\n| `--vaadin-input-field-background` |\n| `--vaadin-input-field-border-color` |\n| `--vaadin-input-field-border-radius` |\n| `--vaadin-input-field-border-width` |\n| `--vaadin-input-field-bottom-end-radius` |\n| `--vaadin-input-field-bottom-start-radius` |\n| `--vaadin-input-field-button-text-color` |\n| `--vaadin-input-field-container-gap` |\n| `--vaadin-input-field-disabled-background` |\n| `--vaadin-input-field-disabled-text-color` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-gap` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-padding` |\n| `--vaadin-input-field-placeholder-color` |\n| `--vaadin-input-field-required-indicator` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-top-end-radius` |\n| `--vaadin-input-field-top-start-radius` |\n| `--vaadin-input-field-value-color` |\n| `--vaadin-input-field-value-font-size` |\n| `--vaadin-input-field-value-font-weight` |\n| `--vaadin-input-field-value-line-height` |\n| `--vaadin-item-overlay-padding` |\n| `--vaadin-multi-select-combo-box-chip-min-width` |\n| `--vaadin-multi-select-combo-box-chips-gap` |\n| `--vaadin-multi-select-combo-box-input-min-width` |\n| `--vaadin-multi-select-combo-box-overlay-max-height` |\n| `--vaadin-multi-select-combo-box-overlay-width` |\n\n### Internal components\n\nIn addition to `<vaadin-multi-select-combo-box>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-multi-select-combo-box-chip>`\n- `<vaadin-multi-select-combo-box-item>` - has the same API as `<vaadin-item>`.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
12
12
  "attributes": [
13
+ {
14
+ "name": "accessible-description-ref",
15
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
16
+ "value": {
17
+ "type": [
18
+ "string"
19
+ ]
20
+ }
21
+ },
13
22
  {
14
23
  "name": "accessible-name",
15
- "description": "String used to label the component to screen reader users.",
24
+ "description": "String used to label the component for screen reader users.",
16
25
  "value": {
17
26
  "type": [
18
27
  "string"
@@ -21,7 +30,7 @@
21
30
  },
22
31
  {
23
32
  "name": "accessible-name-ref",
24
- "description": "Id of the element used as label of the component to screen reader users.",
33
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
25
34
  "value": {
26
35
  "type": [
27
36
  "string"
@@ -93,7 +102,7 @@
93
102
  },
94
103
  {
95
104
  "name": "clear-button-visible",
96
- "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
105
+ "description": "Set to true to display the clear icon which clears the input.\nThis also enables clearing the input when pressing Esc key.",
97
106
  "value": {
98
107
  "type": [
99
108
  "boolean"
@@ -156,7 +165,7 @@
156
165
  },
157
166
  {
158
167
  "name": "item-id-path",
159
- "description": "Path for the id of the item, used to detect whether the item is selected.",
168
+ "description": "Path for the id of the item. If `items` is an array of objects,\nthe `itemIdPath` is used to compare and identify the same item\nin the selection and in `filteredItems` (items given by the\n`dataProvider` callback).",
160
169
  "value": {
161
170
  "type": [
162
171
  "string"
@@ -244,6 +253,15 @@
244
253
  ]
245
254
  }
246
255
  },
256
+ {
257
+ "name": "partial-match-mode",
258
+ "description": "Controls which item is automatically set to be selected, for\nexample on Enter, when the typed filter only partially matches\nits label. The item that will be selected is highlighted in the\ndropdown while typing:\n\n- `none` (default): an item is automatically set to be selected only when the filter matches its label exactly.\n- `first-match`: the first item in the filtered results is automatically set to be selected.\n- `only-match`: the item is automatically set to be selected when filtering narrows the results to a single item.\n\nIn general, an exact match is always set to be selected and takes\nprecedence over partial matches, regardless of the mode.\n\nA partial match is only applied while the dropdown is open. For\nexample, when auto-open is disabled with `autoOpenDisabled`, typing\ndoes not highlight a match or set it to be selected until the\ndropdown is opened.\n\nThis feature cannot be used together with custom values, because a\npartial match is also a valid custom value. A partial match is not\napplied when custom values are allowed with `allowCustomValue`.",
259
+ "value": {
260
+ "type": [
261
+ "string"
262
+ ]
263
+ }
264
+ },
247
265
  {
248
266
  "name": "placeholder",
249
267
  "description": "A hint to the user of what can be entered in the control.\nThe placeholder will be only displayed in the case when\nthere is no item selected.",
@@ -294,9 +312,7 @@
294
312
  "description": "The theme variants to apply to the component.",
295
313
  "value": {
296
314
  "type": [
297
- "string",
298
- "null",
299
- "undefined"
315
+ "string"
300
316
  ]
301
317
  }
302
318
  },
@@ -312,9 +328,18 @@
312
328
  ],
313
329
  "js": {
314
330
  "properties": [
331
+ {
332
+ "name": "accessibleDescriptionRef",
333
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
334
+ "value": {
335
+ "type": [
336
+ "string"
337
+ ]
338
+ }
339
+ },
315
340
  {
316
341
  "name": "accessibleName",
317
- "description": "String used to label the component to screen reader users.",
342
+ "description": "String used to label the component for screen reader users.",
318
343
  "value": {
319
344
  "type": [
320
345
  "string"
@@ -323,7 +348,7 @@
323
348
  },
324
349
  {
325
350
  "name": "accessibleNameRef",
326
- "description": "Id of the element used as label of the component to screen reader users.",
351
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
327
352
  "value": {
328
353
  "type": [
329
354
  "string"
@@ -395,7 +420,7 @@
395
420
  },
396
421
  {
397
422
  "name": "clearButtonVisible",
398
- "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
423
+ "description": "Set to true to display the clear icon which clears the input.\nThis also enables clearing the input when pressing Esc key.",
399
424
  "value": {
400
425
  "type": [
401
426
  "boolean"
@@ -497,7 +522,7 @@
497
522
  },
498
523
  {
499
524
  "name": "itemIdPath",
500
- "description": "Path for the id of the item, used to detect whether the item is selected.",
525
+ "description": "Path for the id of the item. If `items` is an array of objects,\nthe `itemIdPath` is used to compare and identify the same item\nin the selection and in `filteredItems` (items given by the\n`dataProvider` callback).",
501
526
  "value": {
502
527
  "type": [
503
528
  "string"
@@ -605,6 +630,15 @@
605
630
  ]
606
631
  }
607
632
  },
633
+ {
634
+ "name": "partialMatchMode",
635
+ "description": "Controls which item is automatically set to be selected, for\nexample on Enter, when the typed filter only partially matches\nits label. The item that will be selected is highlighted in the\ndropdown while typing:\n\n- `none` (default): an item is automatically set to be selected only when the filter matches its label exactly.\n- `first-match`: the first item in the filtered results is automatically set to be selected.\n- `only-match`: the item is automatically set to be selected when filtering narrows the results to a single item.\n\nIn general, an exact match is always set to be selected and takes\nprecedence over partial matches, regardless of the mode.\n\nA partial match is only applied while the dropdown is open. For\nexample, when auto-open is disabled with `autoOpenDisabled`, typing\ndoes not highlight a match or set it to be selected until the\ndropdown is opened.\n\nThis feature cannot be used together with custom values, because a\npartial match is also a valid custom value. A partial match is not\napplied when custom values are allowed with `allowCustomValue`.",
636
+ "value": {
637
+ "type": [
638
+ "string"
639
+ ]
640
+ }
641
+ },
608
642
  {
609
643
  "name": "placeholder",
610
644
  "description": "A hint to the user of what can be entered in the control.\nThe placeholder will be only displayed in the case when\nthere is no item selected.",
package/web-types.lit.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/multi-select-combo-box",
4
- "version": "25.3.0-dev.3a3c2d7d2a",
4
+ "version": "25.3.0",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -16,19 +16,26 @@
16
16
  "elements": [
17
17
  {
18
18
  "name": "vaadin-multi-select-combo-box",
19
- "description": "`<vaadin-multi-select-combo-box>` is a web component that wraps `<vaadin-combo-box>` and extends\nits functionality to allow selecting multiple items, in addition to basic features.\n\n```html\n<vaadin-multi-select-combo-box id=\"comboBox\"></vaadin-multi-select-combo-box>\n```\n```js\nconst comboBox = document.querySelector('#comboBox');\ncomboBox.items = ['apple', 'banana', 'lemon', 'orange'];\ncomboBox.selectedItems = ['lemon', 'orange'];\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-----------------------|----------------\n`chips` | The element that wraps slotted chips for selected items\n`label` | The label element\n`input-field` | The element that wraps prefix, value and suffix\n`field-button` | Set on both clear and toggle buttons\n`clear-button` | The clear button\n`error-message` | The error message element\n`helper-text` | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n`toggle-button` | The toggle button\n`overlay` | The overlay container\n`content` | The overlay content\n`loader` | The loading indicator shown while loading items\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------------|-----------------\n`disabled` | Set to a disabled element\n`has-value` | Set when the element has a value\n`has-label` | Set when the element has a label\n`has-helper` | Set when the element has helper text or slot\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n`invalid` | Set when the element is invalid\n`focused` | Set when the element is focused\n`focus-ring` | Set when the element is keyboard focused\n`loading` | Set when loading items from the data provider\n`opened` | Set when the dropdown is open\n`readonly` | Set to a readonly element\n\nThe following custom CSS properties are available for styling:\n\nCustom property | Description | Default\n-----------------------------------------------------|----------------------------|--------\n`--vaadin-field-default-width` | Default width of the field | `12em`\n`--vaadin-multi-select-combo-box-overlay-width` | Width of the overlay | `auto`\n`--vaadin-multi-select-combo-box-overlay-max-height` | Max height of the overlay | `65vh`\n`--vaadin-multi-select-combo-box-input-min-width` | Min width of the input | `4em`\n\n### Internal components\n\nIn addition to `<vaadin-multi-select-combo-box>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-multi-select-combo-box-chip>`\n- `<vaadin-multi-select-combo-box-item>` - has the same API as `<vaadin-item>`.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
19
+ "description": "`<vaadin-multi-select-combo-box>` is a web component that wraps `<vaadin-combo-box>` and extends\nits functionality to allow selecting multiple items, in addition to basic features.\n\n```html\n<vaadin-multi-select-combo-box id=\"comboBox\"></vaadin-multi-select-combo-box>\n```\n```js\nconst comboBox = document.querySelector('#comboBox');\ncomboBox.items = ['apple', 'banana', 'lemon', 'orange'];\ncomboBox.selectedItems = ['lemon', 'orange'];\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-----------------------|----------------\n`chips` | The element that wraps slotted chips for selected items\n`label` | The label element\n`input-field` | The element that wraps prefix, value and suffix\n`field-button` | Set on both clear and toggle buttons\n`clear-button` | The clear button\n`error-message` | The error message element\n`helper-text` | The helper text element wrapper\n`required-indicator` | The `required` state indicator element\n`toggle-button` | The toggle button\n`overlay` | The overlay container\n`content` | The overlay content\n`loader` | The loading indicator shown while loading items\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------------|-----------------\n`disabled` | Set to a disabled element\n`has-value` | Set when the element has a value\n`has-label` | Set when the element has a label\n`has-helper` | Set when the element has helper text or slot\n`has-error-message` | Set when the element has an error message\n`has-tooltip` | Set when the element has a slotted tooltip\n`invalid` | Set when the element is invalid\n`focused` | Set when the element is focused\n`focus-ring` | Set when the element is keyboard focused\n`loading` | Set when loading items from the data provider\n`opened` | Set when the dropdown is open\n`readonly` | Set to a readonly element\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property |\n:-------------------------------------------------------|\n| `--vaadin-chip-background` |\n| `--vaadin-chip-border-color` |\n| `--vaadin-chip-border-radius` |\n| `--vaadin-chip-border-width` |\n| `--vaadin-chip-font-size` |\n| `--vaadin-chip-font-weight` |\n| `--vaadin-chip-gap` |\n| `--vaadin-chip-height` |\n| `--vaadin-chip-padding` |\n| `--vaadin-chip-remove-button-text-color` |\n| `--vaadin-chip-text-color` |\n| `--vaadin-field-default-width` |\n| `--vaadin-input-field-background` |\n| `--vaadin-input-field-border-color` |\n| `--vaadin-input-field-border-radius` |\n| `--vaadin-input-field-border-width` |\n| `--vaadin-input-field-bottom-end-radius` |\n| `--vaadin-input-field-bottom-start-radius` |\n| `--vaadin-input-field-button-text-color` |\n| `--vaadin-input-field-container-gap` |\n| `--vaadin-input-field-disabled-background` |\n| `--vaadin-input-field-disabled-text-color` |\n| `--vaadin-input-field-error-color` |\n| `--vaadin-input-field-error-font-size` |\n| `--vaadin-input-field-error-font-weight` |\n| `--vaadin-input-field-error-line-height` |\n| `--vaadin-input-field-gap` |\n| `--vaadin-input-field-helper-color` |\n| `--vaadin-input-field-helper-font-size` |\n| `--vaadin-input-field-helper-font-weight` |\n| `--vaadin-input-field-helper-line-height` |\n| `--vaadin-input-field-label-color` |\n| `--vaadin-input-field-label-font-size` |\n| `--vaadin-input-field-label-font-weight` |\n| `--vaadin-input-field-label-line-height` |\n| `--vaadin-input-field-padding` |\n| `--vaadin-input-field-placeholder-color` |\n| `--vaadin-input-field-required-indicator` |\n| `--vaadin-input-field-required-indicator-color` |\n| `--vaadin-input-field-top-end-radius` |\n| `--vaadin-input-field-top-start-radius` |\n| `--vaadin-input-field-value-color` |\n| `--vaadin-input-field-value-font-size` |\n| `--vaadin-input-field-value-font-weight` |\n| `--vaadin-input-field-value-line-height` |\n| `--vaadin-item-overlay-padding` |\n| `--vaadin-multi-select-combo-box-chip-min-width` |\n| `--vaadin-multi-select-combo-box-chips-gap` |\n| `--vaadin-multi-select-combo-box-input-min-width` |\n| `--vaadin-multi-select-combo-box-overlay-max-height` |\n| `--vaadin-multi-select-combo-box-overlay-width` |\n\n### Internal components\n\nIn addition to `<vaadin-multi-select-combo-box>` itself, the following internal\ncomponents are themable:\n\n- `<vaadin-multi-select-combo-box-chip>`\n- `<vaadin-multi-select-combo-box-item>` - has the same API as `<vaadin-item>`.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
20
20
  "extension": true,
21
21
  "attributes": [
22
+ {
23
+ "name": ".accessibleDescriptionRef",
24
+ "description": "A space-separated list of IDs referencing the elements that\ndescribe the component for screen reader users. The referenced\nelements are announced in addition to the helper text and\nthe error message.",
25
+ "value": {
26
+ "kind": "expression"
27
+ }
28
+ },
22
29
  {
23
30
  "name": ".accessibleName",
24
- "description": "String used to label the component to screen reader users.",
31
+ "description": "String used to label the component for screen reader users.",
25
32
  "value": {
26
33
  "kind": "expression"
27
34
  }
28
35
  },
29
36
  {
30
37
  "name": ".accessibleNameRef",
31
- "description": "Id of the element used as label of the component to screen reader users.",
38
+ "description": "A space-separated list of IDs referencing the elements that\nlabel the component for screen reader users.",
32
39
  "value": {
33
40
  "kind": "expression"
34
41
  }
@@ -84,7 +91,7 @@
84
91
  },
85
92
  {
86
93
  "name": "?clearButtonVisible",
87
- "description": "Set to true to display the clear icon which clears the input.\n\nIt is up to the component to choose where to place the clear icon:\nin the Shadow DOM or in the light DOM. In any way, a reference to\nthe clear icon element should be provided via the `clearElement` getter.",
94
+ "description": "Set to true to display the clear icon which clears the input.\nThis also enables clearing the input when pressing Esc key.",
88
95
  "value": {
89
96
  "kind": "expression"
90
97
  }
@@ -161,7 +168,7 @@
161
168
  },
162
169
  {
163
170
  "name": ".itemIdPath",
164
- "description": "Path for the id of the item, used to detect whether the item is selected.",
171
+ "description": "Path for the id of the item. If `items` is an array of objects,\nthe `itemIdPath` is used to compare and identify the same item\nin the selection and in `filteredItems` (items given by the\n`dataProvider` callback).",
165
172
  "value": {
166
173
  "kind": "expression"
167
174
  }
@@ -243,6 +250,13 @@
243
250
  "kind": "expression"
244
251
  }
245
252
  },
253
+ {
254
+ "name": ".partialMatchMode",
255
+ "description": "Controls which item is automatically set to be selected, for\nexample on Enter, when the typed filter only partially matches\nits label. The item that will be selected is highlighted in the\ndropdown while typing:\n\n- `none` (default): an item is automatically set to be selected only when the filter matches its label exactly.\n- `first-match`: the first item in the filtered results is automatically set to be selected.\n- `only-match`: the item is automatically set to be selected when filtering narrows the results to a single item.\n\nIn general, an exact match is always set to be selected and takes\nprecedence over partial matches, regardless of the mode.\n\nA partial match is only applied while the dropdown is open. For\nexample, when auto-open is disabled with `autoOpenDisabled`, typing\ndoes not highlight a match or set it to be selected until the\ndropdown is opened.\n\nThis feature cannot be used together with custom values, because a\npartial match is also a valid custom value. A partial match is not\napplied when custom values are allowed with `allowCustomValue`.",
256
+ "value": {
257
+ "kind": "expression"
258
+ }
259
+ },
246
260
  {
247
261
  "name": ".placeholder",
248
262
  "description": "A hint to the user of what can be entered in the control.\nThe placeholder will be only displayed in the case when\nthere is no item selected.",