@adyen/bento-vue2 1.5.0 → 1.6.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -650,31 +650,22 @@
           "description": "",
           "attributes": [
             {
-              "name": "actions",
-              "description": "List of actions that will be used to render the buttons.\nFirst element in the list will be rendered as \"primary\".\nAll elements after the first will be rendered as \"secondary\".\nBut you may change the color of 1-st action to red with 'critial' key\nNot more than 3 action buttons can be provided\nOr 2 action buttons and 1 Label for them\n\nEach object in the list should have a `title`, an `event` and\n(optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n\n`title`: Button's text.\n\n`event`: Event triggered when clicking the Button.\n\n`icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n\n```\n[{\n  title: 'Primary',2\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
-              "value": {
-                "kind": "expression",
-                "type": "BentoButtonActionsList"
-              },
-              "default": "null"
-            },
-            {
-              "name": "columnsSize",
-              "description": "If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.",
+              "name": "modalRole",
+              "description": "Defines whether the modal will be an alert modal",
               "value": {
                 "kind": "expression",
-                "type": "BentoModalColumnLayoutVariant"
+                "type": "string"
               },
-              "default": "BentoModalColumnLayoutVariant.SMALLER"
+              "default": "BentoModalRole.DIALOG"
             },
             {
-              "name": "customPadding",
-              "description": "If provided, manages the padding of the whole modal container",
+              "name": "isDismissible",
+              "required": true,
+              "description": "If set to true, it allows the modal to be closed by clicking outside of it",
               "value": {
                 "kind": "expression",
-                "type": "string"
-              },
-              "default": "null"
+                "type": "boolean"
+              }
             },
             {
               "name": "hideCloseButton",
@@ -686,62 +677,53 @@
               }
             },
             {
-              "name": "initiallyOpen",
-              "description": "Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.",
+              "name": "customPadding",
+              "description": "If provided, manages the padding of the whole modal container",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "string"
               },
-              "default": "false"
-            },
-            {
-              "name": "isDismissible",
-              "required": true,
-              "description": "If set to true, it allows the modal to be closed by clicking outside of it",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              }
+              "default": "null"
             },
             {
-              "name": "isOpen",
-              "required": true,
-              "description": "Controls the modal's state from the outside. Set it to true to open the modal",
+              "name": "withColumnLayout",
+              "description": "If provided, renders the modal's content in a two-column layout an wth dividers separating its content",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
-              }
+              },
+              "default": "false"
             },
             {
-              "name": "modalRole",
-              "description": "Defines whether the modal will be an alert modal",
+              "name": "columnsSize",
+              "description": "If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "BentoModalColumnLayoutVariant"
               },
-              "default": "BentoModalRole.DIALOG"
+              "default": "BentoModalColumnLayoutVariant.SMALLER"
             },
             {
-              "name": "overflowVisible",
-              "description": "Allows the inner elments to overflow the dialog",
+              "name": "isOpen",
+              "required": true,
+              "description": "Controls the modal's state from the outside. Set it to true to open the modal",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
-              },
-              "default": "false"
+              }
             },
             {
               "name": "size",
               "description": "Sets the width of the modal",
               "value": {
                 "kind": "expression",
-                "type": "BentoModalSize | `${BentoModalSize}`"
+                "type": "BentoModalSize"
               },
               "default": "BentoModalSize.SMALL"
             },
             {
-              "name": "withColumnLayout",
-              "description": "If provided, renders the modal's content in a two-column layout an wth dividers separating its content",
+              "name": "initiallyOpen",
+              "description": "Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -767,7 +749,7 @@
             }
           ],
           "source": {
-            "module": "./src/components/modal/components/base-modal/base-modal.vue",
+            "module": "./src/components/modal/components/base-modal/__mocks__/base-modal.vue",
             "symbol": "default"
           }
         },
