@adyen/bento-vue2 1.88.1 → 1.89.2

package/dist/chunks/{dashed-underline.DauOBhSD.js.map → dashed-underline.pjYTS0m1.js.map}

@@ -1 +1 @@
-{"version":3,"file":"dashed-underline.DauOBhSD.js","sources":["../../src/components/dashed-underline/dashed-underline.vue"],"sourcesContent":["<template>\n    <span\n        ref=\"element\"\n        v-bento-tooltip-directive:[tooltipPosition]=\"tooltipText\"\n        class=\"b-dashed-underline\"\n        tabindex=\"0\"\n        @mouseenter=\"openPopover\"\n        @mouseleave=\"closePopover\"\n        @focus=\"dashedUnderlineOnFocus\"\n        @focusout=\"dashedUnderlineOnFocusOut\"\n    >\n        <span class=\"b-dashed-underline__content\">\n            <slot></slot>\n        </span>\n        <bento-teleport v-if=\"element && hasPopover\" :disabled=\"teleport?.disabled\" :to=\"teleport?.to\">\n            <span v-on=\"computedPopoverContainerEvents\">\n                <bento-popover\n                    :open=\"isOpen\"\n                    :target-element=\"element\"\n                    :position=\"popoverPosition\"\n                    role=\"tooltip\"\n                    :fit-content=\"popoverSize === 'fit-content' || undefined\"\n                    :large=\"popoverSize === 'large' || undefined\"\n                    :small=\"popoverSize === 'small' || undefined\"\n                    :title=\"popoverTitle\"\n                    disable-focus-trap\n                >\n                    <slot name=\"popover-content\">\n                        <bento-typography>\n                            {{ popoverText }}\n                        </bento-typography>\n                    </slot>\n                </bento-popover>\n            </span>\n        </bento-teleport>\n    </span>\n</template>\n\n<script lang=\"ts\" setup>\n    import { computed, ref, useSlots, watch } from 'vue';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTooltipDirective as vBentoTooltipDirective } from '@/directives/tooltip/index';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import { BentoTeleport } from '@/internal';\n    import { type BentoDashedUnderlineProps } from './dashed-underline.types';\n\n    const CLOSING_POPOVER_DELAY_MS = 200;\n\n    const props = defineProps({\n  popoverText: { default: null },\n  popoverTitle: { default: null },\n  popoverPosition: { default: 'top' },\n  popoverSize: { default: 'fit-content' },\n  teleport: { default: () => ({\n            disabled: true,\n        }) },\n  tooltipText: { default: null },\n  tooltipPosition: { default: 'top' }\n});\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const element = ref<HTMLSpanElement>(null);\n    const isOpen = ref(false);\n\n    const closingTimeOutId = ref();\n\n    const openPopover = () => {\n        isOpen.value = true;\n        if (closingTimeOutId.value) {\n            clearTimeout(closingTimeOutId.value);\n        }\n    };\n\n    const closePopover = () => {\n        // We want to delay closing for a couple of seconds so\n        // it doesn't flicker if a user hovers over the icon and then inside the popover.\n        const timeOutId = setTimeout(() => {\n            isOpen.value = false;\n        }, CLOSING_POPOVER_DELAY_MS);\n        closingTimeOutId.value = timeOutId;\n    };\n\n    const dashedUnderlineOnFocus = () => {\n        openPopover();\n    };\n\n    /**\n     * Only close popover on blur if the newly focus element is not a child of this element\n     * @param e - the event that contains the newly focused element\n     */\n    const dashedUnderlineOnFocusOut = (e: FocusEvent) => {\n        if (!element.value || !(e?.relatedTarget instanceof Element) || !element.value.contains(e.relatedTarget)) {\n            closePopover();\n        }\n    };\n\n    const hasPopover = computed(() => props.popoverText || hasSlot('popover-content'));\n\n    const shouldShowTooltipPopoverError = computed(() => !props.tooltipText && !hasPopover.value);\n\n    watch(\n        shouldShowTooltipPopoverError,\n        value => {\n            if (value) {\n                throw new Error(\n                    'BentoDashedUnderline requires either a tooltip or a popover to be configured. Check the docs for more info.'\n                );\n            }\n        },\n        { immediate: true }\n    );\n\n    /**\n     * When the popover is teleported, it is no longer a DOM descendant of the trigger element.\n     * We add these event listeners to the popover's container to keep the popover open when\n     * the user moves their mouse or focuses out from the trigger to the popover BUT then mouses over\n     * or focuses on the popover content.\n     */\n    const computedPopoverContainerEvents = computed(() =>\n        props.teleport?.disabled === false\n            ? {\n                  mouseenter: openPopover,\n                  mouseleave: closePopover,\n                  focus: dashedUnderlineOnFocus,\n                  focusout: dashedUnderlineOnFocusOut,\n              }\n            : {}\n    );\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Provides a dashed underline to text, indicating that more information is available on\n     * hover or focus. The additional information is displayed in a tooltip or a popover.\n     *\n     * @example\n     * import { BentoDashedUnderline } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDashedUnderline },\n     *     template: `\n     *       <p>\n     *         This is some <bento-dashed-underline tooltip-text=\"A short explanation\">annotated text</bento-dashed-underline>.\n     *       </p>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./dashed-underline.scss\" />\n"],"names":["__default__","CLOSING_POPOVER_DELAY_MS","slots","useSlots","hasSlot","useHasSlot","element","ref","isOpen","closingTimeOutId","openPopover","closePopover","timeOutId","dashedUnderlineOnFocus","dashedUnderlineOnFocusOut","e","hasPopover","computed","props","shouldShowTooltipPopoverError","watch","value","computedPopoverContainerEvents","_a"],"mappings":";;;;;;;AAsJI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;iBAvGAC,IAAA,KAcAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,EAAA,GAEAE,IAAAF,EAAA,GAEAG,IAAA,MAAA;AACI,MAAAF,EAAA,QAAA,IACAC,EAAA,SACI,aAAAA,EAAA,KAAA;AAAA,IACJ,GAGJE,IAAA,MAAA;AAGI,YAAAC,IAAA,WAAA,MAAA;AACI,QAAAJ,EAAA,QAAA;AAAA,MAAe,GAAAP,CAAA;AAEnB,MAAAQ,EAAA,QAAAG;AAAA,IAAyB,GAG7BC,IAAA,MAAA;AACI,MAAAH,EAAA;AAAA,IAAY,GAOhBI,IAAA,CAAAC,MAAA;AACI,OAAA,CAAAT,EAAA,SAAA,GAAAS,KAAA,gBAAAA,EAAA,0BAAA,YAAA,CAAAT,EAAA,MAAA,SAAAS,EAAA,aAAA,MACIJ,EAAA;AAAA,IACJ,GAGJK,IAAAC,EAAA,MAAAC,EAAA,eAAAd,EAAA,iBAAA,CAAA,GAEAe,IAAAF,EAAA,MAAA,CAAAC,EAAA,eAAA,CAAAF,EAAA,KAAA;AAEA,IAAAI;AAAA,MAAAD;AAAA,MACI,CAAAE,MAAA;AAEI,YAAAA;AACI,gBAAA,IAAA;AAAA,YAAU;AAAA,UACN;AAAA,MAER;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;AAStB,UAAAC,IAAAL;AAAA,MAAuC,MAAA;;AAAA,iBAAAM,IAAAL,EAAA,aAAA,gBAAAK,EAAA,cAAA,KAAA;AAAA,UAE7B,YAAAb;AAAA,UACgB,YAAAC;AAAA,UACA,OAAAE;AAAA,UACL,UAAAC;AAAA,QACG,IAAA,CAAA;AAAA;AAAA,IAEb;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"dashed-underline.pjYTS0m1.js","sources":["../../src/components/dashed-underline/dashed-underline.vue"],"sourcesContent":["<template>\n    <span\n        ref=\"element\"\n        v-bento-tooltip-directive:[tooltipPosition]=\"tooltipText\"\n        class=\"b-dashed-underline\"\n        tabindex=\"0\"\n        @mouseenter=\"openPopover\"\n        @mouseleave=\"closePopover\"\n        @focus=\"dashedUnderlineOnFocus\"\n        @focusout=\"dashedUnderlineOnFocusOut\"\n    >\n        <span class=\"b-dashed-underline__content\">\n            <slot></slot>\n        </span>\n        <bento-teleport v-if=\"element && hasPopover\" :disabled=\"teleport?.disabled\" :to=\"teleport?.to\">\n            <span v-on=\"computedPopoverContainerEvents\">\n                <bento-popover\n                    :open=\"isOpen\"\n                    :target-element=\"element\"\n                    :position=\"popoverPosition\"\n                    role=\"tooltip\"\n                    :fit-content=\"popoverSize === 'fit-content' || undefined\"\n                    :large=\"popoverSize === 'large' || undefined\"\n                    :small=\"popoverSize === 'small' || undefined\"\n                    :title=\"popoverTitle\"\n                    disable-focus-trap\n                >\n                    <slot name=\"popover-content\">\n                        <bento-typography>\n                            {{ popoverText }}\n                        </bento-typography>\n                    </slot>\n                </bento-popover>\n            </span>\n        </bento-teleport>\n    </span>\n</template>\n\n<script lang=\"ts\" setup>\n    import { computed, ref, useSlots, watch } from 'vue';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTooltipDirective as vBentoTooltipDirective } from '@/directives/tooltip/index';\n    import { BentoTypography } from '@/components/typography';\n    import { useHasSlot } from '@/composables';\n    import { BentoTeleport } from '@/internal';\n    import { type BentoDashedUnderlineProps } from './dashed-underline.types';\n\n    const CLOSING_POPOVER_DELAY_MS = 200;\n\n    const props = defineProps({\n  popoverText: { default: null },\n  popoverTitle: { default: null },\n  popoverPosition: { default: 'top' },\n  popoverSize: { default: 'fit-content' },\n  teleport: { default: () => ({\n            disabled: true,\n        }) },\n  tooltipText: { default: null },\n  tooltipPosition: { default: 'top' }\n});\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const element = ref<HTMLSpanElement>(null);\n    const isOpen = ref(false);\n\n    const closingTimeOutId = ref();\n\n    const openPopover = () => {\n        isOpen.value = true;\n        if (closingTimeOutId.value) {\n            clearTimeout(closingTimeOutId.value);\n        }\n    };\n\n    const closePopover = () => {\n        // We want to delay closing for a couple of seconds so\n        // it doesn't flicker if a user hovers over the icon and then inside the popover.\n        const timeOutId = setTimeout(() => {\n            isOpen.value = false;\n        }, CLOSING_POPOVER_DELAY_MS);\n        closingTimeOutId.value = timeOutId;\n    };\n\n    const dashedUnderlineOnFocus = () => {\n        openPopover();\n    };\n\n    /**\n     * Only close popover on blur if the newly focus element is not a child of this element\n     * @param e - the event that contains the newly focused element\n     */\n    const dashedUnderlineOnFocusOut = (e: FocusEvent) => {\n        if (!element.value || !(e?.relatedTarget instanceof Element) || !element.value.contains(e.relatedTarget)) {\n            closePopover();\n        }\n    };\n\n    const hasPopover = computed(() => props.popoverText || hasSlot('popover-content'));\n\n    const shouldShowTooltipPopoverError = computed(() => !props.tooltipText && !hasPopover.value);\n\n    watch(\n        shouldShowTooltipPopoverError,\n        value => {\n            if (value) {\n                throw new Error(\n                    'BentoDashedUnderline requires either a tooltip or a popover to be configured. Check the docs for more info.'\n                );\n            }\n        },\n        { immediate: true }\n    );\n\n    /**\n     * When the popover is teleported, it is no longer a DOM descendant of the trigger element.\n     * We add these event listeners to the popover's container to keep the popover open when\n     * the user moves their mouse or focuses out from the trigger to the popover BUT then mouses over\n     * or focuses on the popover content.\n     */\n    const computedPopoverContainerEvents = computed(() =>\n        props.teleport?.disabled === false\n            ? {\n                  mouseenter: openPopover,\n                  mouseleave: closePopover,\n                  focus: dashedUnderlineOnFocus,\n                  focusout: dashedUnderlineOnFocusOut,\n              }\n            : {}\n    );\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Provides a dashed underline to text, indicating that more information is available on\n     * hover or focus. The additional information is displayed in a tooltip or a popover.\n     *\n     * @example\n     * import { BentoDashedUnderline } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDashedUnderline },\n     *     template: `\n     *       <p>\n     *         This is some <bento-dashed-underline tooltip-text=\"A short explanation\">annotated text</bento-dashed-underline>.\n     *       </p>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./dashed-underline.scss\" />\n"],"names":["__default__","CLOSING_POPOVER_DELAY_MS","slots","useSlots","hasSlot","useHasSlot","element","ref","isOpen","closingTimeOutId","openPopover","closePopover","timeOutId","dashedUnderlineOnFocus","dashedUnderlineOnFocusOut","e","hasPopover","computed","props","shouldShowTooltipPopoverError","watch","value","computedPopoverContainerEvents","_a"],"mappings":";;;;;;;AAsJI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;iBAvGAC,IAAA,KAcAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAI,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,EAAA,GAEAE,IAAAF,EAAA,GAEAG,IAAA,MAAA;AACI,MAAAF,EAAA,QAAA,IACAC,EAAA,SACI,aAAAA,EAAA,KAAA;AAAA,IACJ,GAGJE,IAAA,MAAA;AAGI,YAAAC,IAAA,WAAA,MAAA;AACI,QAAAJ,EAAA,QAAA;AAAA,MAAe,GAAAP,CAAA;AAEnB,MAAAQ,EAAA,QAAAG;AAAA,IAAyB,GAG7BC,IAAA,MAAA;AACI,MAAAH,EAAA;AAAA,IAAY,GAOhBI,IAAA,CAAAC,MAAA;AACI,OAAA,CAAAT,EAAA,SAAA,GAAAS,KAAA,gBAAAA,EAAA,0BAAA,YAAA,CAAAT,EAAA,MAAA,SAAAS,EAAA,aAAA,MACIJ,EAAA;AAAA,IACJ,GAGJK,IAAAC,EAAA,MAAAC,EAAA,eAAAd,EAAA,iBAAA,CAAA,GAEAe,IAAAF,EAAA,MAAA,CAAAC,EAAA,eAAA,CAAAF,EAAA,KAAA;AAEA,IAAAI;AAAA,MAAAD;AAAA,MACI,CAAAE,MAAA;AAEI,YAAAA;AACI,gBAAA,IAAA;AAAA,YAAU;AAAA,UACN;AAAA,MAER;AAAA,MACJ,EAAA,WAAA,GAAA;AAAA,IACkB;AAStB,UAAAC,IAAAL;AAAA,MAAuC,MAAA;;AAAA,iBAAAM,IAAAL,EAAA,aAAA,gBAAAK,EAAA,cAAA,KAAA;AAAA,UAE7B,YAAAb;AAAA,UACgB,YAAAC;AAAA,UACA,OAAAE;AAAA,UACL,UAAAC;AAAA,QACG,IAAA,CAAA;AAAA;AAAA,IAEb;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{data-grid-template.T-6_zLby.js → data-grid-template.D8RhngPj.js}

