@adyen/bento-vue3 1.108.3 → 2.0.0-rc.0

package/dist/@types/index.d.ts

@@ -15,6 +15,7 @@ import { ExtractPropTypes } from 'vue';
 import type { FlipOptions } from '@floating-ui/core';
 import { HTMLAttributes } from 'vue';
 import type { Location as Location_2 } from 'vue-router';
+import type { Location as Location_3 } from 'vue-router/types/router.d.ts';
 import type { MaybeElementRef as MaybeElementRef_2 } from '@/types/elements';
 import { MoveEvent } from 'sortablejs';
 import type { OmitStrict as OmitStrict_2 } from '@/types/omit-strict';
@@ -27,7 +28,7 @@ import { PublicProps } from 'vue';
 import { PullResult } from 'sortablejs';
 import { PutResult } from 'sortablejs';
 import { Ref } from 'vue';
-import type { RouterLinkProps } from 'vue-router';
+import type { RouterLinkProps as RouterLinkProps_3 } from 'vue-router';
 import { SortableEvent } from 'sortablejs';
 import { sortablejs } from 'sortablejs';
 import { SortableOptions } from 'sortablejs';
@@ -49,9 +50,9 @@ actions: BentoButtonActionsList_2;
 previousPage: string;
 }>;
 
-declare const __VLS_base_2: DefineComponent<BentoLinkProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+declare const __VLS_base_2: DefineComponent<BentoLinkProps_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 click: (...args: any[]) => void;
-}, string, PublicProps, Readonly<BentoLinkProps> & Readonly<{
+}, string, PublicProps, Readonly<BentoLinkProps_3> & Readonly<{
 onClick?: (...args: any[]) => any;
 }>, {
 variant: BentoLinkVariant | `${BentoLinkVariant}`;
@@ -316,7 +317,6 @@ status: string;
 tag: any;
 title: any;
 type: string;
-variant: any;
 }>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, Readonly<ExtractPropTypes<__VLS_WithDefaults_68<__VLS_TypePropsToOption_68<BentoTimelineItemProps>, {
 additionalTimestamp: any;
 dataList: any;
@@ -325,12 +325,10 @@ status: string;
 tag: any;
 title: any;
 type: string;
-variant: any;
 }>>>, {
 description: string;
 type: string;
 title: BentoTimelineItemTitle | string;
-variant: BentoTimelineItemVariant | `${BentoTimelineItemVariant}`;
 tag: any;
 status: string;
 additionalTimestamp: BentoTimelineTimestamp;
@@ -2346,7 +2344,6 @@ readonly: boolean;
 required: boolean;
 search: any;
 showSlotContentInMultiple: boolean;
-size: any;
 staticCategories: boolean;
 teleport: () => {
 disabled: boolean;
@@ -2381,7 +2378,6 @@ readonly: boolean;
 required: boolean;
 search: any;
 showSlotContentInMultiple: boolean;
-size: any;
 staticCategories: boolean;
 teleport: () => {
 disabled: boolean;
@@ -2404,7 +2400,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize | `${BentoDropdownSize}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoListboxOptions;
@@ -2492,10 +2487,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -2622,10 +2613,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -2703,7 +2690,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize_2 | `${BentoDropdownSize_2}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoAvatarListboxOptions;
@@ -2793,10 +2779,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -2931,10 +2913,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3013,7 +2991,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize_2 | `${BentoDropdownSize_2}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoCountryListboxOptions;
@@ -3094,10 +3071,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3223,10 +3196,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3304,7 +3273,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize_2 | `${BentoDropdownSize_2}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoCurrencyListboxOptions;
@@ -3421,10 +3389,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3550,10 +3514,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3631,7 +3591,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize_2 | `${BentoDropdownSize_2}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoPaymentMethodListboxOptions;
@@ -3713,10 +3672,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3843,10 +3798,6 @@ readonly: {
 type: PropType<boolean>;
 default: boolean;
 };
-size: {
-type: PropType<BentoDropdownSize_2 | "DropdownInputDefault" | "DropdownInputSmall">;
-default: any;
-};
 multiple: {
 type: PropType<boolean>;
 default: boolean;
@@ -3924,7 +3875,6 @@ teleport: BentoTeleportProps;
 error: boolean;
 optional: boolean;
 readonly: boolean;
-size: BentoDropdownSize_2 | `${BentoDropdownSize_2}`;
 multiple: boolean;
 ariaLabel: string;
 items: BentoTagListboxOptions;
@@ -4200,15 +4150,6 @@ type: StringConstructor;
 default: any;
 };
 /**
-* If set to true, renders all checkboxes in the group in an error state.
-*
-* @deprecated Since v2.0.0. Use `errorMessage` instead.
-*/
-hasError: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
 * Shows/hides the group label.
 */
 hideLabel: {
@@ -4303,15 +4244,6 @@ type: StringConstructor;
 default: any;
 };
 /**
-* If set to true, renders all checkboxes in the group in an error state.
-*
-* @deprecated Since v2.0.0. Use `errorMessage` instead.
-*/
-hasError: {
-type: BooleanConstructor;
-default: boolean;
-};
-/**
 * Shows/hides the group label.
 */
 hideLabel: {
@@ -4387,7 +4319,6 @@ modelValue: (string | number)[];
 errorMessage: string;
 tooltipText: string;
 hideLabel: boolean;
-hasError: boolean;
 formId: string;
 }>, {
     content?: (props: {
@@ -6294,10 +6225,8 @@ fallbackPosition: () => string[];
 fallbackStrategy: any;
 fitContent: boolean;
 fixedPositioning: boolean;
-matchWidth: boolean;
 open: boolean;
 large: boolean;
-modifiers: any;
 position: string;
 small: boolean;
 title: any;
@@ -6316,10 +6245,8 @@ fallbackPosition: () => string[];
 fallbackStrategy: any;
 fitContent: boolean;
 fixedPositioning: boolean;
-matchWidth: boolean;
 open: boolean;
 large: boolean;
-modifiers: any;
 position: string;
 small: boolean;
 title: any;
@@ -6338,7 +6265,6 @@ trapAll: boolean;
 trapAllOptions: any;
 fallbackPosition: Array<Placement>;
 fixedPositioning: boolean;
-matchWidth: boolean;
 ariaLabel: string;
 actions: BentoButtonActionsList_2;
 actionsLayout: BentoButtonActionsLayout_2 | `${BentoButtonActionsLayout_2}`;
@@ -6346,7 +6272,6 @@ divider: boolean;
 disableFocusTrap: boolean;
 dismissible: boolean;
 fitContent: boolean;
-modifiers: Array<unknown>;
 withoutSpace: boolean;
 overflowVisible: boolean;
 }>, {
@@ -6384,7 +6309,6 @@ description: any;
 disabled: boolean;
 errorMessage: any;
 formId: any;
-hasError: boolean;
 hideLabel: any;
 modelValue: any;
 optional: boolean;
@@ -6399,7 +6323,6 @@ description: any;
 disabled: boolean;
 errorMessage: any;
 formId: any;
-hasError: boolean;
 hideLabel: any;
 modelValue: any;
 optional: boolean;
@@ -6418,7 +6341,6 @@ modelValue: BentoRadioGroupValue | null;
 errorMessage: string;
 tooltipText: string;
 hideLabel: boolean | null;
-hasError: boolean;
 formId: string | null;
 }>, {
     content?: (props: {}) => any;
@@ -10820,10 +10742,6 @@ export declare type BentoColumnCellAction = OmitStrict<BentoButtonActionObject,
 declare type BentoColumnCellActionEvent = (rowDataItem: BentoDatagridDataItem, columnKey: string) => void;
 
 declare type BentoColumnCellActionMenuItem = {
-    /**
-     * @deprecated Since v2.0.0. Use `event` instead.
-     */
-    handler?: BentoMenuItem['handler'];
     event?: BentoColumnCellActionEvent;
 } & OmitStrict<BentoMenuItem, 'handler'>;
 
@@ -12634,10 +12552,6 @@ export declare interface BentoDropdownProps extends FormField {
      * Toggles whether to use the slot content select items shown in the textbox in multiple mode.
      */
     showSlotContentInMultiple?: boolean;
-    /**
-     * @deprecated Since v2.0.0. Do not use. Only the `default` size is supported.
-     */
-    size?: BentoDropdownSize | `${BentoDropdownSize}`;
     /**
      * If enabled, dropdown will display non-selectable, static categories
      */
@@ -12681,22 +12595,6 @@ export declare interface BentoDropdownProps extends FormField {
     enableValueLabelPair?: boolean;
 }
 
-/**
- * @deprecated Since v2.0.0. Do not use. Only the `default` size is supported.
- */
-export declare enum BentoDropdownSize {
-    DEFAULT = "DropdownInputDefault",
-    SMALL = "DropdownInputSmall"
-}
-
-/**
- * @deprecated Since v2.0.0. Do not use. Only the `default` size is supported.
- */
-declare enum BentoDropdownSize_2 {
-    DEFAULT = 'DropdownInputDefault',
-    SMALL = 'DropdownInputSmall',
-}
-
 /**
  * A Tag Dropdown showing a selectable list of tags.
  *
@@ -14235,33 +14133,69 @@ export declare type BentoLazyLoadType = 'automatic' | 'button' | 'none';
 
 export declare const BentoLink: typeof __VLS_export_62;
 
-declare type BentoLinkProps = RouterLinkProps & LinkProps_2;
+declare type BentoLinkProps = RouterLinkProps & {
+    /**
+     * Disable the default typography for the component. Only use this when the component is inside another typography component.
+     */
+    disableTypography?: boolean;
+    /**
+     * Set the rendered link to a regular external anchor link and renders an external link icon.
+     */
+    external?: boolean;
+    /**
+     * Set to true if used inside a `BentoButton` component.
+     */
+    isButton?: boolean;
+    /**
+     * Set the rendered link to a regular external anchor link.
+     */
+    isNotRouting?: boolean;
+    /**
+     * Sets the target of the rendered link.
+     */
+    target?: string;
+    /**
+     * Set to true to truncate link. Doesn't work with disableTypography.
+     */
+    truncate?: boolean;
+    /**
+     * Link variant type affecting visual style.
+     * @values default, quiet
+     */
+    variant?: BentoLinkVariant_2 | `${BentoLinkVariant_2}`;
+};
 
 declare type BentoLinkProps_2 = RouterLinkProps_2 & {
     /**
      * Disable the default typography for the component. Only use this when the component is inside another typography component.
      */
     disableTypography?: boolean;
+
     /**
      * Set the rendered link to a regular external anchor link and renders an external link icon.
      */
     external?: boolean;
+
     /**
      * Set to true if used inside a `BentoButton` component.
      */
     isButton?: boolean;
+
     /**
      * Set the rendered link to a regular external anchor link.
      */
     isNotRouting?: boolean;
+
     /**
      * Sets the target of the rendered link.
      */
     target?: string;
+
     /**
      * Set to true to truncate link. Doesn't work with disableTypography.
      */
     truncate?: boolean;
+
     /**
      * Link variant type affecting visual style.
      * @values default, quiet
@@ -14269,6 +14203,8 @@ declare type BentoLinkProps_2 = RouterLinkProps_2 & {
     variant?: BentoLinkVariant_3 | `${BentoLinkVariant_3}`;
 };
 
+declare type BentoLinkProps_3 = RouterLinkProps_3 & LinkProps_2;
+
 /**
  * @deprecated Since v2.0.0. Use string literal instead.
  */
@@ -14281,6 +14217,14 @@ export declare enum BentoLinkVariant {
  * @deprecated Since v2.0.0. Use string literal instead.
  */
 declare enum BentoLinkVariant_2 {
+    DEFAULT = "default",
+    QUIET = "quiet"
+}
+
+/**
+ * @deprecated Since v2.0.0. Use string literal instead.
+ */
+declare enum BentoLinkVariant_3 {
     DEFAULT = 'default',
     QUIET = 'quiet',
 }
@@ -14288,9 +14232,9 @@ declare enum BentoLinkVariant_2 {
 /**
  * @deprecated Since v2.0.0. Use string literal instead.
  */
-declare enum BentoLinkVariant_3 {
-    DEFAULT = "default",
-    QUIET = "quiet"
+declare enum BentoLinkVariant_4 {
+    DEFAULT = 'default',
+    QUIET = 'quiet',
 }
 
 /**
@@ -14646,7 +14590,8 @@ export declare enum BentoMenuEvent {
 
 export declare interface BentoMenuItem {
     text: string;
-    handler: () => void;
+    handler?: () => void;
+    link?: BentoLinkProps;
     secondaryText?: string;
     items?: Array<BentoMenuItem>;
     disabled?: boolean;
@@ -14660,7 +14605,8 @@ export declare interface BentoMenuItem {
 
 declare interface BentoMenuItem_2 {
     text: string;
-    handler: () => void;
+    handler?: () => void;
+    link?: BentoLinkProps_2;
     secondaryText?: string;
     items?: Array<BentoMenuItem_2>;
     disabled?: boolean;
@@ -15136,7 +15082,7 @@ export declare interface BentoNavigationMenuItemProps {
     /**
      * Link properties to make the navigation item a navigable link
      */
-    link?: BentoLinkProps_2;
+    link?: BentoLinkProps;
     /**
      * Value to identify this navigation item. Used with navigation-menu's activePage prop to determine if selected.
      */
@@ -16548,10 +16494,6 @@ export declare interface BentoPopoverProps {
      * @see {@link https://floating-ui.com/docs/usefloating#strategy}
      */
     fixedPositioning?: boolean;
-    /**
-     * Makes the popover match the width of its target element.
-     */
-    matchWidth?: boolean;
     /**
      * Toggles the popover open and closed
      */
@@ -16560,10 +16502,6 @@ export declare interface BentoPopoverProps {
      * Displays the popover in a large size.
      */
     large?: boolean;
-    /**
-     * @deprecated Since v2.0.0. Do not use. This property no longer functions since moving to the floating-ui framework.
-     */
-    modifiers?: Array<unknown>;
     /**
      * Popover's position relative to the target element.
      * Possible values are:
@@ -16855,12 +16793,6 @@ export declare interface BentoRadioGroupProps extends FormField {
      * @default null
      */
     formId?: string | null;
-    /**
-     * If set to true, renders all bento-radio-buttons in the group in an error state.
-     * @deprecated Since v2.0.0. Use `errorMessage` instead.
-     * @default false
-     */
-    hasError?: boolean;
     /**
      * Shows/hides the group label.
      * @default null
@@ -18411,16 +18343,9 @@ export declare interface BentoTimelineItemProps {
      * @values milestone, note
      */
     type?: string;
-    /**
-     * Variant for the timeline item
-     * @values DEFAULT, SUCCESS, CRITICAL
-     *
-     * @deprecated Since v2.0.0. Use `status` instead.
-     */
-    variant?: BentoTimelineItemVariant | `${BentoTimelineItemVariant}`;
 }
 
-export declare interface BentoTimelineItemTitle extends RouterLinkProps {
+export declare interface BentoTimelineItemTitle extends RouterLinkProps_3 {
     /**
      * Link label.
      */
@@ -18436,15 +18361,6 @@ export declare interface BentoTimelineItemTitle extends RouterLinkProps {
     [name: string]: any;
 }
 
-/**
- * @deprecated Since v2.0.0. Do not use. Use the `status` prop instead.
- */
-export declare enum BentoTimelineItemVariant {
-    DEFAULT = "SquareSmallIcon",
-    SUCCESS = "CheckedCircleIcon",
-    CRITICAL = "CrossCircleIcon"
-}
-
 export declare interface BentoTimelineProps {
     /**
      * If set to true, gives the possibility to manually add notes to the timeline via a textarea
@@ -19101,7 +19017,7 @@ declare interface LinkProps_2 {
      * Link variant type affecting visual style.
      * @values default, quiet
      */
-    variant?: BentoLinkVariant_2 | `${BentoLinkVariant_2}`;
+    variant?: BentoLinkVariant_4 | `${BentoLinkVariant_4}`;
 }
 
 declare type ListenerCleanup = () => void;
@@ -19337,7 +19253,7 @@ export declare function requireUppercase(value: BentoInputFieldValue): boolean;
  * Manually defined RouterLinkProps to ensure compatibility
  * with Vue Macros and Vue 2.7 / 3 monorepos.
  */
-declare interface RouterLinkProps_2 {
+declare interface RouterLinkProps {
     /**
      * Denotes the target route of the link. When clicked, the value of the `to` prop will be passed to
      * `router.push()` internally, so the value can be either a string or a location descriptor object.
@@ -19415,6 +19331,89 @@ declare interface RouterLinkProps_2 {
     ariaCurrentValue?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';
 }
 
+/**
+ * Manually defined RouterLinkProps to ensure compatibility
+ * with Vue Macros and Vue 2.7 / 3 monorepos.
+ */
+declare interface RouterLinkProps_2 {
+    /**
+     * Denotes the target route of the link. When clicked, the value of the `to` prop will be passed to
+     * `router.push()` internally, so the value can be either a string or a location descriptor object.
+     */
+    to: string | Location_3;
+    /**
+     * Setting `replace` prop will call `router.replace()` instead of `router.push()` when clicked, so the navigation will
+     * not create a new history record.
+     *
+     * @default false
+     */
+    replace?: boolean;
+    /**
+     * Setting `append` prop always appends the relative path to the current path. For example, assuming we are navigating
+     * from `/a` to a relative link `b`, without `append` we will end up at `/b`, but with append we will end up at
+     * `/a/b`.
+     *
+     * @default false
+     */
+    append?: boolean;
+    /**
+     * Sometimes we want <RouterLink> to render as another tag, e.g <li>. Then we can use tag prop to specify which tag to
+     * render to, and it will still listen to click events for navigation.
+     *
+     * @default "a"
+     */
+    tag?: string;
+    /**
+     * Configure the active CSS class applied when the link is active. Note the default value can also be configured
+     * globally via the `linkActiveClass` router constructor option.
+     *
+     * @default "router-link-active"
+     */
+    activeClass?: string;
+    /**
+     * The default active class matching behavior is **inclusive match**. For example, `<RouterLink to="/a">` will get
+     * this class applied as long as the current path starts with `/a/` or is `/a`.
+     *
+     * @default false
+     */
+    exact?: boolean;
+    /**
+     * Allows matching only using the `path` section of the url, effectively ignoring the `query` and the `hash` sections.
+     *
+     * @default false
+     */
+    exactPath?: boolean;
+    /**
+     * Configure the active CSS class applied when the link is active with exact path match. Note the default value can
+     * also be configured globally via the `linkExactPathActiveClass` router constructor option.
+     *
+     * @default "router-link-exact-path-active"
+     */
+    exactPathActiveClass?: string;
+
+    /**
+     * Specify the event(s) that can trigger the link navigation.
+     *
+     * @default 'click'
+     */
+    event?: string | ReadonlyArray<string>;
+    /**
+     * Configure the active CSS class applied when the link is active with exact match. Note the default value can also be
+     * configured globally via the `linkExactActiveClass` router constructor option.
+     *
+     * @default "router-link-exact-active"
+     */
+    exactActiveClass?: string;
+    /**
+     * Configure the value of `aria-current` when the link is active with exact match. It must be one of the allowed
+     * values for [aria-current](https://www.w3.org/TR/wai-aria-1.2/#aria-current) in the ARIA spec. In most cases, the
+     * default of page should be the best fit.
+     *
+     * @default "page"
+     */
+    ariaCurrentValue?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';
+}
+
 export declare interface SectionNavigationItem {
     /**
      * Element ref used as the section navigation target.

package/dist/accordion.js

@@ -1,4 +1,4 @@
-import { a as e, b as n } from "./chunks/accordion-item.CFsXrPwd.js";
+import { a as e, b as n } from "./chunks/accordion-item.CbW267Sz.js";
 export {
   e as BentoAccordion,
   n as BentoAccordionItem

package/dist/action-bar.js

@@ -1,4 +1,4 @@
-import { B as t } from "./chunks/action-bar.BH4UfmNh.js";
+import { B as t } from "./chunks/action-bar.BCeqKil3.js";
 export {
   t as BentoActionBar
 };

package/dist/ai-tag.js

@@ -1,4 +1,4 @@
-import { a as e } from "./chunks/ai-tag.CCm7UlaM.js";
+import { a as e } from "./chunks/ai-tag.CY2pP0Lf.js";
 export {
   e as BentoAiTag
 };

package/dist/anchor-scroller.js

@@ -1,4 +1,4 @@
-import { a as e } from "./chunks/anchor-scroller.B5f_ePD6.js";
+import { a as e } from "./chunks/anchor-scroller.ljKkLo1i.js";
 export {
   e as BentoAnchorScroller
 };