@adyen/bento-vue3 1.43.0 → 1.45.0

package/dist/@types/packages/vue2/src/types/listbox.d.ts

@@ -1,52 +0,0 @@
-import { BentoSearchBarItem } from "../components/search-bar";
-import { BentoEmptyState } from "../components/empty-state";
-import { OmitStrict } from "../../../core/src/types/omit-strict";
-import { BentoButtonActionObject } from "../components/button";
-import { UseVirtualListItemHeight } from "../composables/use-virtual-list";
-export type BentoListboxValue = string | number;
-export type BentoListboxMultiSelectValue = BentoListboxValue[];
-export interface BentoListboxOptionItem extends BentoSearchBarItem {
-    data?: unknown;
-    description?: string;
-    value: BentoListboxValue;
-    items?: Array<BentoListboxOptionItem>;
-}
-export type BentoListboxSelectedValue = BentoListboxValue | BentoListboxMultiSelectValue;
-export type BentoListboxOptions = Array<BentoListboxOptionItem>;
-export type BentoListboxIsOptionDisabled = undefined | ((optionValue: BentoListboxOptionItem) => boolean);
-export declare enum BentoListboxEvent {
-    SELECT = "select",
-    SHOW_MORE = "show-more",
-    ESCAPE = "escape-pressed",
-    CLICK = "click",
-    ENTER = "enter-pressed",
-    SPACE = "space-pressed",
-    TAB = "tab-pressed",
-    CLOSE_DROPDOWN = "close-dropdown"
-}
-/**
- * @deprecated for usage with properties since version 2.0. Use the string literal instead.
- */
-export declare enum BentoListboxLazyLoadType {
-    AUTOMATIC = "automatic",
-    BUTTON = "button",
-    NONE = "none"
-}
-export interface BentoListboxSearchOptions {
-    /**
-     * Custom debounce time. Default: 300
-     */
-    debounceTime?: number;
-    /**
-     * The event that triggers upon user filtering the listbox items.
-     */
-    searchEvent: (searchValue: string) => void;
-}
-export type BentoListboxEmptyStateProps = {
-    action: {
-        icon?: any;
-    } & BentoButtonActionObject;
-} & OmitStrict<InstanceType<typeof BentoEmptyState>['$props'], 'variant' | 'image' | 'description'>;
-export type BentoListboxVirtulisationOptions = boolean | {
-    itemHeight: UseVirtualListItemHeight;
-};

package/dist/@types/packages/vue2/src/types/maybe-ref.d.ts

@@ -1,7 +0,0 @@
-import { Ref } from "../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-/**
- * As recommmended by the vue community to use this type when you are not sure
- * if the argument is a ref.
- * Source: https://github.com/vueuse/vueuse/blob/main/packages/shared/utils/types.ts#L28
- */
-export type MaybeRef<T> = T | Ref<T>;

package/dist/@types/packages/vue2/src/types/prop-types.d.ts

@@ -1 +0,0 @@
-export type Booleanish = boolean | 'true' | 'false';

package/dist/@types/packages/vue2/src/types/refs.d.ts

@@ -1,30 +0,0 @@
-import { ComputedRef, Ref, UnwrapRef } from "../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-/**
- *
- * Maybe it's a `ref`, or a plain value.
- *
- * As recommmended by the vue community to use this type when you are not sure
- * if the argument is a ref.
- * Source: https://github.com/vueuse/vueuse/blob/main/packages/shared/utils/types.ts#L28
- *
- * ```ts
- * type MaybeRef<T> = T | Ref<T>
- * ```
- */
-export type MaybeRef<T> = T | Ref<T> | Ref<UnwrapRef<T>>;
-/**
- * Maybe it's a computed ref, or a getter function
- *
- * ```ts
- * type MaybeReadonlyRef<T> = (() => T) | ComputedRef<T>
- * ```
- */
-export type MaybeReadonlyRef<T> = (() => T) | ComputedRef<T>;
-/**
- * Maybe it's a ref, or a plain value, or a getter function
- *
- * ```ts
- * type MaybeComputedRef<T> = (() => T) | T | Ref<T> | ComputedRef<T>
- * ```
- */
-export type MaybeComputedRef<T> = MaybeReadonlyRef<T> | MaybeRef<T>;

package/dist/@types/packages/vue2/src/types/utils-events.d.ts