@@ -1,7 +1,7 @@
 import { defineComponent as R, useSlots as S, ref as d, computed as i, provide as I, toRef as _ } from "vue";
-import { B as h } from "./header.BG6XUNEs.js";
-import { B } from "./inspector.DgI3voTk.js";
-import { a as x, B as A } from "./tab.BqSNoefU.js";
+import { B as h } from "./header.DkC-KKWa.js";
+import { B } from "./inspector.Bnm0hl_D.js";
+import { a as x, B as A } from "./tab.CaXF0dho.js";
 import { u as E } from "./use-has-slot.C9lQZ6nz.js";
 import { D } from "./data-grid-template.keys.VezYtHtM.js";
 import { n as G } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
@@ -108,4 +108,4 @@ const q = $.exports;
 export {
   q as d
 };
-//# sourceMappingURL=data-grid-template.T-6_zLby.js.map
+//# sourceMappingURL=data-grid-template.D8RhngPj.js.map

package/dist/chunks/{data-grid-template.T-6_zLby.js.map → data-grid-template.D8RhngPj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"data-grid-template.T-6_zLby.js","sources":["../../src/templates/data-grid-template/data-grid-template.vue"],"sourcesContent":["<template>\n    <main class=\"b-data-grid-template\">\n        <bento-inspector v-bind=\"computedInspectorProps\" ref=\"inspectorRef\" v-on=\"inspectorEvents\">\n            <template #page>\n                <div class=\"b-data-grid-template__header\">\n                    <slot name=\"header\">\n                        <bento-header v-bind=\"header\">\n                            <template v-if=\"hasSlot('infoIconTooltipContent')\" #infoIconTooltipContent>\n                                <slot name=\"infoIconTooltipContent\" />\n                            </template>\n                        </bento-header>\n                    </slot>\n                </div>\n\n                <div\n                    v-if=\"hasSlot('additionalContent')\"\n                    ref=\"additionalContentRef\"\n                    class=\"b-data-grid-template__additional-content\"\n                    :class=\"additionalContentConditionalClasses\"\n                >\n                    <slot name=\"additionalContent\" />\n                </div>\n\n                <bento-tabs\n                    v-if=\"tabsSlots.length > 1\"\n                    ref=\"tabsRef\"\n                    :active-tab-index=\"tabs.activeTabIndex\"\n                    :sticky=\"stickyTabs\"\n                    :sticky-options=\"stickyAdditionalContent ? { top: computedStickyAdditionalContentHeight } : null\"\n                    @update:active-tab-index=\"emitTabs\"\n                >\n                    <bento-tab v-for=\"(_item, index) in tabsSlots\" :key=\"`tab-${index}`\" :title=\"getTabTitle(index)\">\n                        <slot :name=\"`tab-${index + 1}`\" />\n                    </bento-tab>\n                </bento-tabs>\n\n                <slot v-else />\n            </template>\n\n            <template #content>\n                <slot name=\"inspector-content\" />\n            </template>\n        </bento-inspector>\n    </main>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoHeader } from '@/components/header';\n    import { BentoInspector } from '@/components/inspector';\n    import { BentoTab, BentoTabs } from '@/components/tabs';\n    import { useHasSlot } from '@/composables';\n    import { computed, type PropType, provide, type Ref, ref, toRef, type UnwrapRef, useSlots } from 'vue';\n    import { DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY } from './data-grid-template.keys';\n    import type {\n        BentoDataGridTemplateDataGrid,\n        BentoDataGridTemplateHeader,\n        BentoDataGridTemplateInspector,\n        BentoDataGridTemplateTabs,\n    } from './data-grid-template.types';\n\n    const props = defineProps({\n        /**\n         * The header that goes to the top of the template\n         */\n        header: {\n            type: Object as PropType<BentoDataGridTemplateHeader>,\n            default: undefined,\n        },\n\n        /**\n         * All the tab properties that can be set on the inner tab components.\n         *  - tabs.activeTabIndex: the currenly active tab index.\n         *  - tabs.tabs: an array of BentoTab props, the first item in the array will affect the `tab-1` slot and so on.\n         */\n        tabs: {\n            type: Object as PropType<BentoDataGridTemplateTabs>,\n            default: undefined,\n        },\n\n        /**\n         * Renders the additional content slot with a sticky positioning\n         */\n        stickyAdditionalContent: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Renders the tabs with a sticky positioning\n         */\n        stickyTabs: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * All the inspector properties that can be set on the inner inspector component.\n         */\n        inspector: {\n            type: Object as PropType<BentoDataGridTemplateInspector>,\n            default: undefined,\n        },\n    });\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const emit = defineEmits([\"update:tabs\", \"update:is-open:inspector\", \"update:active-page:inspector\", \"expand:inspector\"]);\n\n    const tabsRef = ref(null);\n    const additionalContentRef = ref(null);\n    const inspectorRef = ref(null);\n\n    const additionalContentConditionalClasses = computed(() => ({\n        'b-data-grid-template__additional-content--sticky': props.stickyAdditionalContent,\n    }));\n\n    const computedInspectorProps = computed(() => ({\n        title: '',\n        ...props.inspector,\n    }));\n\n    const computedStickyAdditionalContentHeight = computed(() => additionalContentRef?.value?.offsetHeight);\n\n    const computedTabsRef = computed(() => tabsRef.value?.$refs?.tablistwrapper);\n\n    const tabsSlots = computed(() => Object.keys(slots).filter(el => el?.includes('tab-')));\n\n    const inspectorEvents = computed(() => ({\n        'update:is-open': (value: boolean) => emit('update:is-open:inspector', value),\n        'update:active-page': (value: string) => emit('update:active-page:inspector', value),\n        expand: (value: boolean) => emit('expand:inspector', value),\n    }));\n\n    const emitTabs = (newActiveTabIndex: number) => {\n        emit('update:tabs', { ...props.tabs, activeTabIndex: newActiveTabIndex });\n    };\n\n    const getTabTitle = (index: number) => props?.tabs.tabs?.[index]?.title ?? `Tab ${index + 1}`;\n\n    const registerDatagridInDataGridTemplate: BentoDataGridTemplateDataGrid = () => {\n        const isDataGridTemplate = true;\n        const stickyTabs: Ref<boolean> = toRef(props, 'stickyTabs');\n        const stickyAdditionalContent: Ref<boolean> = toRef(props, 'stickyAdditionalContent');\n        const tabsRef: Ref<UnwrapRef<HTMLDivElement>> | null = computedTabsRef;\n        const additionalContentSlotRef: Ref<UnwrapRef<HTMLDivElement>> | null = additionalContentRef;\n\n        // return values to the Tab component\n        return {\n            isDataGridTemplate,\n            stickyTabs,\n            tabsRef,\n            stickyAdditionalContent,\n            additionalContentSlotRef,\n        };\n    };\n\n    provide(DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY, registerDatagridInDataGridTemplate);\n</script>\n\n<script lang=\"ts\">\n    /**\n     * The data grid template is a restrictive, full-page data grid used to display information from a data set.\n     * You can use this data grid template when your user needs a clear overview of data or a way of organizing and analyzing the data in their own way.\n     * This data grid template shouldn’t be confused with the data grid.\n     *\n     * @example\n     * import { BentoDataGridTemplate } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDataGridTemplate },\n     *     template: `\n     *          // If you want to display multiple data grids in the same page (they will be rendered in different tabs)\n     *          <bento-data-grid-template>\n     *              <template #tab-1><bento-data-grid v-bind=\"your-data-grid-args\" title=\"Title for tab 1\"/></template>\n     *              <template #tab-2><bento-data-grid v-bind=\"your-data-grid-args\" title=\"Title for tab 2\"/></template>\n     *          </bento-data-grid-template>\n     *          // Alternatively, if you only want to pass one data grid to your template:\n     *          <bento-data-grid-template>\n     *              <template #default><bento-data-grid v-bind=\"your-data-grid-args\"/></template>\n     *          </bento-data-grid-template>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-template.scss\" />\n"],"names":["__default__","slots","useSlots","hasSlot","useHasSlot","tabsRef","ref","additionalContentRef","inspectorRef","additionalContentConditionalClasses","computed","props","computedInspectorProps","computedStickyAdditionalContentHeight","_a","computedTabsRef","_b","tabsSlots","el","inspectorEvents","value","emit","emitTabs","newActiveTabIndex","getTabTitle","index","registerDatagridInDataGridTemplate","stickyTabs","toRef","stickyAdditionalContent","provide","DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY"],"mappings":";;;;;;;;AAuLI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAhFAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAIAI,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,IAAA,GACAE,IAAAF,EAAA,IAAA,GAEAG,IAAAC,EAAA,OAAA;AAAA,MAA4D,oDAAAC,EAAA;AAAA,IACE,EAAA,GAG9DC,IAAAF,EAAA,OAAA;AAAA,MAA+C,OAAA;AAAA,MACpC,GAAAC,EAAA;AAAA,IACE,EAAA,GAGbE,IAAAH,EAAA,MAAA;;AAAA,cAAAI,IAAAP,KAAA,gBAAAA,EAAA,UAAA,gBAAAO,EAAA;AAAA,KAAA,GAEAC,IAAAL,EAAA,MAAA;;AAAA,cAAAM,KAAAF,IAAAT,EAAA,UAAA,gBAAAS,EAAA,UAAA,gBAAAE,EAAA;AAAA,KAAA,GAEAC,IAAAP,EAAA,MAAA,OAAA,KAAAT,CAAA,EAAA,OAAA,CAAAiB,MAAAA,KAAA,gBAAAA,EAAA,SAAA,OAAA,CAAA,GAEAC,IAAAT,EAAA,OAAA;AAAA,MAAwC,kBAAA,CAAAU,MAAAC,EAAA,4BAAAD,CAAA;AAAA,MACwC,sBAAA,CAAAA,MAAAC,EAAA,gCAAAD,CAAA;AAAA,MACO,QAAA,CAAAA,MAAAC,EAAA,oBAAAD,CAAA;AAAA,IACzB,EAAA,GAG9DE,IAAA,CAAAC,MAAA;AACI,MAAAF,EAAA,eAAA,EAAA,GAAAV,EAAA,MAAA,gBAAAY,EAAA,CAAA;AAAA,IAAwE,GAG5EC,IAAA,CAAAC,MAAA;;AAAA,eAAAT,KAAAF,IAAAH,KAAA,gBAAAA,EAAA,KAAA,SAAA,gBAAAG,EAAAW,OAAA,gBAAAT,EAAA,UAAA,OAAAS,IAAA,CAAA;AAAA,OAEAC,IAAA,MAAA;AAEI,YAAAC,IAAAC,EAAAjB,GAAA,YAAA,GACAkB,IAAAD,EAAAjB,GAAA,yBAAA;AAKA,aAAA;AAAA,QAAO;AAAA,QACH,YAAAgB;AAAA,QACA,SANJZ;AAAA,QAOI,yBAAAc;AAAA,QACA,0BAPJtB;AAAA,MAQI;AAAA,IACJ;AAGJ,WAAAuB,EAAAC,GAAAL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"data-grid-template.D8RhngPj.js","sources":["../../src/templates/data-grid-template/data-grid-template.vue"],"sourcesContent":["<template>\n    <main class=\"b-data-grid-template\">\n        <bento-inspector v-bind=\"computedInspectorProps\" ref=\"inspectorRef\" v-on=\"inspectorEvents\">\n            <template #page>\n                <div class=\"b-data-grid-template__header\">\n                    <slot name=\"header\">\n                        <bento-header v-bind=\"header\">\n                            <template v-if=\"hasSlot('infoIconTooltipContent')\" #infoIconTooltipContent>\n                                <slot name=\"infoIconTooltipContent\" />\n                            </template>\n                        </bento-header>\n                    </slot>\n                </div>\n\n                <div\n                    v-if=\"hasSlot('additionalContent')\"\n                    ref=\"additionalContentRef\"\n                    class=\"b-data-grid-template__additional-content\"\n                    :class=\"additionalContentConditionalClasses\"\n                >\n                    <slot name=\"additionalContent\" />\n                </div>\n\n                <bento-tabs\n                    v-if=\"tabsSlots.length > 1\"\n                    ref=\"tabsRef\"\n                    :active-tab-index=\"tabs.activeTabIndex\"\n                    :sticky=\"stickyTabs\"\n                    :sticky-options=\"stickyAdditionalContent ? { top: computedStickyAdditionalContentHeight } : null\"\n                    @update:active-tab-index=\"emitTabs\"\n                >\n                    <bento-tab v-for=\"(_item, index) in tabsSlots\" :key=\"`tab-${index}`\" :title=\"getTabTitle(index)\">\n                        <slot :name=\"`tab-${index + 1}`\" />\n                    </bento-tab>\n                </bento-tabs>\n\n                <slot v-else />\n            </template>\n\n            <template #content>\n                <slot name=\"inspector-content\" />\n            </template>\n        </bento-inspector>\n    </main>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoHeader } from '@/components/header';\n    import { BentoInspector } from '@/components/inspector';\n    import { BentoTab, BentoTabs } from '@/components/tabs';\n    import { useHasSlot } from '@/composables';\n    import { computed, type PropType, provide, type Ref, ref, toRef, type UnwrapRef, useSlots } from 'vue';\n    import { DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY } from './data-grid-template.keys';\n    import type {\n        BentoDataGridTemplateDataGrid,\n        BentoDataGridTemplateHeader,\n        BentoDataGridTemplateInspector,\n        BentoDataGridTemplateTabs,\n    } from './data-grid-template.types';\n\n    const props = defineProps({\n        /**\n         * The header that goes to the top of the template\n         */\n        header: {\n            type: Object as PropType<BentoDataGridTemplateHeader>,\n            default: undefined,\n        },\n\n        /**\n         * All the tab properties that can be set on the inner tab components.\n         *  - tabs.activeTabIndex: the currenly active tab index.\n         *  - tabs.tabs: an array of BentoTab props, the first item in the array will affect the `tab-1` slot and so on.\n         */\n        tabs: {\n            type: Object as PropType<BentoDataGridTemplateTabs>,\n            default: undefined,\n        },\n\n        /**\n         * Renders the additional content slot with a sticky positioning\n         */\n        stickyAdditionalContent: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * Renders the tabs with a sticky positioning\n         */\n        stickyTabs: {\n            type: Boolean,\n            default: false,\n        },\n\n        /**\n         * All the inspector properties that can be set on the inner inspector component.\n         */\n        inspector: {\n            type: Object as PropType<BentoDataGridTemplateInspector>,\n            default: undefined,\n        },\n    });\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const emit = defineEmits([\"update:tabs\", \"update:is-open:inspector\", \"update:active-page:inspector\", \"expand:inspector\"]);\n\n    const tabsRef = ref(null);\n    const additionalContentRef = ref(null);\n    const inspectorRef = ref(null);\n\n    const additionalContentConditionalClasses = computed(() => ({\n        'b-data-grid-template__additional-content--sticky': props.stickyAdditionalContent,\n    }));\n\n    const computedInspectorProps = computed(() => ({\n        title: '',\n        ...props.inspector,\n    }));\n\n    const computedStickyAdditionalContentHeight = computed(() => additionalContentRef?.value?.offsetHeight);\n\n    const computedTabsRef = computed(() => tabsRef.value?.$refs?.tablistwrapper);\n\n    const tabsSlots = computed(() => Object.keys(slots).filter(el => el?.includes('tab-')));\n\n    const inspectorEvents = computed(() => ({\n        'update:is-open': (value: boolean) => emit('update:is-open:inspector', value),\n        'update:active-page': (value: string) => emit('update:active-page:inspector', value),\n        expand: (value: boolean) => emit('expand:inspector', value),\n    }));\n\n    const emitTabs = (newActiveTabIndex: number) => {\n        emit('update:tabs', { ...props.tabs, activeTabIndex: newActiveTabIndex });\n    };\n\n    const getTabTitle = (index: number) => props?.tabs.tabs?.[index]?.title ?? `Tab ${index + 1}`;\n\n    const registerDatagridInDataGridTemplate: BentoDataGridTemplateDataGrid = () => {\n        const isDataGridTemplate = true;\n        const stickyTabs: Ref<boolean> = toRef(props, 'stickyTabs');\n        const stickyAdditionalContent: Ref<boolean> = toRef(props, 'stickyAdditionalContent');\n        const tabsRef: Ref<UnwrapRef<HTMLDivElement>> | null = computedTabsRef;\n        const additionalContentSlotRef: Ref<UnwrapRef<HTMLDivElement>> | null = additionalContentRef;\n\n        // return values to the Tab component\n        return {\n            isDataGridTemplate,\n            stickyTabs,\n            tabsRef,\n            stickyAdditionalContent,\n            additionalContentSlotRef,\n        };\n    };\n\n    provide(DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY, registerDatagridInDataGridTemplate);\n</script>\n\n<script lang=\"ts\">\n    /**\n     * The data grid template is a restrictive, full-page data grid used to display information from a data set.\n     * You can use this data grid template when your user needs a clear overview of data or a way of organizing and analyzing the data in their own way.\n     * This data grid template shouldn’t be confused with the data grid.\n     *\n     * @example\n     * import { BentoDataGridTemplate } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDataGridTemplate },\n     *     template: `\n     *          // If you want to display multiple data grids in the same page (they will be rendered in different tabs)\n     *          <bento-data-grid-template>\n     *              <template #tab-1><bento-data-grid v-bind=\"your-data-grid-args\" title=\"Title for tab 1\"/></template>\n     *              <template #tab-2><bento-data-grid v-bind=\"your-data-grid-args\" title=\"Title for tab 2\"/></template>\n     *          </bento-data-grid-template>\n     *          // Alternatively, if you only want to pass one data grid to your template:\n     *          <bento-data-grid-template>\n     *              <template #default><bento-data-grid v-bind=\"your-data-grid-args\"/></template>\n     *          </bento-data-grid-template>\n     *     `\n     * }\n     */\n    export default {};\n</script>\n\n<style lang=\"scss\" scoped src=\"./data-grid-template.scss\" />\n"],"names":["__default__","slots","useSlots","hasSlot","useHasSlot","tabsRef","ref","additionalContentRef","inspectorRef","additionalContentConditionalClasses","computed","props","computedInspectorProps","computedStickyAdditionalContentHeight","_a","computedTabsRef","_b","tabsSlots","el","inspectorEvents","value","emit","emitTabs","newActiveTabIndex","getTabTitle","index","registerDatagridInDataGridTemplate","stickyTabs","toRef","stickyAdditionalContent","provide","DATA_GRID_REGISTER_TEMPLATE_INJECTION_KEY"],"mappings":";;;;;;;;AAuLI,MAAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAhFAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAIAI,IAAAC,EAAA,IAAA,GACAC,IAAAD,EAAA,IAAA,GACAE,IAAAF,EAAA,IAAA,GAEAG,IAAAC,EAAA,OAAA;AAAA,MAA4D,oDAAAC,EAAA;AAAA,IACE,EAAA,GAG9DC,IAAAF,EAAA,OAAA;AAAA,MAA+C,OAAA;AAAA,MACpC,GAAAC,EAAA;AAAA,IACE,EAAA,GAGbE,IAAAH,EAAA,MAAA;;AAAA,cAAAI,IAAAP,KAAA,gBAAAA,EAAA,UAAA,gBAAAO,EAAA;AAAA,KAAA,GAEAC,IAAAL,EAAA,MAAA;;AAAA,cAAAM,KAAAF,IAAAT,EAAA,UAAA,gBAAAS,EAAA,UAAA,gBAAAE,EAAA;AAAA,KAAA,GAEAC,IAAAP,EAAA,MAAA,OAAA,KAAAT,CAAA,EAAA,OAAA,CAAAiB,MAAAA,KAAA,gBAAAA,EAAA,SAAA,OAAA,CAAA,GAEAC,IAAAT,EAAA,OAAA;AAAA,MAAwC,kBAAA,CAAAU,MAAAC,EAAA,4BAAAD,CAAA;AAAA,MACwC,sBAAA,CAAAA,MAAAC,EAAA,gCAAAD,CAAA;AAAA,MACO,QAAA,CAAAA,MAAAC,EAAA,oBAAAD,CAAA;AAAA,IACzB,EAAA,GAG9DE,IAAA,CAAAC,MAAA;AACI,MAAAF,EAAA,eAAA,EAAA,GAAAV,EAAA,MAAA,gBAAAY,EAAA,CAAA;AAAA,IAAwE,GAG5EC,IAAA,CAAAC,MAAA;;AAAA,eAAAT,KAAAF,IAAAH,KAAA,gBAAAA,EAAA,KAAA,SAAA,gBAAAG,EAAAW,OAAA,gBAAAT,EAAA,UAAA,OAAAS,IAAA,CAAA;AAAA,OAEAC,IAAA,MAAA;AAEI,YAAAC,IAAAC,EAAAjB,GAAA,YAAA,GACAkB,IAAAD,EAAAjB,GAAA,yBAAA;AAKA,aAAA;AAAA,QAAO;AAAA,QACH,YAAAgB;AAAA,QACA,SANJZ;AAAA,QAOI,yBAAAc;AAAA,QACA,0BAPJtB;AAAA,MAQI;AAAA,IACJ;AAGJ,WAAAuB,EAAAC,GAAAL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/{data-grid.u3f__x8_.js → data-grid.DJG8Ty0A.js}