@@ -776,31 +758,22 @@
           "description": "",
           "attributes": [
             {
-              "name": "modalRole",
-              "description": "Defines whether the modal will be an alert modal",
+              "name": "actions",
+              "description": "List of actions that will be used to render the buttons.\nFirst element in the list will be rendered as \"primary\".\nAll elements after the first will be rendered as \"secondary\".\nBut you may change the color of 1-st action to red with 'critial' key\nNot more than 3 action buttons can be provided\nOr 2 action buttons and 1 Label for them\n\nEach object in the list should have a `title`, an `event` and\n(optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n\n`title`: Button's text.\n\n`event`: Event triggered when clicking the Button.\n\n`icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n\n```\n[{\n  title: 'Primary',2\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "BentoButtonActionsList"
               },
-              "default": "BentoModalRole.DIALOG"
-            },
-            {
-              "name": "isDismissible",
-              "required": true,
-              "description": "If set to true, it allows the modal to be closed by clicking outside of it",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              }
+              "default": "null"
             },
             {
-              "name": "hideCloseButton",
-              "required": true,
-              "description": "Hides a cross icon on the right side of the title",
+              "name": "columnsSize",
+              "description": "If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
-              }
+                "type": "BentoModalColumnLayoutVariant"
+              },
+              "default": "BentoModalColumnLayoutVariant.SMALLER"
             },
             {
               "name": "customPadding",
@@ -812,8 +785,17 @@
               "default": "null"
             },
             {
-              "name": "withColumnLayout",
-              "description": "If provided, renders the modal's content in a two-column layout an wth dividers separating its content",
+              "name": "hideCloseButton",
+              "required": true,
+              "description": "Hides a cross icon on the right side of the title",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
+            },
+            {
+              "name": "initiallyOpen",
+              "description": "Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -821,13 +803,13 @@
               "default": "false"
             },
             {
-              "name": "columnsSize",
-              "description": "If a column layout is provided, it renders the respective left column width variant. This can be smaller than the second column, the same size as the second column or bigger than the second column.",
+              "name": "isDismissible",
+              "required": true,
+              "description": "If set to true, it allows the modal to be closed by clicking outside of it",
               "value": {
                 "kind": "expression",
-                "type": "BentoModalColumnLayoutVariant"
-              },
-              "default": "BentoModalColumnLayoutVariant.SMALLER"
+                "type": "boolean"
+              }
             },
             {
               "name": "isOpen",
@@ -838,18 +820,36 @@
                 "type": "boolean"
               }
             },
+            {
+              "name": "modalRole",
+              "description": "Defines whether the modal will be an alert modal",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "BentoModalRole.DIALOG"
+            },
+            {
+              "name": "overflowVisible",
+              "description": "Allows the inner elments to overflow the dialog",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "size",
               "description": "Sets the width of the modal",
               "value": {
                 "kind": "expression",
-                "type": "BentoModalSize"
+                "type": "BentoModalSize | `${BentoModalSize}`"
               },
               "default": "BentoModalSize.SMALL"
             },
             {
-              "name": "initiallyOpen",
-              "description": "Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.",
+              "name": "withColumnLayout",
+              "description": "If provided, renders the modal's content in a two-column layout an wth dividers separating its content",
               "value": {
                 "kind": "expression",
                 "type": "boolean"
@@ -875,7 +875,7 @@
             }
           ],
           "source": {
-            "module": "./src/components/modal/components/base-modal/__mocks__/base-modal.vue",
+            "module": "./src/components/modal/components/base-modal/base-modal.vue",
             "symbol": "default"
           }
         },
@@ -1811,13 +1811,22 @@
             },
             {
               "name": "filters",
-              "description": "filter-bar value (i.e. filters) that will be passed down to inner filter-bar component",
+              "description": "filter-bar value (i.e. filters) that will be passed down to inner filter-bar component\n{@see BentoFilterBarModel}",
               "value": {
                 "kind": "expression",
                 "type": "BentoFilterBar.props.value.type"
               },
               "default": "undefined"
             },
+            {
+              "name": "filterValues",
+              "description": "An array of the values for each filter set in `value`.\n{@see BentoFilterValues}",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterBar.props.filterValues.type"
+              },
+              "default": "() => []"
+            },
             {
               "name": "filterSearchTerm",
               "description": "Filter bar search term useful to filter all the data by text",
@@ -2688,12 +2697,21 @@
             },
             {
               "name": "value",
-              "description": "Array of filters based on {@see FilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.\n\nCan be used with v-model or independently with the @input event.",
+              "description": "Array of filters based on {@see BentoFilterBarModel}.\nEach one of the elements in the array correspond to a filter that will\nbe created and rendered in the FilterBar.\n\nCan be used with v-model or independently with the @input event.",
               "value": {
                 "kind": "expression",
                 "type": "BentoFilterBarModel"
               },
               "default": "() => []"
+            },
+            {
+              "name": "filterValues",
+              "description": "An array of the values for each filter in the filter bar.\n{@see BentoFilterValues}",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFilterValues"
+              },
+              "default": "() => []"
             }
           ],
           "source": {
@@ -3442,6 +3460,15 @@
               },
               "default": "false"
             },