@@ -1,35 +0,0 @@
-export interface ListenOptions {
-    capture?: boolean;
-    passive?: boolean;
-    once?: boolean;
-    self?: boolean;
-    vm?: Vue;
-    onCleanup?: () => void;
-}
-export declare enum EventKey {
-    ESCAPE = "Escape",
-    ENTER = "Enter",
-    ARROW_LEFT = "ArrowLeft",
-    ARROW_UP = "ArrowUp",
-    ARROW_RIGHT = "ArrowRight",
-    ARROW_DOWN = "ArrowDown",
-    PAGE_UP = "PageUp",
-    PAGE_DOWN = "PageDown",
-    END = "End",
-    HOME = "Home"
-}
-/**
- * @deprecated `Event.keyCode` is deprecated. Use `EventKey` instead
- */
-export declare enum KeyCode {
-    ESCAPE = 27,
-    ENTER = 13,
-    ARROW_LEFT = 37,
-    ARROW_UP = 38,
-    ARROW_RIGHT = 39,
-    ARROW_DOWN = 40,
-    PAGE_UP = 33,
-    PAGE_DOWN = 34,
-    END = 35,
-    HOME = 36
-}

package/dist/@types/packages/vue2/src/utils/ts/aria-label.d.ts

@@ -1,16 +0,0 @@
-import { ComputedRef } from "../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import { MaybeRef } from "../../types/maybe-ref";
-interface ariaLabelOptions {
-    ariaLabel?: MaybeRef<string | null>;
-    label?: MaybeRef<string | null>;
-    defaultFallback?: MaybeRef<string | null>;
-}
-/**
- * Returns a valid aria-label for the element it's invoked for
- * @param ariaLabel - The aria label, which has to be set manually through the homonymous prop
- * @param label - Any other label provided, usually the component's main text
- * @param defaultFallback - The default fallback if no other value is provided
- * @returns {string | null} - A string corresponding to the aria label or null if no value is provided
- */
-export declare const useAriaLabel: ({ ariaLabel, label, defaultFallback, }: ariaLabelOptions) => ComputedRef<string>;
-export {};

package/dist/@types/packages/vue2/src/utils/ts/currency/countries-list.d.ts

@@ -1,11 +0,0 @@
-/**
- * Contains mapping configuration between currency code and exponent for amount in the corresponding currency.
- * Since the majority of the currencies have an exponent equal to 2, they are not listed here.
- * https://docs.adyen.com/development-resources/currency-codes
- * @type {Array}
- * @internal
- */
-export declare const currencyExponentMap: {
-    exponent: number;
-    currencies: string[];
-}[];

package/dist/@types/packages/vue2/src/utils/ts/currency/currency.d.ts

@@ -1,35 +0,0 @@
-import { CurrencyAmount, CurrencyOptions, NumberFormatOptionsResult } from './currency.types';
-/**
- * Returns exponent for specified currency code.
- */
-export declare const getExponent: (currencyCode: string) => number;
-/**
- * Converts passed amount from regular to minor units, based on currency exponent
- */
-export declare const getMinorUnitsAmount: (amount: CurrencyAmount) => number;
-/**
- * Returns normalized amount value from minor units as decimal point number (when exponent is more than zero).
- */
-export declare const getNormalizedAmount: (amount: CurrencyAmount, exponent: number) => number;
-/**
- * /**
- * Prepares amount to be rendered by Intl.NumberFormat function.
- * See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
- *
- * It enables language-sensitive number formatting.
- * Adds currency symbol and ISO code based on provided options
- * The result of execution - is a configuration object that is used in 'getLocalizedCurrencyValue' function
- *
- * @param amount - the value and currency to format.
- * @param options - the formatting options that are passed to the Intl.NumberFormat function.
- * @param majorUnits - if set to true, then currency major units will be used instead of minor ones
- */
-export declare function getNumberFormatOptions(amount: CurrencyAmount, options?: CurrencyOptions, majorUnits?: boolean): NumberFormatOptionsResult;
-/**
- * Get a formatted and localised currency string given an amount and currency type.
- *
- * @param amountValue - the amount of the currency.
- * @param currency - the ISO 4217 currency code.
- * @param majorUnits - if set to true, then currency major units will be used instead of minor ones
- */
-export declare const getLocalizedCurrencyValue: (amountValue: string, currency: string, majorUnits?: boolean) => string;

package/dist/@types/packages/vue2/src/utils/ts/currency/currency.types.d.ts

@@ -1,24 +0,0 @@
-export interface CurrencyAmount {
-    value: number;
-    currency: string;
-}
-export interface CurrencyOptions {
-    style?: string;
-    exponent?: number;
-    optionalFractions?: boolean;
-    highPrecision?: boolean;
-}
-export interface CurrencyFormatOptions {
-    amount: CurrencyAmount;
-    options?: CurrencyOptions;
-}
-export interface NumberFormatOptionsResult {
-    value: number;
-    format: {
-        currency: string;
-        currencyDisplay: string;
-        maximumFractionDigits: number;
-        minimumFractionDigits: number;
-        style: string;
-    };
-}