@@ -7,41 +7,41 @@ import { C as Ot } from "./cross.CC_B-vG-.js";
 import { N as at } from "./minus-small.DJacLGTw.js";
 import { b as Gn } from "./popper-container.C_n9Ds1W.js";
 import { E as ce, b as Nt, B as Hn, T as Vn } from "./tooltip.CbsNGnhw.js";
-import { B as Zn } from "./dashed-underline.DauOBhSD.js";
+import { B as Zn } from "./dashed-underline.pjYTS0m1.js";
 import { B as Se, p as It } from "./typography.C8lPlsbD.js";
 import { u as he } from "./index.B6WW_F-J.js";
 import { B as jn } from "./tag.CocLKztJ.js";
-import { B as qn } from "./action-bar.rHHYcsRV.js";
-import { B as Yn } from "./pagination.BKIqR6O6.js";
+import { B as qn } from "./action-bar.CYGUYI0V.js";
+import { B as Yn } from "./pagination.ZISqB4M_.js";
 import { B as Ge } from "./loading-indicator.PxbRzshH.js";
 import { u as He } from "./use-has-slot.C9lQZ6nz.js";
 import { g as De } from "./generate-uid.NJ8tVoha.js";
-import { a as Jn } from "./filter-bar.B_RHM9kR.js";
-import { B as Kn } from "./empty-state.IiG1LXa2.js";
+import { a as Jn } from "./filter-bar.zD_ctViU.js";
+import { B as Kn } from "./empty-state.D_Ac-XXH.js";
 import { E as Xn } from "./tabs.keys.B4qGhjp2.js";
 import { D as Qn } from "./data-grid-template.keys.VezYtHtM.js";
 import { b as es } from "./index.CwzYJHw2.js";
 import { o as Ve } from "./resize.Bqks3WUm.js";
 import "./index.Cl4_42j5.js";