+            {
+              "name": "initiallyOpen",
+              "description": "Sets the open attribute on the dialog element, use isOpen instead to toggle modal visbility.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
             {
               "name": "actions",
               "description": "List of actions that will be used to render the buttons.\nFirst element in the list will be rendered as \"primary\".\nAll elements after the first will be rendered as \"secondary\".\n\nEach object in the list should have a `title`, an `event` and\n(optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n\n`title`: Button's text.\n\n`event`: Event triggered when clicking the Button.\n\n`icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n\n```\n[{\n  title: 'Primary',2\n  event: () => { ... },\n  icon: FourPeopleIcon\n}, {\n  title: 'Secondary',\n  event: () => { ... }\n}]\n```",
@@ -4505,10 +4532,10 @@
           "attributes": [
             {
               "name": "options",
-              "description": "List of options that are needed to setup the country filter\nAvailable options:\n  - multiple: If \"true\", the user will be able to select multiple items.\n  - listboxItems: The option elements to populate the filter with {@see BentoSelectCurrencyFilterOptions}",
+              "description": "List of options that are needed to setup the country filter\nAvailable options:\n  - multiple: If \"true\", the user will be able to select multiple items.\n  - listboxItems: The option elements to populate the filter with {@see BentoSelectCountryFilterOptions}\n  - variant: Which label variant to display for the option item.",
               "value": {
                 "kind": "expression",
-                "type": "BentoSelectCurrencyFilterOptions"
+                "type": "BentoSelectCountryFilterOptions"
               },
               "default": "undefined"
             }
@@ -4519,7 +4546,7 @@
             }
           ],
           "source": {
-            "module": "./src/components/filter-bar/components/select-filter/variants/select-currency-filter/select-currency-filter.vue",
+            "module": "./src/components/filter-bar/components/select-filter/variants/select-country-filter/select-country-filter.vue",
             "symbol": "default"
           }
         },
@@ -4529,10 +4556,10 @@
           "attributes": [
             {
               "name": "options",
-              "description": "List of options that are needed to setup the country filter\nAvailable options:\n  - multiple: If \"true\", the user will be able to select multiple items.\n  - listboxItems: The option elements to populate the filter with {@see BentoSelectCountryFilterOptions}\n  - variant: Which label variant to display for the option item.",
+              "description": "List of options that are needed to setup the country filter\nAvailable options:\n  - multiple: If \"true\", the user will be able to select multiple items.\n  - listboxItems: The option elements to populate the filter with {@see BentoSelectCurrencyFilterOptions}",
               "value": {
                 "kind": "expression",
-                "type": "BentoSelectCountryFilterOptions"
+                "type": "BentoSelectCurrencyFilterOptions"
               },
               "default": "undefined"
             }
@@ -4543,7 +4570,7 @@
             }
           ],
           "source": {
-            "module": "./src/components/filter-bar/components/select-filter/variants/select-country-filter/select-country-filter.vue",
+            "module": "./src/components/filter-bar/components/select-filter/variants/select-currency-filter/select-currency-filter.vue",
             "symbol": "default"
           }
         },
@@ -5283,142 +5310,6 @@
             "symbol": "default"
           }
         },