package/dist/@types/packages/vue2/src/utils/ts/date-input.d.ts

@@ -1,2 +0,0 @@
-export declare const validateDateInput: (event: KeyboardEvent) => void;
-export declare const formatDateInputValue: (value: string) => string;

package/dist/@types/packages/vue2/src/utils/ts/debounce/debounce.d.ts

@@ -1,10 +0,0 @@
-/**
- * The debounce() method is used to create a debounced function which
- * delays the given callback function until after the stated wait time
- * in milliseconds have passed since the last time this debounced function was called.
- *
- * @param {Function} callback - The function to debounce.
- * @param debounceTime - The number of milliseconds to delay.
- * @returns {Function} - Returns the new debounced function.
- */
-export declare const debounce: <T extends (...args: any[]) => any>(callback: T, debounceTime?: number) => T;

package/dist/@types/packages/vue2/src/utils/ts/debounce/index.d.ts

@@ -1 +0,0 @@
-export * from './debounce';

package/dist/@types/packages/vue2/src/utils/ts/deep-merge/deep-merge.d.ts

@@ -1 +0,0 @@
-export declare function deepMerge(target: object, source: object): object;

package/dist/@types/packages/vue2/src/utils/ts/deep-merge/index.d.ts

@@ -1 +0,0 @@
-export * from './deep-merge';

package/dist/@types/packages/vue2/src/utils/ts/deprecate.d.ts

@@ -1,14 +0,0 @@
-/**
- * Informs users about the deprecations in development mode only.
- *
- * @param title Indicates what is being deprecated.
- * @param deprecationMessage How to avoid the deprecation by giving an example of the alternatives. Backticks can be used to multi-line the message.
- * @param toBeRemovedInVersion The version it will be removed. Must be in X.Y.Z format.
- */
-export declare function deprecate(title: string, deprecationMessage: string, toBeRemovedInVersion: string): void;
-/**
- * Reset shownMessages set
- *
- * @deprecated For testing purposes only. Do not use.
- */
-export declare function resetShownMessages(): void;

package/dist/@types/packages/vue2/src/utils/ts/dev-environment.d.ts

@@ -1 +0,0 @@
-export declare const isDevelopmentEnviroment: () => boolean;

package/dist/@types/packages/vue2/src/utils/ts/events.d.ts

@@ -1,22 +0,0 @@
-import { ListenOptions } from "../../types/utils-events";
-/**
- * Attach event listeners using options object (implementing browser fallbacks), easy cleanup
- *
- * @param {EventTarget}  target              - Target where the event will be attached
- * @param {string}       type                - Event type(s). Accepts multiple types separated by space
- * @param {EventHandler} listener            - Handler function
- * @param {ListenOptions}[options]           - Listener options
- * @param {boolean}      [options.capture]   - Capture event listener
- * @param {boolean}      [options.passive]   - Passive event listener
- * @param {boolean}      [options.once]      - Auto cleanup after event is fired for the first time
- * @param {boolean}      [options.self]      - Only trigger if the target of the event is itself
- * @param {Vue}          [options.vm]        - Auto cleanup when vue instance is destroyed
- * @param {Function}     [options.onCleanup] - Callback function invoked after cleaning up
- * @return {Function} Cleanup function that removes the listener
- */
-export declare function listen(target: EventTarget, type: string, listener: EventListener, options?: ListenOptions): any;
-/**
- * Prevents the event from bubbling
- * @param {Event} event - Triggered event
- */
-export declare const stopEventPropagation: (event: Event) => void;

package/dist/@types/packages/vue2/src/utils/ts/focus-trap.utils.d.ts

@@ -1,33 +0,0 @@
-import { BentoFocusTrapHorizontalNavigationEvent, BentoFocusTrapVerticalNavigationEvent } from "../../components/focus-trap/focus-trap.types";
-/**
- * Perform callback before next re-paint frame of browser.
- *
- * @param action
- * @returns
- */
-export declare const deferAction: (callback: FrameRequestCallback) => number;
-/**
- * Retrieves the next focusable element using a factor to either choose
- * the next or previous focusable element.
- *
- * @param factor a number +1 or -1
- * @param element the element to checks for focusable elements inside of
- * @returns
- */
-export declare const getNextFocusableElement: (factor: any, element: any) => HTMLElement;
-/**
- * Returns an object is if keyboard event key is an arrow previous or next key.
- * this changes depending on if the arrow navigation is horizontal or vertical.
- *
- * @param event
- * @param arrowOrder
- * @returns { isArrowNext: boolean, isArrowPrev: boolean }
- */
-export declare const getArrowType: (event: KeyboardEvent, arrowOrder: BentoFocusTrapVerticalNavigationEvent[] | BentoFocusTrapHorizontalNavigationEvent[]) => {
-    isArrowNext: boolean;
-    isArrowPrev: boolean;
-};
-/**
- * Default scrolling into view options
- */
-export declare const SCROLL_INTO_VIEW_OPTIONS: ScrollIntoViewOptions;

