@adyen/bento-vue2 1.78.2 → 1.79.0

package/dist/chunks/{use-cached-selected-values.BZd3CTeP.js.map → use-cached-selected-values.FoXcm49J.js.map}

@@ -1 +1 @@
-{"version":3,"file":"use-cached-selected-values.BZd3CTeP.js","sources":["../../src/composables/use-checkbox-select-all/use-checkbox-select-all.ts","../../src/composables/use-virtual-list/use-virtual-list.ts","../../src/types/listbox.ts","../../src/components/internal/listbox/components/listbox-single-select/components/listbox-single-select-category/listbox-single-select-category.vue","../../src/components/internal/listbox/components/listbox-option/listbox-option.vue","../../../ui-assets/icons-16/dist/vue/checkmark.vue","../../src/components/internal/listbox/components/listbox-single-select-option/listbox-single-select-option.vue","../../src/components/internal/listbox/composables/useListboxKeyboardNavigation.ts","../../src/components/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options.ts","../../src/components/internal/listbox/components/listbox-single-select/listbox-single-select.vue","../../../ui-assets/icons-16/dist/vue/double-checkmark-small.vue","../../src/components/internal/decorative-checkbox/decorative-checkbox.vue","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.types.ts","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.vue","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.types.ts","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.vue","../../src/components/internal/listbox/composables/use-multi-level-items/use-multi-level-items.ts","../../src/components/internal/listbox/components/listbox-multi-select/listbox-multi-select.vue","../../src/components/internal/listbox/listbox.vue","../../src/components/internal/listbox/composables/use-cached-selected-values/use-cached-selected-values.ts"],"sourcesContent":["import { computed } from 'vue';\nimport type { ComputedRef } from 'vue';\nimport type { Fn } from '@/types/functions';\nimport type { BentoListboxMultiSelectValue, BentoListboxOptions } from '@/types/listbox';\n\n/**\n * Callback function that alllows to select all the items when called\n * @callback selectAllCallback\n */\n\n/**\n * Callback function that alllows to select all the items when called\n * @callback unselectAllCallback\n */\n\n/**\n * @typedef {Object} UseCheckboxSelectAll\n * @property {Ref<boolean>} isAllSelected - Indicates if all values are selected. Pass this to the :value property.\n * @property {Ref<boolean>} isIndeterminate - Indicates if it is in an indeterminated state (not all values are selected nor unselected). Pass this to the :indeterminate property.\n * @property {(selectedValue: boolean) => void} toggleSelectAll - Handles the select all flow, selects or unselects all and nullifies the indeterminated state. Pass this to the @input method.\n */\n\n/**\n * Composable to handle a 3 way checkbox state that allows to manage\n * a \"select all\", \"unselect all\" and an intermediate state where\n * not all are selected.\n *\n * @example\n * const checkboxVModelRef = ref<number[]>([]);\n *\n * const { isAllSelected, isIndeterminate, toggleSelectAll, updateIndeterminate } = useCheckboxSelectAll(\n *    checkboxVModelRef,\n *    () => { checkboxVModelRef.value = [...] // select all logic },\n *    () => { checkboxVModelRef.value = [] // unselect all logic },\n * );\n * toggleSelectAll(true|false); // Hook this to the @input method\n * updateIndeterminate(totalOfAvailableItems);\n *\n *\n * @param {ComputedRef<BentoListboxMultiSelectValue>} selectedItemsList - Reference to the list of selected values\n * @param {ComputedRef<BentoListboxOptions>} items - Reference to the list of all available items in the dropdown\n * @param {selectAllCallback} selectAll - Callback function that alllows to select all the items when called\n * @param {unselectAllCallback} unselectAll - Callback function that alllows to select all the items when called\n * @returns {UseCheckboxSelectAll} Values to be set to the bento-checkbox value and indeterminate props, as well as functions to update them accordingly\n *\n */\nexport const useCheckboxSelectAll = (\n    selectedItemsList: ComputedRef<BentoListboxMultiSelectValue>,\n    items: ComputedRef<BentoListboxOptions>,\n    selectAll: Fn,\n    unselectAll: Fn\n) => {\n    const isAllSelected = computed(\n        () => !!selectedItemsList.value?.length && selectedItemsList.value?.length === items.value.length\n    );\n    const isIndeterminate = computed(() => {\n        // eslint-disable-next-line eqeqeq\n        if (selectedItemsList.value == undefined || selectedItemsList.value.length === 0) {\n            return false;\n        }\n\n        return selectedItemsList.value?.length !== items.value.length;\n    });\n\n    const toggleSelectAll = (selectedValue: boolean) => {\n        if (selectedValue) {\n            selectAll();\n        } else {\n            unselectAll();\n        }\n    };\n\n    return {\n        isAllSelected,\n        isIndeterminate,\n\n        toggleSelectAll,\n    };\n};\n","import { computed, onMounted, onUnmounted, type Ref, ref, type UnwrapRef, watch } from 'vue';\nimport type {\n    UseVirtualListContainerProps,\n    UseVirtualListOptions,\n    UseVirtualListWrapperProps,\n} from './use-virtual-list.types';\nimport { observeSizeOfElement } from '../../utils/ts/resize';\n\n/**\n * Sets up a virtual scrolling functionality on a container element and a list of items to virtually scroll over.\n * This composables returns the containerProps and wrapperProps objects that should be v-binded onto the container and wrapper elements\n * of the list you wish to virtually scroll.\n *\n * This will return a filtered down list object the user can render based on how much the user has scrolled on the container.\n *\n * @usage\n * <template>\n *  <div v-bind=\"containerProps\" @scroll=\"onScroll\">\n *    <ul v-bind=\"wrapperProps\">\n *      <li v-for=\"item in list\" :key=\"item.index\" style=\"height: 22px\">\n *        {{ item.label }}\n *      </li>\n *    </ul>\n *  </div>\n * </template>\n *\n * <script setup lang=\"ts\"\n * import { useVirtualList } from '@adyen/bento-vue2';\n *\n * const DEFAULT_OPTIONS: { label: string }[] = new Array(100)\n *       .fill(0)\n *       .map((_, index) => ({ label: `Option ${index + 1}` }));\n * const ITEMS = ref(DEFAULT_OPTIONS);\n * const ITEM_HEIGHT = 30;\n *\n * const { containerProps, wrapperProps, list, onScroll } = useVirtualList(ITEMS, { itemHeight: ITEM_HEIGHT });\n * </script>\n *\n *\n * @param items - a reference to a list of items to virtually scroll over.\n * @param options - customises how the Virtual scroller list functions.\n * @param options.itemHeight - the height in pixel or a function that returns the height in pixels for each item.\n * @param options.overscan - number of pre-rendered DOM nodes. Prevents whitespace between items if you scroll very quickly.\n * @param options.prefixHeight - the prefix height of elements present the scrollable area but not present in the items property.\n * @param options.disabled - if set to true, disables the virtual scrolling functionality.\n */\nexport function useVirtualList<T>(\n    items: Ref<Array<T>>,\n    { disabled, itemHeight, overscan = 5, prefixHeight }: UseVirtualListOptions\n) {\n    const containerRef: Ref<UnwrapRef<HTMLElement | null>> = ref<HTMLElement | null>(null);\n    const list = ref<Array<T>>([]) as Ref<Array<T>>;\n    const startIndex = ref(0);\n    const endIndex = ref(0);\n    const containerHeight = ref(0);\n    let listObserver;\n\n    const wrapperProps = computed<UseVirtualListWrapperProps>(() => {\n        const totalHeight =\n            typeof itemHeight === 'number'\n                ? items.value.length * itemHeight\n                : items.value.reduce((sum, _, index) => sum + itemHeight(index), 0);\n\n        const offSetTop =\n            typeof itemHeight === 'number'\n                ? startIndex.value * itemHeight\n                : items.value.slice(0, startIndex.value).reduce((sum, _, i) => sum + itemHeight(i), 0);\n\n        return {\n            style: {\n                marginTop: `${offSetTop}px`,\n                height: `${totalHeight - offSetTop}px`,\n            },\n        };\n    });\n\n    /**\n     * Gets the offset for the first item to show within the visible area.\n     * @returns offset number.\n     */\n    const getOffset = () => {\n        const prefixHeightIfSet = prefixHeight?.value ?? 0;\n        const scrollTop = Math.max(containerRef.value.scrollTop - prefixHeightIfSet, 0);\n        if (typeof itemHeight === 'number') {\n            return Math.floor(scrollTop / itemHeight);\n        }\n\n        let sum = 0;\n        let offset = 0;\n\n        for (let i = 0; i < items.value.length; i += 1) {\n            const size = itemHeight(i);\n            sum += size;\n            if (sum >= scrollTop) {\n                offset = i;\n                break;\n            }\n        }\n        return offset;\n    };\n\n    /**\n     * Gets the visible number of items based on the container size and item heights.\n     * @returns visible number of items.\n     */\n    const getVisibileNumberOfItems = () => {\n        containerHeight.value = containerRef.value.clientHeight;\n        if (typeof itemHeight === 'number') {\n            return Math.ceil(containerHeight.value / itemHeight);\n        }\n\n        const start = startIndex.value ?? 0;\n        let sum = 0;\n        let capacity = 0;\n        for (let i = start; i < items.value.length; i += 1) {\n            const size = itemHeight(i);\n            sum += size;\n            capacity = i;\n            if (sum > containerHeight.value) {\n                break;\n            }\n        }\n        return capacity - start;\n    };\n\n    const updateVisibleItems = () => {\n        if (containerRef.value) {\n            const visibleCount = getVisibileNumberOfItems();\n            startIndex.value = getOffset();\n            endIndex.value = Math.min(startIndex.value + visibleCount + overscan, items.value.length);\n            list.value = items.value.slice(startIndex.value, endIndex.value);\n        }\n    };\n\n    const onScroll = () => {\n        updateVisibleItems();\n    };\n\n    if (!disabled) {\n        onMounted(() => {\n            if (containerRef.value) {\n                containerHeight.value = containerRef.value.clientHeight;\n                // When the listbox opens we need to update the height\n                listObserver = observeSizeOfElement(containerRef.value, ({ clientHeight }) => {\n                    containerHeight.value = clientHeight;\n                    updateVisibleItems();\n                });\n                updateVisibleItems();\n            }\n        });\n\n        onUnmounted(() => {\n            listObserver?.disconnect();\n        });\n\n        watch(\n            () => items.value,\n            () => {\n                updateVisibleItems();\n            }\n        );\n    }\n\n    const containerProps: UseVirtualListContainerProps = {\n        ref: containerRef,\n        style: { overflowY: 'auto' },\n    };\n\n    if (disabled) {\n        return {\n            containerRef,\n            containerProps,\n            // eslint-disable-next-line @typescript-eslint/no-empty-function\n            onScroll: () => {},\n            list: items,\n        };\n    }\n\n    return {\n        containerRef,\n        containerProps,\n        onScroll,\n        list,\n        wrapperProps,\n    };\n}\n","import { type BentoSearchBarItem } from '@/components/search-bar/search-bar.types';\nimport { type BentoEmptyStateProps } from '@/components/empty-state/empty-state.types';\nimport { type OmitStrict } from '@/types/omit-strict';\nimport { type BentoButtonActionObject } from '@/components/button/components/button-actions/button-actions.types';\nimport { type UseVirtualListItemHeight } from '@/composables/use-virtual-list/use-virtual-list.types';\n\nexport type BentoListboxValue = string | number;\n\nexport type BentoListboxMultiSelectValue = Array<BentoListboxValue>;\n\nexport interface BentoListboxOptionItem extends BentoSearchBarItem {\n    data?: unknown;\n    description?: string;\n    value: BentoListboxValue;\n    displayValue?: string;\n    items?: Array<BentoListboxOptionItem>; // Reference itself for multi-level options\n}\n\nexport interface BentoListboxSelectedValueLabelPair {\n    value: BentoListboxOptionItem['value'];\n    label: BentoListboxOptionItem['label'];\n}\n\nexport type BentoListboxSelectedValue =\n    | BentoListboxValue\n    | BentoListboxMultiSelectValue\n    | BentoListboxSelectedValueLabelPair\n    | Array<BentoListboxSelectedValueLabelPair>;\n\nexport type BentoListboxOptions = Array<BentoListboxOptionItem>;\n\nexport type BentoListboxIsOptionDisabled = undefined | ((optionValue: BentoListboxOptionItem) => boolean);\n\nexport enum BentoListboxEvent {\n    SELECT = 'select',\n    SHOW_MORE = 'show-more',\n    ESCAPE = 'escape-pressed',\n    CLICK = 'click',\n    ENTER = 'enter-pressed',\n    SPACE = 'space-pressed',\n    TAB = 'tab-pressed',\n    CLOSE_DROPDOWN = 'close-dropdown',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoListboxLazyLoadType {\n    AUTOMATIC = 'automatic',\n    BUTTON = 'button',\n    NONE = 'none',\n}\n\nexport interface BentoListboxSearchOptions {\n    /**\n     * Custom debounce time. Default: 300\n     */\n    debounceTime?: number;\n\n    /**\n     * The event that triggers upon user filtering the listbox items.\n     */\n    searchEvent: (searchValue: string) => void;\n}\n\nexport type BentoListboxEmptyStateProps = { action: { icon?: any } & BentoButtonActionObject } & OmitStrict<\n    BentoEmptyStateProps,\n    'variant' | 'image' | 'description'\n>;\n\nexport type BentoListboxVirtulisationOptions = boolean | { itemHeight: UseVirtualListItemHeight };\n\nexport type BentoListboxItemRole = 'treeitem' | 'option';\n","<template>\n    <div class=\"b-listbox-single-select-category\" role=\"group\" :aria-label=\"categoryLabel\">\n        <bento-typography\n            variant=\"caption\"\n            el=\"span\"\n            class=\"b-listbox-single-select-category__label-text\"\n            aria-hidden=\"true\"\n        >\n            {{ categoryLabel }}\n        </bento-typography>\n        <div>\n            <slot />\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { defineComponent } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n\n    export default defineComponent({\n        name: 'bento-listbox-static-category',\n        components: {\n            BentoTypography,\n        },\n        props: {\n            /**\n             * Category label text\n             */\n            categoryLabel: {\n                type: String,\n                required: true,\n            },\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-single-select-category.scss\" />\n","<template>\n    <div\n        class=\"b-listbox-option\"\n        role=\"option\"\n        :class=\"conditionalClasses\"\n        v-bind=\"$attrs\"\n        @click=\"onClick\"\n        @keydown.enter=\"onOptionSelected(BentoListboxEvent.ENTER, $event)\"\n        @keydown.space=\"onOptionSelected(BentoListboxEvent.SPACE, $event)\"\n        @keydown.tab=\"onOptionSelected(BentoListboxEvent.TAB, $event)\"\n    >\n        <slot></slot>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent } from 'vue';\n    import { BentoListboxEvent } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n\n    /**\n     * listbox option wrapper.\n     * Contains only styles and allows the Multi-Select and Single-Select DRY the styles.\n     *\n     * Options and Attributes are inherited (`inheritAttrs: true`)\n     *\n     * @example\n     * <bento-listbox-option\n     *    ...props\n     *    ...attrs\n     * />\n     */\n    export default defineComponent({\n        name: 'bento-listbox-option',\n        props: {\n            /**\n             * Setting this property to true will disable the option.\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * Indicates if the value is selected. Only one element can be selected at a time.\n             */\n            selected: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.CLICK, BentoListboxEvent.ENTER, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit }) {\n            const conditionalClasses = computed(() => ({\n                'b-listbox-option--disabled': props.disabled,\n                'b-listbox-option--selected': props.selected,\n            }));\n\n            const onClick = (e: Event) => {\n                emit(BentoListboxEvent.CLICK, e);\n            };\n\n            const onOptionSelected = (eventName, e: Event) => {\n                emit(eventName, e);\n            };\n\n            return {\n                // Enums\n                BentoKeyboardNavigationKeyDownEvent,\n                BentoListboxEvent,\n\n                // Values\n                conditionalClasses,\n\n                // Events\n                onClick,\n                onOptionSelected,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-option.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M15.0608 4.00011L14.0001 2.93945L6.00011 10.9395L2.00011 6.93945L0.939453 8.00011L6.00011 13.0608L15.0608 4.00011Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <bento-listbox-option\n        class=\"b-listbox-single-select-option\"\n        :disabled=\"disabled\"\n        :selected=\"selected\"\n        :aria-selected=\"ariaSelected\"\n        :aria-disabled=\"ariaDisabled\"\n        :tabindex=\"tabIndex\"\n        @click=\"onOptionSelected(BentoListboxEvent.SELECT)\"\n        @enter-pressed=\"onOptionSelected(BentoListboxEvent.ENTER)\"\n        @space-pressed.prevent=\"onOptionSelected(BentoListboxEvent.SPACE)\"\n        @tab-pressed=\"onOptionSelected(BentoListboxEvent.TAB)\"\n    >\n        <slot v-bind=\"option\">\n            <span class=\"b-listbox-single-select-option__text\">\n                <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                <bento-typography\n                    v-if=\"option.description\"\n                    class=\"b-listbox-single-select-option__description\"\n                    el=\"span\"\n                >\n                    {{ option.description }}\n                </bento-typography>\n            </span>\n        </slot>\n        <span class=\"b-listbox-single-select-option__check-icon\">\n            <checkmark-icon v-show=\"selected\" svg-title=\"selected\" />\n        </span>\n    </bento-listbox-option>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoListboxOption } from '../listbox-option';\n    import { BentoListboxEvent, type BentoListboxOptionItem } from '@/types/listbox';\n    import CheckmarkIcon from '@adyen/ui-assets-icons-16/vue/checkmark';\n\n    /**\n     * Listbox option element.\n     *\n     * @example\n     * <bento-listbox-single-select-option\n     *      v-for=\"option in options\"\n     *      :key=\"option.value\"\n     *      :option=\"option\"\n     *      :selected=\"option.selected\"\n     *      @select=\"onOptionSelected\"\n     * />\n     */\n    export default defineComponent({\n        name: 'bento-listbox-single-select-option',\n        components: {\n            BentoListboxOption,\n            BentoTypography,\n            CheckmarkIcon,\n        },\n        props: {\n            /**\n             * Setting this property to true will disable the option.\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * The option item that contains all the option item's data.\n             * @type {BentoListboxOptionItem}\n             */\n            option: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n\n            /**\n             * Indicates if the value is selected. Only one element can be selected at a time.\n             */\n            selected: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.ENTER, BentoListboxEvent.SELECT, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit }) {\n            const onOptionSelected = eventName => {\n                if (props.disabled) {\n                    return;\n                }\n\n                /**\n                 * Trigerred when an option is clicked or selected via keyboard navigation.\n                 * Indicates which option was selected.\n                 *\n                 * @event {string} - The corresponding event\n                 * @property {number} selectedValue - Selected option's value\n                 */\n                emit(eventName, props.option);\n            };\n\n            const ariaDisabled = computed(() => (props.disabled ? true : null));\n            const ariaSelected = computed(() => (props.selected ? true : null));\n            const tabIndex = computed(() => (props.disabled ? -1 : 0));\n\n            return {\n                // Values\n                ariaDisabled,\n                ariaSelected,\n                tabIndex,\n\n                // Enums\n                BentoListboxEvent,\n\n                // Events\n                onOptionSelected,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-single-select-option.scss\" />\n","import { computed, type Ref, ref } from 'vue';\n\nconst enum ListboxKeyboardNavigationMutationDirection {\n    INCREASE = 'increase',\n    DECREASE = 'decrease',\n}\n\nexport const useListboxKeyboardNavigation = (\n    { items }: { items: Ref<Array<HTMLElement>> },\n    focusItem: (index: number) => void\n) => {\n    const lastItemIndex = computed(() => items.value.length - 1);\n    const focusedIndex = ref(0);\n\n    const mutateFocusedIndex = (direction: ListboxKeyboardNavigationMutationDirection) => {\n        switch (direction) {\n            case ListboxKeyboardNavigationMutationDirection.INCREASE:\n                focusedIndex.value += 1;\n                break;\n            case ListboxKeyboardNavigationMutationDirection.DECREASE:\n                focusedIndex.value -= 1;\n                break;\n            default:\n                break;\n        }\n    };\n\n    const calculateFocusedIndex = ({ edgeCaseItem }, direction) => {\n        const isEdgeCaseItem = focusedIndex.value === edgeCaseItem;\n        if (isEdgeCaseItem) {\n            return;\n        }\n        mutateFocusedIndex(direction);\n        focusItem(focusedIndex.value);\n    };\n\n    const moveToNextElement = (event?: CustomEvent<KeyboardEvent>) => {\n        // prevent arrow down to scroll down the container\n        preventDefault(event);\n        calculateFocusedIndex(\n            {\n                edgeCaseItem: lastItemIndex.value,\n            },\n            ListboxKeyboardNavigationMutationDirection.INCREASE\n        );\n    };\n\n    const moveToPreviousElement = (event?: CustomEvent<KeyboardEvent>) => {\n        // prevent arrow up to scroll up the container\n        preventDefault(event);\n        calculateFocusedIndex(\n            {\n                edgeCaseItem: 0,\n            },\n            ListboxKeyboardNavigationMutationDirection.DECREASE\n        );\n    };\n\n    const moveToFirstElement = () => {\n        focusedIndex.value = 0;\n        focusItem(focusedIndex.value);\n    };\n\n    const moveToLastElement = () => {\n        focusedIndex.value = lastItemIndex.value;\n        focusItem(focusedIndex.value);\n    };\n\n    const setListboxFocusedIndex = (index: number) => {\n        focusedIndex.value = index;\n    };\n\n    const preventDefault = (event?: CustomEvent<KeyboardEvent>) => {\n        event?.detail?.preventDefault();\n    };\n\n    return {\n        moveToFirstElement,\n        moveToLastElement,\n        moveToNextElement,\n        moveToPreviousElement,\n        setListboxFocusedIndex,\n        preventDefault,\n        focusedIndex,\n    };\n};\n","import { type BentoListboxItemRole, type BentoListboxOptions } from '@/types/listbox';\nimport { nextTick, ref, type Ref, watch } from 'vue';\n\n/**\n * Composable that provides a reactive list of visible DOM options within a container.\n * It queries for all elements with `role=\"option\"` inside the container and filters\n * them based on their visibility. This is useful for components with virtual scrolling\n * or complex layouts where not all options are visible at once. It automatically\n * updates the list of visible options whenever the `items` array changes.\n *\n * @param containerRef A ref to the HTML container element that holds the options.\n * @param items The list of items for the listbox. The watcher on this parameter triggers the update.\n * @param role The role of the option elements to query for. Defaults to 'option'.\n * @param checkVisibility If true, it will only return visible options. Defaults to true.\n * @returns An object containing:\n * - `visibleDomOptions`: A reactive list of visible option elements.\n * - `updateVisibleDomOptions`: A function to manually trigger an update of the visible options.\n */\nexport const useVisibleDomOptions = (\n    containerRef: Ref<Element | undefined>,\n    items: Ref<BentoListboxOptions>,\n    role: Ref<BentoListboxItemRole> = ref('option'),\n    checkVisibility: boolean = true\n) => {\n    const visibleDomOptions = ref<Array<HTMLDivElement>>([]);\n\n    const updateVisibleDomOptions = async () => {\n        if (!containerRef.value || containerRef.value.nodeType === Node.COMMENT_NODE) {\n            return;\n        }\n\n        const options = Array.from(containerRef.value.querySelectorAll<HTMLDivElement>(`[role=\"${role.value}\"]`));\n\n        visibleDomOptions.value = checkVisibility\n            ? options.filter((option: HTMLDivElement) => option.checkVisibility())\n            : options;\n    };\n\n    watch(\n        items,\n        () => {\n            nextTick(() => {\n                updateVisibleDomOptions();\n            });\n        },\n        { immediate: true }\n    );\n\n    return {\n        visibleDomOptions,\n        updateVisibleDomOptions,\n    };\n};\n","<template>\n    <div\n        ref=\"listboxRef\"\n        v-bento-keyboard-navigation-directive\n        v-bind=\"ariaAttributes\"\n        role=\"listbox\"\n        v-on=\"listboxListeners\"\n    >\n        <template v-if=\"hasCategories && staticCategories\">\n            <bento-listbox-single-select-category\n                v-for=\"category in items\"\n                :key=\"category.value\"\n                :category-label=\"category.label\"\n            >\n                <bento-listbox-single-select-option\n                    v-for=\"option in category.items\"\n                    :key=\"option.value\"\n                    ref=\"listboxItemRef\"\n                    role=\"option\"\n                    :option=\"option\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :selected=\"option.value === selectedItem.value\"\n                    v-on=\"listboxOptionListeners\"\n                >\n                    <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                        <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                    </template>\n                </bento-listbox-single-select-option>\n            </bento-listbox-single-select-category>\n        </template>\n        <template v-else>\n            <bento-listbox-single-select-option\n                v-for=\"option in items\"\n                :key=\"option.value\"\n                ref=\"listboxItemRef\"\n                role=\"option\"\n                :option=\"option\"\n                :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                :selected=\"option.value === selectedItem.value\"\n                v-on=\"listboxOptionListeners\"\n            >\n                <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                    <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                </template>\n            </bento-listbox-single-select-option>\n        </template>\n    </div>\n</template>\n<script lang=\"ts\">\n    import { computed, defineComponent, type HTMLAttributes, type PropType, ref, toRef } from 'vue';\n    import { BentoListboxSingleSelectCategory } from './components/listbox-single-select-category';\n    import { BentoListboxSingleSelectOption } from '../listbox-single-select-option';\n    import { useListboxKeyboardNavigation } from '../../composables/useListboxKeyboardNavigation';\n    import { useVisibleDomOptions } from '@/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options';\n    import { BentoListboxEvent, type BentoListboxIsOptionDisabled, type BentoListboxOptions } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { type Booleanish } from '@/types/prop-types';\n\n    import { BentoKeyboardNavigationDirective } from '@/directives';\n\n    /**\n     * Listbox single-select options list\n     *\n     * @example\n     * import { BentoListboxMultiSelect } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelect },\n     *     template: `\n     *          <bento-listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-listbox-single-select',\n        components: {\n            BentoListboxSingleSelectCategory,\n            BentoListboxSingleSelectOption,\n        },\n        directives: { BentoKeyboardNavigationDirective },\n        inheritAttrs: false,\n        props: {\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * The `input` value.\n             * Providing an empty string will select no options.\n             * Set to an empty string `''` if you don't want any of the available options to be selected\n             */\n            selectedValue: {\n                type: Array as PropType<BentoListboxOptions>,\n                default: undefined,\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.SELECT, BentoListboxEvent.ENTER, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit, expose, slots, attrs }) {\n            const listboxRef = ref(null);\n            const listboxItemRef = ref([]);\n            const selectedItem = computed(() => !!props.selectedValue?.length && props.selectedValue.at(0));\n            const ariaAttributes = computed(\n                () =>\n                    ({\n                        'aria-label': attrs['aria-label']?.toString() as string,\n                        'aria-busy': attrs['aria-busy']?.toString() as Booleanish,\n                        'aria-atomic': attrs['aria-atomic']?.toString() as Booleanish,\n                        'aria-live': attrs['aria-live']?.toString() as string,\n                    }) as HTMLAttributes\n            );\n\n            /**\n             * Finds out if items have sub items\n             */\n            const hasCategories = computed(() => !!props.items.some(({ items }) => !!items));\n\n            const onOptionSelected = eventName => (selectedOption: BentoListboxOptions) => {\n                emit(eventName, [selectedOption]);\n            };\n\n            // Keyboard navigation\n            const { visibleDomOptions } = useVisibleDomOptions(listboxRef, toRef(props, 'items'), ref('option'), false);\n\n            const focusItem = (nextFocusedItemIndex: number) => {\n                visibleDomOptions.value[nextFocusedItemIndex]?.focus();\n            };\n\n            const {\n                moveToNextElement,\n                moveToPreviousElement,\n                moveToFirstElement,\n                moveToLastElement,\n                setListboxFocusedIndex,\n            } = useListboxKeyboardNavigation(\n                {\n                    items: visibleDomOptions,\n                },\n                focusItem\n            );\n\n            const listboxListeners = {\n                [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: moveToPreviousElement,\n                [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: moveToNextElement,\n                [BentoKeyboardNavigationKeyDownEvent.HOME]: moveToFirstElement,\n                [BentoKeyboardNavigationKeyDownEvent.END]: moveToLastElement,\n            };\n\n            const listboxOptionListeners = {\n                [BentoListboxEvent.SELECT]: onOptionSelected(BentoListboxEvent.SELECT),\n                [BentoListboxEvent.SPACE]: onOptionSelected(BentoListboxEvent.SPACE),\n                [BentoListboxEvent.TAB]: onOptionSelected(BentoListboxEvent.TAB),\n                [BentoListboxEvent.ENTER]: onOptionSelected(BentoListboxEvent.ENTER),\n            };\n\n            expose({\n                /**\n                 * Reference for a single listbox item.\n                 * Required for keyboard navigation in dropdown as $children is removed in vue@3\n                 */\n                listboxItemRef,\n                /**\n                 * Method to set the index of the item to be focused on\n                 * Used for focus management to be kept in-sync with parent e.g. dropdowns\n                 */\n                setListboxFocusedIndex,\n            });\n\n            return {\n                // Enums\n                BentoListboxEvent,\n\n                // Values\n                listboxRef,\n                listboxItemRef,\n                selectedItem,\n                slots,\n                ariaAttributes,\n\n                // Computed\n                hasCategories,\n\n                // Methods\n                onOptionSelected,\n\n                // Keyboard navigation\n                listboxListeners,\n                listboxOptionListeners,\n            };\n        },\n    });\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M9.69043 5.75L4.62988 10.8105L1.56934 7.75L2.62988 6.68945L4.62988 8.68945L8.62988 4.68945L9.69043 5.75Z\"/><path fill=\"#001222\" d=\"M13.9307 5.75L8.87012 10.8105L7.80957 9.75L12.8701 4.68945L13.9307 5.75Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <div class=\"b-checkbox-input\" :class=\"conditionalClasses\" role=\"presentation\">\n        <!-- Don't change order because it matters for CSS. Icons first -->\n        <minus-small-icon v-if=\"indeterminate\" class=\"b-checkbox-input__icon\" svg-title=\"\" aria-hidden=\"true\" />\n        <double-checkmark-small-icon\n            v-else-if=\"allSelected\"\n            class=\"b-checkbox-input__icon\"\n            svg-title=\"\"\n            aria-hidden=\"true\"\n            data-testid=\"decorative-checkbox-double-checkmark-icon\"\n        />\n        <checkmark-small-icon v-else-if=\"checked\" class=\"b-checkbox-input__icon\" svg-title=\"\" aria-hidden=\"true\" />\n        <div class=\"b-checkbox-input__outline\" :class=\"outlineConditionalClasses\" />\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { CheckboxInputState } from '@/internal/checkbox-input/checkbox-input.types';\n    import CheckmarkSmallIcon from '@adyen/ui-assets-icons-16/vue/checkmark-small';\n    import MinusSmallIcon from '@adyen/ui-assets-icons-16/vue/minus-small';\n    import DoubleCheckmarkSmallIcon from '@adyen/ui-assets-icons-16/vue/double-checkmark-small';\n\n    const props = defineProps({\n  disabled: { type: Boolean, default: false },\n  indeterminate: { type: Boolean, default: false },\n  checked: { type: Boolean, default: false },\n  allSelected: { type: Boolean, default: false }\n});\n\n    const conditionalClasses = computed(() => ({\n        [`b-checkbox-input--${CheckboxInputState.DISABLED}`]: props.disabled,\n    }));\n\n    const outlineConditionalClasses = computed(() => ({\n        [`b-checkbox-input__outline--${CheckboxInputState.UNCHECKED}`]:\n            !props.checked && !props.indeterminate && !props.allSelected,\n        [`b-checkbox-input__outline--${CheckboxInputState.CHECKED}`]:\n            (props.checked || props.allSelected) && !props.indeterminate,\n        [`b-checkbox-input__outline--${CheckboxInputState.INDETERMINATE}`]: props.indeterminate,\n    }));\n</script>\n\n<script lang=\"ts\">\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"@/internal/checkbox-input/checkbox-input.scss\" />\n","export enum ListboxMultiSelectCategoryClass {\n    DISABLED = 'disabled',\n    STATIC_CATEGORY = 'static-category',\n}\n\nexport enum ListboxMultiSelectCategoryEvent {\n    SELECT_CATEGORY = 'select-category',\n    UNSELECT_CATEGORY = 'unselect-category',\n    TOGGLE_CATEGORY_VISIBILITY = 'toggle-category-visibility',\n}\n","<template>\n    <div>\n        <bento-listbox-option\n            v-if=\"!isStaticCategory\"\n            class=\"b-listbox-multi-select-category__option\"\n            :class=\"conditionalClass\"\n            :tabindex=\"tabindex\"\n            :aria-selected=\"ariaCheckedComputed !== 'false'\"\n            :aria-checked=\"ariaCheckedComputed\"\n            :aria-disabled=\"hasAllPropsDisabled\"\n            :aria-expanded=\"`${isOpen}`\"\n            role=\"treeitem\"\n            :aria-owns=\"categoryGroupId\"\n            :aria-labelledby=\"categoryNameId\"\n            @click=\"handleSelectAll\"\n            @enter-pressed=\"handleSelectAll\"\n            @space-pressed.prevent=\"handleSelectAll\"\n            @keydown.arrow-left.native=\"toggleOpen($event, false)\"\n            @keydown.arrow-right.native=\"toggleOpen($event, true)\"\n        >\n            <decorative-checkbox\n                :indeterminate=\"isIndeterminate\"\n                :disabled=\"hasAllPropsDisabled\"\n                :checked=\"isAllSelected\"\n            />\n            <span class=\"b-listbox-multi-select-category__label\">\n                <bento-typography :id=\"categoryNameId\" el=\"span\" class=\"b-listbox-multi-select-category__label-text\">\n                    {{ category.label }}\n                </bento-typography>\n                <div\n                    aria-hidden=\"true\"\n                    class=\"b-listbox-multi-select-category__label-chevron\"\n                    data-testid=\"toggle-listbox\"\n                    @click.capture.stop=\"toggleOpen\"\n                >\n                    <chevron-up-icon v-if=\"isOpen\" :svg-title=\"chevronTitle\" />\n                    <chevron-down-icon v-else :svg-title=\"chevronTitle\" />\n                </div>\n            </span>\n        </bento-listbox-option>\n\n        <div\n            v-else\n            class=\"b-listbox-multi-select-category b-listbox-multi-select-category--static-category\"\n            aria-hidden=\"true\"\n        >\n            <span class=\"b-listbox-multi-select-category__label\">\n                <bento-typography el=\"span\" variant=\"caption\" class=\"b-listbox-multi-select-category__label-text\">\n                    {{ category.label }}\n                </bento-typography>\n            </span>\n        </div>\n\n        <div v-show=\"showItemChildren\" :id=\"categoryGroupId\" role=\"group\" :aria-label=\"category.label\">\n            <slot />\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType, ref, toRef, watch } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoListboxOption } from '../../../../../listbox-option';\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n\n    import {\n        type BentoListboxIsOptionDisabled,\n        type BentoListboxMultiSelectValue,\n        type BentoListboxOptionItem,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { useCheckboxSelectAll } from '@/composables';\n    import {\n        ListboxMultiSelectCategoryClass,\n        ListboxMultiSelectCategoryEvent,\n    } from './listbox-multi-select-category.types';\n    import { useI18n } from '@/utils/ts/i18n';\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    import messages from './messages.json';\n    import { generateUid } from '@/core/utils/ts';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    /**\n     * Listbox multi-select category list.\n     * Allows the rendering of nested lists\n     *\n     * @example\n     * import { ListboxMultiSelectCategory } from '@/internal/listbox';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelectCategory },\n     *     template: `\n     *          <listbox-multi-select-category\n     *              :category=\"option\"\n     *              :is-option-disabled=\"true\"\n     *              :selected-items-list=\"['option-1']\"\n     *              @select-category=\"$emit('select-category', option)\"\n     *              @unselect-category=\"$emit('unselect-category', option)\"\n     *          >\n     *              <listbox-multi-select-options\n     *                  category-items\n     *                  :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *                  :is-multi-level=\"true\"\n     *                  :selected-items-list=\"['option-']\"\n     *                  :searching=\"false\"\n     *                  @toggle-checkbox-selection=\"value => toggleCheckboxSelection(value)\"\n     *              />\n     *          </listbox-multi-select-category>\n     *     `\n     * }\n     */\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-listbox-multi-select-category',\n        components: {\n            BentoTypography,\n            BentoListboxOption,\n            ChevronDownIcon,\n            ChevronUpIcon,\n            DecorativeCheckbox,\n        },\n        props: {\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             * @property {BentoListboxOptionItem} value.items - Category items list\n             */\n            category: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: [Function] as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The `input` value.\n             * Providing an empty array will select no options.\n             */\n            selectedItemsList: {\n                type: Array as PropType<Array<BentoListboxValue>>,\n                default: () => [],\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Category's tabindex\n             */\n            tabindex: { type: Number, default: -1 },\n        },\n        emits: [\n            ListboxMultiSelectCategoryEvent.SELECT_CATEGORY,\n            ListboxMultiSelectCategoryEvent.UNSELECT_CATEGORY,\n            ListboxMultiSelectCategoryEvent.TOGGLE_CATEGORY_VISIBILITY,\n        ],\n        setup(props, { emit }) {\n            const isOpen = ref(false);\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const categoryGroupId = generateUid('category-group');\n            const categoryNameId = generateUid('category-name');\n\n            // This method should be used to determine if an option is disabled as it works for both vue 2 & 3.\n            const vue2Vue3FixedisOptionDisabled = option =>\n                props.isOptionDisabled ? props.isOptionDisabled(option) : false;\n\n            const hasAllPropsDisabled = computed(() =>\n                props.category.items.every(option => vue2Vue3FixedisOptionDisabled(option))\n            );\n\n            const isStaticCategory = toRef(props, 'staticCategories');\n\n            // Display item children if is open state or if static categories is enabled\n            const showItemChildren = computed(() => isOpen.value || props.staticCategories);\n\n            const conditionalClass = computed(() => ({\n                [`b-listbox-multi-select-category--${ListboxMultiSelectCategoryClass.DISABLED}`]:\n                    hasAllPropsDisabled.value,\n            }));\n\n            const toggleOpen = (event: Event, open?: boolean) => {\n                event.preventDefault();\n                isOpen.value = open !== undefined ? open : !isOpen.value;\n                emit(ListboxMultiSelectCategoryEvent.TOGGLE_CATEGORY_VISIBILITY, props.category.value);\n            };\n\n            const optionStates = (option: BentoListboxOptionItem) => {\n                const isDisabled = vue2Vue3FixedisOptionDisabled(option);\n                const isPreSelected =\n                    (props.selectedItemsList as BentoListboxMultiSelectValue)?.includes(option.value) || false;\n                return { isDisabled, isPreSelected };\n            };\n\n            const enabledItems = computed(() =>\n                props.category.items.filter(option => {\n                    const { isDisabled, isPreSelected } = optionStates(option);\n                    return (isDisabled && isPreSelected) || !isDisabled;\n                })\n            );\n\n            const visibleSelectedList = computed(\n                () =>\n                    enabledItems.value?.filter(({ value }) =>\n                        props.selectedItemsList?.includes(value)\n                    ) as unknown as BentoListboxMultiSelectValue\n            );\n\n            const chevronTitle = computed(() => {\n                const messageName = isOpen.value ? 'categoryOpened' : 'categoryClosed';\n                return t(messageName, { category: props.category.label }) as string;\n            });\n\n            const selectAll = () => {\n                emit(ListboxMultiSelectCategoryEvent.SELECT_CATEGORY);\n            };\n            const unselectAll = () => {\n                emit(ListboxMultiSelectCategoryEvent.UNSELECT_CATEGORY);\n            };\n\n            const { isAllSelected, isIndeterminate, toggleSelectAll } = useCheckboxSelectAll(\n                visibleSelectedList,\n                enabledItems,\n                selectAll,\n                unselectAll\n            );\n\n            const ariaCheckedComputed = computed(() => {\n                if (isIndeterminate.value) {\n                    return 'mixed';\n                }\n\n                return `${isAllSelected.value}`;\n            });\n\n            const isSelectAllOn = ref(isAllSelected.value);\n\n            const handleSelectAll = () => {\n                isSelectAllOn.value = !isSelectAllOn.value;\n                toggleSelectAll(isSelectAllOn.value);\n            };\n\n            watch(isAllSelected, () => {\n                isSelectAllOn.value = isAllSelected.value;\n            });\n\n            return {\n                // Values\n                chevronTitle,\n                conditionalClass,\n                hasAllPropsDisabled,\n                isOpen,\n                isAllSelected,\n                isIndeterminate,\n                isStaticCategory,\n                categoryGroupId,\n                categoryNameId,\n\n                // Computed\n                showItemChildren,\n                ariaCheckedComputed,\n\n                // Methods\n                handleSelectAll,\n                toggleOpen,\n                toggleSelectAll,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select-category.scss\" />\n","export enum ListboxMultiSelectOptionsEvent {\n    SELECT_CATEGORY = 'select-category',\n    TOGGLE_CHECKBOX_SELECTION = 'toggle-checkbox-selection',\n    UNSELECT_CATEGORY = 'unselect-category',\n    TOGGLE_CATEGORY_VISIBILITY = 'toggle-category-visibility',\n}\n","<template>\n    <div>\n        <div v-for=\"option in items\" :key=\"`selected-${option.value}`\">\n            <template v-if=\"searching && isMultiLevel\">\n                <bento-listbox-option\n                    class=\"b-listbox-multi-select-options\"\n                    :class=\"conditionalClasses\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :tabindex=\"computedTabindex(option.value)\"\n                    :aria-selected=\"`${isOptionSelected(option)}`\"\n                    :aria-checked=\"`${isOptionSelected(option)}`\"\n                    :aria-disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :role=\"$attrs['role']\"\n                    @click=\"toggleSearchOption(option)\"\n                    @enter-pressed=\"toggleSearchOption(option)\"\n                    @space-pressed.prevent=\"toggleSearchOption(option)\"\n                >\n                    <decorative-checkbox\n                        :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                        :checked=\"isOptionSelected(option)\"\n                    />\n                    <slot v-bind=\"option\">\n                        <span class=\"b-listbox-multi-select__option-text\">\n                            <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                            <bento-typography\n                                v-if=\"shouldShowDescription(option)\"\n                                class=\"b-listbox-multi-select__option-description\"\n                                el=\"span\"\n                            >\n                                {{ option.description }}\n                            </bento-typography>\n                        </span>\n                    </slot>\n                </bento-listbox-option>\n            </template>\n\n            <template v-else>\n                <!-- Category -->\n                <template v-if=\"option.items\">\n                    <listbox-multi-select-category\n                        :category=\"option\"\n                        :static-categories=\"staticCategories\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        :selected-items-list=\"selectedItemsList\"\n                        :tabindex=\"computedTabindex(option.value)\"\n                        @select-category=\"$emit(ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, option)\"\n                        @unselect-category=\"$emit(ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, option)\"\n                        @toggle-category-visibility=\"\n                            $emit(ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY, $event)\n                        \"\n                    >\n                        <listbox-multi-select-options\n                            category-items\n                            :items=\"option.items\"\n                            :is-option-disabled=\"isOptionDisabled\"\n                            :items-index=\"itemsIndex\"\n                            :focused-index=\"focusedIndex\"\n                            :is-multi-level=\"isMultiLevel\"\n                            :static-categories=\"staticCategories\"\n                            :selected-items-list=\"selectedItemsList\"\n                            :searching=\"searching\"\n                            :role=\"$attrs['role']\"\n                            @toggle-checkbox-selection=\"value => toggleCheckboxSelection(value)\"\n                        />\n                    </listbox-multi-select-category>\n                </template>\n\n                <!-- Option -->\n                <bento-listbox-option\n                    v-else\n                    class=\"b-listbox-multi-select-options\"\n                    :class=\"conditionalClasses\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :tabindex=\"computedTabindex(option.value)\"\n                    :aria-selected=\"`${isOptionSelected(option)}`\"\n                    :aria-checked=\"`${isOptionSelected(option)}`\"\n                    :aria-disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :role=\"$attrs['role']\"\n                    @click=\"toggleCheckboxSelection(option)\"\n                    @enter-pressed=\"toggleCheckboxSelection(option)\"\n                    @space-pressed.prevent=\"toggleCheckboxSelection(option)\"\n                >\n                    <decorative-checkbox\n                        :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                        :checked=\"isOptionSelected(option)\"\n                    />\n                    <slot v-bind=\"option\">\n                        <span class=\"b-listbox-multi-select__option-text\">\n                            <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                            <bento-typography\n                                v-if=\"shouldShowDescription(option)\"\n                                class=\"b-listbox-multi-select__option-description\"\n                                el=\"span\"\n                            >\n                                {{ option.description }}\n                            </bento-typography>\n                        </span>\n                    </slot>\n                </bento-listbox-option>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import { BentoListboxOption } from '../../../listbox-option';\n    import { BentoTypography } from '@/components/typography';\n    import { ListboxMultiSelectCategory } from './components/listbox-multi-select-category';\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n\n    import {\n        BentoListboxEvent,\n        type BentoListboxIsOptionDisabled,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { ListboxMultiSelectOptionsEvent } from './listbox-multi-select-options.types';\n\n    /**\n     * Listbox multi-select options list\n     *\n     * @example\n     * import { ListboxMultiSelectOptions } from './components/listbox-multi-select-options';\n     *\n     * export default {\n     *     components: { ListboxMultiSelect },\n     *     template: `\n     *          <listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'listbox-multi-select-options',\n        components: {\n            BentoListboxOption,\n            BentoTypography,\n            ListboxMultiSelectCategory,\n            DecorativeCheckbox,\n        },\n        inheritAttrs: false,\n        props: {\n            /**\n             * Indicates if the items listed are inside a category\n             * so they can be padded to right by one level in recursion.\n             * Items of categories are automatically defined as \"categoryItems\"\n             */\n            categoryItems: { type: Boolean, default: false },\n\n            /**\n             * Current focused option index\n             */\n            focusedIndex: { type: Number, default: 0 },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * Indicates if the elements options are inside a multi-level category\n             */\n            isMultiLevel: { type: Boolean, default: false },\n\n            /**\n             * Flag that indicates that an external search it's being made\n             * to filter out the items inside the the multi-select listbox\n             *\n             * If enabled, hides the \"Select all\" checkbox in \"multiple\" mode.\n             */\n            searching: { type: Boolean, default: false },\n\n            /**\n             * List of selected items.\n             * Providing an empty array will select no options.\n             */\n            selectedItemsList: {\n                type: Array as PropType<Array<BentoListboxValue>>,\n                default: () => [],\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Object with the index of each item.\n             */\n            itemsIndex: {\n                type: Object as PropType<Record<string, number>>,\n                default: () => ({}),\n            },\n        },\n        emits: [\n            ListboxMultiSelectOptionsEvent.TOGGLE_CHECKBOX_SELECTION,\n            ListboxMultiSelectOptionsEvent.SELECT_CATEGORY,\n            ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY,\n            ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY,\n        ],\n        setup(props, { emit }) {\n            const toggleCheckboxSelection = (option: BentoListboxOptionItem) => {\n                if (props.isOptionDisabled(option)) {\n                    return;\n                }\n                emit(ListboxMultiSelectOptionsEvent.TOGGLE_CHECKBOX_SELECTION, option);\n            };\n\n            const isCategory = (option: BentoListboxOptionItem) => !!option.items;\n            const shouldShowDescription = (option: BentoListboxOptionItem) => {\n                const isSearchingMultiLevel = props.isMultiLevel && props.searching;\n\n                return option.description && (!props.isMultiLevel || isSearchingMultiLevel);\n            };\n\n            const isOptionSelected = option => {\n                if (option.items) {\n                    return !!option.items.find(item => props.selectedItemsList.includes(item.value));\n                }\n                return props.selectedItemsList.includes(option.value);\n            };\n\n            const toggleSearchOption = option => {\n                if (isCategory(option)) {\n                    const event = isOptionSelected(option)\n                        ? ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY\n                        : ListboxMultiSelectOptionsEvent.SELECT_CATEGORY;\n                    emit(event, option);\n                } else {\n                    toggleCheckboxSelection(option);\n                }\n            };\n\n            const conditionalClasses = computed(() => ({\n                'b-listbox-multi-select-options__static-category-option': props.staticCategories,\n                'b-listbox-multi-select-options__category-option': props.categoryItems,\n            }));\n\n            const computedTabindex = value => (props.itemsIndex[value] === props.focusedIndex ? 0 : -1);\n\n            return {\n                // Values\n                conditionalClasses,\n\n                // Methods\n                isOptionSelected,\n                shouldShowDescription,\n                toggleCheckboxSelection,\n                toggleSearchOption,\n                computedTabindex,\n\n                // Enums\n                BentoListboxEvent,\n                ListboxMultiSelectOptionsEvent,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select-options.scss\" />\n","import { type BentoListboxOptions } from '@/types/listbox';\nimport { computed, type Ref } from 'vue';\n\n/**\n * Checks if items array is flat or has multi levels and converts items into a flat array if needed\n *\n * It receives a layout of type @see BentoLayoutGroupProportions to\n * generate the class and apply it to the children of the @see BentoFormLayoutGroup component\n *\n * @param {Ref<BentoListboxOptions>} itemsList - ref of the list of items for the listbox\n * @returns {ComputedRef<boolean>} isMultiLevelSelect - Indicates if items array is multi level\n * @returns {ComputedRef<any[]>} flattenedItemsList - list of items computed into a flat array\n */\nexport const useMultiLevelItems = (itemsList: Ref<BentoListboxOptions>) => {\n    const isMultiLevelSelect = computed(() => !!itemsList.value?.find(({ items }) => !!items));\n\n    const flattenedItemsList = computed(() => {\n        if (isMultiLevelSelect.value) {\n            return itemsList.value?.reduce((acc, val) => {\n                if (val.items) {\n                    acc.push(...val.items.flat());\n                } else {\n                    acc.push(val);\n                }\n                return acc;\n            }, []);\n        }\n\n        return itemsList.value;\n    });\n\n    return {\n        isMultiLevelSelect,\n        flattenedItemsList,\n    };\n};\n","<template>\n    <div ref=\"listboxRef\" class=\"b-listbox-multi-select\">\n        <!-- Selected options -->\n        <div v-if=\"showSelectedItems\">\n            <ul\n                v-bento-keyboard-navigation-directive\n                class=\"b-listbox-multi-select__chips\"\n                v-on=\"chipsSectionListeners\"\n            >\n                <li v-for=\"item in selectedOptions\" :key=\"item.value\">\n                    <bento-chip\n                        ref=\"selectedListboxItemsRef\"\n                        :disabled=\"isOptionDisabled(item)\"\n                        :label=\"item.label\"\n                        condensed\n                        @click=\"item.items ? unselectAllCategory(item) : toggleCheckboxSelection('select', item)\"\n                    />\n                </li>\n            </ul>\n\n            <hr class=\"b-listbox-multi-select__divider\" aria-hidden=\"true\" />\n        </div>\n\n        <div v-bento-keyboard-navigation-directive v-bind=\"ariaAttributes\" :role=\"computedRole\" v-on=\"listboxListeners\">\n            <!-- Select all -->\n            <bento-listbox-option\n                v-if=\"showSelectAllCheckbox\"\n                ref=\"selectAllListboxItemsRef\"\n                class=\"b-listbox-multi-select__option\"\n                :tabindex=\"focusedIndex === 0 ? 0 : -1\"\n                :aria-selected=\"ariaCheckedComputed !== 'false'\"\n                :aria-checked=\"ariaCheckedComputed\"\n                :role=\"computedOptionRole\"\n                @click=\"handleSelectAll\"\n                @enter-pressed=\"handleSelectAll\"\n                @space-pressed.prevent=\"handleSelectAll\"\n            >\n                <decorative-checkbox :checked=\"isAllSelected\" :indeterminate=\"isIndeterminate\" />\n                <bento-typography el=\"span\">\n                    {{ selectAllCheckboxText }}\n                </bento-typography>\n            </bento-listbox-option>\n            <hr v-if=\"showSelectAllCheckbox\" class=\"b-listbox-multi-select__divider\" aria-hidden=\"true\" />\n\n            <!-- Available options -->\n            <listbox-multi-select-options\n                ref=\"listboxItemsRef\"\n                :items=\"items\"\n                :is-option-disabled=\"isOptionDisabled\"\n                :is-multi-level=\"isMultiLevelSelect\"\n                :static-categories=\"staticCategories\"\n                :searching=\"searching\"\n                :selected-items-list=\"selectedItemsList\"\n                :focused-index=\"focusedIndex\"\n                :items-index=\"computedItemsIndex\"\n                :role=\"computedOptionRole\"\n                @toggle-checkbox-selection=\"toggleCheckboxSelection('select', $event)\"\n                @select-category=\"selectAllCategory\"\n                @unselect-category=\"unselectAllCategory\"\n                @toggle-category-visibility=\"toggleCategoryVisibility\"\n                @space-pressed=\"toggleCheckboxSelection(BentoListboxEvent.SPACE, $event)\"\n                @tab-pressed=\"toggleCheckboxSelection(BentoListboxEvent.TAB, $event)\"\n                @enter-pressed=\"toggleCheckboxSelection(BentoListboxEvent.ENTER, $event)\"\n            >\n                <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                    <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                </template>\n            </listbox-multi-select-options>\n        </div>\n    </div>\n</template>\n<script setup lang=\"ts\">\n    import { computed, type HTMLAttributes, nextTick, ref, toRef, useAttrs, useSlots, watch } from 'vue';\n    import { isVue2 } from 'vue-demi';\n\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoChip } from '@/components/chip';\n    import { BentoListboxOption } from '../listbox-option';\n    import { ListboxMultiSelectOptions } from './components/listbox-multi-select-options';\n\n    import { useCheckboxSelectAll } from '@/composables';\n    import { useListboxKeyboardNavigation } from '../../composables/useListboxKeyboardNavigation';\n    import { useMultiLevelItems } from '../../composables/use-multi-level-items/use-multi-level-items';\n    import { useVisibleDomOptions } from '@/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options';\n\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoKeyboardNavigationDirective as vBentoKeyboardNavigationDirective } from '@/directives';\n\n    import {\n        BentoListboxEvent,\n        type BentoListboxMultiSelectValue,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { type Booleanish } from '@/types/prop-types';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { type ListboxMultiSelectProps } from './listbox-multi-select.types';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  hasMoreItems: { type: Boolean, default: false },\n  isOptionDisabled: { default: isVue2 ? () => () => false : () => false },\n  items: null,\n  lazyLoadType: { default: 'none' },\n  searching: { type: Boolean, default: false },\n  selectedValues: null,\n  staticCategories: { type: Boolean, default: false }\n});\n\n    const emit = defineEmits([\"select\"]);\n\n    const { t, n } = useI18n<{ message: MessageSchema }>({ messages });\n    const slots = useSlots();\n    const attrs = useAttrs();\n    const ariaAttributes = computed(\n        () =>\n            ({\n                'aria-label': attrs['aria-label']?.toString() as string,\n                'aria-busy': attrs['aria-busy']?.toString() as Booleanish,\n                'aria-atomic': attrs['aria-atomic']?.toString() as Booleanish,\n                'aria-live': attrs['aria-live']?.toString() as string,\n                'aria-multiselectable': true,\n            }) as HTMLAttributes\n    );\n    const listboxRef = ref(null);\n    const selectAllListboxItemsRef = ref(null);\n    const selectedListboxItemsRef = ref(null);\n    const listboxItemsRef = ref(null);\n\n    const selectedItemsList = computed<Array<BentoListboxValue>>(() => props.selectedValues.map(({ value }) => value));\n\n    const { isMultiLevelSelect, flattenedItemsList } = useMultiLevelItems(toRef(props, 'items'));\n\n    const isTreePattern = computed(() => isMultiLevelSelect.value && !props.staticCategories);\n\n    const computedRole = computed(() => (isTreePattern.value ? 'tree' : 'listbox'));\n    const computedOptionRole = computed(() => (isTreePattern.value ? 'treeitem' : 'option'));\n\n    const optionStates = (option: BentoListboxOptionItem) => {\n        const isDisabled = props.isOptionDisabled(option);\n        const isPreSelected =\n            (selectedItemsList.value as BentoListboxMultiSelectValue)?.includes(option.value) || false;\n        return { isDisabled, isPreSelected };\n    };\n\n    // Items that are not disabled and pre-selected disabled items\n    const enabledItems = computed(() => {\n        if (props.searching && isMultiLevelSelect) {\n            return props.items;\n        }\n\n        const fullItemsList = flattenedItemsList.value.filter(option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return (isDisabled && isPreSelected) || !isDisabled;\n        });\n\n        props.selectedValues.forEach(selectedValue => {\n            if (!fullItemsList.find(item => item.value === selectedValue.value)) {\n                fullItemsList.push(selectedValue);\n            }\n        });\n\n        return fullItemsList;\n    });\n\n    const visibleSelectedList = computed(\n        () =>\n            enabledItems.value?.filter(option => {\n                if (option.items && isMultiLevelSelect.value && props.searching) {\n                    const amountOfSelectedCategoryOptions = option.items.filter(categoryOption =>\n                        (props.selectedValues ?? []).includes(categoryOption.value)\n                    ).length;\n                    return amountOfSelectedCategoryOptions === option.items.length;\n                }\n\n                return selectedItemsList.value?.includes(option.value); // Check for category\n            }) as BentoListboxMultiSelectValue\n    );\n\n    const calculateTotalItems = () => {\n        if (isMultiLevelSelect.value && !props.searching) {\n            return flattenedItemsList.value.length;\n        }\n\n        return props.items.length;\n    };\n\n    const selectAllCheckboxText = computed(() => {\n        const possibleSelections = enabledItems.value.length;\n        const total = calculateTotalItems();\n        const amountSelectedValues = visibleSelectedList.value?.length || 0;\n\n        if (amountSelectedValues === 0) {\n            return t('selectAll', { total: n(possibleSelections) });\n        }\n\n        if (amountSelectedValues === total) {\n            return t('allSelected', { total: n(total) });\n        }\n\n        return amountSelectedValues <= total\n            ? t('numberOfTotalSelected', { number: n(amountSelectedValues), total: n(total) })\n            : t('numbersSelected', { number: n(amountSelectedValues) });\n    });\n\n    const selectAll = (selectableItems: BentoListboxOptions) => {\n        const filterOutDisabledAndNotPreselectedOptions = option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return (isDisabled && isPreSelected) || !isDisabled;\n        };\n\n        // Adding or removing this list of values\n        const addOrRemoveList = selectableItems\n            .filter(filterOutDisabledAndNotPreselectedOptions)\n            .filter(item => !selectedItemsList.value.includes(item.value)); // MAKE SURE NOT TO ADD DUPLICATES\n\n        emit('select', [...props.selectedValues, ...addOrRemoveList]);\n    };\n\n    const unselectAll = (selectableItems: BentoListboxOptions) => {\n        const findEnabledUnselectedItems = option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return !(isDisabled && isPreSelected);\n        };\n\n        const unselectedItemsList = selectableItems.filter(findEnabledUnselectedItems).map(({ value }) => value);\n        const newSelectedList = props.selectedValues.filter(item => !unselectedItemsList?.includes(item.value));\n        emit('select', newSelectedList);\n    };\n\n    const selectAllItems = () => {\n        selectAll(flattenedItemsList.value);\n    };\n\n    const unselectAllItems = () => {\n        unselectAll(flattenedItemsList.value);\n    };\n\n    const { isAllSelected, isIndeterminate, toggleSelectAll } = useCheckboxSelectAll(\n        visibleSelectedList,\n        enabledItems,\n        selectAllItems,\n        unselectAllItems\n    );\n\n    const ariaCheckedComputed = computed(() => {\n        if (isIndeterminate.value) {\n            return 'mixed';\n        }\n\n        return `${isAllSelected.value}`;\n    });\n\n    const isSelectAllOn = ref(isAllSelected.value);\n\n    const handleSelectAll = () => {\n        isSelectAllOn.value = !isSelectAllOn.value;\n        toggleSelectAll(isSelectAllOn.value);\n    };\n\n    watch(isAllSelected, () => {\n        isSelectAllOn.value = isAllSelected.value;\n    });\n\n    const selectAllCategory = (category: BentoListboxOptionItem) => {\n        selectAll(category.items);\n    };\n\n    const unselectAllCategory = (category: BentoListboxOptionItem) => {\n        unselectAll(category.items);\n    };\n\n    const toggleCheckboxSelection = (eventName, selectedOption: BentoListboxOptionItem) => {\n        let exists = false;\n        const newSelectedList = props.selectedValues.filter(({ value }) => {\n            if (selectedOption.value === value) {\n                exists = true;\n                return false;\n            }\n\n            return true;\n        });\n\n        if (!exists) {\n            newSelectedList.push(selectedOption);\n        }\n        emit(eventName, newSelectedList);\n    };\n\n    const selectedOptions = computed(() => {\n        if (!isMultiLevelSelect.value) {\n            return props.selectedValues;\n        }\n\n        const isOptionSelected = (option: BentoListboxOptionItem): boolean =>\n            (selectedItemsList.value as unknown as Array<string | number>).includes(option.value);\n\n        const categoryOptionsSelected = (categoryOptions: Array<BentoListboxOptionItem>): boolean =>\n            !props.staticCategories && categoryOptions.every(option => isOptionSelected(option));\n\n        const optionsFlat = props.items.flatMap(option =>\n            option.items && !categoryOptionsSelected(option.items) ? option.items : option\n        );\n\n        const options = optionsFlat.filter(option => {\n            if (option.items) {\n                return true;\n            }\n            return isOptionSelected(option);\n        });\n\n        return options;\n    });\n\n    const showSelectedItems = computed(() => {\n        const isLazyLoad = ['automatic', 'button'].includes(props.lazyLoadType);\n        const hasAllItemsSelected =\n            props.selectedValues?.length > 0 && visibleSelectedList.value?.length !== flattenedItemsList.value?.length;\n\n        if (isLazyLoad && props.hasMoreItems) {\n            return !!props.selectedValues?.length;\n        }\n\n        return hasAllItemsSelected;\n    });\n\n    const showSelectAllCheckbox = computed(() => {\n        const isLazyLoad = ['automatic', 'button'].includes(props.lazyLoadType);\n\n        if (!isLazyLoad) {\n            return true;\n        }\n\n        return !props.hasMoreItems;\n    });\n\n    // Keyboard navigation\n    const expandedCategories = ref([]);\n\n    const { visibleDomOptions, updateVisibleDomOptions } = useVisibleDomOptions(\n        listboxRef,\n        toRef(props, 'items'),\n        computedOptionRole\n    );\n\n    const toggleCategoryVisibility = category => {\n        if (expandedCategories.value.includes(category)) {\n            expandedCategories.value = expandedCategories.value.filter(item => item !== category);\n        } else {\n            expandedCategories.value.push(category);\n        }\n\n        nextTick(() => {\n            updateVisibleDomOptions();\n        });\n    };\n\n    const focusItem = (nextFocusedItemIndex: number) => {\n        visibleDomOptions.value[nextFocusedItemIndex]?.focus();\n    };\n\n    const {\n        moveToNextElement,\n        moveToPreviousElement,\n        moveToFirstElement,\n        moveToLastElement,\n        preventDefault,\n        focusedIndex,\n        setListboxFocusedIndex,\n    } = useListboxKeyboardNavigation(\n        {\n            items: visibleDomOptions,\n        },\n        focusItem\n    );\n\n    const listboxListeners = {\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: (event: CustomEvent<KeyboardEvent>) =>\n            moveToPreviousElement(event),\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: (event: CustomEvent<KeyboardEvent>) =>\n            moveToNextElement(event),\n        [BentoKeyboardNavigationKeyDownEvent.HOME]: moveToFirstElement,\n        [BentoKeyboardNavigationKeyDownEvent.END]: moveToLastElement,\n    };\n\n    defineExpose({\n        /**\n         * Method to set the index of the item to be focused on\n         * Used for focus management to be kept in-sync with parent e.g. dropdowns\n         */\n        setListboxFocusedIndex,\n    });\n\n    const chipsSectionListeners = {\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: preventDefault,\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: preventDefault,\n    };\n\n    const computedItemsIndex = computed(() => {\n        let itemIndex = 1;\n        const indexMap = {};\n\n        props.items.forEach(item => {\n            let subItemsVisible = expandedCategories.value.includes(item.value);\n\n            if (item.items) {\n                if (props.staticCategories) {\n                    subItemsVisible = true;\n                } else {\n                    indexMap[item.value] = itemIndex++;\n                }\n\n                if (subItemsVisible) {\n                    item.items.forEach(subItem => (indexMap[subItem.value] = itemIndex++));\n                }\n            } else {\n                indexMap[item.value] = itemIndex++;\n            }\n        });\n        return indexMap;\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Listbox multi-select options list\n     *\n     * @example\n     * import { BentoListboxMultiSelect } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelect },\n     *     template: `\n     *          <bento-listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default { i18n: { messages } };\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select.scss\" />\n","<template>\n    <div\n        :id=\"id\"\n        ref=\"listboxRef\"\n        v-bento-keyboard-navigation-directive\n        class=\"b-listbox\"\n        tabindex=\"-1\"\n        v-bind=\"listboxContainerAttributes\"\n        :style=\"containerProps?.style\"\n        data-testid=\"listbox-container\"\n        @scroll=\"onListboxContainerScroll\"\n    >\n        <div v-bind=\"wrapperProps\">\n            <!-- Loading filtered items loading -->\n            <div v-if=\"componentLoading\" class=\"b-listbox__loading-filtered-items\">\n                <bento-loading-indicator />\n            </div>\n            <!-- Empty search message -->\n            <div v-else-if=\"isSearchResultEmpty\" class=\"b-listbox__empty-search-message\">\n                <bento-empty-state v-if=\"emptyState\" v-bind=\"limitedEmptyStateProps\" />\n                <bento-typography v-else el=\"span\">{{ noResultsMessage }}</bento-typography>\n            </div>\n\n            <template v-else>\n                <!-- Multi select -->\n                <template v-if=\"multiple\">\n                    <bento-listbox-multi-select\n                        ref=\"listboxItemRef\"\n                        :has-more-items=\"hasMoreItems\"\n                        v-bind=\"ariaAttributes\"\n                        :items=\"items\"\n                        :lazy-load-type=\"lazyLoadType\"\n                        :static-categories=\"staticCategories\"\n                        :selected-values=\"selectedValue\"\n                        :searching=\"searching\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        v-on=\"listboxListeners\"\n                    >\n                        <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                            <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                        </template>\n                    </bento-listbox-multi-select>\n                </template>\n\n                <!-- Single select -->\n                <template v-else>\n                    <bento-listbox-single-select\n                        ref=\"listboxItemRef\"\n                        :items=\"virtualisedItems\"\n                        v-bind=\"ariaAttributes\"\n                        :selected-value=\"selectedValue\"\n                        :static-categories=\"staticCategories\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        v-on=\"listboxListeners\"\n                    >\n                        <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                            <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                        </template>\n                    </bento-listbox-single-select>\n                </template>\n\n                <!-- Lazy Loading -->\n                <div v-if=\"shouldDisplayShowMoreButton\" class=\"b-listbox__lazy-load\">\n                    <bento-loading-button :state=\"loadingButtonState\" variant=\"secondary\" @click.capture=\"emitShowMore\">\n                        {{ showMoreButtonText }}\n                    </bento-loading-button>\n                </div>\n                <div v-else-if=\"loading\" class=\"b-listbox__lazy-load\">\n                    <bento-loading-indicator />\n                </div>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType, ref, toRef } from 'vue';\n    import {\n        type BentoListboxEmptyStateProps,\n        BentoListboxEvent,\n        type BentoListboxIsOptionDisabled,\n        BentoListboxLazyLoadType,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxVirtulisationOptions,\n    } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { BentoKeyboardNavigationDirective } from '@/directives';\n    import { BentoListboxSingleSelect } from './components/listbox-single-select';\n    import { BentoListboxMultiSelect } from './components/listbox-multi-select';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoLoadingIndicator } from '@/components/loading-indicator';\n    import { BentoLoadingButton, BentoLoadingButtonState } from '@/components/button';\n    import { BentoEmptyState } from '@/components/empty-state';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { debounce } from '@/utils/ts/debounce';\n    import { useVirtualList } from '@/composables/use-virtual-list';\n    import type { HTMLAttributes } from 'vue/types/jsx.d.ts';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n    const DEFAULT_DROPDOWN_ITEM_HEIGHT = 36;\n\n    /**\n     * Listbox container.\n     * It lists all the available options.\n     *\n     * @example\n     * <bento-listbox\n     *      v-slot=\"{label, value}\"\n     *      :id=\"listboxOptionsContainerId\"\n     *      :aria-label=\"ariaLabel\"\n     *      :disabled=\"disabled\"\n     *      :multiple=\"multiple\"\n     *      :selected=\"value\"\n     *      :isOptionDisabled=\"option => option.value === 2\"\n     *      :items=\"[{\n     *         { label: 'Option 1', value: 1 },\n     *         { label: 'Option 2', value: 2 },\n     *      }]\"\n     *      @select=\"onOptionSelected\"\n     * >\n     * </bento-listbox>\n     */\n    export default defineComponent({\n        name: 'bento-listbox',\n        components: {\n            BentoEmptyState,\n            BentoListboxSingleSelect,\n            BentoListboxMultiSelect,\n            BentoTypography,\n            BentoLoadingIndicator,\n            BentoLoadingButton,\n        },\n        directives: { BentoKeyboardNavigationDirective },\n        i18n: { messages },\n        props: {\n            /**\n             * Defines a string value that labels an interactive element.\n             */\n            ariaLabel: { type: String, default: null },\n\n            /**\n             * Empty state props that will be used with the inner empty state component to be displayed when no search results are found.\n             */\n            emptyState: {\n                type: Object as PropType<BentoListboxEmptyStateProps>,\n                default: undefined,\n            },\n\n            /**\n             * Indicates whether there are more items to load\n             */\n            hasMoreItems: { type: Boolean, default: false },\n\n            /**\n             *  Identifies the listbox whose contents are controlled by the the combobox on which the aria-controls attribute is set.\n             */\n            id: { type: String, required: true },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - Listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => undefined,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }\n             *  * @property {string} value.label - Text to be displayed in the option\n             *  * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * Indicates if new options are lazy loading.\n             */\n            loading: { type: Boolean, default: false },\n\n            /**\n             * The type of `Lazy Load`.\n             * Type \"automatic\" will enable infinite scrolling\n             * Type \"button\" will enable lazy loading with \"Show more\" button\n             */\n            lazyLoadType: {\n                type: String as PropType<BentoListboxLazyLoadType | `${BentoListboxLazyLoadType}`>,\n                default: BentoListboxLazyLoadType.NONE,\n                validator: (value: BentoListboxLazyLoadType) => Object.values(BentoListboxLazyLoadType).includes(value),\n            },\n\n            /**\n             * Indicates the listbox is loading filtered items.\n             */\n            componentLoading: { type: Boolean, default: false },\n\n            /**\n             * If enabled, the user will be able to select multiple items.\n             */\n            multiple: { type: Boolean, default: false },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Messaged displayed when no items are listed in the listbox\n             */\n            noResultsMessage: { type: String, required: true },\n\n            /**\n             * Flag that indicates that an external search it's being made\n             * to filter out the items inside the the multi-select listbox\n             *\n             * If enabled, hides the \"Select all\" checkbox in \"multiple\" mode.\n             */\n            searching: BentoListboxMultiSelect.props.searching,\n\n            /**\n             * The `input` value.\n             * Providing an empty string or empty array will select no options.\n             * Set to an empty string `''` if you don't want any of the available options to be selected for single select\n             */\n            selectedValue: {\n                type: Array as PropType<BentoListboxOptions>,\n                default: () => [],\n            },\n\n            /**\n             * Enables virtual scrolling if set to true or by providing an object with itemHeight function.\n             * The itemHeight function is used to calculate the height of rendered item given it's index.\n             */\n            virtualScroll: {\n                type: [Boolean, Object] as PropType<BentoListboxVirtulisationOptions>,\n                default: false,\n            },\n        },\n        emits: [\n            BentoListboxEvent.SELECT,\n            BentoListboxEvent.SPACE,\n            BentoListboxEvent.SHOW_MORE,\n            BentoListboxEvent.ENTER,\n            BentoListboxEvent.ESCAPE,\n            BentoListboxEvent.TAB,\n        ],\n        setup(props, { emit, slots }) {\n            const listboxItemRef = ref([]);\n            const items = toRef(props, 'items');\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const isLazyLoadListbox = computed(() => props.lazyLoadType !== BentoListboxLazyLoadType.AUTOMATIC);\n            const hasAutomaticLazyLoader = computed(() => props.lazyLoadType === BentoListboxLazyLoadType.AUTOMATIC);\n\n            // Virtual scrolling\n            const virtualScrollItemHeight = () => {\n                if (typeof props?.virtualScroll === 'object' && props?.virtualScroll?.itemHeight) {\n                    return props.virtualScroll.itemHeight;\n                }\n                return DEFAULT_DROPDOWN_ITEM_HEIGHT;\n            };\n            const {\n                containerRef: listboxRef,\n                containerProps,\n                onScroll: onContainerScroll,\n                list: virtualisedItems,\n                wrapperProps,\n            } = useVirtualList<BentoListboxOptionItem>(items, {\n                itemHeight: virtualScrollItemHeight(),\n                // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select\n                disabled: props?.multiple || props?.virtualScroll === false || props?.lazyLoadType !== 'none',\n            });\n\n            // Aria a11y\n            const ariaAtomic = computed<HTMLAttributes['aria-atomic']>(() =>\n                props.componentLoading !== undefined || isLazyLoadListbox.value ? 'true' : undefined\n            );\n            const ariaBusy = computed<HTMLAttributes['aria-busy']>(() =>\n                (isLazyLoadListbox.value && props.loading) || props.componentLoading ? 'true' : 'false'\n            );\n            const ariaLive = computed<HTMLAttributes['aria-live']>(() =>\n                isLazyLoadListbox.value || props.componentLoading !== undefined ? 'polite' : undefined\n            );\n\n            const ariaAttributes = computed(\n                () =>\n                    ({\n                        'aria-label': props.ariaLabel,\n                        'aria-busy': ariaBusy.value,\n                        'aria-atomic': ariaAtomic.value,\n                        'aria-live': ariaLive.value,\n                    }) as HTMLAttributes\n            );\n\n            const listboxContainerAttributes = computed(\n                () =>\n                    (props.componentLoading\n                        ? {\n                              ...ariaAttributes.value,\n                              role: 'alert',\n                          }\n                        : {}) as HTMLAttributes\n            );\n\n            const onOptionSelected = eventName => (selectedItem: BentoListboxOptions) => {\n                emit(eventName, selectedItem);\n            };\n\n            const emitShowMore = () => {\n                emit(BentoListboxEvent.SHOW_MORE);\n            };\n\n            const emitShowMoreOnScrollEnd = debounce(() => {\n                const container = listboxRef.value;\n\n                if (!container) {\n                    return;\n                }\n\n                const isAtBottom = Math.round(container.scrollTop) + container.clientHeight >= container.scrollHeight;\n\n                if (props.hasMoreItems && isAtBottom && !props.loading) {\n                    emitShowMore();\n                }\n            });\n\n            const onListboxContainerScroll = () => {\n                if (hasAutomaticLazyLoader.value) {\n                    emitShowMoreOnScrollEnd();\n                } else {\n                    onContainerScroll();\n                }\n            };\n\n            const isSearchResultEmpty = computed(() => props.items?.length === 0);\n\n            const shouldDisplayShowMoreButton = computed(\n                () => props.lazyLoadType === BentoListboxLazyLoadType.BUTTON && props.hasMoreItems\n            );\n\n            const loadingButtonState = computed(() =>\n                props.loading ? BentoLoadingButtonState.LOADING : BentoLoadingButtonState.START\n            );\n\n            const showMoreButtonText = computed(() => (props.loading ? t('loading') : t('showMore')));\n\n            const limitedEmptyStateProps = computed<InstanceType<typeof BentoEmptyState>['$props']>(() => ({\n                ...props.emptyState,\n                variant: 'condensed',\n            }));\n\n            const listboxListeners = {\n                [BentoListboxEvent.SELECT]: onOptionSelected(BentoListboxEvent.SELECT),\n                [BentoListboxEvent.SPACE]: onOptionSelected(BentoListboxEvent.SPACE),\n                [BentoListboxEvent.TAB]: onOptionSelected(BentoListboxEvent.TAB),\n                [BentoListboxEvent.ENTER]: onOptionSelected(BentoListboxEvent.ENTER),\n            };\n\n            return {\n                // Refs\n                listboxRef,\n                listboxItemRef,\n\n                // a11y\n                ariaAttributes,\n                listboxContainerAttributes,\n\n                // Values\n                containerProps,\n                isSearchResultEmpty,\n                limitedEmptyStateProps,\n                loadingButtonState,\n                slots,\n                shouldDisplayShowMoreButton,\n                showMoreButtonText,\n                virtualisedItems,\n                wrapperProps,\n\n                // Enums\n                BentoKeyboardNavigationKeyDownEvent,\n                BentoListboxEvent,\n\n                // Methods\n                onListboxContainerScroll,\n                onOptionSelected,\n                emitShowMore,\n                listboxListeners,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox.scss\" />\n","import {\n    type BentoListboxMultiSelectValue,\n    type BentoListboxOptionItem,\n    type BentoListboxOptions,\n    type BentoListboxSelectedValue,\n    type BentoListboxSelectedValueLabelPair,\n    type BentoListboxValue,\n} from '@/types/listbox';\nimport { ref, type Ref, watch } from 'vue';\n\n/**\n * Extracts an item's label from the items in the list of options\n * displayed in the Listbox.\n *\n * Searches through all items and their sub-items (categories).\n *\n * @param items List of options displayed in the Listbox\n * @param value Selected value that needs to be found in the list\n * @returns Label found\n */\nconst findItem = (items: BentoListboxOptions, value: BentoListboxValue): BentoListboxOptionItem => {\n    for (const item of items) {\n        if (item.value === value) {\n            return item;\n        }\n\n        if (item.items) {\n            // recursively look for the value and continue to the next item if value is not found\n            const label = findItem(item.items, value);\n\n            if (label) {\n                return label;\n            }\n        }\n    }\n\n    return null;\n};\n\n/**\n * Type guard to check if a value is of type BentoListboxSelectedValueLabelPair.\n * @param value The value to check.\n * @returns True if the value is BentoListboxSelectedValueLabelPair, false otherwise.\n */\nconst isBentoListboxSelectedValueLabelPair = (\n    value: BentoListboxSelectedValue\n): value is BentoListboxSelectedValueLabelPair => {\n    return typeof value === 'object' && value !== null && 'value' in value && 'label' in value;\n};\n\n/**\n * Creates two lists (one with value/label pairs and one simply with values) that are\n * used to cache the internal option selections to preserve the `label` in case the\n * value is loaded from external sources and might not be found in the list of `items`\n * later on.\n *\n * This helps with external searches and lazy loaded lists.\n *\n * @param items List of options displayed in the Listbox\n * @param selectedValues Selected list of values\n * @param multiple Indicates if the Listbox is multi-select (true) or single-select (false)\n * @param enableValueLabelPair Indicates if the Listbox should emit value/label pairs.\n * @returns Two lists of cached items. One list with label/value pairs and one with only the values stored.\n */\nexport const useCachedSelectedValues = (\n    items: Ref<BentoListboxOptions>,\n    selectedValues: Ref<BentoListboxSelectedValue>,\n    multiple: Ref<boolean>,\n    enableValueLabelPair?: Ref<boolean>\n) => {\n    const cachedSelectedListboxOptions = ref<BentoListboxOptions>([]);\n    const cachedListboxSelectedValues = ref<BentoListboxSelectedValue>();\n\n    /**\n     * Sets the cached selected values based on a simple value (string or number).\n     * It handles both single and multi-select modes.\n     * @param newSelectedValues The new list of selected options.\n     */\n    const setSimpleSelectedValues = (newSelectedValues: BentoListboxOptions) => {\n        if (multiple.value) {\n            cachedListboxSelectedValues.value = newSelectedValues.map(({ value }) => value);\n        } else {\n            cachedListboxSelectedValues.value = newSelectedValues.length > 0 ? newSelectedValues[0].value : null;\n        }\n    };\n\n    const setValueLabelPair = (newSelectedValues: BentoListboxOptions) => {\n        if (multiple.value) {\n            cachedListboxSelectedValues.value = newSelectedValues.map(({ value, label }) => ({ value, label }));\n        } else {\n            cachedListboxSelectedValues.value =\n                newSelectedValues.length > 0\n                    ? { value: newSelectedValues[0].value, label: newSelectedValues[0].label }\n                    : null;\n        }\n    };\n\n    const setCachedValues = (newSelectedValues: BentoListboxOptions) => {\n        cachedSelectedListboxOptions.value = newSelectedValues;\n        if (enableValueLabelPair?.value) {\n            setValueLabelPair(newSelectedValues);\n        } else {\n            setSimpleSelectedValues(newSelectedValues);\n        }\n    };\n\n    const resetCache = () => {\n        cachedSelectedListboxOptions.value = [];\n        cachedListboxSelectedValues.value = null;\n    };\n\n    watch(\n        () => selectedValues.value,\n        () => {\n            if (!selectedValues.value && selectedValues.value !== 0) {\n                resetCache();\n                return;\n            }\n\n            const isSingleSelect = !Array.isArray(selectedValues.value);\n            // Make a copy of cache\n            const cachedCopy = [...cachedSelectedListboxOptions.value];\n            // Clear cache\n            resetCache();\n\n            const addValue = (value: BentoListboxSelectedValue) => {\n                // When it's a value/label pair, add it immediately\n                // Otherwise search if the value is available in the list\n                // and create a value/label pair to be added to the list\n                if (isBentoListboxSelectedValueLabelPair(value)) {\n                    cachedSelectedListboxOptions.value.push(value);\n                } else {\n                    // Search label by value in \"items\"\n                    let selectedItem = findItem(items.value, value as BentoListboxValue);\n\n                    // Search in previous cache\n                    if (!selectedItem) {\n                        selectedItem = findItem(cachedCopy, value as BentoListboxValue);\n                    }\n\n                    // Transform value to label if not found anywhere\n                    if (!selectedItem) {\n                        selectedItem = { value: value as BentoListboxValue, label: value.toString() };\n                    }\n\n                    cachedSelectedListboxOptions.value.push(selectedItem);\n                }\n            };\n\n            if (isSingleSelect) {\n                const value = selectedValues.value as BentoListboxValue;\n\n                addValue(value);\n                if (enableValueLabelPair?.value) {\n                    setValueLabelPair(cachedSelectedListboxOptions.value);\n                } else {\n                    setSimpleSelectedValues(cachedSelectedListboxOptions.value);\n                }\n                return;\n            }\n\n            // Multi-select\n            (selectedValues.value as BentoListboxMultiSelectValue).forEach(addValue);\n            // Add each selected value in the cache\n            if (enableValueLabelPair?.value) {\n                setValueLabelPair(cachedSelectedListboxOptions.value);\n            } else {\n                setSimpleSelectedValues(cachedSelectedListboxOptions.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    return {\n        // Values\n        cachedSelectedListboxOptions,\n        cachedListboxSelectedValues,\n        // Methods\n        resetCache,\n        setCachedValues,\n    };\n};\n"],"names":["useCheckboxSelectAll","selectedItemsList","items","selectAll","unselectAll","isAllSelected","computed","_a","_b","isIndeterminate","selectedValue","useVirtualList","disabled","itemHeight","overscan","prefixHeight","containerRef","ref","list","startIndex","endIndex","containerHeight","listObserver","wrapperProps","totalHeight","sum","_","index","offSetTop","i","getOffset","prefixHeightIfSet","scrollTop","offset","size","getVisibileNumberOfItems","start","capacity","updateVisibleItems","visibleCount","onScroll","onMounted","observeSizeOfElement","clientHeight","onUnmounted","watch","containerProps","BentoListboxEvent","BentoListboxEvent2","BentoListboxLazyLoadType","BentoListboxLazyLoadType2","_sfc_main$a","defineComponent","BentoTypography","_sfc_main$9","props","emit","conditionalClasses","BentoKeyboardNavigationKeyDownEvent","e","eventName","uuid$1","_sfc_main$8","_sfc_main$7","BentoListboxOption","CheckmarkIcon","onOptionSelected","ariaDisabled","ariaSelected","tabIndex","useListboxKeyboardNavigation","focusItem","lastItemIndex","focusedIndex","mutateFocusedIndex","direction","calculateFocusedIndex","edgeCaseItem","moveToNextElement","event","preventDefault","moveToPreviousElement","moveToFirstElement","moveToLastElement","setListboxFocusedIndex","useVisibleDomOptions","role","checkVisibility","visibleDomOptions","updateVisibleDomOptions","options","option","nextTick","_sfc_main$6","BentoListboxSingleSelectCategory","BentoListboxSingleSelectOption","BentoKeyboardNavigationDirective","expose","slots","attrs","listboxRef","listboxItemRef","selectedItem","ariaAttributes","_c","_d","hasCategories","selectedOption","toRef","nextFocusedItemIndex","listboxListeners","listboxOptionListeners","uuid","_sfc_main$5","__default__$1","CheckboxInputState","outlineConditionalClasses","ListboxMultiSelectCategoryClass","ListboxMultiSelectCategoryClass2","ListboxMultiSelectCategoryEvent","ListboxMultiSelectCategoryEvent2","_sfc_main$3","messages$2","ChevronDownIcon","ChevronUpIcon","DecorativeCheckbox","isOpen","useI18n","categoryGroupId","generateUid","categoryNameId","vue2Vue3FixedisOptionDisabled","hasAllPropsDisabled","isStaticCategory","showItemChildren","conditionalClass","toggleOpen","open","optionStates","isDisabled","isPreSelected","enabledItems","visibleSelectedList","value","chevronTitle","messageName","toggleSelectAll","ariaCheckedComputed","isSelectAllOn","handleSelectAll","ListboxMultiSelectOptionsEvent","ListboxMultiSelectOptionsEvent2","_sfc_main$2","ListboxMultiSelectCategory","toggleCheckboxSelection","isCategory","shouldShowDescription","isSearchingMultiLevel","isOptionSelected","item","toggleSearchOption","useMultiLevelItems","itemsList","isMultiLevelSelect","flattenedItemsList","acc","val","__default__","messages$1","t","n","useSlots","useAttrs","selectAllListboxItemsRef","selectedListboxItemsRef","listboxItemsRef","isTreePattern","computedRole","computedOptionRole","fullItemsList","categoryOption","calculateTotalItems","selectAllCheckboxText","possibleSelections","total","amountSelectedValues","selectableItems","filterOutDisabledAndNotPreselectedOptions","addOrRemoveList","findEnabledUnselectedItems","unselectedItemsList","newSelectedList","selectAllItems","unselectAllItems","selectAllCategory","category","unselectAllCategory","exists","selectedOptions","categoryOptionsSelected","categoryOptions","showSelectedItems","isLazyLoad","hasAllItemsSelected","showSelectAllCheckbox","expandedCategories","toggleCategoryVisibility","chipsSectionListeners","computedItemsIndex","itemIndex","indexMap","subItemsVisible","subItem","DEFAULT_DROPDOWN_ITEM_HEIGHT","_sfc_main","BentoEmptyState","BentoListboxSingleSelect","BentoListboxMultiSelect","BentoLoadingIndicator","BentoLoadingButton","messages","isLazyLoadListbox","hasAutomaticLazyLoader","virtualScrollItemHeight","onContainerScroll","virtualisedItems","ariaAtomic","ariaBusy","ariaLive","listboxContainerAttributes","emitShowMore","emitShowMoreOnScrollEnd","debounce","container","isAtBottom","onListboxContainerScroll","isSearchResultEmpty","shouldDisplayShowMoreButton","loadingButtonState","BentoLoadingButtonState","showMoreButtonText","limitedEmptyStateProps","findItem","label","isBentoListboxSelectedValueLabelPair","useCachedSelectedValues","selectedValues","multiple","enableValueLabelPair","cachedSelectedListboxOptions","cachedListboxSelectedValues","setSimpleSelectedValues","newSelectedValues","setValueLabelPair","setCachedValues","resetCache","isSingleSelect","cachedCopy","addValue"],"mappings":"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"}
+{"version":3,"file":"use-cached-selected-values.FoXcm49J.js","sources":["../../src/composables/use-checkbox-select-all/use-checkbox-select-all.ts","../../src/composables/use-virtual-list/use-virtual-list.ts","../../src/types/listbox.ts","../../src/components/internal/listbox/components/listbox-single-select/components/listbox-single-select-category/listbox-single-select-category.vue","../../src/components/internal/listbox/components/listbox-option/listbox-option.vue","../../../ui-assets/icons-16/dist/vue/checkmark.vue","../../src/components/internal/listbox/components/listbox-single-select-option/listbox-single-select-option.vue","../../src/components/internal/listbox/composables/useListboxKeyboardNavigation.ts","../../src/components/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options.ts","../../src/components/internal/listbox/components/listbox-single-select/listbox-single-select.vue","../../../ui-assets/icons-16/dist/vue/double-checkmark-small.vue","../../src/components/internal/decorative-checkbox/decorative-checkbox.vue","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.types.ts","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/components/listbox-multi-select-category/listbox-multi-select-category.vue","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.types.ts","../../src/components/internal/listbox/components/listbox-multi-select/components/listbox-multi-select-options/listbox-multi-select-options.vue","../../src/components/internal/listbox/composables/use-multi-level-items/use-multi-level-items.ts","../../src/components/internal/listbox/components/listbox-multi-select/listbox-multi-select.vue","../../src/components/internal/listbox/listbox.vue","../../src/components/internal/listbox/composables/use-cached-selected-values/use-cached-selected-values.ts"],"sourcesContent":["import { computed } from 'vue';\nimport type { ComputedRef } from 'vue';\nimport type { Fn } from '@/types/functions';\nimport type { BentoListboxMultiSelectValue, BentoListboxOptions } from '@/types/listbox';\n\n/**\n * Callback function that alllows to select all the items when called\n * @callback selectAllCallback\n */\n\n/**\n * Callback function that alllows to select all the items when called\n * @callback unselectAllCallback\n */\n\n/**\n * @typedef {Object} UseCheckboxSelectAll\n * @property {Ref<boolean>} isAllSelected - Indicates if all values are selected. Pass this to the :value property.\n * @property {Ref<boolean>} isIndeterminate - Indicates if it is in an indeterminated state (not all values are selected nor unselected). Pass this to the :indeterminate property.\n * @property {(selectedValue: boolean) => void} toggleSelectAll - Handles the select all flow, selects or unselects all and nullifies the indeterminated state. Pass this to the @input method.\n */\n\n/**\n * Composable to handle a 3 way checkbox state that allows to manage\n * a \"select all\", \"unselect all\" and an intermediate state where\n * not all are selected.\n *\n * @example\n * const checkboxVModelRef = ref<number[]>([]);\n *\n * const { isAllSelected, isIndeterminate, toggleSelectAll, updateIndeterminate } = useCheckboxSelectAll(\n *    checkboxVModelRef,\n *    () => { checkboxVModelRef.value = [...] // select all logic },\n *    () => { checkboxVModelRef.value = [] // unselect all logic },\n * );\n * toggleSelectAll(true|false); // Hook this to the @input method\n * updateIndeterminate(totalOfAvailableItems);\n *\n *\n * @param {ComputedRef<BentoListboxMultiSelectValue>} selectedItemsList - Reference to the list of selected values\n * @param {ComputedRef<BentoListboxOptions>} items - Reference to the list of all available items in the dropdown\n * @param {selectAllCallback} selectAll - Callback function that alllows to select all the items when called\n * @param {unselectAllCallback} unselectAll - Callback function that alllows to select all the items when called\n * @returns {UseCheckboxSelectAll} Values to be set to the bento-checkbox value and indeterminate props, as well as functions to update them accordingly\n *\n */\nexport const useCheckboxSelectAll = (\n    selectedItemsList: ComputedRef<BentoListboxMultiSelectValue>,\n    items: ComputedRef<BentoListboxOptions>,\n    selectAll: Fn,\n    unselectAll: Fn\n) => {\n    const isAllSelected = computed(\n        () => !!selectedItemsList.value?.length && selectedItemsList.value?.length === items.value.length\n    );\n    const isIndeterminate = computed(() => {\n        // eslint-disable-next-line eqeqeq\n        if (selectedItemsList.value == undefined || selectedItemsList.value.length === 0) {\n            return false;\n        }\n\n        return selectedItemsList.value?.length !== items.value.length;\n    });\n\n    const toggleSelectAll = (selectedValue: boolean) => {\n        if (selectedValue) {\n            selectAll();\n        } else {\n            unselectAll();\n        }\n    };\n\n    return {\n        isAllSelected,\n        isIndeterminate,\n\n        toggleSelectAll,\n    };\n};\n","import { computed, onMounted, onUnmounted, type Ref, ref, type UnwrapRef, watch } from 'vue';\nimport type {\n    UseVirtualListContainerProps,\n    UseVirtualListOptions,\n    UseVirtualListWrapperProps,\n} from './use-virtual-list.types';\nimport { observeSizeOfElement } from '../../utils/ts/resize';\n\n/**\n * Sets up a virtual scrolling functionality on a container element and a list of items to virtually scroll over.\n * This composables returns the containerProps and wrapperProps objects that should be v-binded onto the container and wrapper elements\n * of the list you wish to virtually scroll.\n *\n * This will return a filtered down list object the user can render based on how much the user has scrolled on the container.\n *\n * @usage\n * <template>\n *  <div v-bind=\"containerProps\" @scroll=\"onScroll\">\n *    <ul v-bind=\"wrapperProps\">\n *      <li v-for=\"item in list\" :key=\"item.index\" style=\"height: 22px\">\n *        {{ item.label }}\n *      </li>\n *    </ul>\n *  </div>\n * </template>\n *\n * <script setup lang=\"ts\"\n * import { useVirtualList } from '@adyen/bento-vue2';\n *\n * const DEFAULT_OPTIONS: { label: string }[] = new Array(100)\n *       .fill(0)\n *       .map((_, index) => ({ label: `Option ${index + 1}` }));\n * const ITEMS = ref(DEFAULT_OPTIONS);\n * const ITEM_HEIGHT = 30;\n *\n * const { containerProps, wrapperProps, list, onScroll } = useVirtualList(ITEMS, { itemHeight: ITEM_HEIGHT });\n * </script>\n *\n *\n * @param items - a reference to a list of items to virtually scroll over.\n * @param options - customises how the Virtual scroller list functions.\n * @param options.itemHeight - the height in pixel or a function that returns the height in pixels for each item.\n * @param options.overscan - number of pre-rendered DOM nodes. Prevents whitespace between items if you scroll very quickly.\n * @param options.prefixHeight - the prefix height of elements present the scrollable area but not present in the items property.\n * @param options.disabled - if set to true, disables the virtual scrolling functionality.\n */\nexport function useVirtualList<T>(\n    items: Ref<Array<T>>,\n    { disabled, itemHeight, overscan = 5, prefixHeight }: UseVirtualListOptions\n) {\n    const containerRef: Ref<UnwrapRef<HTMLElement | null>> = ref<HTMLElement | null>(null);\n    const list = ref<Array<T>>([]) as Ref<Array<T>>;\n    const startIndex = ref(0);\n    const endIndex = ref(0);\n    const containerHeight = ref(0);\n    let listObserver;\n\n    const wrapperProps = computed<UseVirtualListWrapperProps>(() => {\n        const totalHeight =\n            typeof itemHeight === 'number'\n                ? items.value.length * itemHeight\n                : items.value.reduce((sum, _, index) => sum + itemHeight(index), 0);\n\n        const offSetTop =\n            typeof itemHeight === 'number'\n                ? startIndex.value * itemHeight\n                : items.value.slice(0, startIndex.value).reduce((sum, _, i) => sum + itemHeight(i), 0);\n\n        return {\n            style: {\n                marginTop: `${offSetTop}px`,\n                height: `${totalHeight - offSetTop}px`,\n            },\n        };\n    });\n\n    /**\n     * Gets the offset for the first item to show within the visible area.\n     * @returns offset number.\n     */\n    const getOffset = () => {\n        const prefixHeightIfSet = prefixHeight?.value ?? 0;\n        const scrollTop = Math.max(containerRef.value.scrollTop - prefixHeightIfSet, 0);\n        if (typeof itemHeight === 'number') {\n            return Math.floor(scrollTop / itemHeight);\n        }\n\n        let sum = 0;\n        let offset = 0;\n\n        for (let i = 0; i < items.value.length; i += 1) {\n            const size = itemHeight(i);\n            sum += size;\n            if (sum >= scrollTop) {\n                offset = i;\n                break;\n            }\n        }\n        return offset;\n    };\n\n    /**\n     * Gets the visible number of items based on the container size and item heights.\n     * @returns visible number of items.\n     */\n    const getVisibileNumberOfItems = () => {\n        containerHeight.value = containerRef.value.clientHeight;\n        if (typeof itemHeight === 'number') {\n            return Math.ceil(containerHeight.value / itemHeight);\n        }\n\n        const start = startIndex.value ?? 0;\n        let sum = 0;\n        let capacity = 0;\n        for (let i = start; i < items.value.length; i += 1) {\n            const size = itemHeight(i);\n            sum += size;\n            capacity = i;\n            if (sum > containerHeight.value) {\n                break;\n            }\n        }\n        return capacity - start;\n    };\n\n    const updateVisibleItems = () => {\n        if (containerRef.value) {\n            const visibleCount = getVisibileNumberOfItems();\n            startIndex.value = getOffset();\n            endIndex.value = Math.min(startIndex.value + visibleCount + overscan, items.value.length);\n            list.value = items.value.slice(startIndex.value, endIndex.value);\n        }\n    };\n\n    const onScroll = () => {\n        updateVisibleItems();\n    };\n\n    if (!disabled) {\n        onMounted(() => {\n            if (containerRef.value) {\n                containerHeight.value = containerRef.value.clientHeight;\n                // When the listbox opens we need to update the height\n                listObserver = observeSizeOfElement(containerRef.value, ({ clientHeight }) => {\n                    containerHeight.value = clientHeight;\n                    updateVisibleItems();\n                });\n                updateVisibleItems();\n            }\n        });\n\n        onUnmounted(() => {\n            listObserver?.disconnect();\n        });\n\n        watch(\n            () => items.value,\n            () => {\n                updateVisibleItems();\n            }\n        );\n    }\n\n    const containerProps: UseVirtualListContainerProps = {\n        ref: containerRef,\n        style: { overflowY: 'auto' },\n    };\n\n    if (disabled) {\n        return {\n            containerRef,\n            containerProps,\n            // eslint-disable-next-line @typescript-eslint/no-empty-function\n            onScroll: () => {},\n            list: items,\n        };\n    }\n\n    return {\n        containerRef,\n        containerProps,\n        onScroll,\n        list,\n        wrapperProps,\n    };\n}\n","import { type BentoSearchBarItem } from '@/components/search-bar/search-bar.types';\nimport { type BentoEmptyStateProps } from '@/components/empty-state/empty-state.types';\nimport { type OmitStrict } from '@/types/omit-strict';\nimport { type BentoButtonActionObject } from '@/components/button/components/button-actions/button-actions.types';\nimport { type UseVirtualListItemHeight } from '@/composables/use-virtual-list/use-virtual-list.types';\n\nexport type BentoListboxValue = string | number;\n\nexport type BentoListboxMultiSelectValue = Array<BentoListboxValue>;\n\nexport interface BentoListboxOptionItem extends BentoSearchBarItem {\n    data?: unknown;\n    description?: string;\n    value: BentoListboxValue;\n    displayValue?: string;\n    items?: Array<BentoListboxOptionItem>; // Reference itself for multi-level options\n}\n\nexport interface BentoListboxSelectedValueLabelPair {\n    value: BentoListboxOptionItem['value'];\n    label: BentoListboxOptionItem['label'];\n}\n\nexport type BentoListboxSelectedValue =\n    | BentoListboxValue\n    | BentoListboxMultiSelectValue\n    | BentoListboxSelectedValueLabelPair\n    | Array<BentoListboxSelectedValueLabelPair>;\n\nexport type BentoListboxOptions = Array<BentoListboxOptionItem>;\n\nexport type BentoListboxIsOptionDisabled = undefined | ((optionValue: BentoListboxOptionItem) => boolean);\n\nexport enum BentoListboxEvent {\n    SELECT = 'select',\n    SHOW_MORE = 'show-more',\n    ESCAPE = 'escape-pressed',\n    CLICK = 'click',\n    ENTER = 'enter-pressed',\n    SPACE = 'space-pressed',\n    TAB = 'tab-pressed',\n    CLOSE_DROPDOWN = 'close-dropdown',\n}\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoListboxLazyLoadType {\n    AUTOMATIC = 'automatic',\n    BUTTON = 'button',\n    NONE = 'none',\n}\n\nexport interface BentoListboxSearchOptions {\n    /**\n     * Custom debounce time. Default: 300\n     */\n    debounceTime?: number;\n\n    /**\n     * The event that triggers upon user filtering the listbox items.\n     */\n    searchEvent: (searchValue: string) => void;\n}\n\nexport type BentoListboxEmptyStateProps = { action: { icon?: any } & BentoButtonActionObject } & OmitStrict<\n    BentoEmptyStateProps,\n    'variant' | 'image' | 'description'\n>;\n\nexport type BentoListboxVirtulisationOptions = boolean | { itemHeight: UseVirtualListItemHeight };\n\nexport type BentoListboxItemRole = 'treeitem' | 'option';\n","<template>\n    <div class=\"b-listbox-single-select-category\" role=\"group\" :aria-label=\"categoryLabel\">\n        <bento-typography\n            variant=\"caption\"\n            el=\"span\"\n            class=\"b-listbox-single-select-category__label-text\"\n            aria-hidden=\"true\"\n        >\n            {{ categoryLabel }}\n        </bento-typography>\n        <div>\n            <slot />\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { defineComponent } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n\n    export default defineComponent({\n        name: 'bento-listbox-static-category',\n        components: {\n            BentoTypography,\n        },\n        props: {\n            /**\n             * Category label text\n             */\n            categoryLabel: {\n                type: String,\n                required: true,\n            },\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-single-select-category.scss\" />\n","<template>\n    <div\n        class=\"b-listbox-option\"\n        role=\"option\"\n        :class=\"conditionalClasses\"\n        v-bind=\"$attrs\"\n        @click=\"onClick\"\n        @keydown.enter=\"onOptionSelected(BentoListboxEvent.ENTER, $event)\"\n        @keydown.space=\"onOptionSelected(BentoListboxEvent.SPACE, $event)\"\n        @keydown.tab=\"onOptionSelected(BentoListboxEvent.TAB, $event)\"\n    >\n        <slot></slot>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent } from 'vue';\n    import { BentoListboxEvent } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n\n    /**\n     * listbox option wrapper.\n     * Contains only styles and allows the Multi-Select and Single-Select DRY the styles.\n     *\n     * Options and Attributes are inherited (`inheritAttrs: true`)\n     *\n     * @example\n     * <bento-listbox-option\n     *    ...props\n     *    ...attrs\n     * />\n     */\n    export default defineComponent({\n        name: 'bento-listbox-option',\n        props: {\n            /**\n             * Setting this property to true will disable the option.\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * Indicates if the value is selected. Only one element can be selected at a time.\n             */\n            selected: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.CLICK, BentoListboxEvent.ENTER, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit }) {\n            const conditionalClasses = computed(() => ({\n                'b-listbox-option--disabled': props.disabled,\n                'b-listbox-option--selected': props.selected,\n            }));\n\n            const onClick = (e: Event) => {\n                emit(BentoListboxEvent.CLICK, e);\n            };\n\n            const onOptionSelected = (eventName, e: Event) => {\n                emit(eventName, e);\n            };\n\n            return {\n                // Enums\n                BentoKeyboardNavigationKeyDownEvent,\n                BentoListboxEvent,\n\n                // Values\n                conditionalClasses,\n\n                // Events\n                onClick,\n                onOptionSelected,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-option.scss\" />\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M15.0608 4.00011L14.0001 2.93945L6.00011 10.9395L2.00011 6.93945L0.939453 8.00011L6.00011 13.0608L15.0608 4.00011Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <bento-listbox-option\n        class=\"b-listbox-single-select-option\"\n        :disabled=\"disabled\"\n        :selected=\"selected\"\n        :aria-selected=\"ariaSelected\"\n        :aria-disabled=\"ariaDisabled\"\n        :tabindex=\"tabIndex\"\n        @click=\"onOptionSelected(BentoListboxEvent.SELECT)\"\n        @enter-pressed=\"onOptionSelected(BentoListboxEvent.ENTER)\"\n        @space-pressed.prevent=\"onOptionSelected(BentoListboxEvent.SPACE)\"\n        @tab-pressed=\"onOptionSelected(BentoListboxEvent.TAB)\"\n    >\n        <slot v-bind=\"option\">\n            <span class=\"b-listbox-single-select-option__text\">\n                <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                <bento-typography\n                    v-if=\"option.description\"\n                    class=\"b-listbox-single-select-option__description\"\n                    el=\"span\"\n                >\n                    {{ option.description }}\n                </bento-typography>\n            </span>\n        </slot>\n        <span class=\"b-listbox-single-select-option__check-icon\">\n            <checkmark-icon v-show=\"selected\" svg-title=\"selected\" />\n        </span>\n    </bento-listbox-option>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoListboxOption } from '../listbox-option';\n    import { BentoListboxEvent, type BentoListboxOptionItem } from '@/types/listbox';\n    import CheckmarkIcon from '@adyen/ui-assets-icons-16/vue/checkmark';\n\n    /**\n     * Listbox option element.\n     *\n     * @example\n     * <bento-listbox-single-select-option\n     *      v-for=\"option in options\"\n     *      :key=\"option.value\"\n     *      :option=\"option\"\n     *      :selected=\"option.selected\"\n     *      @select=\"onOptionSelected\"\n     * />\n     */\n    export default defineComponent({\n        name: 'bento-listbox-single-select-option',\n        components: {\n            BentoListboxOption,\n            BentoTypography,\n            CheckmarkIcon,\n        },\n        props: {\n            /**\n             * Setting this property to true will disable the option.\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * The option item that contains all the option item's data.\n             * @type {BentoListboxOptionItem}\n             */\n            option: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n\n            /**\n             * Indicates if the value is selected. Only one element can be selected at a time.\n             */\n            selected: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.ENTER, BentoListboxEvent.SELECT, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit }) {\n            const onOptionSelected = eventName => {\n                if (props.disabled) {\n                    return;\n                }\n\n                /**\n                 * Trigerred when an option is clicked or selected via keyboard navigation.\n                 * Indicates which option was selected.\n                 *\n                 * @event {string} - The corresponding event\n                 * @property {number} selectedValue - Selected option's value\n                 */\n                emit(eventName, props.option);\n            };\n\n            const ariaDisabled = computed(() => (props.disabled ? true : null));\n            const ariaSelected = computed(() => (props.selected ? true : null));\n            const tabIndex = computed(() => (props.disabled ? -1 : 0));\n\n            return {\n                // Values\n                ariaDisabled,\n                ariaSelected,\n                tabIndex,\n\n                // Enums\n                BentoListboxEvent,\n\n                // Events\n                onOptionSelected,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-single-select-option.scss\" />\n","import { computed, type Ref, ref } from 'vue';\n\nconst enum ListboxKeyboardNavigationMutationDirection {\n    INCREASE = 'increase',\n    DECREASE = 'decrease',\n}\n\nexport const useListboxKeyboardNavigation = (\n    { items }: { items: Ref<Array<HTMLElement>> },\n    focusItem: (index: number) => void\n) => {\n    const lastItemIndex = computed(() => items.value.length - 1);\n    const focusedIndex = ref(0);\n\n    const mutateFocusedIndex = (direction: ListboxKeyboardNavigationMutationDirection) => {\n        switch (direction) {\n            case ListboxKeyboardNavigationMutationDirection.INCREASE:\n                focusedIndex.value += 1;\n                break;\n            case ListboxKeyboardNavigationMutationDirection.DECREASE:\n                focusedIndex.value -= 1;\n                break;\n            default:\n                break;\n        }\n    };\n\n    const calculateFocusedIndex = ({ edgeCaseItem }, direction) => {\n        const isEdgeCaseItem = focusedIndex.value === edgeCaseItem;\n        if (isEdgeCaseItem) {\n            return;\n        }\n        mutateFocusedIndex(direction);\n        focusItem(focusedIndex.value);\n    };\n\n    const moveToNextElement = (event?: CustomEvent<KeyboardEvent>) => {\n        // prevent arrow down to scroll down the container\n        preventDefault(event);\n        calculateFocusedIndex(\n            {\n                edgeCaseItem: lastItemIndex.value,\n            },\n            ListboxKeyboardNavigationMutationDirection.INCREASE\n        );\n    };\n\n    const moveToPreviousElement = (event?: CustomEvent<KeyboardEvent>) => {\n        // prevent arrow up to scroll up the container\n        preventDefault(event);\n        calculateFocusedIndex(\n            {\n                edgeCaseItem: 0,\n            },\n            ListboxKeyboardNavigationMutationDirection.DECREASE\n        );\n    };\n\n    const moveToFirstElement = () => {\n        focusedIndex.value = 0;\n        focusItem(focusedIndex.value);\n    };\n\n    const moveToLastElement = () => {\n        focusedIndex.value = lastItemIndex.value;\n        focusItem(focusedIndex.value);\n    };\n\n    const setListboxFocusedIndex = (index: number) => {\n        focusedIndex.value = index;\n    };\n\n    const preventDefault = (event?: CustomEvent<KeyboardEvent>) => {\n        event?.detail?.preventDefault();\n    };\n\n    return {\n        moveToFirstElement,\n        moveToLastElement,\n        moveToNextElement,\n        moveToPreviousElement,\n        setListboxFocusedIndex,\n        preventDefault,\n        focusedIndex,\n    };\n};\n","import { type BentoListboxItemRole, type BentoListboxOptions } from '@/types/listbox';\nimport { nextTick, ref, type Ref, watch } from 'vue';\n\n/**\n * Composable that provides a reactive list of visible DOM options within a container.\n * It queries for all elements with `role=\"option\"` inside the container and filters\n * them based on their visibility. This is useful for components with virtual scrolling\n * or complex layouts where not all options are visible at once. It automatically\n * updates the list of visible options whenever the `items` array changes.\n *\n * @param containerRef A ref to the HTML container element that holds the options.\n * @param items The list of items for the listbox. The watcher on this parameter triggers the update.\n * @param role The role of the option elements to query for. Defaults to 'option'.\n * @param checkVisibility If true, it will only return visible options. Defaults to true.\n * @returns An object containing:\n * - `visibleDomOptions`: A reactive list of visible option elements.\n * - `updateVisibleDomOptions`: A function to manually trigger an update of the visible options.\n */\nexport const useVisibleDomOptions = (\n    containerRef: Ref<Element | undefined>,\n    items: Ref<BentoListboxOptions>,\n    role: Ref<BentoListboxItemRole> = ref('option'),\n    checkVisibility: boolean = true\n) => {\n    const visibleDomOptions = ref<Array<HTMLDivElement>>([]);\n\n    const updateVisibleDomOptions = async () => {\n        if (!containerRef.value || containerRef.value.nodeType === Node.COMMENT_NODE) {\n            return;\n        }\n\n        const options = Array.from(containerRef.value.querySelectorAll<HTMLDivElement>(`[role=\"${role.value}\"]`));\n\n        visibleDomOptions.value = checkVisibility\n            ? options.filter((option: HTMLDivElement) => option.checkVisibility())\n            : options;\n    };\n\n    watch(\n        items,\n        () => {\n            nextTick(() => {\n                updateVisibleDomOptions();\n            });\n        },\n        { immediate: true }\n    );\n\n    return {\n        visibleDomOptions,\n        updateVisibleDomOptions,\n    };\n};\n","<template>\n    <div\n        ref=\"listboxRef\"\n        v-bento-keyboard-navigation-directive\n        v-bind=\"ariaAttributes\"\n        role=\"listbox\"\n        v-on=\"listboxListeners\"\n    >\n        <template v-if=\"hasCategories && staticCategories\">\n            <bento-listbox-single-select-category\n                v-for=\"category in items\"\n                :key=\"category.value\"\n                :category-label=\"category.label\"\n            >\n                <bento-listbox-single-select-option\n                    v-for=\"option in category.items\"\n                    :key=\"option.value\"\n                    ref=\"listboxItemRef\"\n                    role=\"option\"\n                    :option=\"option\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :selected=\"option.value === selectedItem.value\"\n                    v-on=\"listboxOptionListeners\"\n                >\n                    <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                        <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                    </template>\n                </bento-listbox-single-select-option>\n            </bento-listbox-single-select-category>\n        </template>\n        <template v-else>\n            <bento-listbox-single-select-option\n                v-for=\"option in items\"\n                :key=\"option.value\"\n                ref=\"listboxItemRef\"\n                role=\"option\"\n                :option=\"option\"\n                :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                :selected=\"option.value === selectedItem.value\"\n                v-on=\"listboxOptionListeners\"\n            >\n                <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                    <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                </template>\n            </bento-listbox-single-select-option>\n        </template>\n    </div>\n</template>\n<script lang=\"ts\">\n    import { computed, defineComponent, type HTMLAttributes, type PropType, ref, toRef } from 'vue';\n    import { BentoListboxSingleSelectCategory } from './components/listbox-single-select-category';\n    import { BentoListboxSingleSelectOption } from '../listbox-single-select-option';\n    import { useListboxKeyboardNavigation } from '../../composables/useListboxKeyboardNavigation';\n    import { useVisibleDomOptions } from '@/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options';\n    import { BentoListboxEvent, type BentoListboxIsOptionDisabled, type BentoListboxOptions } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { type Booleanish } from '@/types/prop-types';\n\n    import { BentoKeyboardNavigationDirective } from '@/directives';\n\n    /**\n     * Listbox single-select options list\n     *\n     * @example\n     * import { BentoListboxMultiSelect } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelect },\n     *     template: `\n     *          <bento-listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-listbox-single-select',\n        components: {\n            BentoListboxSingleSelectCategory,\n            BentoListboxSingleSelectOption,\n        },\n        directives: { BentoKeyboardNavigationDirective },\n        inheritAttrs: false,\n        props: {\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * The `input` value.\n             * Providing an empty string will select no options.\n             * Set to an empty string `''` if you don't want any of the available options to be selected\n             */\n            selectedValue: {\n                type: Array as PropType<BentoListboxOptions>,\n                default: undefined,\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n        },\n        emits: [BentoListboxEvent.SELECT, BentoListboxEvent.ENTER, BentoListboxEvent.SPACE, BentoListboxEvent.TAB],\n        setup(props, { emit, expose, slots, attrs }) {\n            const listboxRef = ref(null);\n            const listboxItemRef = ref([]);\n            const selectedItem = computed(() => !!props.selectedValue?.length && props.selectedValue.at(0));\n            const ariaAttributes = computed(\n                () =>\n                    ({\n                        'aria-label': attrs['aria-label']?.toString() as string,\n                        'aria-busy': attrs['aria-busy']?.toString() as Booleanish,\n                        'aria-atomic': attrs['aria-atomic']?.toString() as Booleanish,\n                        'aria-live': attrs['aria-live']?.toString() as string,\n                    }) as HTMLAttributes\n            );\n\n            /**\n             * Finds out if items have sub items\n             */\n            const hasCategories = computed(() => !!props.items.some(({ items }) => !!items));\n\n            const onOptionSelected = eventName => (selectedOption: BentoListboxOptions) => {\n                emit(eventName, [selectedOption]);\n            };\n\n            // Keyboard navigation\n            const { visibleDomOptions } = useVisibleDomOptions(listboxRef, toRef(props, 'items'), ref('option'), false);\n\n            const focusItem = (nextFocusedItemIndex: number) => {\n                visibleDomOptions.value[nextFocusedItemIndex]?.focus();\n            };\n\n            const {\n                moveToNextElement,\n                moveToPreviousElement,\n                moveToFirstElement,\n                moveToLastElement,\n                setListboxFocusedIndex,\n            } = useListboxKeyboardNavigation(\n                {\n                    items: visibleDomOptions,\n                },\n                focusItem\n            );\n\n            const listboxListeners = {\n                [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: moveToPreviousElement,\n                [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: moveToNextElement,\n                [BentoKeyboardNavigationKeyDownEvent.HOME]: moveToFirstElement,\n                [BentoKeyboardNavigationKeyDownEvent.END]: moveToLastElement,\n            };\n\n            const listboxOptionListeners = {\n                [BentoListboxEvent.SELECT]: onOptionSelected(BentoListboxEvent.SELECT),\n                [BentoListboxEvent.SPACE]: onOptionSelected(BentoListboxEvent.SPACE),\n                [BentoListboxEvent.TAB]: onOptionSelected(BentoListboxEvent.TAB),\n                [BentoListboxEvent.ENTER]: onOptionSelected(BentoListboxEvent.ENTER),\n            };\n\n            expose({\n                /**\n                 * Reference for a single listbox item.\n                 * Required for keyboard navigation in dropdown as $children is removed in vue@3\n                 */\n                listboxItemRef,\n                /**\n                 * Method to set the index of the item to be focused on\n                 * Used for focus management to be kept in-sync with parent e.g. dropdowns\n                 */\n                setListboxFocusedIndex,\n            });\n\n            return {\n                // Enums\n                BentoListboxEvent,\n\n                // Values\n                listboxRef,\n                listboxItemRef,\n                selectedItem,\n                slots,\n                ariaAttributes,\n\n                // Computed\n                hasCategories,\n\n                // Methods\n                onOptionSelected,\n\n                // Keyboard navigation\n                listboxListeners,\n                listboxOptionListeners,\n            };\n        },\n    });\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M9.69043 5.75L4.62988 10.8105L1.56934 7.75L2.62988 6.68945L4.62988 8.68945L8.62988 4.68945L9.69043 5.75Z\"/><path fill=\"#001222\" d=\"M13.9307 5.75L8.87012 10.8105L7.80957 9.75L12.8701 4.68945L13.9307 5.75Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <div class=\"b-checkbox-input\" :class=\"conditionalClasses\" role=\"presentation\">\n        <!-- Don't change order because it matters for CSS. Icons first -->\n        <minus-small-icon v-if=\"indeterminate\" class=\"b-checkbox-input__icon\" svg-title=\"\" aria-hidden=\"true\" />\n        <double-checkmark-small-icon\n            v-else-if=\"allSelected\"\n            class=\"b-checkbox-input__icon\"\n            svg-title=\"\"\n            aria-hidden=\"true\"\n            data-testid=\"decorative-checkbox-double-checkmark-icon\"\n        />\n        <checkmark-small-icon v-else-if=\"checked\" class=\"b-checkbox-input__icon\" svg-title=\"\" aria-hidden=\"true\" />\n        <div class=\"b-checkbox-input__outline\" :class=\"outlineConditionalClasses\" />\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { CheckboxInputState } from '@/internal/checkbox-input/checkbox-input.types';\n    import CheckmarkSmallIcon from '@adyen/ui-assets-icons-16/vue/checkmark-small';\n    import MinusSmallIcon from '@adyen/ui-assets-icons-16/vue/minus-small';\n    import DoubleCheckmarkSmallIcon from '@adyen/ui-assets-icons-16/vue/double-checkmark-small';\n\n    const props = defineProps({\n  disabled: { type: Boolean, default: false },\n  indeterminate: { type: Boolean, default: false },\n  checked: { type: Boolean, default: false },\n  allSelected: { type: Boolean, default: false }\n});\n\n    const conditionalClasses = computed(() => ({\n        [`b-checkbox-input--${CheckboxInputState.DISABLED}`]: props.disabled,\n    }));\n\n    const outlineConditionalClasses = computed(() => ({\n        [`b-checkbox-input__outline--${CheckboxInputState.UNCHECKED}`]:\n            !props.checked && !props.indeterminate && !props.allSelected,\n        [`b-checkbox-input__outline--${CheckboxInputState.CHECKED}`]:\n            (props.checked || props.allSelected) && !props.indeterminate,\n        [`b-checkbox-input__outline--${CheckboxInputState.INDETERMINATE}`]: props.indeterminate,\n    }));\n</script>\n\n<script lang=\"ts\">\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"@/internal/checkbox-input/checkbox-input.scss\" />\n","export enum ListboxMultiSelectCategoryClass {\n    DISABLED = 'disabled',\n    STATIC_CATEGORY = 'static-category',\n}\n\nexport enum ListboxMultiSelectCategoryEvent {\n    SELECT_CATEGORY = 'select-category',\n    UNSELECT_CATEGORY = 'unselect-category',\n    TOGGLE_CATEGORY_VISIBILITY = 'toggle-category-visibility',\n}\n","<template>\n    <div>\n        <bento-listbox-option\n            v-if=\"!isStaticCategory\"\n            class=\"b-listbox-multi-select-category__option\"\n            :class=\"conditionalClass\"\n            :tabindex=\"tabindex\"\n            :aria-selected=\"ariaCheckedComputed !== 'false'\"\n            :aria-checked=\"ariaCheckedComputed\"\n            :aria-disabled=\"hasAllPropsDisabled\"\n            :aria-expanded=\"`${isOpen}`\"\n            role=\"treeitem\"\n            :aria-owns=\"categoryGroupId\"\n            :aria-labelledby=\"categoryNameId\"\n            @click=\"handleSelectAll\"\n            @enter-pressed=\"handleSelectAll\"\n            @space-pressed.prevent=\"handleSelectAll\"\n            @keydown.arrow-left.native=\"toggleOpen($event, false)\"\n            @keydown.arrow-right.native=\"toggleOpen($event, true)\"\n        >\n            <decorative-checkbox\n                :indeterminate=\"isIndeterminate\"\n                :disabled=\"hasAllPropsDisabled\"\n                :checked=\"isAllSelected\"\n            />\n            <span class=\"b-listbox-multi-select-category__label\">\n                <bento-typography :id=\"categoryNameId\" el=\"span\" class=\"b-listbox-multi-select-category__label-text\">\n                    {{ category.label }}\n                </bento-typography>\n                <div\n                    aria-hidden=\"true\"\n                    class=\"b-listbox-multi-select-category__label-chevron\"\n                    data-testid=\"toggle-listbox\"\n                    @click.capture.stop=\"toggleOpen\"\n                >\n                    <chevron-up-icon v-if=\"isOpen\" :svg-title=\"chevronTitle\" />\n                    <chevron-down-icon v-else :svg-title=\"chevronTitle\" />\n                </div>\n            </span>\n        </bento-listbox-option>\n\n        <div\n            v-else\n            class=\"b-listbox-multi-select-category b-listbox-multi-select-category--static-category\"\n            aria-hidden=\"true\"\n        >\n            <span class=\"b-listbox-multi-select-category__label\">\n                <bento-typography el=\"span\" variant=\"caption\" class=\"b-listbox-multi-select-category__label-text\">\n                    {{ category.label }}\n                </bento-typography>\n            </span>\n        </div>\n\n        <div v-show=\"showItemChildren\" :id=\"categoryGroupId\" role=\"group\" :aria-label=\"category.label\">\n            <slot />\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType, ref, toRef, watch } from 'vue';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoListboxOption } from '../../../../../listbox-option';\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n\n    import {\n        type BentoListboxIsOptionDisabled,\n        type BentoListboxMultiSelectValue,\n        type BentoListboxOptionItem,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { useCheckboxSelectAll } from '@/composables';\n    import {\n        ListboxMultiSelectCategoryClass,\n        ListboxMultiSelectCategoryEvent,\n    } from './listbox-multi-select-category.types';\n    import { useI18n } from '@/utils/ts/i18n';\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    import messages from './messages.json';\n    import { generateUid } from '@/core/utils/ts';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    /**\n     * Listbox multi-select category list.\n     * Allows the rendering of nested lists\n     *\n     * @example\n     * import { ListboxMultiSelectCategory } from '@/internal/listbox';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelectCategory },\n     *     template: `\n     *          <listbox-multi-select-category\n     *              :category=\"option\"\n     *              :is-option-disabled=\"true\"\n     *              :selected-items-list=\"['option-1']\"\n     *              @select-category=\"$emit('select-category', option)\"\n     *              @unselect-category=\"$emit('unselect-category', option)\"\n     *          >\n     *              <listbox-multi-select-options\n     *                  category-items\n     *                  :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *                  :is-multi-level=\"true\"\n     *                  :selected-items-list=\"['option-']\"\n     *                  :searching=\"false\"\n     *                  @toggle-checkbox-selection=\"value => toggleCheckboxSelection(value)\"\n     *              />\n     *          </listbox-multi-select-category>\n     *     `\n     * }\n     */\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-listbox-multi-select-category',\n        components: {\n            BentoTypography,\n            BentoListboxOption,\n            ChevronDownIcon,\n            ChevronUpIcon,\n            DecorativeCheckbox,\n        },\n        props: {\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             * @property {BentoListboxOptionItem} value.items - Category items list\n             */\n            category: {\n                type: Object as PropType<BentoListboxOptionItem>,\n                required: true,\n            },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: [Function] as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The `input` value.\n             * Providing an empty array will select no options.\n             */\n            selectedItemsList: {\n                type: Array as PropType<Array<BentoListboxValue>>,\n                default: () => [],\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Category's tabindex\n             */\n            tabindex: { type: Number, default: -1 },\n        },\n        emits: [\n            ListboxMultiSelectCategoryEvent.SELECT_CATEGORY,\n            ListboxMultiSelectCategoryEvent.UNSELECT_CATEGORY,\n            ListboxMultiSelectCategoryEvent.TOGGLE_CATEGORY_VISIBILITY,\n        ],\n        setup(props, { emit }) {\n            const isOpen = ref(false);\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const categoryGroupId = generateUid('category-group');\n            const categoryNameId = generateUid('category-name');\n\n            // This method should be used to determine if an option is disabled as it works for both vue 2 & 3.\n            const vue2Vue3FixedisOptionDisabled = option =>\n                props.isOptionDisabled ? props.isOptionDisabled(option) : false;\n\n            const hasAllPropsDisabled = computed(() =>\n                props.category.items.every(option => vue2Vue3FixedisOptionDisabled(option))\n            );\n\n            const isStaticCategory = toRef(props, 'staticCategories');\n\n            // Display item children if is open state or if static categories is enabled\n            const showItemChildren = computed(() => isOpen.value || props.staticCategories);\n\n            const conditionalClass = computed(() => ({\n                [`b-listbox-multi-select-category--${ListboxMultiSelectCategoryClass.DISABLED}`]:\n                    hasAllPropsDisabled.value,\n            }));\n\n            const toggleOpen = (event: Event, open?: boolean) => {\n                event.preventDefault();\n                isOpen.value = open !== undefined ? open : !isOpen.value;\n                emit(ListboxMultiSelectCategoryEvent.TOGGLE_CATEGORY_VISIBILITY, props.category.value);\n            };\n\n            const optionStates = (option: BentoListboxOptionItem) => {\n                const isDisabled = vue2Vue3FixedisOptionDisabled(option);\n                const isPreSelected =\n                    (props.selectedItemsList as BentoListboxMultiSelectValue)?.includes(option.value) || false;\n                return { isDisabled, isPreSelected };\n            };\n\n            const enabledItems = computed(() =>\n                props.category.items.filter(option => {\n                    const { isDisabled, isPreSelected } = optionStates(option);\n                    return (isDisabled && isPreSelected) || !isDisabled;\n                })\n            );\n\n            const visibleSelectedList = computed(\n                () =>\n                    enabledItems.value?.filter(({ value }) =>\n                        props.selectedItemsList?.includes(value)\n                    ) as unknown as BentoListboxMultiSelectValue\n            );\n\n            const chevronTitle = computed(() => {\n                const messageName = isOpen.value ? 'categoryOpened' : 'categoryClosed';\n                return t(messageName, { category: props.category.label }) as string;\n            });\n\n            const selectAll = () => {\n                emit(ListboxMultiSelectCategoryEvent.SELECT_CATEGORY);\n            };\n            const unselectAll = () => {\n                emit(ListboxMultiSelectCategoryEvent.UNSELECT_CATEGORY);\n            };\n\n            const { isAllSelected, isIndeterminate, toggleSelectAll } = useCheckboxSelectAll(\n                visibleSelectedList,\n                enabledItems,\n                selectAll,\n                unselectAll\n            );\n\n            const ariaCheckedComputed = computed(() => {\n                if (isIndeterminate.value) {\n                    return 'mixed';\n                }\n\n                return `${isAllSelected.value}`;\n            });\n\n            const isSelectAllOn = ref(isAllSelected.value);\n\n            const handleSelectAll = () => {\n                isSelectAllOn.value = !isSelectAllOn.value;\n                toggleSelectAll(isSelectAllOn.value);\n            };\n\n            watch(isAllSelected, () => {\n                isSelectAllOn.value = isAllSelected.value;\n            });\n\n            return {\n                // Values\n                chevronTitle,\n                conditionalClass,\n                hasAllPropsDisabled,\n                isOpen,\n                isAllSelected,\n                isIndeterminate,\n                isStaticCategory,\n                categoryGroupId,\n                categoryNameId,\n\n                // Computed\n                showItemChildren,\n                ariaCheckedComputed,\n\n                // Methods\n                handleSelectAll,\n                toggleOpen,\n                toggleSelectAll,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select-category.scss\" />\n","export enum ListboxMultiSelectOptionsEvent {\n    SELECT_CATEGORY = 'select-category',\n    TOGGLE_CHECKBOX_SELECTION = 'toggle-checkbox-selection',\n    UNSELECT_CATEGORY = 'unselect-category',\n    TOGGLE_CATEGORY_VISIBILITY = 'toggle-category-visibility',\n}\n","<template>\n    <div>\n        <div v-for=\"option in items\" :key=\"`selected-${option.value}`\">\n            <template v-if=\"searching && isMultiLevel\">\n                <bento-listbox-option\n                    class=\"b-listbox-multi-select-options\"\n                    :class=\"conditionalClasses\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :tabindex=\"computedTabindex(option.value)\"\n                    :aria-selected=\"`${isOptionSelected(option)}`\"\n                    :aria-checked=\"`${isOptionSelected(option)}`\"\n                    :aria-disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :role=\"$attrs['role']\"\n                    @click=\"toggleSearchOption(option)\"\n                    @enter-pressed=\"toggleSearchOption(option)\"\n                    @space-pressed.prevent=\"toggleSearchOption(option)\"\n                >\n                    <decorative-checkbox\n                        :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                        :checked=\"isOptionSelected(option)\"\n                    />\n                    <slot v-bind=\"option\">\n                        <span class=\"b-listbox-multi-select__option-text\">\n                            <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                            <bento-typography\n                                v-if=\"shouldShowDescription(option)\"\n                                class=\"b-listbox-multi-select__option-description\"\n                                el=\"span\"\n                            >\n                                {{ option.description }}\n                            </bento-typography>\n                        </span>\n                    </slot>\n                </bento-listbox-option>\n            </template>\n\n            <template v-else>\n                <!-- Category -->\n                <template v-if=\"option.items\">\n                    <listbox-multi-select-category\n                        :category=\"option\"\n                        :static-categories=\"staticCategories\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        :selected-items-list=\"selectedItemsList\"\n                        :tabindex=\"computedTabindex(option.value)\"\n                        @select-category=\"$emit(ListboxMultiSelectOptionsEvent.SELECT_CATEGORY, option)\"\n                        @unselect-category=\"$emit(ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY, option)\"\n                        @toggle-category-visibility=\"\n                            $emit(ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY, $event)\n                        \"\n                    >\n                        <listbox-multi-select-options\n                            category-items\n                            :items=\"option.items\"\n                            :is-option-disabled=\"isOptionDisabled\"\n                            :items-index=\"itemsIndex\"\n                            :focused-index=\"focusedIndex\"\n                            :is-multi-level=\"isMultiLevel\"\n                            :static-categories=\"staticCategories\"\n                            :selected-items-list=\"selectedItemsList\"\n                            :searching=\"searching\"\n                            :role=\"$attrs['role']\"\n                            @toggle-checkbox-selection=\"value => toggleCheckboxSelection(value)\"\n                        />\n                    </listbox-multi-select-category>\n                </template>\n\n                <!-- Option -->\n                <bento-listbox-option\n                    v-else\n                    class=\"b-listbox-multi-select-options\"\n                    :class=\"conditionalClasses\"\n                    :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :tabindex=\"computedTabindex(option.value)\"\n                    :aria-selected=\"`${isOptionSelected(option)}`\"\n                    :aria-checked=\"`${isOptionSelected(option)}`\"\n                    :aria-disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                    :role=\"$attrs['role']\"\n                    @click=\"toggleCheckboxSelection(option)\"\n                    @enter-pressed=\"toggleCheckboxSelection(option)\"\n                    @space-pressed.prevent=\"toggleCheckboxSelection(option)\"\n                >\n                    <decorative-checkbox\n                        :disabled=\"isOptionDisabled ? isOptionDisabled(option) : null\"\n                        :checked=\"isOptionSelected(option)\"\n                    />\n                    <slot v-bind=\"option\">\n                        <span class=\"b-listbox-multi-select__option-text\">\n                            <bento-typography el=\"span\">{{ option.label }}</bento-typography>\n                            <bento-typography\n                                v-if=\"shouldShowDescription(option)\"\n                                class=\"b-listbox-multi-select__option-description\"\n                                el=\"span\"\n                            >\n                                {{ option.description }}\n                            </bento-typography>\n                        </span>\n                    </slot>\n                </bento-listbox-option>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType } from 'vue';\n    import { BentoListboxOption } from '../../../listbox-option';\n    import { BentoTypography } from '@/components/typography';\n    import { ListboxMultiSelectCategory } from './components/listbox-multi-select-category';\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n\n    import {\n        BentoListboxEvent,\n        type BentoListboxIsOptionDisabled,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { ListboxMultiSelectOptionsEvent } from './listbox-multi-select-options.types';\n\n    /**\n     * Listbox multi-select options list\n     *\n     * @example\n     * import { ListboxMultiSelectOptions } from './components/listbox-multi-select-options';\n     *\n     * export default {\n     *     components: { ListboxMultiSelect },\n     *     template: `\n     *          <listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'listbox-multi-select-options',\n        components: {\n            BentoListboxOption,\n            BentoTypography,\n            ListboxMultiSelectCategory,\n            DecorativeCheckbox,\n        },\n        inheritAttrs: false,\n        props: {\n            /**\n             * Indicates if the items listed are inside a category\n             * so they can be padded to right by one level in recursion.\n             * Items of categories are automatically defined as \"categoryItems\"\n             */\n            categoryItems: { type: Boolean, default: false },\n\n            /**\n             * Current focused option index\n             */\n            focusedIndex: { type: Number, default: 0 },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => false,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }.\n             *\n             * @property {string} value.label - Text to be displayed in the option\n             * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * Indicates if the elements options are inside a multi-level category\n             */\n            isMultiLevel: { type: Boolean, default: false },\n\n            /**\n             * Flag that indicates that an external search it's being made\n             * to filter out the items inside the the multi-select listbox\n             *\n             * If enabled, hides the \"Select all\" checkbox in \"multiple\" mode.\n             */\n            searching: { type: Boolean, default: false },\n\n            /**\n             * List of selected items.\n             * Providing an empty array will select no options.\n             */\n            selectedItemsList: {\n                type: Array as PropType<Array<BentoListboxValue>>,\n                default: () => [],\n            },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Object with the index of each item.\n             */\n            itemsIndex: {\n                type: Object as PropType<Record<string, number>>,\n                default: () => ({}),\n            },\n        },\n        emits: [\n            ListboxMultiSelectOptionsEvent.TOGGLE_CHECKBOX_SELECTION,\n            ListboxMultiSelectOptionsEvent.SELECT_CATEGORY,\n            ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY,\n            ListboxMultiSelectOptionsEvent.TOGGLE_CATEGORY_VISIBILITY,\n        ],\n        setup(props, { emit }) {\n            const toggleCheckboxSelection = (option: BentoListboxOptionItem) => {\n                if (props.isOptionDisabled(option)) {\n                    return;\n                }\n                emit(ListboxMultiSelectOptionsEvent.TOGGLE_CHECKBOX_SELECTION, option);\n            };\n\n            const isCategory = (option: BentoListboxOptionItem) => !!option.items;\n            const shouldShowDescription = (option: BentoListboxOptionItem) => {\n                const isSearchingMultiLevel = props.isMultiLevel && props.searching;\n\n                return option.description && (!props.isMultiLevel || isSearchingMultiLevel);\n            };\n\n            const isOptionSelected = option => {\n                if (option.items) {\n                    return !!option.items.find(item => props.selectedItemsList.includes(item.value));\n                }\n                return props.selectedItemsList.includes(option.value);\n            };\n\n            const toggleSearchOption = option => {\n                if (isCategory(option)) {\n                    const event = isOptionSelected(option)\n                        ? ListboxMultiSelectOptionsEvent.UNSELECT_CATEGORY\n                        : ListboxMultiSelectOptionsEvent.SELECT_CATEGORY;\n                    emit(event, option);\n                } else {\n                    toggleCheckboxSelection(option);\n                }\n            };\n\n            const conditionalClasses = computed(() => ({\n                'b-listbox-multi-select-options__static-category-option': props.staticCategories,\n                'b-listbox-multi-select-options__category-option': props.categoryItems,\n            }));\n\n            const computedTabindex = value => (props.itemsIndex[value] === props.focusedIndex ? 0 : -1);\n\n            return {\n                // Values\n                conditionalClasses,\n\n                // Methods\n                isOptionSelected,\n                shouldShowDescription,\n                toggleCheckboxSelection,\n                toggleSearchOption,\n                computedTabindex,\n\n                // Enums\n                BentoListboxEvent,\n                ListboxMultiSelectOptionsEvent,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select-options.scss\" />\n","import { type BentoListboxOptions } from '@/types/listbox';\nimport { computed, type Ref } from 'vue';\n\n/**\n * Checks if items array is flat or has multi levels and converts items into a flat array if needed\n *\n * It receives a layout of type @see BentoLayoutGroupProportions to\n * generate the class and apply it to the children of the @see BentoFormLayoutGroup component\n *\n * @param {Ref<BentoListboxOptions>} itemsList - ref of the list of items for the listbox\n * @returns {ComputedRef<boolean>} isMultiLevelSelect - Indicates if items array is multi level\n * @returns {ComputedRef<any[]>} flattenedItemsList - list of items computed into a flat array\n */\nexport const useMultiLevelItems = (itemsList: Ref<BentoListboxOptions>) => {\n    const isMultiLevelSelect = computed(() => !!itemsList.value?.find(({ items }) => !!items));\n\n    const flattenedItemsList = computed(() => {\n        if (isMultiLevelSelect.value) {\n            return itemsList.value?.reduce((acc, val) => {\n                if (val.items) {\n                    acc.push(...val.items.flat());\n                } else {\n                    acc.push(val);\n                }\n                return acc;\n            }, []);\n        }\n\n        return itemsList.value;\n    });\n\n    return {\n        isMultiLevelSelect,\n        flattenedItemsList,\n    };\n};\n","<template>\n    <div ref=\"listboxRef\" class=\"b-listbox-multi-select\">\n        <!-- Selected options -->\n        <div v-if=\"showSelectedItems\">\n            <ul\n                v-bento-keyboard-navigation-directive\n                class=\"b-listbox-multi-select__chips\"\n                v-on=\"chipsSectionListeners\"\n            >\n                <li v-for=\"item in selectedOptions\" :key=\"item.value\">\n                    <bento-chip\n                        ref=\"selectedListboxItemsRef\"\n                        :disabled=\"isOptionDisabled(item)\"\n                        :label=\"item.label\"\n                        condensed\n                        @click=\"item.items ? unselectAllCategory(item) : toggleCheckboxSelection('select', item)\"\n                    />\n                </li>\n            </ul>\n\n            <hr class=\"b-listbox-multi-select__divider\" aria-hidden=\"true\" />\n        </div>\n\n        <div v-bento-keyboard-navigation-directive v-bind=\"ariaAttributes\" :role=\"computedRole\" v-on=\"listboxListeners\">\n            <!-- Select all -->\n            <bento-listbox-option\n                v-if=\"showSelectAllCheckbox\"\n                ref=\"selectAllListboxItemsRef\"\n                class=\"b-listbox-multi-select__option\"\n                :tabindex=\"focusedIndex === 0 ? 0 : -1\"\n                :aria-selected=\"ariaCheckedComputed !== 'false'\"\n                :aria-checked=\"ariaCheckedComputed\"\n                :role=\"computedOptionRole\"\n                @click=\"handleSelectAll\"\n                @enter-pressed=\"handleSelectAll\"\n                @space-pressed.prevent=\"handleSelectAll\"\n            >\n                <decorative-checkbox :checked=\"isAllSelected\" :indeterminate=\"isIndeterminate\" />\n                <bento-typography el=\"span\">\n                    {{ selectAllCheckboxText }}\n                </bento-typography>\n            </bento-listbox-option>\n            <hr v-if=\"showSelectAllCheckbox\" class=\"b-listbox-multi-select__divider\" aria-hidden=\"true\" />\n\n            <!-- Available options -->\n            <listbox-multi-select-options\n                ref=\"listboxItemsRef\"\n                :items=\"items\"\n                :is-option-disabled=\"isOptionDisabled\"\n                :is-multi-level=\"isMultiLevelSelect\"\n                :static-categories=\"staticCategories\"\n                :searching=\"searching\"\n                :selected-items-list=\"selectedItemsList\"\n                :focused-index=\"focusedIndex\"\n                :items-index=\"computedItemsIndex\"\n                :role=\"computedOptionRole\"\n                @toggle-checkbox-selection=\"toggleCheckboxSelection('select', $event)\"\n                @select-category=\"selectAllCategory\"\n                @unselect-category=\"unselectAllCategory\"\n                @toggle-category-visibility=\"toggleCategoryVisibility\"\n                @space-pressed=\"toggleCheckboxSelection(BentoListboxEvent.SPACE, $event)\"\n                @tab-pressed=\"toggleCheckboxSelection(BentoListboxEvent.TAB, $event)\"\n                @enter-pressed=\"toggleCheckboxSelection(BentoListboxEvent.ENTER, $event)\"\n            >\n                <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                    <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                </template>\n            </listbox-multi-select-options>\n        </div>\n    </div>\n</template>\n<script setup lang=\"ts\">\n    import { computed, type HTMLAttributes, nextTick, ref, toRef, useAttrs, useSlots, watch } from 'vue';\n    import { isVue2 } from 'vue-demi';\n\n    import { DecorativeCheckbox } from '@/internal/decorative-checkbox';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoChip } from '@/components/chip';\n    import { BentoListboxOption } from '../listbox-option';\n    import { ListboxMultiSelectOptions } from './components/listbox-multi-select-options';\n\n    import { useCheckboxSelectAll } from '@/composables';\n    import { useListboxKeyboardNavigation } from '../../composables/useListboxKeyboardNavigation';\n    import { useMultiLevelItems } from '../../composables/use-multi-level-items/use-multi-level-items';\n    import { useVisibleDomOptions } from '@/internal/listbox/composables/use-visible-dom-options/use-visible-dom-options';\n\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoKeyboardNavigationDirective as vBentoKeyboardNavigationDirective } from '@/directives';\n\n    import {\n        BentoListboxEvent,\n        type BentoListboxMultiSelectValue,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxValue,\n    } from '@/types/listbox';\n    import { type Booleanish } from '@/types/prop-types';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { type ListboxMultiSelectProps } from './listbox-multi-select.types';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const props = defineProps({\n  hasMoreItems: { type: Boolean, default: false },\n  isOptionDisabled: { default: isVue2 ? () => () => false : () => false },\n  items: null,\n  lazyLoadType: { default: 'none' },\n  searching: { type: Boolean, default: false },\n  selectedValues: null,\n  staticCategories: { type: Boolean, default: false }\n});\n\n    const emit = defineEmits([\"select\"]);\n\n    const { t, n } = useI18n<{ message: MessageSchema }>({ messages });\n    const slots = useSlots();\n    const attrs = useAttrs();\n    const ariaAttributes = computed(\n        () =>\n            ({\n                'aria-label': attrs['aria-label']?.toString() as string,\n                'aria-busy': attrs['aria-busy']?.toString() as Booleanish,\n                'aria-atomic': attrs['aria-atomic']?.toString() as Booleanish,\n                'aria-live': attrs['aria-live']?.toString() as string,\n                'aria-multiselectable': true,\n            }) as HTMLAttributes\n    );\n    const listboxRef = ref(null);\n    const selectAllListboxItemsRef = ref(null);\n    const selectedListboxItemsRef = ref(null);\n    const listboxItemsRef = ref(null);\n\n    const selectedItemsList = computed<Array<BentoListboxValue>>(() => props.selectedValues.map(({ value }) => value));\n\n    const { isMultiLevelSelect, flattenedItemsList } = useMultiLevelItems(toRef(props, 'items'));\n\n    const isTreePattern = computed(() => isMultiLevelSelect.value && !props.staticCategories);\n\n    const computedRole = computed(() => (isTreePattern.value ? 'tree' : 'listbox'));\n    const computedOptionRole = computed(() => (isTreePattern.value ? 'treeitem' : 'option'));\n\n    const optionStates = (option: BentoListboxOptionItem) => {\n        const isDisabled = props.isOptionDisabled(option);\n        const isPreSelected =\n            (selectedItemsList.value as BentoListboxMultiSelectValue)?.includes(option.value) || false;\n        return { isDisabled, isPreSelected };\n    };\n\n    // Items that are not disabled and pre-selected disabled items\n    const enabledItems = computed(() => {\n        if (props.searching && isMultiLevelSelect) {\n            return props.items;\n        }\n\n        const fullItemsList = flattenedItemsList.value.filter(option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return (isDisabled && isPreSelected) || !isDisabled;\n        });\n\n        props.selectedValues.forEach(selectedValue => {\n            if (!fullItemsList.find(item => item.value === selectedValue.value)) {\n                fullItemsList.push(selectedValue);\n            }\n        });\n\n        return fullItemsList;\n    });\n\n    const visibleSelectedList = computed(\n        () =>\n            enabledItems.value?.filter(option => {\n                if (option.items && isMultiLevelSelect.value && props.searching) {\n                    const amountOfSelectedCategoryOptions = option.items.filter(categoryOption =>\n                        (props.selectedValues ?? []).includes(categoryOption.value)\n                    ).length;\n                    return amountOfSelectedCategoryOptions === option.items.length;\n                }\n\n                return selectedItemsList.value?.includes(option.value); // Check for category\n            }) as BentoListboxMultiSelectValue\n    );\n\n    const calculateTotalItems = () => {\n        if (isMultiLevelSelect.value && !props.searching) {\n            return flattenedItemsList.value.length;\n        }\n\n        return props.items.length;\n    };\n\n    const selectAllCheckboxText = computed(() => {\n        const possibleSelections = enabledItems.value.length;\n        const total = calculateTotalItems();\n        const amountSelectedValues = visibleSelectedList.value?.length || 0;\n\n        if (amountSelectedValues === 0) {\n            return t('selectAll', { total: n(possibleSelections) });\n        }\n\n        if (amountSelectedValues === total) {\n            return t('allSelected', { total: n(total) });\n        }\n\n        return amountSelectedValues <= total\n            ? t('numberOfTotalSelected', { number: n(amountSelectedValues), total: n(total) })\n            : t('numbersSelected', { number: n(amountSelectedValues) });\n    });\n\n    const selectAll = (selectableItems: BentoListboxOptions) => {\n        const filterOutDisabledAndNotPreselectedOptions = option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return (isDisabled && isPreSelected) || !isDisabled;\n        };\n\n        // Adding or removing this list of values\n        const addOrRemoveList = selectableItems\n            .filter(filterOutDisabledAndNotPreselectedOptions)\n            .filter(item => !selectedItemsList.value.includes(item.value)); // MAKE SURE NOT TO ADD DUPLICATES\n\n        emit('select', [...props.selectedValues, ...addOrRemoveList]);\n    };\n\n    const unselectAll = (selectableItems: BentoListboxOptions) => {\n        const findEnabledUnselectedItems = option => {\n            const { isDisabled, isPreSelected } = optionStates(option);\n            return !(isDisabled && isPreSelected);\n        };\n\n        const unselectedItemsList = selectableItems.filter(findEnabledUnselectedItems).map(({ value }) => value);\n        const newSelectedList = props.selectedValues.filter(item => !unselectedItemsList?.includes(item.value));\n        emit('select', newSelectedList);\n    };\n\n    const selectAllItems = () => {\n        selectAll(flattenedItemsList.value);\n    };\n\n    const unselectAllItems = () => {\n        unselectAll(flattenedItemsList.value);\n    };\n\n    const { isAllSelected, isIndeterminate, toggleSelectAll } = useCheckboxSelectAll(\n        visibleSelectedList,\n        enabledItems,\n        selectAllItems,\n        unselectAllItems\n    );\n\n    const ariaCheckedComputed = computed(() => {\n        if (isIndeterminate.value) {\n            return 'mixed';\n        }\n\n        return `${isAllSelected.value}`;\n    });\n\n    const isSelectAllOn = ref(isAllSelected.value);\n\n    const handleSelectAll = () => {\n        isSelectAllOn.value = !isSelectAllOn.value;\n        toggleSelectAll(isSelectAllOn.value);\n    };\n\n    watch(isAllSelected, () => {\n        isSelectAllOn.value = isAllSelected.value;\n    });\n\n    const selectAllCategory = (category: BentoListboxOptionItem) => {\n        selectAll(category.items);\n    };\n\n    const unselectAllCategory = (category: BentoListboxOptionItem) => {\n        unselectAll(category.items);\n    };\n\n    const toggleCheckboxSelection = (eventName, selectedOption: BentoListboxOptionItem) => {\n        let exists = false;\n        const newSelectedList = props.selectedValues.filter(({ value }) => {\n            if (selectedOption.value === value) {\n                exists = true;\n                return false;\n            }\n\n            return true;\n        });\n\n        if (!exists) {\n            newSelectedList.push(selectedOption);\n        }\n        emit(eventName, newSelectedList);\n    };\n\n    const selectedOptions = computed(() => {\n        if (!isMultiLevelSelect.value) {\n            return props.selectedValues;\n        }\n\n        const isOptionSelected = (option: BentoListboxOptionItem): boolean =>\n            (selectedItemsList.value as unknown as Array<string | number>).includes(option.value);\n\n        const categoryOptionsSelected = (categoryOptions: Array<BentoListboxOptionItem>): boolean =>\n            !props.staticCategories && categoryOptions.every(option => isOptionSelected(option));\n\n        const optionsFlat = props.items.flatMap(option =>\n            option.items && !categoryOptionsSelected(option.items) ? option.items : option\n        );\n\n        const options = optionsFlat.filter(option => {\n            if (option.items) {\n                return true;\n            }\n            return isOptionSelected(option);\n        });\n\n        return options;\n    });\n\n    const showSelectedItems = computed(() => {\n        const isLazyLoad = ['automatic', 'button'].includes(props.lazyLoadType);\n        const hasAllItemsSelected =\n            props.selectedValues?.length > 0 && visibleSelectedList.value?.length !== flattenedItemsList.value?.length;\n\n        if (isLazyLoad && props.hasMoreItems) {\n            return !!props.selectedValues?.length;\n        }\n\n        return hasAllItemsSelected;\n    });\n\n    const showSelectAllCheckbox = computed(() => {\n        const isLazyLoad = ['automatic', 'button'].includes(props.lazyLoadType);\n\n        if (!isLazyLoad) {\n            return true;\n        }\n\n        return !props.hasMoreItems;\n    });\n\n    // Keyboard navigation\n    const expandedCategories = ref([]);\n\n    const { visibleDomOptions, updateVisibleDomOptions } = useVisibleDomOptions(\n        listboxRef,\n        toRef(props, 'items'),\n        computedOptionRole\n    );\n\n    const toggleCategoryVisibility = category => {\n        if (expandedCategories.value.includes(category)) {\n            expandedCategories.value = expandedCategories.value.filter(item => item !== category);\n        } else {\n            expandedCategories.value.push(category);\n        }\n\n        nextTick(() => {\n            updateVisibleDomOptions();\n        });\n    };\n\n    const focusItem = (nextFocusedItemIndex: number) => {\n        visibleDomOptions.value[nextFocusedItemIndex]?.focus();\n    };\n\n    const {\n        moveToNextElement,\n        moveToPreviousElement,\n        moveToFirstElement,\n        moveToLastElement,\n        preventDefault,\n        focusedIndex,\n        setListboxFocusedIndex,\n    } = useListboxKeyboardNavigation(\n        {\n            items: visibleDomOptions,\n        },\n        focusItem\n    );\n\n    const listboxListeners = {\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: (event: CustomEvent<KeyboardEvent>) =>\n            moveToPreviousElement(event),\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: (event: CustomEvent<KeyboardEvent>) =>\n            moveToNextElement(event),\n        [BentoKeyboardNavigationKeyDownEvent.HOME]: moveToFirstElement,\n        [BentoKeyboardNavigationKeyDownEvent.END]: moveToLastElement,\n    };\n\n    defineExpose({\n        /**\n         * Method to set the index of the item to be focused on\n         * Used for focus management to be kept in-sync with parent e.g. dropdowns\n         */\n        setListboxFocusedIndex,\n    });\n\n    const chipsSectionListeners = {\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_UP]: preventDefault,\n        [BentoKeyboardNavigationKeyDownEvent.ARROW_DOWN]: preventDefault,\n    };\n\n    const computedItemsIndex = computed(() => {\n        let itemIndex = 1;\n        const indexMap = {};\n\n        props.items.forEach(item => {\n            let subItemsVisible = expandedCategories.value.includes(item.value);\n\n            if (item.items) {\n                if (props.staticCategories) {\n                    subItemsVisible = true;\n                } else {\n                    indexMap[item.value] = itemIndex++;\n                }\n\n                if (subItemsVisible) {\n                    item.items.forEach(subItem => (indexMap[subItem.value] = itemIndex++));\n                }\n            } else {\n                indexMap[item.value] = itemIndex++;\n            }\n        });\n        return indexMap;\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Listbox multi-select options list\n     *\n     * @example\n     * import { BentoListboxMultiSelect } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoListboxMultiSelect },\n     *     template: `\n     *          <bento-listbox-multi-select\n     *              :items=\"[{ label: 'Option 1', value: 'option-1' }]\"\n     *              :selected-values=\"['option-1']\"\n     *          />\n     *     `\n     * }\n     */\n    export default { i18n: { messages } };\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox-multi-select.scss\" />\n","<template>\n    <div\n        :id=\"id\"\n        ref=\"listboxRef\"\n        v-bento-keyboard-navigation-directive\n        class=\"b-listbox\"\n        tabindex=\"-1\"\n        v-bind=\"listboxContainerAttributes\"\n        :style=\"containerProps?.style\"\n        data-testid=\"listbox-container\"\n        @scroll=\"onListboxContainerScroll\"\n    >\n        <div v-bind=\"wrapperProps\">\n            <!-- Loading filtered items loading -->\n            <div v-if=\"componentLoading\" class=\"b-listbox__loading-filtered-items\">\n                <bento-loading-indicator />\n            </div>\n            <!-- Empty search message -->\n            <div v-else-if=\"isSearchResultEmpty\" class=\"b-listbox__empty-search-message\">\n                <bento-empty-state v-if=\"emptyState\" v-bind=\"limitedEmptyStateProps\" />\n                <bento-typography v-else el=\"span\">{{ noResultsMessage }}</bento-typography>\n            </div>\n\n            <template v-else>\n                <!-- Multi select -->\n                <template v-if=\"multiple\">\n                    <bento-listbox-multi-select\n                        ref=\"listboxItemRef\"\n                        :has-more-items=\"hasMoreItems\"\n                        v-bind=\"ariaAttributes\"\n                        :items=\"items\"\n                        :lazy-load-type=\"lazyLoadType\"\n                        :static-categories=\"staticCategories\"\n                        :selected-values=\"selectedValue\"\n                        :searching=\"searching\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        v-on=\"listboxListeners\"\n                    >\n                        <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                            <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                        </template>\n                    </bento-listbox-multi-select>\n                </template>\n\n                <!-- Single select -->\n                <template v-else>\n                    <bento-listbox-single-select\n                        ref=\"listboxItemRef\"\n                        :items=\"virtualisedItems\"\n                        v-bind=\"ariaAttributes\"\n                        :selected-value=\"selectedValue\"\n                        :static-categories=\"staticCategories\"\n                        :is-option-disabled=\"isOptionDisabled\"\n                        v-on=\"listboxListeners\"\n                    >\n                        <template v-for=\"(_, innerSlot) of slots\" #[innerSlot]=\"scope\">\n                            <slot :name=\"innerSlot\" v-bind=\"scope\" />\n                        </template>\n                    </bento-listbox-single-select>\n                </template>\n\n                <!-- Lazy Loading -->\n                <div v-if=\"shouldDisplayShowMoreButton\" class=\"b-listbox__lazy-load\">\n                    <bento-loading-button :state=\"loadingButtonState\" variant=\"secondary\" @click.capture=\"emitShowMore\">\n                        {{ showMoreButtonText }}\n                    </bento-loading-button>\n                </div>\n                <div v-else-if=\"loading\" class=\"b-listbox__lazy-load\">\n                    <bento-loading-indicator />\n                </div>\n            </template>\n        </div>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, type PropType, ref, toRef } from 'vue';\n    import {\n        type BentoListboxEmptyStateProps,\n        BentoListboxEvent,\n        type BentoListboxIsOptionDisabled,\n        BentoListboxLazyLoadType,\n        type BentoListboxOptionItem,\n        type BentoListboxOptions,\n        type BentoListboxVirtulisationOptions,\n    } from '@/types/listbox';\n    import { BentoKeyboardNavigationKeyDownEvent } from '@/types/keyboard-navigation';\n    import { BentoKeyboardNavigationDirective } from '@/directives';\n    import { BentoListboxSingleSelect } from './components/listbox-single-select';\n    import { BentoListboxMultiSelect } from './components/listbox-multi-select';\n    import { BentoTypography } from '@/components/typography';\n    import { BentoLoadingIndicator } from '@/components/loading-indicator';\n    import { BentoLoadingButton, BentoLoadingButtonState } from '@/components/button';\n    import { BentoEmptyState } from '@/components/empty-state';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { debounce } from '@/utils/ts/debounce';\n    import { useVirtualList } from '@/composables/use-virtual-list';\n    import type { HTMLAttributes } from 'vue/types/jsx.d.ts';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n    const DEFAULT_DROPDOWN_ITEM_HEIGHT = 36;\n\n    /**\n     * Listbox container.\n     * It lists all the available options.\n     *\n     * @example\n     * <bento-listbox\n     *      v-slot=\"{label, value}\"\n     *      :id=\"listboxOptionsContainerId\"\n     *      :aria-label=\"ariaLabel\"\n     *      :disabled=\"disabled\"\n     *      :multiple=\"multiple\"\n     *      :selected=\"value\"\n     *      :isOptionDisabled=\"option => option.value === 2\"\n     *      :items=\"[{\n     *         { label: 'Option 1', value: 1 },\n     *         { label: 'Option 2', value: 2 },\n     *      }]\"\n     *      @select=\"onOptionSelected\"\n     * >\n     * </bento-listbox>\n     */\n    export default defineComponent({\n        name: 'bento-listbox',\n        components: {\n            BentoEmptyState,\n            BentoListboxSingleSelect,\n            BentoListboxMultiSelect,\n            BentoTypography,\n            BentoLoadingIndicator,\n            BentoLoadingButton,\n        },\n        directives: { BentoKeyboardNavigationDirective },\n        i18n: { messages },\n        props: {\n            /**\n             * Defines a string value that labels an interactive element.\n             */\n            ariaLabel: { type: String, default: null },\n\n            /**\n             * Empty state props that will be used with the inner empty state component to be displayed when no search results are found.\n             */\n            emptyState: {\n                type: Object as PropType<BentoListboxEmptyStateProps>,\n                default: undefined,\n            },\n\n            /**\n             * Indicates whether there are more items to load\n             */\n            hasMoreItems: { type: Boolean, default: false },\n\n            /**\n             *  Identifies the listbox whose contents are controlled by the the combobox on which the aria-controls attribute is set.\n             */\n            id: { type: String, required: true },\n\n            /**\n             * Function that allows the options to be disabled\n             *\n             * @type {BentoListboxIsOptionDisabled}\n             * @param {BentoListboxOptionItem} option - Listbox option object\n             * @param {string} option.label - Option's label text\n             * @param {string|number} option.value - Option's value\n             * @param {unknown} option.data - Option's extra data to be passed to the default slot\n             */\n            isOptionDisabled: {\n                type: Function as PropType<BentoListboxIsOptionDisabled>,\n                default: () => undefined,\n            },\n\n            /**\n             * The option elements to populate the listbox with.\n             * It must be an array of {@see BentoListboxOptionItem }\n             *  * @property {string} value.label - Text to be displayed in the option\n             *  * @property {string,number} value.value - Value of the option\n             */\n            items: {\n                type: Array as PropType<BentoListboxOptions>,\n                required: true,\n            },\n\n            /**\n             * Indicates if new options are lazy loading.\n             */\n            loading: { type: Boolean, default: false },\n\n            /**\n             * The type of `Lazy Load`.\n             * Type \"automatic\" will enable infinite scrolling\n             * Type \"button\" will enable lazy loading with \"Show more\" button\n             */\n            lazyLoadType: {\n                type: String as PropType<BentoListboxLazyLoadType | `${BentoListboxLazyLoadType}`>,\n                default: BentoListboxLazyLoadType.NONE,\n                validator: (value: BentoListboxLazyLoadType) => Object.values(BentoListboxLazyLoadType).includes(value),\n            },\n\n            /**\n             * Indicates the listbox is loading filtered items.\n             */\n            componentLoading: { type: Boolean, default: false },\n\n            /**\n             * If enabled, the user will be able to select multiple items.\n             */\n            multiple: { type: Boolean, default: false },\n\n            /**\n             * If enabled, dropdown will display non-selectable, static categories\n             */\n            staticCategories: { type: Boolean, default: false },\n\n            /**\n             * Messaged displayed when no items are listed in the listbox\n             */\n            noResultsMessage: { type: String, required: true },\n\n            /**\n             * Flag that indicates that an external search it's being made\n             * to filter out the items inside the the multi-select listbox\n             *\n             * If enabled, hides the \"Select all\" checkbox in \"multiple\" mode.\n             */\n            searching: BentoListboxMultiSelect.props.searching,\n\n            /**\n             * The `input` value.\n             * Providing an empty string or empty array will select no options.\n             * Set to an empty string `''` if you don't want any of the available options to be selected for single select\n             */\n            selectedValue: {\n                type: Array as PropType<BentoListboxOptions>,\n                default: () => [],\n            },\n\n            /**\n             * Enables virtual scrolling if set to true or by providing an object with itemHeight function.\n             * The itemHeight function is used to calculate the height of rendered item given it's index.\n             */\n            virtualScroll: {\n                type: [Boolean, Object] as PropType<BentoListboxVirtulisationOptions>,\n                default: false,\n            },\n        },\n        emits: [\n            BentoListboxEvent.SELECT,\n            BentoListboxEvent.SPACE,\n            BentoListboxEvent.SHOW_MORE,\n            BentoListboxEvent.ENTER,\n            BentoListboxEvent.ESCAPE,\n            BentoListboxEvent.TAB,\n        ],\n        setup(props, { emit, slots }) {\n            const listboxItemRef = ref([]);\n            const items = toRef(props, 'items');\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const isLazyLoadListbox = computed(() => props.lazyLoadType !== BentoListboxLazyLoadType.AUTOMATIC);\n            const hasAutomaticLazyLoader = computed(() => props.lazyLoadType === BentoListboxLazyLoadType.AUTOMATIC);\n\n            // Virtual scrolling\n            const virtualScrollItemHeight = () => {\n                if (typeof props?.virtualScroll === 'object' && props?.virtualScroll?.itemHeight) {\n                    return props.virtualScroll.itemHeight;\n                }\n                return DEFAULT_DROPDOWN_ITEM_HEIGHT;\n            };\n            const {\n                containerRef: listboxRef,\n                containerProps,\n                onScroll: onContainerScroll,\n                list: virtualisedItems,\n                wrapperProps,\n            } = useVirtualList<BentoListboxOptionItem>(items, {\n                itemHeight: virtualScrollItemHeight(),\n                // Disable virtual scrolling if not enabled or if lazy loading is enabled or if multi-select\n                disabled: props?.multiple || props?.virtualScroll === false || props?.lazyLoadType !== 'none',\n            });\n\n            // Aria a11y\n            const ariaAtomic = computed<HTMLAttributes['aria-atomic']>(() =>\n                props.componentLoading !== undefined || isLazyLoadListbox.value ? 'true' : undefined\n            );\n            const ariaBusy = computed<HTMLAttributes['aria-busy']>(() =>\n                (isLazyLoadListbox.value && props.loading) || props.componentLoading ? 'true' : 'false'\n            );\n            const ariaLive = computed<HTMLAttributes['aria-live']>(() =>\n                isLazyLoadListbox.value || props.componentLoading !== undefined ? 'polite' : undefined\n            );\n\n            const ariaAttributes = computed(\n                () =>\n                    ({\n                        'aria-label': props.ariaLabel,\n                        'aria-busy': ariaBusy.value,\n                        'aria-atomic': ariaAtomic.value,\n                        'aria-live': ariaLive.value,\n                    }) as HTMLAttributes\n            );\n\n            const listboxContainerAttributes = computed(\n                () =>\n                    (props.componentLoading\n                        ? {\n                              ...ariaAttributes.value,\n                              role: 'alert',\n                          }\n                        : {}) as HTMLAttributes\n            );\n\n            const onOptionSelected = eventName => (selectedItem: BentoListboxOptions) => {\n                emit(eventName, selectedItem);\n            };\n\n            const emitShowMore = () => {\n                emit(BentoListboxEvent.SHOW_MORE);\n            };\n\n            const emitShowMoreOnScrollEnd = debounce(() => {\n                const container = listboxRef.value;\n\n                if (!container) {\n                    return;\n                }\n\n                const isAtBottom = Math.round(container.scrollTop) + container.clientHeight >= container.scrollHeight;\n\n                if (props.hasMoreItems && isAtBottom && !props.loading) {\n                    emitShowMore();\n                }\n            });\n\n            const onListboxContainerScroll = () => {\n                if (hasAutomaticLazyLoader.value) {\n                    emitShowMoreOnScrollEnd();\n                } else {\n                    onContainerScroll();\n                }\n            };\n\n            const isSearchResultEmpty = computed(() => props.items?.length === 0);\n\n            const shouldDisplayShowMoreButton = computed(\n                () => props.lazyLoadType === BentoListboxLazyLoadType.BUTTON && props.hasMoreItems\n            );\n\n            const loadingButtonState = computed(() =>\n                props.loading ? BentoLoadingButtonState.LOADING : BentoLoadingButtonState.START\n            );\n\n            const showMoreButtonText = computed(() => (props.loading ? t('loading') : t('showMore')));\n\n            const limitedEmptyStateProps = computed<InstanceType<typeof BentoEmptyState>['$props']>(() => ({\n                ...props.emptyState,\n                variant: 'condensed',\n            }));\n\n            const listboxListeners = {\n                [BentoListboxEvent.SELECT]: onOptionSelected(BentoListboxEvent.SELECT),\n                [BentoListboxEvent.SPACE]: onOptionSelected(BentoListboxEvent.SPACE),\n                [BentoListboxEvent.TAB]: onOptionSelected(BentoListboxEvent.TAB),\n                [BentoListboxEvent.ENTER]: onOptionSelected(BentoListboxEvent.ENTER),\n            };\n\n            return {\n                // Refs\n                listboxRef,\n                listboxItemRef,\n\n                // a11y\n                ariaAttributes,\n                listboxContainerAttributes,\n\n                // Values\n                containerProps,\n                isSearchResultEmpty,\n                limitedEmptyStateProps,\n                loadingButtonState,\n                slots,\n                shouldDisplayShowMoreButton,\n                showMoreButtonText,\n                virtualisedItems,\n                wrapperProps,\n\n                // Enums\n                BentoKeyboardNavigationKeyDownEvent,\n                BentoListboxEvent,\n\n                // Methods\n                onListboxContainerScroll,\n                onOptionSelected,\n                emitShowMore,\n                listboxListeners,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./listbox.scss\" />\n","import {\n    type BentoListboxMultiSelectValue,\n    type BentoListboxOptionItem,\n    type BentoListboxOptions,\n    type BentoListboxSelectedValue,\n    type BentoListboxSelectedValueLabelPair,\n    type BentoListboxValue,\n} from '@/types/listbox';\nimport { ref, type Ref, watch } from 'vue';\n\n/**\n * Extracts an item's label from the items in the list of options\n * displayed in the Listbox.\n *\n * Searches through all items and their sub-items (categories).\n *\n * @param items List of options displayed in the Listbox\n * @param value Selected value that needs to be found in the list\n * @returns Label found\n */\nconst findItem = (items: BentoListboxOptions, value: BentoListboxValue): BentoListboxOptionItem => {\n    for (const item of items) {\n        if (item.value === value) {\n            return item;\n        }\n\n        if (item.items) {\n            // recursively look for the value and continue to the next item if value is not found\n            const label = findItem(item.items, value);\n\n            if (label) {\n                return label;\n            }\n        }\n    }\n\n    return null;\n};\n\n/**\n * Type guard to check if a value is of type BentoListboxSelectedValueLabelPair.\n * @param value The value to check.\n * @returns True if the value is BentoListboxSelectedValueLabelPair, false otherwise.\n */\nconst isBentoListboxSelectedValueLabelPair = (\n    value: BentoListboxSelectedValue\n): value is BentoListboxSelectedValueLabelPair => {\n    return typeof value === 'object' && value !== null && 'value' in value && 'label' in value;\n};\n\n/**\n * Creates two lists (one with value/label pairs and one simply with values) that are\n * used to cache the internal option selections to preserve the `label` in case the\n * value is loaded from external sources and might not be found in the list of `items`\n * later on.\n *\n * This helps with external searches and lazy loaded lists.\n *\n * @param items List of options displayed in the Listbox\n * @param selectedValues Selected list of values\n * @param multiple Indicates if the Listbox is multi-select (true) or single-select (false)\n * @param enableValueLabelPair Indicates if the Listbox should emit value/label pairs.\n * @returns Two lists of cached items. One list with label/value pairs and one with only the values stored.\n */\nexport const useCachedSelectedValues = (\n    items: Ref<BentoListboxOptions>,\n    selectedValues: Ref<BentoListboxSelectedValue>,\n    multiple: Ref<boolean>,\n    enableValueLabelPair?: Ref<boolean>\n) => {\n    const cachedSelectedListboxOptions = ref<BentoListboxOptions>([]);\n    const cachedListboxSelectedValues = ref<BentoListboxSelectedValue>();\n\n    /**\n     * Sets the cached selected values based on a simple value (string or number).\n     * It handles both single and multi-select modes.\n     * @param newSelectedValues The new list of selected options.\n     */\n    const setSimpleSelectedValues = (newSelectedValues: BentoListboxOptions) => {\n        if (multiple.value) {\n            cachedListboxSelectedValues.value = newSelectedValues.map(({ value }) => value);\n        } else {\n            cachedListboxSelectedValues.value = newSelectedValues.length > 0 ? newSelectedValues[0].value : null;\n        }\n    };\n\n    const setValueLabelPair = (newSelectedValues: BentoListboxOptions) => {\n        if (multiple.value) {\n            cachedListboxSelectedValues.value = newSelectedValues.map(({ value, label }) => ({ value, label }));\n        } else {\n            cachedListboxSelectedValues.value =\n                newSelectedValues.length > 0\n                    ? { value: newSelectedValues[0].value, label: newSelectedValues[0].label }\n                    : null;\n        }\n    };\n\n    const setCachedValues = (newSelectedValues: BentoListboxOptions) => {\n        cachedSelectedListboxOptions.value = newSelectedValues;\n        if (enableValueLabelPair?.value) {\n            setValueLabelPair(newSelectedValues);\n        } else {\n            setSimpleSelectedValues(newSelectedValues);\n        }\n    };\n\n    const resetCache = () => {\n        cachedSelectedListboxOptions.value = [];\n        cachedListboxSelectedValues.value = null;\n    };\n\n    watch(\n        () => selectedValues.value,\n        () => {\n            if (!selectedValues.value && selectedValues.value !== 0) {\n                resetCache();\n                return;\n            }\n\n            const isSingleSelect = !Array.isArray(selectedValues.value);\n            // Make a copy of cache\n            const cachedCopy = [...cachedSelectedListboxOptions.value];\n            // Clear cache\n            resetCache();\n\n            const addValue = (value: BentoListboxSelectedValue) => {\n                // When it's a value/label pair, add it immediately\n                // Otherwise search if the value is available in the list\n                // and create a value/label pair to be added to the list\n                if (isBentoListboxSelectedValueLabelPair(value)) {\n                    cachedSelectedListboxOptions.value.push(value);\n                } else {\n                    // Search label by value in \"items\"\n                    let selectedItem = findItem(items.value, value as BentoListboxValue);\n\n                    // Search in previous cache\n                    if (!selectedItem) {\n                        selectedItem = findItem(cachedCopy, value as BentoListboxValue);\n                    }\n\n                    // Transform value to label if not found anywhere\n                    if (!selectedItem) {\n                        selectedItem = { value: value as BentoListboxValue, label: value.toString() };\n                    }\n\n                    cachedSelectedListboxOptions.value.push(selectedItem);\n                }\n            };\n\n            if (isSingleSelect) {\n                const value = selectedValues.value as BentoListboxValue;\n\n                addValue(value);\n                if (enableValueLabelPair?.value) {\n                    setValueLabelPair(cachedSelectedListboxOptions.value);\n                } else {\n                    setSimpleSelectedValues(cachedSelectedListboxOptions.value);\n                }\n                return;\n            }\n\n            // Multi-select\n            (selectedValues.value as BentoListboxMultiSelectValue).forEach(addValue);\n            // Add each selected value in the cache\n            if (enableValueLabelPair?.value) {\n                setValueLabelPair(cachedSelectedListboxOptions.value);\n            } else {\n                setSimpleSelectedValues(cachedSelectedListboxOptions.value);\n            }\n        },\n        { immediate: true }\n    );\n\n    return {\n        // Values\n        cachedSelectedListboxOptions,\n        cachedListboxSelectedValues,\n        // Methods\n        resetCache,\n        setCachedValues,\n    };\n};\n"],"names":["useCheckboxSelectAll","selectedItemsList","items","selectAll","unselectAll","isAllSelected","computed","_a","_b","isIndeterminate","selectedValue","useVirtualList","disabled","itemHeight","overscan","prefixHeight","containerRef","ref","list","startIndex","endIndex","containerHeight","listObserver","wrapperProps","totalHeight","sum","_","index","offSetTop","i","getOffset","prefixHeightIfSet","scrollTop","offset","size","getVisibileNumberOfItems","start","capacity","updateVisibleItems","visibleCount","onScroll","onMounted","observeSizeOfElement","clientHeight","onUnmounted","watch","containerProps","BentoListboxEvent","BentoListboxEvent2","BentoListboxLazyLoadType","BentoListboxLazyLoadType2","_sfc_main$a","defineComponent","BentoTypography","_sfc_main$9","props","emit","conditionalClasses","BentoKeyboardNavigationKeyDownEvent","e","eventName","uuid$1","_sfc_main$8","_sfc_main$7","BentoListboxOption","CheckmarkIcon","onOptionSelected","ariaDisabled","ariaSelected","tabIndex","useListboxKeyboardNavigation","focusItem","lastItemIndex","focusedIndex","mutateFocusedIndex","direction","calculateFocusedIndex","edgeCaseItem","moveToNextElement","event","preventDefault","moveToPreviousElement","moveToFirstElement","moveToLastElement","setListboxFocusedIndex","useVisibleDomOptions","role","checkVisibility","visibleDomOptions","updateVisibleDomOptions","options","option","nextTick","_sfc_main$6","BentoListboxSingleSelectCategory","BentoListboxSingleSelectOption","BentoKeyboardNavigationDirective","expose","slots","attrs","listboxRef","listboxItemRef","selectedItem","ariaAttributes","_c","_d","hasCategories","selectedOption","toRef","nextFocusedItemIndex","listboxListeners","listboxOptionListeners","uuid","_sfc_main$5","__default__$1","CheckboxInputState","outlineConditionalClasses","ListboxMultiSelectCategoryClass","ListboxMultiSelectCategoryClass2","ListboxMultiSelectCategoryEvent","ListboxMultiSelectCategoryEvent2","_sfc_main$3","messages$2","ChevronDownIcon","ChevronUpIcon","DecorativeCheckbox","isOpen","useI18n","categoryGroupId","generateUid","categoryNameId","vue2Vue3FixedisOptionDisabled","hasAllPropsDisabled","isStaticCategory","showItemChildren","conditionalClass","toggleOpen","open","optionStates","isDisabled","isPreSelected","enabledItems","visibleSelectedList","value","chevronTitle","messageName","toggleSelectAll","ariaCheckedComputed","isSelectAllOn","handleSelectAll","ListboxMultiSelectOptionsEvent","ListboxMultiSelectOptionsEvent2","_sfc_main$2","ListboxMultiSelectCategory","toggleCheckboxSelection","isCategory","shouldShowDescription","isSearchingMultiLevel","isOptionSelected","item","toggleSearchOption","useMultiLevelItems","itemsList","isMultiLevelSelect","flattenedItemsList","acc","val","__default__","messages$1","t","n","useSlots","useAttrs","selectAllListboxItemsRef","selectedListboxItemsRef","listboxItemsRef","isTreePattern","computedRole","computedOptionRole","fullItemsList","categoryOption","calculateTotalItems","selectAllCheckboxText","possibleSelections","total","amountSelectedValues","selectableItems","filterOutDisabledAndNotPreselectedOptions","addOrRemoveList","findEnabledUnselectedItems","unselectedItemsList","newSelectedList","selectAllItems","unselectAllItems","selectAllCategory","category","unselectAllCategory","exists","selectedOptions","categoryOptionsSelected","categoryOptions","showSelectedItems","isLazyLoad","hasAllItemsSelected","showSelectAllCheckbox","expandedCategories","toggleCategoryVisibility","chipsSectionListeners","computedItemsIndex","itemIndex","indexMap","subItemsVisible","subItem","DEFAULT_DROPDOWN_ITEM_HEIGHT","_sfc_main","BentoEmptyState","BentoListboxSingleSelect","BentoListboxMultiSelect","BentoLoadingIndicator","BentoLoadingButton","messages","isLazyLoadListbox","hasAutomaticLazyLoader","virtualScrollItemHeight","onContainerScroll","virtualisedItems","ariaAtomic","ariaBusy","ariaLive","listboxContainerAttributes","emitShowMore","emitShowMoreOnScrollEnd","debounce","container","isAtBottom","onListboxContainerScroll","isSearchResultEmpty","shouldDisplayShowMoreButton","loadingButtonState","BentoLoadingButtonState","showMoreButtonText","limitedEmptyStateProps","findItem","label","isBentoListboxSelectedValueLabelPair","useCachedSelectedValues","selectedValues","multiple","enableValueLabelPair","cachedSelectedListboxOptions","cachedListboxSelectedValues","setSimpleSelectedValues","newSelectedValues","setValueLabelPair","setCachedValues","resetCache","isSingleSelect","cachedCopy","addValue"],"mappings":"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"}