-        {
-          "name": "bento-textarea",
-          "description": "",
-          "attributes": [
-            {
-              "name": "ariaLabel",
-              "description": "Text that labels an the input element",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "undefined"
-            },
-            {
-              "name": "characterLimit",
-              "description": "Text that shows number of characters in textarea",
-              "value": {
-                "kind": "expression",
-                "type": "number"
-              },
-              "default": "undefined"
-            },
-            {
-              "name": "description",
-              "description": "Text displayed as the help text of the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "disabled",
-              "description": "Disables the possibility of changing value in the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "clearable",
-              "description": "If set to true, shows a button to clear all the text",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "errorMessage",
-              "description": "Adds error text",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "height",
-              "description": "Sets the height of the textarea, e.g 200px OR 20vh",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "null"
-            },
-            {
-              "name": "label",
-              "description": "Text displayed as the label of the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "optional",
-              "description": "Highlights the textarea is optional.",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "placeholder",
-              "description": "Text displayed as the placeholder of the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "''"
-            },
-            {
-              "name": "readonly",
-              "description": "Set the textarea to read only state.",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "resizable",
-              "description": "Indicates the possibility of resize the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "BentoTextareaResizeOption | `${BentoTextareaResizeOption}`"
-              },
-              "default": "BentoTextareaResizeOption.BOTH"
-            },
-            {
-              "name": "required",
-              "description": "Highlights the textarea is required.",
-              "value": {
-                "kind": "expression",
-                "type": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "name": "value",
-              "description": "Text displayed as the value of the textarea",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              },
-              "default": "''"
-            }
-          ],
-          "source": {
-            "module": "./src/components/textarea/textarea.vue",
-            "symbol": "default"
-          }
-        },
         {
           "name": "bento-timeline",
           "description": "Timeline displays a collection of events in a reverse chronological order (newest event is displayed on the top).",
@@ -7015,6 +6906,27 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "fixed-scroller",
+          "description": "",
+          "slots": [
+            {
+              "name": "default"
+            }
+          ],
+          "source": {
+            "module": "./src/components/internal/fixed-scroller/fixed-scroller.vue",
+            "symbol": "default"
+          }
+        },
+        {
+          "name": "fixed-scroller-stub",
+          "description": "",
+          "source": {
+            "module": "./src/components/internal/fixed-scroller/__tests__/fixed-scroller-stub.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "focus-trap-mock",
           "description": "",
@@ -7105,6 +7017,17 @@
         {
           "name": "form-layout-field-tip",
           "description": "",
+          "attributes": [
+            {
+              "name": "type",
+              "description": "Type of a alert; set a distinctive icon and color. Defaults to highlight.",
+              "value": {
+                "kind": "expression",
+                "type": "BentoFormLayoutFieldTipTypeOption"
+              },
+              "default": "'highlight'"
+            }
+          ],
           "slots": [
             {
               "name": "default"
@@ -7647,7 +7570,7 @@
               "description": "Optional icon displayed to the left of the menu-item",
               "value": {
                 "kind": "expression",
-                "type": "VueNodeElement"
+                "type": "BentoMenuItem['icon']"
               },
               "default": "null"
             },
@@ -7738,6 +7661,14 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "modal-with-date-picker-stub",
+          "description": "",
+          "source": {
+            "module": "./src/components/modal/__tests__/modal-with-date-picker-stub.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "pagination.test",
           "description": "",
@@ -8659,6 +8590,142 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "textarea",
+          "description": "",
+          "attributes": [
+            {
+              "name": "ariaLabel",
+              "description": "Text that labels an the input element",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "undefined"
+            },
+            {
+              "name": "characterLimit",
+              "description": "Text that shows number of characters in textarea",
+              "value": {
+                "kind": "expression",
+                "type": "number"
+              },
+              "default": "undefined"
+            },
+            {
+              "name": "description",
+              "description": "Text displayed as the help text of the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "disabled",
+              "description": "Disables the possibility of changing value in the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "clearable",
+              "description": "If set to true, shows a button to clear all the text",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "errorMessage",
+              "description": "Adds error text",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "height",
+              "description": "Sets the height of the textarea, e.g 200px OR 20vh",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "null"
+            },
+            {
+              "name": "label",
+              "description": "Text displayed as the label of the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "optional",
+              "description": "Highlights the textarea is optional.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "placeholder",
+              "description": "Text displayed as the placeholder of the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
+            },
+            {
+              "name": "readonly",
+              "description": "Set the textarea to read only state.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "resizable",
+              "description": "Indicates the possibility of resize the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "BentoTextareaResizeOption | `${BentoTextareaResizeOption}`"
+              },
+              "default": "BentoTextareaResizeOption.BOTH"
+            },
+            {
+              "name": "required",
+              "description": "Highlights the textarea is required.",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "name": "value",
+              "description": "Text displayed as the value of the textarea",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "''"
+            }
+          ],
+          "source": {
+            "module": "./src/components/textarea/textarea.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "timeline-stub",
           "description": "",