package/dist/@types/packages/vue2/src/utils/ts/get-date-locale/get-date-locale.d.ts

@@ -1,11 +0,0 @@
-/**
- * Returns all the supported languages by the Dates.
- * @returns set of supported date locale
- */
-export declare function getDateLocale(): {
-    de: Locale;
-    enUS: Locale;
-    fr: Locale;
-    ja: Locale;
-    ptBR: Locale;
-};

package/dist/@types/packages/vue2/src/utils/ts/get-slot-text/get-slot-text.d.ts

@@ -1,9 +0,0 @@
-import type { Slots } from "../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-/**
- * Get text recursively from slot by giving slot name.
- * This recursion will only occur 5 times before the method gives up and returns an empty string.
- * @param slots - the slots provided the the component's setup function
- * @returns A function who's first parameter is the name of the slot.
- */
-export declare const getSlotText: (slots: Slots) => (name: string) => string;
-export default getSlotText;

package/dist/@types/packages/vue2/src/utils/ts/get-slot-text/index.d.ts

@@ -1 +0,0 @@
-export { getSlotText } from './get-slot-text';

package/dist/@types/packages/vue2/src/utils/ts/i18n.d.ts

@@ -1,52 +0,0 @@
-import type { WritableComputedRef } from "../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import VueI18n from 'vue-i18n';
-export declare const defaultI18nOptions: {
-    locale: string;
-    fallbackLocale: string;
-    fallbackRoot: boolean;
-};
-export declare function createI18n(options?: {
-    locale: string;
-    fallbackLocale: string;
-    fallbackRoot: boolean;
-}): VueI18n;
-export interface Composer<MessageKey> {
-    locale: WritableComputedRef<string>;
-    t?(key: MessageKey, values?: VueI18n.Values): string;
-    tc?(key: MessageKey, choice?: VueI18n.Choice, values?: VueI18n.Values): string;
-    tc?(key: MessageKey, choice: VueI18n.Choice, locale: VueI18n.Locale, values?: VueI18n.Values): string;
-    te?(key: MessageKey, locale?: VueI18n.Locale): boolean;
-    d?: typeof VueI18n.prototype.d;
-    n?: typeof VueI18n.prototype.n;
-}
-export type MessageKeys = {
-    [key: string]: string;
-};
-export interface i18nMessages {
-    'en-US': {
-        [key: string]: string;
-    };
-    [key: string]: {
-        [key: string]: string;
-    };
-}
-export declare const useI18n: <T extends {
-    message: MessageKeys;
-}>(params?: {
-    messages?: i18nMessages;
-} | undefined, onlyLocale?: boolean) => Composer<keyof T["message"]>;
-/**
- * Gets the vue 2 or vue 3 global vue-i18n component
- */
-export declare const getI18nComponent: () => "i18n" | "i18n-t";
-/**
- * Gets the correct props for the global vue-i18n component depending on if the component is used in vue 2 or vue 3.
- * @param path - the translation key path.
- */
-export declare const getI18nProps: (path: string) => {
-    path: string;
-    keypath?: undefined;
-} | {
-    keypath: string;
-    path?: undefined;
-};

package/dist/@types/packages/vue2/src/utils/ts/print-development-warning.d.ts

@@ -1,6 +0,0 @@
-/**
- * Prints console.warn messages in development mode only.
- *
- * @see console.warn for what parameters you can use
- */
-export declare function printDevelopmentWarning(...args: Parameters<typeof console.warn>): void;

package/dist/@types/packages/vue2/src/utils/ts/resize.d.ts

@@ -1 +0,0 @@
-export declare const observeSizeOfElement: (element: any, callback: any) => ResizeObserver | null;

package/dist/@types/packages/vue2/src/utils/ts/storybook.d.ts

@@ -1,11 +0,0 @@
-export * from "../../../../core/src/utils/ts/storybook";
-/**
- * Adds necessary Toast component to display toasts.
- * It should be added just once on the app level, but never in the views or components itself
- */
-export declare const withToastDecorator: () => {
-    components: {
-        BentoToast: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<{}, {}, {}, {}, {}, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>;
-    };
-    template: string;
-};

package/dist/@types/packages/vue2/src/utils/ts/time-input.d.ts

@@ -1,2 +0,0 @@
-export declare const validateTimeInput: (event: KeyboardEvent) => void;
-export declare const formatTimeInputValue: (value: string) => string;