-import { B as Dt } from "./checkbox.DfB3ZeA-.js";
-import { B as xt } from "./button.Ctj3rkxw.js";
-import { c as Ze, f as Ft, h as ts, b as ns, a as ss, O as it, D as os } from "./button-actions.DyPS54Yi.js";
-import { E as rt } from "./link.DKimL08z.js";
-import { C as ct } from "./copy.DSNuoLZf.js";
+import { b as Dt } from "./focus-trap.DRqjHzt6.js";
+import { B as xt } from "./checkbox.CIv8WgGp.js";
+import { B as Ft } from "./button.DxhJNOtr.js";
+import { c as Ze, f as Bt, h as ts, b as ns, a as ss, O as it, D as os } from "./button-actions.BLk114As.js";
+import { E as rt } from "./link.MhoM3zQj.js";
+import { C as ct } from "./copy.BVGQcf22.js";
 import { C as ls } from "./chevron-down.eYtgv5ly.js";
 import { C as as } from "./chevron-up.d8cwIlA_.js";
-import { b as Bt } from "./focus-trap.DRqjHzt6.js";
 import { u as is } from "./use-expandable-content-height.GkjjbmPy.js";
 import { B as rs } from "./info-icon.BF8KxU-k.js";
-import { D as cs } from "./use-cached-selected-values.DiIjmiF_.js";
+import { D as cs } from "./use-cached-selected-values.DqX2qsMC.js";
 import { B as dt } from "./popover.types.hA13DZPg.js";
 import { A as ds } from "./arrow-left.CRREfabP.js";
 import { A as us } from "./arrow-right.Dn3AYpUP.js";
 import { H as fs, S as gs } from "./show.B_mKPF6I.js";
 import { l as ut } from "./events.BQOQSSb7.js";
 import { B as Pt } from "./toggle.B1z1YPe_.js";