package/dist/@types/packages/vue2/src/utils/ts/truncate.d.ts

@@ -1,7 +0,0 @@
-/**
- * Trunctes a string if it goes over a certain character limit.
- * @param aString the string or number to truncate.
- * @param characterLimit the character limit to start truncating at.
- * @returns a string that is truncated if it's length is over the limit.
- */
-export declare const truncate: (aStringOrNumber: string | number, characterLimit: number) => string;

package/dist/assets/loading-button.css

@@ -1 +0,0 @@
-@keyframes spin-07b9c537{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.b-loading-button--loading[data-v-07b9c537]:hover{cursor:default}.b-loading-button--primary-loading[data-v-07b9c537],.b-loading-button--primary-loading[data-v-07b9c537]:hover{background-color:var(--b-loading-button-primary-loading-background-color)}.b-loading-button--primary-loading.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--primary-loading[data-v-07b9c537],.b-loading-button--primary-loading:hover.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--primary-loading[data-v-07b9c537]:hover{background-color:var(--b-loading-button-primary-loading-background-color-inverse)}.b-loading-button--primary-success[data-v-07b9c537]{background-color:var(--b-loading-button-primary-success-background-color);color:var(--b-loading-button-primary-success-color)}.b-loading-button--primary-success[data-v-07b9c537]:hover{background-color:var(--b-loading-button-primary-success-hover-background-color)}.b-loading-button--primary-success[data-v-07b9c537]:active{background-color:var(--b-loading-button-primary-success-active-background-color)}.b-loading-button--primary-success[data-v-07b9c537]:disabled{background-color:var(--b-loading-button-primary-success-disabled-background-color);color:var(--b-loading-button-primary-success-disabled-color)}.b-loading-button--secondary-loading[data-v-07b9c537],.b-loading-button--secondary-loading[data-v-07b9c537]:hover{background-color:var(--b-loading-button-secondary-loading-background-color);color:var(--b-loading-button-secondary-loading-color)}.b-loading-button--secondary-loading.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--secondary-loading[data-v-07b9c537],.b-loading-button--secondary-loading:hover.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--secondary-loading[data-v-07b9c537]:hover{background-color:var(--b-loading-button-secondary-loading-background-color-inverse)}.b-loading-button--secondary-loading.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--secondary-loading[data-v-07b9c537],.b-loading-button--secondary-loading:hover.b-loading-button--inverse[data-v-07b9c537],.b-loading-button--inverse .b-loading-button--secondary-loading[data-v-07b9c537]:hover{color:var(--b-loading-button-secondary-loading-color-inverse)}.b-loading-button--secondary-loading[data-v-07b9c537]:hover:not(:focus),.b-loading-button--secondary-loading[data-v-07b9c537]:hover:hover:not(:focus){box-shadow:none}.b-loading-button--secondary-success[data-v-07b9c537]{background-color:var(--b-loading-button-secondary-success-background-color);border-color:var(--b-loading-button-secondary-success-border-color);color:var(--b-loading-button-secondary-success-color)}.b-loading-button--secondary-success[data-v-07b9c537]:hover{border-color:var(--b-loading-button-secondary-success-hover-border-color);box-shadow:var(--b-loading-button-secondary-success-hover-box-shadow)}.b-loading-button--secondary-success[data-v-07b9c537]:active{background-color:var(--b-loading-button-secondary-success-active-background-color);border-color:var(--b-loading-button-secondary-success-active-border-color)}.b-loading-button--secondary-success[data-v-07b9c537]:disabled{background-color:var(--b-loading-button-secondary-success-disabled-background-color);border-color:var(--b-loading-button-secondary-success-disabled-border-color);box-shadow:unset;color:var(--b-loading-button-secondary-success-disabled-color)}.b-loading-button--tertiary-loading[data-v-07b9c537],.b-loading-button--tertiary-loading[data-v-07b9c537]:hover{background-color:var(--b-loading-button-tertiary-loading-background-color);color:var(--b-loading-button-tertiary-loading-color);text-decoration:var(--b-loading-button-tertiary-loading-text-decoration)}.b-loading-button__icon[data-v-07b9c537]{display:inline-flex}

package/dist/chunks/accordion-item.BOftQTUm.js

@@ -1,142 +0,0 @@
-import { defineComponent as E, provide as $, toRef as z, openBlock as a, createElementBlock as l, renderSlot as S, ref as x, inject as D, computed as R, watch as r, createVNode as g, unref as e, withCtx as h, createElementVNode as y, createBlock as I, createTextVNode as H, toDisplayString as V, Transition as j, normalizeStyle as w, createCommentVNode as A } from "vue";
-import { _ as N } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { B as U } from "./typography.DNzU41ah.js";
-import { C as J, a as M } from "./chevron-up.DQZG_BP3.js";
-import { g as C } from "./generate-uid.D-HFI38h.js";
-import { o as q } from "./resize.Bqks3WUm.js";
-import { u as K } from "./i18n.CPGoe9tN.js";
-import { u as L } from "./use-expandable-content-height.GkjjbmPy.js";
-import "../assets/accordion-item.css";
-const T = Symbol("accordion title size injection key"), P = { class: "b-accordion" }, Y = {}, Z = /* @__PURE__ */ E({
-  ...Y,
-  __name: "accordion",
-  props: {
-    /**
-     * Controls accordion title size.
-     * @values default, small
-     */
-    titleSize: {
-      type: String,
-      default: "default"
-    }
-  },
-  setup(i) {
-    return $(T, z(i, "titleSize")), (s, c) => (a(), l("div", P, [
-      S(s.$slots, "default", {}, void 0, !0)
-    ]));
-  }
-}), le = /* @__PURE__ */ N(Z, [["__scopeId", "data-v-9fccc066"]]), k = {
-  "en-US": {
-    collapse: "Collapse",
-    expand: "Expand"
-  },
-  "pt-BR": {
-    collapse: "Recolher",
-    expand: "Expandir"
-  },
-  "ja-JP": {
-    collapse: "折りたたむ",
-    expand: "展開"
-  }
-}, F = { class: "b-accordion-item" }, G = ["id", "aria-controls", "aria-expanded"], Q = ["id", "aria-labelledby"], W = {
-  i18n: { messages: k }
-}, X = /* @__PURE__ */ E({
-  ...W,
-  __name: "accordion-item",
-  props: {
-    /**
-     * Sets the title of the accordion item.
-     */
-    title: {
-      type: String,
-      required: !0
-    },
-    /**
-     * Controls if the content is visible or hidden.
-     */
-    isExpanded: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  emits: ["update:is-expanded"],
-  setup(i, { emit: d }) {
-    const s = "b-accordion-item__animation--content", c = i, B = d, { t: p } = K({ messages: k }), n = x(null), t = x(c.isExpanded), u = C("accordionItemButton"), m = C("accordionItemContent"), _ = D(T, "default"), { updateContentHeight: v, contentHeight: f } = L(n, t), O = R(() => f.value ? { "max-height": f.value } : {});
-    return r(
-      () => c.isExpanded,
-      (o) => {
-        t.value = o;
-      }
-    ), r(
-      () => n.value,
-      () => {
-        let o = null;
-        !o && n.value && (o = q(n.value, () => {
-          n.value && v();
-        }));
-      }
-    ), r(
-      t,
-      (o) => {
-        B("update:is-expanded", o), v();
-      },
-      { immediate: !0 }
-    ), (o, b) => (a(), l("div", F, [
-      g(e(U), {
-        el: "h3",
-        variant: e(_) === "small" ? "body" : "title",
-        strongest: e(_) === "small"
-      }, {
-        default: h(() => [
-          y("button", {
-            id: e(u),
-            "aria-controls": e(m),
-            "aria-expanded": `${t.value}`,
-            type: "button",
-            class: "b-accordion-item__button",
-            onClick: b[0] || (b[0] = (ee) => t.value = !t.value)
-          }, [
-            t.value ? (a(), I(e(J), {
-              key: 0,
-              class: "b-accordion-item__icon",
-              "svg-title": e(p)("collapse"),
-              "aria-hidden": "true"
-            }, null, 8, ["svg-title"])) : (a(), I(e(M), {
-              key: 1,
-              class: "b-accordion-item__icon",
-              "svg-title": e(p)("expand"),
-              "aria-hidden": "true"
-            }, null, 8, ["svg-title"])),
-            H(" " + V(i.title), 1)
-          ], 8, G)
-        ]),
-        _: 1
-      }, 8, ["variant", "strongest"]),
-      g(j, { name: s }, {
-        default: h(() => [
-          t.value ? (a(), l("div", {
-            key: 0,
-            id: e(m),
-            "aria-labelledby": e(u),
-            role: "region",
-            style: w(O.value)
-          }, [
-            y("div", {
-              ref_key: "contentDiv",
-              ref: n,
-              class: "b-accordion-item__content"
-            }, [
-              S(o.$slots, "default", {}, void 0, !0)
-            ], 512)
-          ], 12, Q)) : A("", !0)
-        ]),
-        _: 3
-      })
-    ]));
-  }
-}), de = /* @__PURE__ */ N(X, [["__scopeId", "data-v-242828d5"]]);
-export {
-  le as a,
-  de as b
-};
-//# sourceMappingURL=accordion-item.BOftQTUm.js.map

package/dist/chunks/accordion-item.BOftQTUm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"accordion-item.BOftQTUm.js","sources":["../../../vue2/src/components/accordion/accordion.keys.ts","../../../vue2/src/components/accordion/accordion.vue","../../../vue2/src/components/accordion/components/accordion-item.vue"],"sourcesContent":["export const ACCORDION_TITLE_SIZE_INJECTION_KEY = Symbol('accordion title size injection key');\n","<template>\n    <div class=\"b-accordion\">\n        <slot />\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { PropType, provide, toRef } from 'vue';\n\n    import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from './accordion.keys';\n\n    import type { BentoAccordionTitleSize } from './accordion.types';\n\n    const props = defineProps({\n        /**\n         * Controls accordion title size.\n         * @values default, small\n         */\n        titleSize: {\n            type: String as PropType<BentoAccordionTitleSize>,\n            default: 'default',\n        },\n    });\n\n    provide(ACCORDION_TITLE_SIZE_INJECTION_KEY, toRef(props, 'titleSize'));\n</script>\n\n<script lang=\"ts\">\n    /**\n     * An accordion is a vertical stack of interactive headers used to reveal or hide\n     * sections of content associated with these headers.\n     *\n     * This component must only have `BentoAccordionItem` components in its default slot.\n     *\n     * Accordion items should be collapsed by default.\n     *\n     * @example\n     * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoAccordion, BentoAccordionItem },\n     *     template: `\n     *          <bento-accordion>\n     *              <bento-accordion-item title=\"Item 1\">\n     *                  Content for item 1\n     *              </bento-accordion-item>\n     *              <bento-accordion-item title=\"Item 2\">\n     *                  Content for item 2\n     *              </bento-accordion-item>\n     *          </bento-accordion>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion.scss\" />\n","<template>\n    <div class=\"b-accordion-item\">\n        <bento-typography\n            el=\"h3\"\n            :variant=\"titleSize === 'small' ? 'body' : 'title'\"\n            :strongest=\"titleSize === 'small'\"\n        >\n            <button\n                :id=\"buttonId\"\n                :aria-controls=\"contentId\"\n                :aria-expanded=\"`${isOpen}`\"\n                type=\"button\"\n                class=\"b-accordion-item__button\"\n                @click=\"isOpen = !isOpen\"\n            >\n                <chevron-up-icon\n                    v-if=\"isOpen\"\n                    class=\"b-accordion-item__icon\"\n                    :svg-title=\"t('collapse')\"\n                    aria-hidden=\"true\"\n                />\n                <chevron-down-icon v-else class=\"b-accordion-item__icon\" :svg-title=\"t('expand')\" aria-hidden=\"true\" />\n                {{ title }}\n            </button>\n        </bento-typography>\n\n        <Transition :name=\"CONTENT_TRANSITION_NAME\">\n            <div v-if=\"isOpen\" :id=\"contentId\" :aria-labelledby=\"buttonId\" role=\"region\" :style=\"contentMaxHeight\">\n                <div ref=\"contentDiv\" class=\"b-accordion-item__content\">\n                    <slot />\n                </div>\n            </div>\n        </Transition>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, inject, ref, watch } from 'vue';\n\n    import { BentoTypography } from '@/components/typography';\n    import ChevronDownIcon from '@adyen/ui-assets-icons-16/vue/chevron-down';\n    import ChevronUpIcon from '@adyen/ui-assets-icons-16/vue/chevron-up';\n\n    import { generateUid } from '@/core/utils/ts';\n    import { observeSizeOfElement } from '@/utils/ts/resize';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    import { ACCORDION_TITLE_SIZE_INJECTION_KEY } from '../accordion.keys';\n\n    import type { BentoAccordionTitleSize } from '../accordion.types';\n    import { useExpandableContentHeight } from '@/composables/use-expandable-content-height/use-expandable-content-height';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const CONTENT_TRANSITION_NAME = 'b-accordion-item__animation--content';\n\n    const props = defineProps({\n        /**\n         * Sets the title of the accordion item.\n         */\n        title: {\n            type: String,\n            required: true,\n        },\n        /**\n         * Controls if the content is visible or hidden.\n         */\n        isExpanded: {\n            type: Boolean,\n            default: false,\n        },\n    });\n\n    const emit = defineEmits<{\n        /**\n         * Emits update event when content is toggled\n         */\n        (e: 'update:is-expanded', value: boolean): void;\n    }>();\n\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    // Refs\n    const contentDiv = ref<HTMLDivElement>(null);\n    const isOpen = ref(props.isExpanded);\n\n    // Generating IDs\n    const buttonId = generateUid('accordionItemButton');\n    const contentId = generateUid('accordionItemContent');\n\n    // Injecting prop from parent\n    const titleSize = inject<`${BentoAccordionTitleSize}`>(ACCORDION_TITLE_SIZE_INJECTION_KEY, 'default');\n\n    // Getting and setting the item height to be able to handle height animation\n    const { updateContentHeight, contentHeight } = useExpandableContentHeight(contentDiv, isOpen);\n\n    const contentMaxHeight = computed(() => (contentHeight.value ? { 'max-height': contentHeight.value } : {}));\n\n    watch(\n        () => props.isExpanded,\n        value => {\n            isOpen.value = value;\n        }\n    );\n\n    watch(\n        () => contentDiv.value,\n        () => {\n            let observer: ResizeObserver | null = null;\n            if (!observer && contentDiv.value) {\n                observer = observeSizeOfElement(contentDiv.value, () => {\n                    if (contentDiv.value) {\n                        updateContentHeight();\n                    }\n                });\n            }\n        }\n    );\n\n    watch(\n        isOpen,\n        value => {\n            // Enable two-way data binding for `isExpanded`\n            emit('update:is-expanded', value);\n\n            updateContentHeight();\n        },\n        { immediate: true }\n    );\n</script>\n\n<script lang=\"ts\">\n    /**\n     * An accordion item is an interactive header used to reveal or hide a\n     * section of content associated with this header.\n     *\n     * This component must always be wrapped by a `BentoAccordion` component.\n     *\n     * @example\n     * import { BentoAccordion, BentoAccordionItem } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoAccordion, BentoAccordionItem },\n     *     template: `\n     *          <bento-accordion>\n     *              <bento-accordion-item title=\"Item 1\">\n     *                  Content for item 1\n     *              </bento-accordion-item>\n     *              <bento-accordion-item title=\"Item 2\">\n     *                  Content for item 2\n     *              </bento-accordion-item>\n     *          </bento-accordion>\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./accordion-item.scss\" />\n"],"names":["ACCORDION_TITLE_SIZE_INJECTION_KEY","__default__$1","provide","toRef","__props","__default__","messages","CONTENT_TRANSITION_NAME","props","emit","__emit","t","useI18n","contentDiv","ref","isOpen","buttonId","generateUid","contentId","titleSize","inject","updateContentHeight","contentHeight","useExpandableContentHeight","contentMaxHeight","computed","watch","value","observer","observeSizeOfElement"],"mappings":";;;;;;;;;AAAa,MAAAA,IAAA,OAAA,oCAAA,iCCqDTC,IAAA,CAAA;;;;;;;;;;;;;;AA7BA,WAAAC,EAAAF,GAAAG,EAXAC,GAWA,WAAA,CAAA;;;;;;;;;;;;;;;;;mHCqIAC,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAEf;;;;;;;;;;;;;;;;;;;;;AAvGA,UAAAC,IAAA,wCAEAC,IAAAJ,GAiBAK,IAAAC,GAOA,EAAA,GAAAC,EAAA,IAAAC,EAAA,EAAA,UAAAN,EAAA,CAAA,GAGAO,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAAN,EAAA,UAAA,GAGAQ,IAAAC,EAAA,qBAAA,GACAC,IAAAD,EAAA,sBAAA,GAGAE,IAAAC,EAAApB,GAAA,SAAA,GAGA,EAAA,qBAAAqB,GAAA,eAAAC,EAAA,IAAAC,EAAAV,GAAAE,CAAA,GAEAS,IAAAC,EAAA,MAAAH,EAAA,QAAA,EAAA,cAAAA,EAAA,MAAA,IAAA,CAAA,CAAA;AAEA,WAAAI;AAAA,MAAA,MAAAlB,EAAA;AAAA,MACgB,CAAAmB,MAAA;AAER,QAAAZ,EAAA,QAAAY;AAAA,MAAe;AAAA,IACnB,GAGJD;AAAA,MAAA,MAAAb,EAAA;AAAA,MACqB,MAAA;AAEb,YAAAe,IAAA;AACA,QAAA,CAAAA,KAAAf,EAAA,UACIe,IAAAC,EAAAhB,EAAA,OAAA,MAAA;AACI,UAAAA,EAAA,SACIQ,EAAA;AAAA,QACJ,CAAA;AAAA,MAER;AAAA,IACJ,GAGJK;AAAA,MAAAX;AAAA,MACI,CAAAY,MAAA;AAGI,QAAAlB,EAAA,sBAAAkB,CAAA,GAEAN,EAAA;AAAA,MAAoB;AAAA,MACxB,EAAA,WAAA,GAAA;AAAA,IACkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}