-import { B as _s } from "./search-bar.k0tIoWcb.js";
-import { u as vs } from "./dropdown.Do5c4SST.js";
+import { B as _s } from "./search-bar.DPjYDhja.js";
+import { u as vs } from "./dropdown.Ct7uhPr6.js";
 import { S as ms } from "./search.D53Ia3rC.js";
 import { B as Cs } from "./directive.rXUeDb8p.js";
 import "../assets/data-grid.css";
@@ -651,10 +651,10 @@ const ye = "b-row-actions-column", Ds = (s, t, n, e, o, l) => {
     hoveredOverColumnState: l
   };
 }, je = (s) => {
-  const n = Bt(s).filter((e) => e.node !== s);
+  const n = Dt(s).filter((e) => e.node !== s);
   return (n == null ? void 0 : n.length) > 0 ? (n[0].node.focus(), !0) : !1;
 }, we = (s) => {
-  const t = Bt(s), n = t == null ? void 0 : t.filter((e) => e.node !== s);
+  const t = Dt(s), n = t == null ? void 0 : t.filter((e) => e.node !== s);
   if ((n == null ? void 0 : n.length) > 0)
     return n.forEach((e) => e.node.setAttribute("tabindex", "-1")), n;
 }, Ut = (s) => {
@@ -795,69 +795,9 @@ var ao = function() {
   null
 );
 const co = ro.exports, uo = {
-  "en-US": {
-    columnActions: "{name} column actions",
-    deselectAll: "Deselect all",
-    deselectAllCurrentResults: "Deselect all in current results",
-    deselectPage: "Deselect this page",
-    freezeColumn: "Freeze column",
-    hideColumn: "Hide column",
-    moveColumnLeft: "Move column left",
-    moveColumnRight: "Move column right",
-    rowActionsColumn: "Row actions column",
-    selectAll: "Select all",
-    selectAllCurrentResults: "Select all in current results",
-    selectAllMenu: "Select all menu",
-    selectPage: "Select this page",
-    selectionMenu: "Selection menu",
-    showColumn: "Show column",
-    sortColumn: "Sort {name} column",
-    sortColumnInAscendingOrder: "Sort {name} column in ascending order",
-    sortColumnInDescendingOrder: "Sort {name} column in descending order",
-    unfreezeColumn: "Unfreeze column"
-  },
-  "ja-JP": {
-    columnActions: "{name}列のアクション",
-    deselectAll: "すべての選択を解除",
-    deselectAllCurrentResults: "現在の結果の選択をすべて解除",
-    deselectPage: "このページの選択を解除",
-    freezeColumn: "列を固定",
-    hideColumn: "列を非表示",
-    moveColumnLeft: "列を左へ移動",
-    moveColumnRight: "列を右へ移動",
-    rowActionsColumn: "行アクション列",
-    selectAll: "すべて選択",
-    selectAllCurrentResults: "現在の結果をすべて選択",
-    selectAllMenu: "すべてのメニューを選択",
-    selectPage: "このページを選択",
-    selectionMenu: "選択メニュー",
-    showColumn: "列を表示",
-    sortColumn: "{name}列を並べ替え",
-    sortColumnInAscendingOrder: "{name}列を昇順に並べ替え",
-    sortColumnInDescendingOrder: "{name}列を降順に並べ替え",
-    unfreezeColumn: "列の固定を解除"
-  },
-  "pt-BR": {
-    columnActions: "Ações da coluna {name}",
-    deselectAll: "Desmarcar tudo",
-    deselectAllCurrentResults: "Desmarcar tudo nos resultados atuais",
-    deselectPage: "Desmarcar esta página",
-    freezeColumn: "Congelar coluna",
-    hideColumn: "Ocultar coluna",
-    moveColumnLeft: "Mover coluna para a esquerda",
-    moveColumnRight: "Mover coluna para a direita",
-    rowActionsColumn: "Coluna de ações da linha",
-    selectAll: "Selecionar tudo",
-    selectAllCurrentResults: "Selecionar tudo nos resultados atuais",
-    selectAllMenu: "Selecionar todo o menu",
-    selectPage: "Selecione esta página",
-    selectionMenu: "Menu de seleção",
-    showColumn: "Mostrar coluna",
-    sortColumn: "Classificar a coluna {name}",
-    sortColumnInAscendingOrder: "Classificar a coluna {name} em ordem crescente",
-    sortColumnInDescendingOrder: "Classificar a coluna {name} em ordem decrescente",
-    unfreezeColumn: "Descongelar coluna"
-  }
+  "en-US": { columnActions: "{name} column actions", deselectAll: "Deselect all", deselectAllCurrentResults: "Deselect all in current results", deselectPage: "Deselect this page", freezeColumn: "Freeze column", hideColumn: "Hide column", moveColumnLeft: "Move column left", moveColumnRight: "Move column right", rowActionsColumn: "Row actions column", selectAll: "Select all", selectAllCurrentResults: "Select all in current results", selectAllMenu: "Select all menu", selectPage: "Select this page", selectionMenu: "Selection menu", showColumn: "Show column", sortColumn: "Sort {name} column", sortColumnInAscendingOrder: "Sort {name} column in ascending order", sortColumnInDescendingOrder: "Sort {name} column in descending order", unfreezeColumn: "Unfreeze column" },
+  "ja-JP": { columnActions: "{name}列のアクション", deselectAll: "すべての選択を解除", deselectAllCurrentResults: "現在の結果の選択をすべて解除", deselectPage: "このページの選択を解除", freezeColumn: "列を固定", hideColumn: "列を非表示", moveColumnLeft: "列を左へ移動", moveColumnRight: "列を右へ移動", rowActionsColumn: "行アクション列", selectAll: "すべて選択", selectAllCurrentResults: "現在の結果をすべて選択", selectAllMenu: "すべてのメニューを選択", selectPage: "このページを選択", selectionMenu: "選択メニュー", showColumn: "列を表示", sortColumn: "{name}列を並べ替え", sortColumnInAscendingOrder: "{name}列を昇順に並べ替え", sortColumnInDescendingOrder: "{name}列を降順に並べ替え", unfreezeColumn: "列の固定を解除" },
+  "pt-BR": { columnActions: "Ações da coluna {name}", deselectAll: "Desmarcar tudo", deselectAllCurrentResults: "Desmarcar tudo nos resultados atuais", deselectPage: "Desmarcar esta página", freezeColumn: "Congelar coluna", hideColumn: "Ocultar coluna", moveColumnLeft: "Mover coluna para a esquerda", moveColumnRight: "Mover coluna para a direita", rowActionsColumn: "Coluna de ações da linha", selectAll: "Selecionar tudo", selectAllCurrentResults: "Selecionar tudo nos resultados atuais", selectAllMenu: "Selecionar todo o menu", selectPage: "Selecione esta página", selectionMenu: "Menu de seleção", showColumn: "Mostrar coluna", sortColumn: "Classificar a coluna {name}", sortColumnInAscendingOrder: "Classificar a coluna {name} em ordem crescente", sortColumnInDescendingOrder: "Classificar a coluna {name} em ordem decrescente", unfreezeColumn: "Descongelar coluna" }
 }, zt = /* @__PURE__ */ Symbol("data-grid slashed zero key"), Te = /* @__PURE__ */ Symbol("data-grid small container key"), xe = /* @__PURE__ */ Symbol("data-grid touch device key"), fo = {
   i18n: { messages: uo },
   name: "data-grid-columns"
@@ -1185,7 +1125,7 @@ const co = ro.exports, uo = {
     });
     return t({
       columnHeaderRefs: d
-    }), { __sfc: !0, props: e, emit: n, CLOSING_CONTEXTUAL_MENU_DELAY_MS: o, t: l, columns: a, sortBy: i, allColumnsRef: _, columnHeaderRefs: d, contextMenuRef: C, hoveredColumnField: m, closingTimeOutId: S, onAllRowSelect: b, isActionsColumn: f, isAllSelectionState: A, selectAllMenu: L, startResize: F, isResizing: E, columnHoverEventToEmitAfterResizing: u, isSorting: y, getSortingDirection: O, sortByColumnField: x, getSortingColumnDirection: r, draggingEventsForColumn: g, contextualMenuData: R, showContextualMenu: T, hideContextualMenu: B, dataGridColumnEvents: P, hasColumnActions: k, registerColumnsRefs: K, isSmallContainer: Y, isTouchDevice: ee, conditionalColumnsClasses: G, conditionalSelectColumnClasses: M, computeMenuPosition: w, conditionalColumnClasses: W, conditionalColumnHeaderAndActionsClasses: $, conditionalColumnActionsClasses: z, conditionalColumnSeparatorClasses: ve, conditionalColumnHeaderClasses: me, conditionalColumnMenuClasses: re, BentoCheckbox: Dt, BentoDatagridSortDirection: be, BentoTypography: Se, DATAGRID_ROW_ACTIONS_COLUMN_FIELD_NAME: ye, BentoInfoIcon: rs, DatagridColumnsEvent: j, BentoMenu: Ft, BentoToggleButton: Ze, DecorativeCheckbox: cs, ArrowUpAndDownSortIcon: Hs, SortAscendingIcon: Qs, SortDescendingIcon: oo, TriangleDown: co };
+    }), { __sfc: !0, props: e, emit: n, CLOSING_CONTEXTUAL_MENU_DELAY_MS: o, t: l, columns: a, sortBy: i, allColumnsRef: _, columnHeaderRefs: d, contextMenuRef: C, hoveredColumnField: m, closingTimeOutId: S, onAllRowSelect: b, isActionsColumn: f, isAllSelectionState: A, selectAllMenu: L, startResize: F, isResizing: E, columnHoverEventToEmitAfterResizing: u, isSorting: y, getSortingDirection: O, sortByColumnField: x, getSortingColumnDirection: r, draggingEventsForColumn: g, contextualMenuData: R, showContextualMenu: T, hideContextualMenu: B, dataGridColumnEvents: P, hasColumnActions: k, registerColumnsRefs: K, isSmallContainer: Y, isTouchDevice: ee, conditionalColumnsClasses: G, conditionalSelectColumnClasses: M, computeMenuPosition: w, conditionalColumnClasses: W, conditionalColumnHeaderAndActionsClasses: $, conditionalColumnActionsClasses: z, conditionalColumnSeparatorClasses: ve, conditionalColumnHeaderClasses: me, conditionalColumnMenuClasses: re, BentoCheckbox: xt, BentoDatagridSortDirection: be, BentoTypography: Se, DATAGRID_ROW_ACTIONS_COLUMN_FIELD_NAME: ye, BentoInfoIcon: rs, DatagridColumnsEvent: j, BentoMenu: Bt, BentoToggleButton: Ze, DecorativeCheckbox: cs, ArrowUpAndDownSortIcon: Hs, SortAscendingIcon: Qs, SortDescendingIcon: oo, TriangleDown: co };
   }
 });
 var _o = function() {
@@ -1237,18 +1177,9 @@ var po = function() {
   null
 );
 const So = bo.exports, Ro = {
-  "en-US": {
-    toggleColumnFreeze: "Toggle {label} column freeze",
-    toggleColumnVisibility: "Toggle {label} column visibility"
-  },
-  "ja-JP": {
-    toggleColumnFreeze: "{label}列の固定を切り替え",
-    toggleColumnVisibility: "{label}列の表示を切り替え"
-  },
-  "pt-BR": {
-    toggleColumnFreeze: "Alternar congelamento da coluna {label}",
-    toggleColumnVisibility: "Alternar visibilidade da coluna {label}"
-  }
+  "en-US": { toggleColumnFreeze: "Toggle {label} column freeze", toggleColumnVisibility: "Toggle {label} column visibility" },
+  "ja-JP": { toggleColumnFreeze: "{label}列の固定を切り替え", toggleColumnVisibility: "{label}列の表示を切り替え" },
+  "pt-BR": { toggleColumnFreeze: "Alternar congelamento da coluna {label}", toggleColumnVisibility: "Alternar visibilidade da coluna {label}" }
 }, Eo = de({
   i18n: { messages: Ro },
   name: "bento-data-grid",
@@ -1325,62 +1256,14 @@ var Lo = function() {
   "b49cbd8d"
 );
 const To = yo.exports, Oo = {
-  "en-US": {
-    appearance: "Appearance",
-    closeConfigSettingsPanel: "Close configuration settings panel",
-    closeSearch: "Close search",
-    columnVisibilitySearchFilter: "Column visibility search filter",
-    columns: "Columns",
-    condensed: "Condensed",
-    condensedToggle: "Condensed toggle",
-    configSettingsPanel: "Configuration settings Panel",
-    displayOptions: "Display options",
-    noColumnsMatch: "No columns match this search",
-    search: "Search",
-    showAllColumns: "Show all columns ({numberOfColumns})",
-    toggleConfigSettingsPanelVisibility: "Toggle Configuration settings panel visibility",
-    zebraRows: "Zebra rows",
-    zebraRowsToggle: "Zebra rows toggle"
-  },
-  "ja-JP": {
-    appearance: "外観",
-    closeConfigSettingsPanel: "構成設定パネルを閉じる",
-    closeSearch: "検索を閉じる",
-    columnVisibilitySearchFilter: "列の表示設定検索フィルター",
-    columns: "列",
-    condensed: "凝縮",
-    condensedToggle: "簡略化を切り替え",
-    configSettingsPanel: "構成設定パネル",
-    displayOptions: "表示オプション",
-    noColumnsMatch: "この検索に一致する列はありません",
-    search: "検索",
-    showAllColumns: "すべての列を表示 ({numberOfColumns})",
-    toggleConfigSettingsPanelVisibility: "構成設定パネルの表示を切り替え",
-    zebraRows: "1行おきに色を設定",
-    zebraRowsToggle: "1行おきに色を設定の切り替え"
-  },
-  "pt-BR": {
-    appearance: "Aparência",
-    closeConfigSettingsPanel: "Fechar painel de configurações",
-    closeSearch: "Fechar busca",
-    columnVisibilitySearchFilter: "Filtro de busca de visibilidade de coluna",
-    columns: "Colunas",
-    condensed: "Condensado",
-    condensedToggle: "Alternância condensada",
-    configSettingsPanel: "Painel de configurações",
-    displayOptions: "Opções de exibição",
-    noColumnsMatch: "Nenhuma coluna corresponde a esta busca",
-    search: "Buscar",
-    showAllColumns: "Mostrar todas as colunas ({numberOfColumns})",
-    toggleConfigSettingsPanelVisibility: "Alternar a visibilidade do painel de configurações",
-    zebraRows: "Linhas alternadas",
-    zebraRowsToggle: "Alternar linhas alternadas"
-  }
+  "en-US": { appearance: "Appearance", closeConfigSettingsPanel: "Close configuration settings panel", closeSearch: "Close search", columnVisibilitySearchFilter: "Column visibility search filter", columns: "Columns", condensed: "Condensed", condensedToggle: "Condensed toggle", configSettingsPanel: "Configuration settings Panel", displayOptions: "Display options", noColumnsMatch: "No columns match this search", search: "Search", showAllColumns: "Show all columns ({numberOfColumns})", toggleConfigSettingsPanelVisibility: "Toggle Configuration settings panel visibility", zebraRows: "Zebra rows", zebraRowsToggle: "Zebra rows toggle" },
+  "ja-JP": { appearance: "外観", closeConfigSettingsPanel: "構成設定パネルを閉じる", closeSearch: "検索を閉じる", columnVisibilitySearchFilter: "列の表示設定検索フィルター", columns: "列", condensed: "凝縮", condensedToggle: "簡略化を切り替え", configSettingsPanel: "構成設定パネル", displayOptions: "表示オプション", noColumnsMatch: "この検索に一致する列はありません", search: "検索", showAllColumns: "すべての列を表示 ({numberOfColumns})", toggleConfigSettingsPanelVisibility: "構成設定パネルの表示を切り替え", zebraRows: "1行おきに色を設定", zebraRowsToggle: "1行おきに色を設定の切り替え" },
+  "pt-BR": { appearance: "Aparência", closeConfigSettingsPanel: "Fechar painel de configurações", closeSearch: "Fechar busca", columnVisibilitySearchFilter: "Filtro de busca de visibilidade de coluna", columns: "Colunas", condensed: "Condensado", condensedToggle: "Alternância condensada", configSettingsPanel: "Painel de configurações", displayOptions: "Opções de exibição", noColumnsMatch: "Nenhuma coluna corresponde a esta busca", search: "Buscar", showAllColumns: "Mostrar todas as colunas ({numberOfColumns})", toggleConfigSettingsPanelVisibility: "Alternar a visibilidade do painel de configurações", zebraRows: "Linhas alternadas", zebraRowsToggle: "Alternar linhas alternadas" }
 }, No = de({
   i18n: { messages: Oo },
   name: "bento-data-grid",
   components: {
-    BentoButton: xt,
+    BentoButton: Ft,
     BentoCrossIcon: Ot,
     BentoPopover: ts,
     BentoSettingsIcon: So,
@@ -1512,42 +1395,9 @@ var Io = function() {
   "0e477266"
 );
 const Fo = xo.exports, kt = {
-  "en-US": {
-    filterBar: "Filters",
-    gettingYourData: "Getting your data",
-    loading: "Loading",
-    noResults: "No results",
-    pagination: "Pagination",
-    selectRow: "Select row",
-    showMore: "Show more",
-    sortAscending: "{field} sort ascending",
-    sortDescending: "{field} sort descending",
-    sortInactive: "{field} sort inactive"
-  },
-  "ja-JP": {
-    filterBar: "フィルター",
-    gettingYourData: "データの取得",
-    loading: "読み込み中",
-    noResults: "結果がありません",
-    pagination: "ページネーション",
-    selectRow: "行を選択",
-    showMore: "表示内容を増やす",
-    sortAscending: "{field}昇順で並べ替え",
-    sortDescending: "{field}降順で並べ替え",
-    sortInactive: "{field}の並べ替えが無効"
-  },
-  "pt-BR": {
-    filterBar: "Filtro",
-    gettingYourData: "Obtendo seus dados",
-    loading: "Carregando",
-    noResults: "Nenhum resultado",
-    pagination: "Paginação",
-    selectRow: "Selecionar linha",
-    showMore: "Mostrar mais",
-    sortAscending: "{field} ordenar em ordem ascendente",
-    sortDescending: "{field} ordenar em ordem decrescente",
-    sortInactive: "{field} ordenação inativa"
-  }
+  "en-US": { filterBar: "Filters", gettingYourData: "Getting your data", loading: "Loading", noResults: "No results", pagination: "Pagination", selectRow: "Select row", showMore: "Show more", sortAscending: "{field} sort ascending", sortDescending: "{field} sort descending", sortInactive: "{field} sort inactive" },
+  "ja-JP": { filterBar: "フィルター", gettingYourData: "データの取得", loading: "読み込み中", noResults: "結果がありません", pagination: "ページネーション", selectRow: "行を選択", showMore: "表示内容を増やす", sortAscending: "{field}昇順で並べ替え", sortDescending: "{field}降順で並べ替え", sortInactive: "{field}の並べ替えが無効" },
+  "pt-BR": { filterBar: "Filtro", gettingYourData: "Obtendo seus dados", loading: "Carregando", noResults: "Nenhum resultado", pagination: "Paginação", selectRow: "Selecionar linha", showMore: "Mostrar mais", sortAscending: "{field} ordenar em ordem ascendente", sortDescending: "{field} ordenar em ordem decrescente", sortInactive: "{field} ordenação inativa" }
 }, Bo = {
   i18n: { messages: kt }
 }, Po = /* @__PURE__ */ de({
@@ -1594,24 +1444,9 @@ var Wo = function() {
   null
 );
 const Rt = Ho.exports, Vo = {
-  "en-US": {
-    copy: "Copy",
-    edit: "Edit",
-    more: "More",
-    open: "Open"
-  },
-  "ja-JP": {
-    copy: "コピー",
-    edit: "編集",
-    more: "詳しく見る",
-    open: "未解決"
-  },
-  "pt-BR": {
-    copy: "Copiar",
-    edit: "Editar",
-    more: "Mais",
-    open: "Aberto"
-  }
+  "en-US": { copy: "Copy", edit: "Edit", more: "More", open: "Open" },
+  "ja-JP": { copy: "コピー", edit: "編集", more: "詳しく見る", open: "未解決" },
+  "pt-BR": { copy: "Copiar", edit: "Editar", more: "Mais", open: "Aberto" }
 }, Zo = {
   i18n: { messages: Vo },
   name: "data-grid-cell-actions"
@@ -1782,7 +1617,7 @@ const Rt = Ho.exports, Vo = {
     return { __sfc: !0, t: e, props: n, emit: t, isTouchDevice: o, getMenuItemText: l, getMenuItemIcon: a, isRowActions: i, conditionalCellActionsBackgroundGradientClasses: _, conditionalCellActionsClasses: d, showGradientElement: C, isBentoColumnCellActionsByCellValueDataFn: m, computedCellActions: S, getButtonTitle: b, generateButtonEvents: f, generateMenuEvents: A, transformMenuEvents: L, getCopyText: (u) => {
       var y, O;
       return (u == null ? void 0 : u.getCopyData) !== void 0 ? u.getCopyData(n.rowDataItem, n.columnKey) : n.columnKey ? (O = (y = n.rowDataItem) == null ? void 0 : y[n.columnKey]) == null ? void 0 : O.toString() : "";
-    }, shouldShowMenuIconLeft: (u) => u.iconLeft || (u == null ? void 0 : u.variant) === "more", BentoButton: xt, BentoMenu: Ft, Copy: ct, vBentoTooltipDirective: Nt, Edit1Icon: Rt, ExternalLinkIcon: rt, OptionsVerticalIcon: it };
+    }, shouldShowMenuIconLeft: (u) => u.iconLeft || (u == null ? void 0 : u.variant) === "more", BentoButton: Ft, BentoMenu: Bt, Copy: ct, vBentoTooltipDirective: Nt, Edit1Icon: Rt, ExternalLinkIcon: rt, OptionsVerticalIcon: it };
   }
 });
 var qo = function() {
@@ -1827,21 +1662,9 @@ const Et = () => {
   const s = document.activeElement;
   return s ? s.matches(":focus-visible") || s.matches(".focus-visible") : !1;
 }, Ko = {
-  "en-US": {
-    collapseNestedContent: "Collapse nested content",
-    expandNestedContent: "Expand nested content",
-    selectRow: "Select row"
-  },
-  "ja-JP": {
-    collapseNestedContent: "ネストされたコンテンツを折りたたむ",
-    expandNestedContent: "ネストされたコンテンツを展開",
-    selectRow: "行を選択"
-  },
-  "pt-BR": {
-    collapseNestedContent: "Recolher conteúdo aninhado",
-    expandNestedContent: "Expandir conteúdo aninhado",
-    selectRow: "Selecionar linha"
-  }
+  "en-US": { collapseNestedContent: "Collapse nested content", expandNestedContent: "Expand nested content", selectRow: "Select row" },
+  "ja-JP": { collapseNestedContent: "ネストされたコンテンツを折りたたむ", expandNestedContent: "ネストされたコンテンツを展開", selectRow: "行を選択" },
+  "pt-BR": { collapseNestedContent: "Recolher conteúdo aninhado", expandNestedContent: "Expandir conteúdo aninhado", selectRow: "Selecionar linha" }
 }, Xo = {
   i18n: { messages: Ko },
   name: "data-grid-cell"
@@ -2088,7 +1911,7 @@ const Et = () => {
     }));
     return t({
       gridcellRef: i
-    }), { __sfc: !0, slots: o, hasSlot: l, t: a, props: e, emit: n, gridcellRef: i, cellActionsRef: _, shouldShowCellActions: d, childrenMenuContainerElements: C, isFocused: m, focusableItems: S, hasEverBeenFocused: b, hasRowData: f, controlledNestedRowElementIds: A, ariaHidden: L, tabIndex: F, conditionalTitleAttribute: E, getRowData: u, sumColumnAmountsInColumnSets: y, getColIndex: O, getCellIndex: x, isLeavingCellFocus: r, onMenuClose: g, hasInteractiveElFocusedInside: R, getGridcellEvents: T, toggleNestedContent: B, registerMenuContainerElement: P, menuMouseLeave: k, hasSlashedZero: K, isSmallContainer: Y, isTouchDevice: ee, conditionalRowCellClasses: G, computedCellContentClasses: M, DATAGRID_ACTIONS_COLUMN_FIELD_NAME: le, BentoCheckbox: Dt, BentoTypography: Se, BentoToggleButton: Ze, DataGridCellActions: Wt, ChevronDownIcon: ls, ChevronUpIcon: as };
+    }), { __sfc: !0, slots: o, hasSlot: l, t: a, props: e, emit: n, gridcellRef: i, cellActionsRef: _, shouldShowCellActions: d, childrenMenuContainerElements: C, isFocused: m, focusableItems: S, hasEverBeenFocused: b, hasRowData: f, controlledNestedRowElementIds: A, ariaHidden: L, tabIndex: F, conditionalTitleAttribute: E, getRowData: u, sumColumnAmountsInColumnSets: y, getColIndex: O, getCellIndex: x, isLeavingCellFocus: r, onMenuClose: g, hasInteractiveElFocusedInside: R, getGridcellEvents: T, toggleNestedContent: B, registerMenuContainerElement: P, menuMouseLeave: k, hasSlashedZero: K, isSmallContainer: Y, isTouchDevice: ee, conditionalRowCellClasses: G, computedCellContentClasses: M, DATAGRID_ACTIONS_COLUMN_FIELD_NAME: le, BentoCheckbox: xt, BentoTypography: Se, BentoToggleButton: Ze, DataGridCellActions: Wt, ChevronDownIcon: ls, ChevronUpIcon: as };
   }
 });
 var el = function() {
@@ -2597,24 +2420,12 @@ var ml = function() {
   "dbc055cb"
 );
 const Ga = hl.exports, pl = {
-  "de-DE": {
-    numberResults: "1 Ergebnis | {count} Ergebnisse"
-  },
-  "en-US": {
-    numberResults: "1 result | {count} results"
-  },
-  "es-ES": {
-    numberResults: "1 resultado | {count} resultados"
-  },
-  "fr-FR": {
-    numberResults: "1 résultat | {count} résultats"
-  },
-  "ja-JP": {
-    numberResults: "1件の結果 | {count}件の結果"
-  },
-  "pt-BR": {
-    numberResults: "1 resultado | {count} resultados"
-  }
+  "de-DE": { numberResults: "1 Ergebnis | {count} Ergebnisse" },
+  "en-US": { numberResults: "1 result | {count} results" },
+  "es-ES": { numberResults: "1 resultado | {count} resultados" },
+  "fr-FR": { numberResults: "1 résultat | {count} résultats" },
+  "ja-JP": { numberResults: "1件の結果 | {count}件の結果" },
+  "pt-BR": { numberResults: "1 resultado | {count} resultados" }
 }, wl = {
   i18n: { messages: pl }
 }, bl = /* @__PURE__ */ de({
@@ -2721,18 +2532,9 @@ var Pl = function() {
   null
 );
 const $l = Ul.exports, zl = {
-  "en-US": {
-    decrease: "decrease",
-    increase: "increase"
-  },
-  "ja-JP": {
-    decrease: "低減",
-    increase: "増加"
-  },
-  "pt-BR": {
-    decrease: "diminuir",
-    increase: "aumentar"
-  }
+  "en-US": { decrease: "decrease", increase: "increase" },
+  "ja-JP": { decrease: "低減", increase: "増加" },
+  "pt-BR": { decrease: "diminuir", increase: "aumentar" }
 }, kl = {
   i18n: { messages: zl }
 }, Wl = /* @__PURE__ */ de({
@@ -3389,4 +3191,4 @@ export {
   be as h,
   ge as i
 };
-//# sourceMappingURL=data-grid.u3f__x8_.js.map
+//# sourceMappingURL=data-grid.DJG8Ty0A.js.map