@adyen/bento-vue2 1.77.0 → 1.78.0

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/composables/use-bento-base-filter/utils/utils.ts","../src/composables/use-bento-base-filter/use-bento-base-filter.ts","../src/composables/use-form-validate/use-form.ts","../src/composables/use-bento-theme/use-bento-theme.types.ts","../src/composables/use-bento-theme/use-bento-theme.ts","../src/composables/use-bento-toast-controller/install.ts","../src/composables/use-bento-theme/install.types.ts","../src/composables/use-bento-theme/install.ts","../src/install.ts","../src/types/base-filter.ts"],"sourcesContent":["/**\n * Checks if a value is a plain object.\n *\n * @param value The value to check.\n * @returns Whether the value is a plain object.\n */\nexport const isPlainObject = (value: unknown) => {\n    if (value === null || typeof value !== 'object') {\n        return false;\n    }\n\n    return Object.prototype.toString.call(value) === '[object Object]';\n};\n\n/**\n * Checks if a value is an array.\n *\n * @param value The value to check.\n * @returns Whether the value is an array.\n */\nexport const isArray = <T>(value: T) => Array.isArray(value);\n\n/**\n * Checks if a value is empty.\n * If the value is an array, it checks if the array is empty or if all elements are empty strings.\n * If the value is not an array, it checks if the value is falsy.\n *\n * @param value The value to check.\n * @returns Whether the value is empty.\n */\nexport const isValueEmpty = <T>(value: T) =>\n    isArray(value) ? (value as []).length === 0 || (value as Array<T>).every(el => el === '') : !value;\n\n/**\n * Checks if two objects are deeply equal by comparing their JSON string representations.\n *\n * @param first The first value.\n * @param second The second value.\n * @returns Whether the values are equal.\n */\nexport const isEqual = <T>(first: T, second: T) => JSON.stringify(first) === JSON.stringify(second);\n\n/**\n * Creates a deep copy of a value.\n * If the value is a plain object, it uses `JSON.parse(JSON.stringify(value))` to create a deep copy.\n * Otherwise, it returns the value as is.\n *\n * @param value The value to copy.\n * @returns The deep copied value or the original value if it's not a plain object.\n */\nexport const deepCopy = <T>(value: T) =>\n    isPlainObject(value) || isArray(value) ? (JSON.parse(JSON.stringify(value)) as T) : value;\n\n/**\n * Copies the structure of a plain object, setting all values to `undefined`.\n * If the value is not a plain object, it returns `undefined`.\n *\n * @param value The object whose structure to copy.\n * @returns An object with the same keys as the input object but with all values set to `undefined`, or `undefined` if the input is not a plain object.\n */\nexport const copyStructure = <T>(value: T) =>\n    isPlainObject(value) ? Object.fromEntries(Object.keys(value).map(key => [key, undefined])) : undefined;\n","import { computed, onMounted, ref, watch } from 'vue';\nimport type { Ref } from 'vue';\nimport { copyStructure, deepCopy, isEqual, isValueEmpty } from './utils';\n\n/**\n * A composable to wire the `bento-base-filter` component for the mandatory fields and events.\n *\n * @usage\n * ```vue\n * <template>\n *    <bento-base-filter\n *       :disable-apply-button=\"isApplyButtonDisabled\"\n *       :disable-secondary-button=\"isSecondaryButtonDisabled\"\n *       @ apply=\"updateFilter\"\n *       @ clear=\"clearFilter(updateFilter)\"\n *       @ open=\"openFilter\"\n *       @ reset=\"resetFilter(updateFilter)\"\n *     >\n *          <!-- CONTENT HERE -->\n *     </bento-base-filter>\n * </template>\n * <script>\n *    import { ref } from 'vue'\n *    import { useBentoBaseFilter, BentoBaseFilter, BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n *    type CustomFilterValue = boolean\n *    const props = defineProps<BentoBaseFilterProps<CustomFilterValue>>();\n *\n *    const {\n *       // Values\n *       internalFilterValue,\n *       isSecondaryButtonDisabled,\n *       isApplyButtonDisabled,\n *\n *        // Methods\n *        clearFilter,\n *        resetFilter,\n *        openFilter,\n *    } = useBentoBaseFilter<CustomFilterValue>(toRef(props, 'value'), toRef(props, 'defaultValue'));\n * </script>\n * ```\n *\n * @param appliedFilter The currently applied filter value.\n * @param defaultFilter The default filter value (if available).\n * @returns An object containing refs and functions:\n * - `internalFilterValue`: The temporary state of the filter before it's applied.\n * - `isSecondaryButtonDisabled`: `true` if the secondary (clear/reset) button should be disabled.\n * - `isApplyButtonDisabled`: `true` if the apply button should be disabled.\n * - `clearFilter`: Clears the filter to its initial or default state.\n * - `resetFilter`: Resets the filter to its default state.\n * - `openFilter`: Syncs the internal state with the applied filter.\n */\nexport function useBentoBaseFilter<T>(appliedFilter: Ref<T>, defaultFilter: Ref<T>) {\n    /**\n     * Handles the internal value. Kept in sync when the new value is applied\n     */\n    const internalFilterValue = ref<T>();\n    const initialStructureOrValue = ref<T>();\n\n    onMounted(() => {\n        /**\n         * Copy initial structure as long as the value is not \"undefined\"\n         */\n        if (appliedFilter.value != null) {\n            initialStructureOrValue.value = copyStructure<T>(appliedFilter.value) as T;\n        }\n    });\n\n    watch(\n        () => appliedFilter.value,\n        newValue => {\n            internalFilterValue.value = deepCopy<T>(newValue);\n        },\n        { immediate: true }\n    );\n\n    /**\n     * Indicates if the filter has a value applied (active).\n     * - inactive (`true`): `appliedFilter` is empty (`undefined`) or all of its properties are empty for object values\n     */\n    const isFilterInactive = computed(\n        () => isValueEmpty(appliedFilter.value) || isEqual<T>(appliedFilter.value, initialStructureOrValue.value)\n    );\n\n    /**\n     * Indicates if the secondary (clear/reset) button should be disabled.\n     * - disabled (`true`): No filter value is applied or `appliedFilter` value is the same as the `defaultFilter` (persistent) value\n     */\n    const isSecondaryButtonDisabled = computed(() =>\n        defaultFilter.value != null ? isEqual<T>(defaultFilter.value, appliedFilter.value) : isFilterInactive.value\n    );\n\n    const isApplyButtonDisabled = computed(() => {\n        const isValueUnchanged = isEqual<T>(internalFilterValue.value, appliedFilter.value);\n        return isValueUnchanged || (isValueEmpty(internalFilterValue.value) && isFilterInactive.value);\n    });\n\n    /**\n     * Clears the non-persistent filters (not used in persistent filters).\n     *\n     * Receives a callback to execute additional tasks required when clearing a filter\n     *\n     * - `object`: Sets all properties to `undefined`\n     * - non-`object`: Sets to `undefined`\n     * @param callback Function to be called when clearing a filter\n     */\n    function clearFilter(callback?: (newValue: T) => void) {\n        internalFilterValue.value = deepCopy<T>(initialStructureOrValue.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    /**\n     * Resets the persistent filters (not used in non-persistent filters).\n     * Sets the `internalFilterValue`\n     *\n     * Receives a callback to execute additional tasks required when resetting a filter.\n     * @param callback Function to be called when resetting a filter\n     */\n    function resetFilter(callback?: (newValue: T) => void) {\n        internalFilterValue.value = deepCopy<T>(defaultFilter.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    /**\n     * Sets the value to what is applied when opening a filter.\n     * @param callback Function to be called when opening a filter\n     */\n    function openFilter(callback?: (newValue: T) => void) {\n        // Reset value every time it opens\n        internalFilterValue.value = deepCopy<T>(appliedFilter.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    return {\n        // Values\n        internalFilterValue,\n        isSecondaryButtonDisabled,\n        isApplyButtonDisabled,\n\n        // Methods\n        clearFilter,\n        resetFilter,\n        openFilter,\n    };\n}\n","import { type Ref, ref, shallowRef } from 'vue';\nimport * as z from 'zod';\nimport type { ZodSchema } from 'zod';\nimport { type allKeys, type ErrorBag, type UseForm } from './use-form.types';\n\n/**\n * Composable that tansforms a Zod schema into a Typed Schema that can be used alongside with {@see useForm}.\n *\n * This is meant to simulate the behavior of {@link @vee-validate/zod} {@see https://vee-validate.logaretm.com/v4/integrations/zod-schema-validation}.\n * Function that transform Zod’s schemas into something that can be understood by vee-validate\n *\n * @deprecated For usage with Zod/v3. Migrate to Zod/v4 and use `@adyen/bento-vue2/use-form-v4' instead or migrate to Vue3 and use Vee-Validate instead.\n *\n * @param formSchema Zod schema to be transformed into a `vee-validate` schema\n * @returns Schema transformed\n */\nexport function toTypedSchema<T extends ZodSchema>(formSchema: T) {\n    return formSchema;\n}\n\n/**\n * Finds and returns the initial values of each of the values defined in the schema so that they\n * can be transformed into a reactive element.\n * @param schema Zod validation schema containing the definitions of each value to be used in the form\n * @returns Object with the items defined in the schema and their (default) values\n *\n * @example\n * const validationSchema = toTypedSchema(\n *      z.object({\n *          name: z\n *              .string()\n *              .min(3, { message: 'Name is required' })\n *              .startsWith('Jane')\n *              .max(4, { message: 'Name cannot be longer than 4 characters' })\n *              .default('Joe'),\n *      })\n * );\n * getInitialFormValues(validationSchema)\n *\n * Will return:\n *\n * {\n *      name: 'Joe'\n * }\n *\n */\nfunction getInitialFormValues<T extends ZodSchema>(schema: T): z.infer<typeof schema> {\n    if (!!z && schema instanceof z.ZodObject) {\n        return Object.fromEntries(\n            Object.entries(schema.shape).map(([key, value]) => {\n                if (!!z && value instanceof z.ZodDefault) {\n                    // eslint-disable-next-line no-underscore-dangle\n                    return [key, value._def.defaultValue()];\n                }\n\n                if (!!z && value instanceof z.ZodObject) {\n                    return [key, getInitialFormValues(value)];\n                }\n\n                return [key, undefined];\n            })\n        ) as z.infer<typeof schema>;\n    }\n\n    return undefined;\n}\n\n/**\n * Constructs a path with dot paths for arrays to use brackets to be compatible with vee-validate path syntax\n * @param issue List of nested path elements\n * @returns Path with dots\n */\nfunction normalizeFormPath(issue: z.ZodIssue) {\n    return issue.path.join('.');\n}\n\n/**\n * Composable that facilitates validating form data for Vue2 & Vue3 implementations with FormLayout\n * to ease the migration to Vue3.\n *\n * For Vue3 implementations use Vee-Validate.\n *\n * This provides a simplified version of Vee-Validate v4 implemented with Zod to validate a form schema.\n * It returns reactive values that can be used directly in form input elements with 'v-model' alongside\n * with functions to \"reset\" the data (sets values to default value) and a function to execute the\n * successful form validation process (through a callback).\n *\n * @deprecated For usage with Zod/v3. Migrate to Zod/v4 and use `@adyen/bento-vue2/use-form-v4' instead or migrate to Vue3 and use Vee-Validate instead.\n *\n * @param props Form configuration object\n * @param extends ZodSchema} props.validationSchema Zod typed validation schema\n * @returns response - Composable with reactive form values and errors, and functions to handle the reactive data\n * @returns response.errorBag Object with all the form values and an array of each one of the errors (if any) per value\n * @returns response.errors Object with all the form values and the first error found for that field (if any)\n * @returns response.values Object with all the form values and their current value\n * @returns response.handleReset Resets the form values to default (initial values) when it gets called\n * @returns response.submitForm Validates the data set in {response.values} and sets errors (if found) inside {response.errors} and {response.errorBag}.\n *                                                                   When the validation is successful it calls the callback so the submit process can continue\n *\n * @example\n * const validationSchema = toTypedSchema(\n *      z.object({\n *          name: z\n *              .string()\n *              .min(3, { message: 'Name is required' })\n *              .startsWith('Jane')\n *              .max(4, { message: 'Name cannot be longer than 4 characters' })\n *              .default('Joe'),\n *      })\n * );\n *\n * const { values, errors, errorBag, submitForm, handleReset } = useForm({\n *     validationSchema\n * });\n * const handleSubmit = submitForm(() => {\n *     // Send data to API here\n * })\n *\n */\nexport function useForm<T extends ZodSchema>({\n    validationSchema,\n}: UseForm<T>): {\n    errorBag: Ref<{\n        [P in allKeys<(typeof validationSchema)['_type']>]?: Array<string>;\n    }>;\n    errors: Ref<{\n        [P in allKeys<(typeof validationSchema)['_type']>]?: string;\n    }>;\n    values: Ref<(typeof validationSchema)['_type']>;\n    handleReset: () => void;\n    submitForm: (submitted: any) => () => void;\n} {\n    // Errors per field\n    const errors = shallowRef<z.infer<typeof validationSchema>>({});\n    // All errors per field\n    const errorBag: Ref<ErrorBag<z.infer<typeof validationSchema>>> = ref({});\n    const values: Ref<z.TypeOf<T>> = ref(getInitialFormValues<T>(validationSchema));\n\n    const cleanErrors = () => {\n        errors.value = {};\n        errorBag.value = {};\n    };\n\n    const resetForm = () => {\n        cleanErrors();\n        values.value = getInitialFormValues<T>(validationSchema);\n    };\n\n    const submitForm = submitted => () => {\n        cleanErrors();\n\n        // Run validations on the form data through the schema\n        const validSchema = validationSchema.safeParse(values.value);\n\n        // Update errors\n        if (!validSchema.success) {\n            (validSchema as z.SafeParseError<T>).error.issues.forEach(error => {\n                const path = normalizeFormPath(error);\n\n                // Add the first ocurrance of a fild error to the \"errors\" object\n                if (!errors.value[path]) {\n                    errors.value[path] = error.message;\n                }\n\n                // Add each error to the \"errorBag\" per field array\n                if (!errorBag.value[path]) {\n                    errorBag.value[path] = [error.message];\n                } else {\n                    errorBag.value[path].push(error.message);\n                }\n            });\n        } else {\n            submitted(values.value);\n        }\n    };\n\n    return {\n        // Values\n        errorBag,\n        errors,\n        values,\n\n        // Methods\n        handleReset: () => resetForm(),\n        submitForm,\n    };\n}\n","import { type BentoTheme } from './install.types';\n\nexport const useBentoThemeKey = Symbol('use-bento-theme');\n\nexport interface UseBentoTheme {\n    getTheme: () => string;\n    setTheme: (theme: BentoTheme | `${BentoTheme}`) => void;\n}\n","import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\nimport { getCurrentInstance, inject } from 'vue';\nimport { isVue2 } from 'vue-demi';\nimport { type UseBentoTheme, useBentoThemeKey } from './use-bento-theme.types';\n\n/**\n * Composable that handles theming-related capabilities for the Bento component library.\n * Requires the use of `BentoPlugin`.\n *\n * @example\n * <script setup lang=\"ts\">\n *    import { useBentoTheme, BentoTheme } from '@adyen/bento-vue2';\n *\n *    const { setTheme } = useBentoTheme();\n *\n *    setTheme(BentoTheme.BENTO_DARK)\n * </script>\n *\n * @returns {UseBentoTheme} An object with getter and setter method for the Bento theme.\n * @returns {Function} getTheme - Returns the current theme in the string form of BentoTheme enum.\n * @returns {Function} setTheme - Sets the theme of the Bento component library.\n *\n */\nexport function useBentoTheme(): UseBentoTheme {\n    const bentoThemeController = isVue2\n        ? getCurrentInstance()?.proxy[useBentoThemeKey]\n        : inject(useBentoThemeKey, null);\n\n    if (!bentoThemeController) {\n        printDevelopmentWarning('useBentoTheme does not work without Vue.use(BentoPlugin)');\n\n        // Return placeholder functions so client code won't break, but theme won't toggle\n        return {\n            getTheme: () => undefined,\n            setTheme: () => undefined,\n        };\n    }\n\n    // Return a new object so unintentional reassigning its properties won't override a global state\n    return { ...bentoThemeController };\n}\n","import { type App, isVue2, type Vue2 } from 'vue-demi';\nimport { createToastStack, toastStackInjectionKey } from './toast-stack';\n\n/**\n * This function is used to create and register global reactive state necessary fro the Toasts to operate.\n * @param {Vue} Vue A context application to register global state with.\n */\nexport default Vue => {\n    if (isVue2) {\n        // Add toast stack as a global property as there is no \"app.provide\" functionality in Vue2\n        // eslint-disable-next-line no-param-reassign -- this is an official way of setting up instance properties on Vue\n        (Vue as typeof Vue2).prototype[toastStackInjectionKey] = createToastStack();\n    } else {\n        (Vue as App).provide(toastStackInjectionKey, createToastStack());\n    }\n};\n","export enum BentoTheme {\n    /**\n     * @deprecated in favor of {@link BENTO_LIGHT}. To be removed in v2.0.0.\n     */\n    LEGACY = 'b-legacy-theme',\n    STYLEGUIDE = 'b-styleguide-theme',\n\n    /**\n     * @deprecated in favor of {@link BENTO_LIGHT}. To be removed in v2.0.0.\n     */\n    BENTO = '',\n\n    BENTO_LIGHT = 'b-light-theme',\n    BENTO_DARK = 'b-dark-theme',\n    BENTO_SYSTEM = 'b-system',\n}\n","import { type App, isVue2, type Vue2 } from 'vue-demi';\nimport { useBentoThemeKey } from './use-bento-theme.types';\nimport { BentoTheme } from './install.types';\n\nconst getTheme = () => document.body.className.match(/b-\\w+-theme/)?.[0] ?? '';\nconst getThemeForSystemPreference = () => {\n    const preferredDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;\n\n    if (preferredDarkMode) {\n        return BentoTheme.BENTO_DARK;\n    }\n\n    return BentoTheme.BENTO_LIGHT;\n};\n\nexport const setTheme = (theme: BentoTheme) => {\n    const currentTheme = getTheme();\n    const systemTheme = getThemeForSystemPreference();\n    const themeToSet = theme === BentoTheme.BENTO_SYSTEM ? systemTheme : theme;\n\n    if (themeToSet === BentoTheme.BENTO_LIGHT || themeToSet === BentoTheme.BENTO) {\n        document.documentElement.style.colorScheme = 'light';\n    } else if (themeToSet === BentoTheme.BENTO_DARK) {\n        document.documentElement.style.colorScheme = 'dark';\n    }\n\n    // if theme is different from current and it is not `BentoTheme.BENTO`\n    if (currentTheme.length && currentTheme !== themeToSet) {\n        document.body.classList.remove(currentTheme);\n    }\n\n    // if theme is not `BentoTheme.BENTO`\n    if (themeToSet.length) {\n        document.body.classList.add(themeToSet);\n    }\n};\n\n/**\n * This function is used to create and register global reactive state necessary for theme to operate.\n * @param {Vue} Vue A context application to register global state with.\n */\nexport default Vue => {\n    const themeProvider = {\n        getTheme,\n        setTheme,\n    };\n\n    if (isVue2) {\n        // Add theme  as a global property as there is no \"app.provide\" functionality in Vue2\n        // eslint-disable-next-line no-param-reassign -- this is an official way of setting up instance properties on Vue\n        (Vue as typeof Vue2).prototype[useBentoThemeKey] = themeProvider;\n    } else {\n        (Vue as App).provide(useBentoThemeKey, themeProvider);\n    }\n};\n","import installToast from './composables/use-bento-toast-controller/install';\nimport installTheme, { setTheme } from './composables/use-bento-theme/install';\nimport { deprecate } from './utils/ts/deprecate';\nimport { BentoTheme } from './composables/use-bento-theme/install.types';\nimport type { PluginObject } from 'vue';\n\ninterface BentoVuePlugin {\n    theme?: BentoTheme;\n    withToast?: boolean;\n    withUtilityClasses?: boolean;\n    withDesignTokensCSSInjection?: boolean;\n}\n\nconst plugin: PluginObject<BentoVuePlugin> = {\n    name: 'BentoVue',\n    install: async (\n        Vue,\n        {\n            theme = BentoTheme.BENTO_LIGHT,\n            withToast = false,\n            withUtilityClasses = false,\n            withDesignTokensCSSInjection = true,\n        }: BentoVuePlugin\n    ) => {\n        installTheme(Vue);\n\n        if (withToast) {\n            installToast(Vue);\n        }\n        if (withDesignTokensCSSInjection) {\n            deprecate(\n                'Using default setting withDesignTokensCSSInjection set to true in BentoVue plugin',\n                'Please disable CSS injection by setting withDesignTokensCSSInjection to false in BentoVue plugin options as highlighted here:\\nhttps://adyen-bento.netlify.app/?path=/docs/welcome-getting-started--docs#import-css-variables',\n                '2.0.0'\n            );\n            // Make sure to put all awaited CSS imports below this point and not above!\n            if (theme === BentoTheme.STYLEGUIDE) {\n                await import('@adyen/bento-design-tokens/dist/css/bento/variables-styleguide.css');\n            } else {\n                await import('@adyen/bento-design-tokens/dist/css/bento/variables.css');\n            }\n\n            if (withUtilityClasses) {\n                await import('@adyen/bento-design-tokens/dist/css/bento/utility.css');\n            }\n        }\n\n        if (theme === BentoTheme.STYLEGUIDE) {\n            setTheme(BentoTheme.STYLEGUIDE);\n        } else if (theme === BentoTheme.BENTO_SYSTEM) {\n            setTheme(BentoTheme.BENTO_SYSTEM);\n        } else if (theme === BentoTheme.BENTO_DARK) {\n            setTheme(BentoTheme.BENTO_DARK);\n        } else if (theme === BentoTheme.BENTO) {\n            deprecate('Using `BentoTheme.BENTO`', 'Please use `BentoTheme.BENTO_LIGHT` instead', '2.0.0');\n            setTheme(BentoTheme.BENTO_LIGHT);\n        } else {\n            setTheme(BentoTheme.BENTO_LIGHT);\n        }\n    },\n};\n\nexport { BentoTheme };\nexport default plugin;\n","/**\n * Defines the props used by `bento-base-filter` that must be implemented\n * on every filter as `defineProps`.\n *\n * The interface can be extended if new values are required.\n * The object can be extended if new values are required.\n *\n * @template CustomValue Defines the type of the `value` and `defaultValue` props.\n * @template CustomOptions Defines the type of the options used by the filter (default: `undefined`).\n *\n * @example\n * Using the interface\n *\n * ```typescript\n * import { type BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n * interface CustomOptions {\n *      option: string;\n * }\n *\n * withDefaults(defineProps<BentoBaseFilterProps<string, CustomOptions>>(), {\n *    defaultValue: undefined,\n * })\n * ```\n *\n * @example\n * Using the object\n *\n * ```typescript\n * import { BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n * defineProps({\n *   ...BentoBaseFilterProps,\n *   options: {\n *      type: Object,\n *      default: () => ({\n *          option: null\n *      })\n *   }\n * })\n * ```\n */\nexport interface BentoBaseFilterProps<CustomValue, CustomOptions = undefined> {\n    /**\n     * Disables the filter from being interacted with.\n     */\n    disabled?: boolean;\n\n    /**\n     * Default value of the filter to reset to.\n     */\n    defaultValue?: CustomValue;\n\n    /**\n     * Filter name/key referencing the actual property name in the data set.\n     * Should be unique per filter bar.\n     */\n    field: string;\n\n    /**\n     * Label text to be displayed\n     */\n    label: string;\n\n    /**\n     * Renders the base filter's slot content only - leaving out the button and the popover.\n     * Used for the allFiltersModal component.\n     */\n    onlySlot?: boolean;\n\n    /**\n     * List of options that are needed to setup the filter\n     * Available options:\n     *   - firstDayOfWeek: Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n     *   - isDateDisabled: Indicate if a date should be disabled or not\n     *   - tooltipPosition: The position of the tooltip attached to the filter button\n     *   - tooltipText: The content of the tooltip attached to the filter button\n     */\n    options?: CustomOptions;\n\n    /**\n     * Current value of the filter\n     */\n    value: CustomValue;\n}\n\nexport const BentoBaseFilterProps = Object.freeze({\n    /**\n     * Disables the filter from being interacted with.\n     */\n    disabled: { type: Boolean, default: false },\n\n    /**\n     * Default value of the filter to reset to.\n     */\n    defaultValue: {\n        type: [Object, Number, Boolean, Array, String, Date],\n        default: null,\n    },\n\n    /**\n     * Filter name/key referencing the actual property name in the data set.\n     * Should be unique per filter bar.\n     */\n    field: { type: String, required: true },\n\n    /**\n     * Label text to be displayed\n     */\n    label: { type: String, required: true },\n\n    /**\n     * Renders the base filter's slot content only - leaving out the button and the popover.\n     * Used for the allFiltersModal component.\n     */\n    onlySlot: { type: Boolean, default: false },\n\n    /**\n     * The current value of the filter, used for v-model.\n     */\n    value: {\n        type: [Object, Number, Boolean, Array, String, Date],\n        default: undefined,\n    },\n});\n\n/**\n * Defines the mandatory emits that need to be defined by the implementation of any filter\n *\n * @template CustomValue Defines the type of the value being passed to the emit. Same as the type set in `BentoBaseFilterProps`\n *\n * @example\n * Using the interface\n *\n * ```typescript\n * import { type BentoBaseFilterEvents } from '@adyen/bento-vue2'\n *\n * defineEmits<BentoBaseFilterEvents<string>>()\n * ```\n *\n * @example\n * Using the object\n *\n * ```typescript\n * import { BentoBaseFilterEvents } from '@adyen/bento-vue2'\n *\n * defineEmits(BentoBaseFilterEvents)\n * ```\n */\nexport interface BentoBaseFilterEvents<CustomValue> {\n    /**\n     * Used in the All filters modal\n     */\n    (e: 'input', newFilterValue: CustomValue): void;\n\n    /**\n     * Used in the Filter Bar\n     */\n    (e: 'update', newFilterValue: CustomValue): void;\n}\n\nexport const BentoBaseFilterEvents = ['input', 'update'];\n"],"names":["isPlainObject","value","isArray","isValueEmpty","el","isEqual","first","second","deepCopy","copyStructure","key","useBentoBaseFilter","appliedFilter","defaultFilter","internalFilterValue","ref","initialStructureOrValue","onMounted","watch","newValue","isFilterInactive","computed","isSecondaryButtonDisabled","isApplyButtonDisabled","clearFilter","callback","resetFilter","openFilter","toTypedSchema","formSchema","getInitialFormValues","schema","z","normalizeFormPath","issue","useForm","validationSchema","errors","shallowRef","errorBag","values","cleanErrors","resetForm","validSchema","submitted","error","path","useBentoThemeKey","useBentoTheme","bentoThemeController","_a","getCurrentInstance","printDevelopmentWarning","installToast","Vue","toastStackInjectionKey","createToastStack","BentoTheme","getTheme","getThemeForSystemPreference","setTheme","theme","currentTheme","systemTheme","themeToSet","installTheme","themeProvider","plugin","withToast","withUtilityClasses","withDesignTokensCSSInjection","deprecate","BentoBaseFilterProps","BentoBaseFilterEvents"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../src/composables/use-bento-base-filter/utils/utils.ts","../src/composables/use-bento-base-filter/use-bento-base-filter.ts","../src/composables/use-form-validate/use-form.ts","../src/composables/use-bento-theme/use-bento-theme.types.ts","../src/composables/use-bento-theme/use-bento-theme.ts","../src/directives/highlight/highlight.ts","../src/composables/use-bento-toast-controller/install.ts","../src/composables/use-bento-theme/install.types.ts","../src/composables/use-bento-theme/install.ts","../src/install.ts","../src/types/base-filter.ts"],"sourcesContent":["/**\n * Checks if a value is a plain object.\n *\n * @param value The value to check.\n * @returns Whether the value is a plain object.\n */\nexport const isPlainObject = (value: unknown) => {\n    if (value === null || typeof value !== 'object') {\n        return false;\n    }\n\n    return Object.prototype.toString.call(value) === '[object Object]';\n};\n\n/**\n * Checks if a value is an array.\n *\n * @param value The value to check.\n * @returns Whether the value is an array.\n */\nexport const isArray = <T>(value: T) => Array.isArray(value);\n\n/**\n * Checks if a value is empty.\n * If the value is an array, it checks if the array is empty or if all elements are empty strings.\n * If the value is not an array, it checks if the value is falsy.\n *\n * @param value The value to check.\n * @returns Whether the value is empty.\n */\nexport const isValueEmpty = <T>(value: T) =>\n    isArray(value) ? (value as []).length === 0 || (value as Array<T>).every(el => el === '') : !value;\n\n/**\n * Checks if two objects are deeply equal by comparing their JSON string representations.\n *\n * @param first The first value.\n * @param second The second value.\n * @returns Whether the values are equal.\n */\nexport const isEqual = <T>(first: T, second: T) => JSON.stringify(first) === JSON.stringify(second);\n\n/**\n * Creates a deep copy of a value.\n * If the value is a plain object, it uses `JSON.parse(JSON.stringify(value))` to create a deep copy.\n * Otherwise, it returns the value as is.\n *\n * @param value The value to copy.\n * @returns The deep copied value or the original value if it's not a plain object.\n */\nexport const deepCopy = <T>(value: T) =>\n    isPlainObject(value) || isArray(value) ? (JSON.parse(JSON.stringify(value)) as T) : value;\n\n/**\n * Copies the structure of a plain object, setting all values to `undefined`.\n * If the value is not a plain object, it returns `undefined`.\n *\n * @param value The object whose structure to copy.\n * @returns An object with the same keys as the input object but with all values set to `undefined`, or `undefined` if the input is not a plain object.\n */\nexport const copyStructure = <T>(value: T) =>\n    isPlainObject(value) ? Object.fromEntries(Object.keys(value).map(key => [key, undefined])) : undefined;\n","import { computed, onMounted, ref, watch } from 'vue';\nimport type { Ref } from 'vue';\nimport { copyStructure, deepCopy, isEqual, isValueEmpty } from './utils';\n\n/**\n * A composable to wire the `bento-base-filter` component for the mandatory fields and events.\n *\n * @usage\n * ```vue\n * <template>\n *    <bento-base-filter\n *       :disable-apply-button=\"isApplyButtonDisabled\"\n *       :disable-secondary-button=\"isSecondaryButtonDisabled\"\n *       @ apply=\"updateFilter\"\n *       @ clear=\"clearFilter(updateFilter)\"\n *       @ open=\"openFilter\"\n *       @ reset=\"resetFilter(updateFilter)\"\n *     >\n *          <!-- CONTENT HERE -->\n *     </bento-base-filter>\n * </template>\n * <script>\n *    import { ref } from 'vue'\n *    import { useBentoBaseFilter, BentoBaseFilter, BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n *    type CustomFilterValue = boolean\n *    const props = defineProps<BentoBaseFilterProps<CustomFilterValue>>();\n *\n *    const {\n *       // Values\n *       internalFilterValue,\n *       isSecondaryButtonDisabled,\n *       isApplyButtonDisabled,\n *\n *        // Methods\n *        clearFilter,\n *        resetFilter,\n *        openFilter,\n *    } = useBentoBaseFilter<CustomFilterValue>(toRef(props, 'value'), toRef(props, 'defaultValue'));\n * </script>\n * ```\n *\n * @param appliedFilter The currently applied filter value.\n * @param defaultFilter The default filter value (if available).\n * @returns An object containing refs and functions:\n * - `internalFilterValue`: The temporary state of the filter before it's applied.\n * - `isSecondaryButtonDisabled`: `true` if the secondary (clear/reset) button should be disabled.\n * - `isApplyButtonDisabled`: `true` if the apply button should be disabled.\n * - `clearFilter`: Clears the filter to its initial or default state.\n * - `resetFilter`: Resets the filter to its default state.\n * - `openFilter`: Syncs the internal state with the applied filter.\n */\nexport function useBentoBaseFilter<T>(appliedFilter: Ref<T>, defaultFilter: Ref<T>) {\n    /**\n     * Handles the internal value. Kept in sync when the new value is applied\n     */\n    const internalFilterValue = ref<T>();\n    const initialStructureOrValue = ref<T>();\n\n    onMounted(() => {\n        /**\n         * Copy initial structure as long as the value is not \"undefined\"\n         */\n        if (appliedFilter.value != null) {\n            initialStructureOrValue.value = copyStructure<T>(appliedFilter.value) as T;\n        }\n    });\n\n    watch(\n        () => appliedFilter.value,\n        newValue => {\n            internalFilterValue.value = deepCopy<T>(newValue);\n        },\n        { immediate: true }\n    );\n\n    /**\n     * Indicates if the filter has a value applied (active).\n     * - inactive (`true`): `appliedFilter` is empty (`undefined`) or all of its properties are empty for object values\n     */\n    const isFilterInactive = computed(\n        () => isValueEmpty(appliedFilter.value) || isEqual<T>(appliedFilter.value, initialStructureOrValue.value)\n    );\n\n    /**\n     * Indicates if the secondary (clear/reset) button should be disabled.\n     * - disabled (`true`): No filter value is applied or `appliedFilter` value is the same as the `defaultFilter` (persistent) value\n     */\n    const isSecondaryButtonDisabled = computed(() =>\n        defaultFilter.value != null ? isEqual<T>(defaultFilter.value, appliedFilter.value) : isFilterInactive.value\n    );\n\n    const isApplyButtonDisabled = computed(() => {\n        const isValueUnchanged = isEqual<T>(internalFilterValue.value, appliedFilter.value);\n        return isValueUnchanged || (isValueEmpty(internalFilterValue.value) && isFilterInactive.value);\n    });\n\n    /**\n     * Clears the non-persistent filters (not used in persistent filters).\n     *\n     * Receives a callback to execute additional tasks required when clearing a filter\n     *\n     * - `object`: Sets all properties to `undefined`\n     * - non-`object`: Sets to `undefined`\n     * @param callback Function to be called when clearing a filter\n     */\n    function clearFilter(callback?: (newValue: T) => void) {\n        internalFilterValue.value = deepCopy<T>(initialStructureOrValue.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    /**\n     * Resets the persistent filters (not used in non-persistent filters).\n     * Sets the `internalFilterValue`\n     *\n     * Receives a callback to execute additional tasks required when resetting a filter.\n     * @param callback Function to be called when resetting a filter\n     */\n    function resetFilter(callback?: (newValue: T) => void) {\n        internalFilterValue.value = deepCopy<T>(defaultFilter.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    /**\n     * Sets the value to what is applied when opening a filter.\n     * @param callback Function to be called when opening a filter\n     */\n    function openFilter(callback?: (newValue: T) => void) {\n        // Reset value every time it opens\n        internalFilterValue.value = deepCopy<T>(appliedFilter.value);\n        if (callback) {\n            callback(internalFilterValue.value);\n        }\n    }\n\n    return {\n        // Values\n        internalFilterValue,\n        isSecondaryButtonDisabled,\n        isApplyButtonDisabled,\n\n        // Methods\n        clearFilter,\n        resetFilter,\n        openFilter,\n    };\n}\n","import { type Ref, ref, shallowRef } from 'vue';\nimport * as z from 'zod';\nimport type { ZodSchema } from 'zod';\nimport { type allKeys, type ErrorBag, type UseForm } from './use-form.types';\n\n/**\n * Composable that tansforms a Zod schema into a Typed Schema that can be used alongside with {@see useForm}.\n *\n * This is meant to simulate the behavior of {@link @vee-validate/zod} {@see https://vee-validate.logaretm.com/v4/integrations/zod-schema-validation}.\n * Function that transform Zod’s schemas into something that can be understood by vee-validate\n *\n * @deprecated For usage with Zod/v3. Migrate to Zod/v4 and use `@adyen/bento-vue2/use-form-v4' instead or migrate to Vue3 and use Vee-Validate instead.\n *\n * @param formSchema Zod schema to be transformed into a `vee-validate` schema\n * @returns Schema transformed\n */\nexport function toTypedSchema<T extends ZodSchema>(formSchema: T) {\n    return formSchema;\n}\n\n/**\n * Finds and returns the initial values of each of the values defined in the schema so that they\n * can be transformed into a reactive element.\n * @param schema Zod validation schema containing the definitions of each value to be used in the form\n * @returns Object with the items defined in the schema and their (default) values\n *\n * @example\n * const validationSchema = toTypedSchema(\n *      z.object({\n *          name: z\n *              .string()\n *              .min(3, { message: 'Name is required' })\n *              .startsWith('Jane')\n *              .max(4, { message: 'Name cannot be longer than 4 characters' })\n *              .default('Joe'),\n *      })\n * );\n * getInitialFormValues(validationSchema)\n *\n * Will return:\n *\n * {\n *      name: 'Joe'\n * }\n *\n */\nfunction getInitialFormValues<T extends ZodSchema>(schema: T): z.infer<typeof schema> {\n    if (!!z && schema instanceof z.ZodObject) {\n        return Object.fromEntries(\n            Object.entries(schema.shape).map(([key, value]) => {\n                if (!!z && value instanceof z.ZodDefault) {\n                    // eslint-disable-next-line no-underscore-dangle\n                    return [key, value._def.defaultValue()];\n                }\n\n                if (!!z && value instanceof z.ZodObject) {\n                    return [key, getInitialFormValues(value)];\n                }\n\n                return [key, undefined];\n            })\n        ) as z.infer<typeof schema>;\n    }\n\n    return undefined;\n}\n\n/**\n * Constructs a path with dot paths for arrays to use brackets to be compatible with vee-validate path syntax\n * @param issue List of nested path elements\n * @returns Path with dots\n */\nfunction normalizeFormPath(issue: z.ZodIssue) {\n    return issue.path.join('.');\n}\n\n/**\n * Composable that facilitates validating form data for Vue2 & Vue3 implementations with FormLayout\n * to ease the migration to Vue3.\n *\n * For Vue3 implementations use Vee-Validate.\n *\n * This provides a simplified version of Vee-Validate v4 implemented with Zod to validate a form schema.\n * It returns reactive values that can be used directly in form input elements with 'v-model' alongside\n * with functions to \"reset\" the data (sets values to default value) and a function to execute the\n * successful form validation process (through a callback).\n *\n * @deprecated For usage with Zod/v3. Migrate to Zod/v4 and use `@adyen/bento-vue2/use-form-v4' instead or migrate to Vue3 and use Vee-Validate instead.\n *\n * @param props Form configuration object\n * @param extends ZodSchema} props.validationSchema Zod typed validation schema\n * @returns response - Composable with reactive form values and errors, and functions to handle the reactive data\n * @returns response.errorBag Object with all the form values and an array of each one of the errors (if any) per value\n * @returns response.errors Object with all the form values and the first error found for that field (if any)\n * @returns response.values Object with all the form values and their current value\n * @returns response.handleReset Resets the form values to default (initial values) when it gets called\n * @returns response.submitForm Validates the data set in {response.values} and sets errors (if found) inside {response.errors} and {response.errorBag}.\n *                                                                   When the validation is successful it calls the callback so the submit process can continue\n *\n * @example\n * const validationSchema = toTypedSchema(\n *      z.object({\n *          name: z\n *              .string()\n *              .min(3, { message: 'Name is required' })\n *              .startsWith('Jane')\n *              .max(4, { message: 'Name cannot be longer than 4 characters' })\n *              .default('Joe'),\n *      })\n * );\n *\n * const { values, errors, errorBag, submitForm, handleReset } = useForm({\n *     validationSchema\n * });\n * const handleSubmit = submitForm(() => {\n *     // Send data to API here\n * })\n *\n */\nexport function useForm<T extends ZodSchema>({\n    validationSchema,\n}: UseForm<T>): {\n    errorBag: Ref<{\n        [P in allKeys<(typeof validationSchema)['_type']>]?: Array<string>;\n    }>;\n    errors: Ref<{\n        [P in allKeys<(typeof validationSchema)['_type']>]?: string;\n    }>;\n    values: Ref<(typeof validationSchema)['_type']>;\n    handleReset: () => void;\n    submitForm: (submitted: any) => () => void;\n} {\n    // Errors per field\n    const errors = shallowRef<z.infer<typeof validationSchema>>({});\n    // All errors per field\n    const errorBag: Ref<ErrorBag<z.infer<typeof validationSchema>>> = ref({});\n    const values: Ref<z.TypeOf<T>> = ref(getInitialFormValues<T>(validationSchema));\n\n    const cleanErrors = () => {\n        errors.value = {};\n        errorBag.value = {};\n    };\n\n    const resetForm = () => {\n        cleanErrors();\n        values.value = getInitialFormValues<T>(validationSchema);\n    };\n\n    const submitForm = submitted => () => {\n        cleanErrors();\n\n        // Run validations on the form data through the schema\n        const validSchema = validationSchema.safeParse(values.value);\n\n        // Update errors\n        if (!validSchema.success) {\n            (validSchema as z.SafeParseError<T>).error.issues.forEach(error => {\n                const path = normalizeFormPath(error);\n\n                // Add the first ocurrance of a fild error to the \"errors\" object\n                if (!errors.value[path]) {\n                    errors.value[path] = error.message;\n                }\n\n                // Add each error to the \"errorBag\" per field array\n                if (!errorBag.value[path]) {\n                    errorBag.value[path] = [error.message];\n                } else {\n                    errorBag.value[path].push(error.message);\n                }\n            });\n        } else {\n            submitted(values.value);\n        }\n    };\n\n    return {\n        // Values\n        errorBag,\n        errors,\n        values,\n\n        // Methods\n        handleReset: () => resetForm(),\n        submitForm,\n    };\n}\n","import { type BentoTheme } from './install.types';\n\nexport const useBentoThemeKey = Symbol('use-bento-theme');\n\nexport interface UseBentoTheme {\n    getTheme: () => string;\n    setTheme: (theme: BentoTheme | `${BentoTheme}`) => void;\n}\n","import { printDevelopmentWarning } from '@/utils/ts/print-development-warning';\nimport { getCurrentInstance, inject } from 'vue';\nimport { isVue2 } from 'vue-demi';\nimport { type UseBentoTheme, useBentoThemeKey } from './use-bento-theme.types';\n\n/**\n * Composable that handles theming-related capabilities for the Bento component library.\n * Requires the use of `BentoPlugin`.\n *\n * @example\n * <script setup lang=\"ts\">\n *    import { useBentoTheme, BentoTheme } from '@adyen/bento-vue2';\n *\n *    const { setTheme } = useBentoTheme();\n *\n *    setTheme(BentoTheme.BENTO_DARK)\n * </script>\n *\n * @returns {UseBentoTheme} An object with getter and setter method for the Bento theme.\n * @returns {Function} getTheme - Returns the current theme in the string form of BentoTheme enum.\n * @returns {Function} setTheme - Sets the theme of the Bento component library.\n *\n */\nexport function useBentoTheme(): UseBentoTheme {\n    const bentoThemeController = isVue2\n        ? getCurrentInstance()?.proxy[useBentoThemeKey]\n        : inject(useBentoThemeKey, null);\n\n    if (!bentoThemeController) {\n        printDevelopmentWarning('useBentoTheme does not work without Vue.use(BentoPlugin)');\n\n        // Return placeholder functions so client code won't break, but theme won't toggle\n        return {\n            getTheme: () => undefined,\n            setTheme: () => undefined,\n        };\n    }\n\n    // Return a new object so unintentional reassigning its properties won't override a global state\n    return { ...bentoThemeController };\n}\n","const getSize = ({ modifiers, value }) => Object.keys(modifiers)[0] || value?.size || 'small';\n\nconst toggleHighlight = (el, binding, enabled) => {\n    const extraPadding = binding.value?.extraPadding ?? false;\n    const rounded = binding.value?.rounded ?? false;\n    const size = getSize(binding);\n\n    el.classList.toggle('b-highlight', enabled);\n    el.classList.toggle('b-highlight--extra-padding', enabled && extraPadding);\n    el.classList.toggle('b-highlight--rounded', enabled && rounded);\n\n    ['small', 'medium', 'large'].forEach(s => {\n        el.classList.toggle(`b-highlight--${s}`, enabled && s === size);\n    });\n};\n\nconst applyHighlight = (el, binding) => {\n    toggleHighlight(el, binding, binding.value !== false);\n};\n\nconst updateHighlight = (el, binding) => {\n    toggleHighlight(el, binding, binding.value !== false);\n};\n\nconst removeHighlight = (el, binding) => {\n    toggleHighlight(el, binding, false);\n};\n\nexport const BentoHighlightDirective = {\n    // Vue 2\n    bind: applyHighlight,\n    update: updateHighlight,\n    unbind: removeHighlight,\n\n    // Vue 3\n    beforeMount: applyHighlight,\n    mounted: updateHighlight,\n    updated: updateHighlight,\n    unmounted: removeHighlight,\n};\n\nimport './highlight.scss';\n","import { type App, isVue2, type Vue2 } from 'vue-demi';\nimport { createToastStack, toastStackInjectionKey } from './toast-stack';\n\n/**\n * This function is used to create and register global reactive state necessary fro the Toasts to operate.\n * @param {Vue} Vue A context application to register global state with.\n */\nexport default Vue => {\n    if (isVue2) {\n        // Add toast stack as a global property as there is no \"app.provide\" functionality in Vue2\n        // eslint-disable-next-line no-param-reassign -- this is an official way of setting up instance properties on Vue\n        (Vue as typeof Vue2).prototype[toastStackInjectionKey] = createToastStack();\n    } else {\n        (Vue as App).provide(toastStackInjectionKey, createToastStack());\n    }\n};\n","export enum BentoTheme {\n    /**\n     * @deprecated in favor of {@link BENTO_LIGHT}. To be removed in v2.0.0.\n     */\n    LEGACY = 'b-legacy-theme',\n    STYLEGUIDE = 'b-styleguide-theme',\n\n    /**\n     * @deprecated in favor of {@link BENTO_LIGHT}. To be removed in v2.0.0.\n     */\n    BENTO = '',\n\n    BENTO_LIGHT = 'b-light-theme',\n    BENTO_DARK = 'b-dark-theme',\n    BENTO_SYSTEM = 'b-system',\n}\n","import { type App, isVue2, type Vue2 } from 'vue-demi';\nimport { useBentoThemeKey } from './use-bento-theme.types';\nimport { BentoTheme } from './install.types';\n\nconst getTheme = () => document.body.className.match(/b-\\w+-theme/)?.[0] ?? '';\nconst getThemeForSystemPreference = () => {\n    const preferredDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;\n\n    if (preferredDarkMode) {\n        return BentoTheme.BENTO_DARK;\n    }\n\n    return BentoTheme.BENTO_LIGHT;\n};\n\nexport const setTheme = (theme: BentoTheme) => {\n    const currentTheme = getTheme();\n    const systemTheme = getThemeForSystemPreference();\n    const themeToSet = theme === BentoTheme.BENTO_SYSTEM ? systemTheme : theme;\n\n    if (themeToSet === BentoTheme.BENTO_LIGHT || themeToSet === BentoTheme.BENTO) {\n        document.documentElement.style.colorScheme = 'light';\n    } else if (themeToSet === BentoTheme.BENTO_DARK) {\n        document.documentElement.style.colorScheme = 'dark';\n    }\n\n    // if theme is different from current and it is not `BentoTheme.BENTO`\n    if (currentTheme.length && currentTheme !== themeToSet) {\n        document.body.classList.remove(currentTheme);\n    }\n\n    // if theme is not `BentoTheme.BENTO`\n    if (themeToSet.length) {\n        document.body.classList.add(themeToSet);\n    }\n};\n\n/**\n * This function is used to create and register global reactive state necessary for theme to operate.\n * @param {Vue} Vue A context application to register global state with.\n */\nexport default Vue => {\n    const themeProvider = {\n        getTheme,\n        setTheme,\n    };\n\n    if (isVue2) {\n        // Add theme  as a global property as there is no \"app.provide\" functionality in Vue2\n        // eslint-disable-next-line no-param-reassign -- this is an official way of setting up instance properties on Vue\n        (Vue as typeof Vue2).prototype[useBentoThemeKey] = themeProvider;\n    } else {\n        (Vue as App).provide(useBentoThemeKey, themeProvider);\n    }\n};\n","import installToast from './composables/use-bento-toast-controller/install';\nimport installTheme, { setTheme } from './composables/use-bento-theme/install';\nimport { deprecate } from './utils/ts/deprecate';\nimport { BentoTheme } from './composables/use-bento-theme/install.types';\nimport type { PluginObject } from 'vue';\n\ninterface BentoVuePlugin {\n    theme?: BentoTheme;\n    withToast?: boolean;\n    withUtilityClasses?: boolean;\n    withDesignTokensCSSInjection?: boolean;\n}\n\nconst plugin: PluginObject<BentoVuePlugin> = {\n    name: 'BentoVue',\n    install: async (\n        Vue,\n        {\n            theme = BentoTheme.BENTO_LIGHT,\n            withToast = false,\n            withUtilityClasses = false,\n            withDesignTokensCSSInjection = true,\n        }: BentoVuePlugin\n    ) => {\n        installTheme(Vue);\n\n        if (withToast) {\n            installToast(Vue);\n        }\n        if (withDesignTokensCSSInjection) {\n            deprecate(\n                'Using default setting withDesignTokensCSSInjection set to true in BentoVue plugin',\n                'Please disable CSS injection by setting withDesignTokensCSSInjection to false in BentoVue plugin options as highlighted here:\\nhttps://adyen-bento.netlify.app/?path=/docs/welcome-getting-started--docs#import-css-variables',\n                '2.0.0'\n            );\n            // Make sure to put all awaited CSS imports below this point and not above!\n            if (theme === BentoTheme.STYLEGUIDE) {\n                await import('@adyen/bento-design-tokens/dist/css/bento/variables-styleguide.css');\n            } else {\n                await import('@adyen/bento-design-tokens/dist/css/bento/variables.css');\n            }\n\n            if (withUtilityClasses) {\n                await import('@adyen/bento-design-tokens/dist/css/bento/utility.css');\n            }\n        }\n\n        if (theme === BentoTheme.STYLEGUIDE) {\n            setTheme(BentoTheme.STYLEGUIDE);\n        } else if (theme === BentoTheme.BENTO_SYSTEM) {\n            setTheme(BentoTheme.BENTO_SYSTEM);\n        } else if (theme === BentoTheme.BENTO_DARK) {\n            setTheme(BentoTheme.BENTO_DARK);\n        } else if (theme === BentoTheme.BENTO) {\n            deprecate('Using `BentoTheme.BENTO`', 'Please use `BentoTheme.BENTO_LIGHT` instead', '2.0.0');\n            setTheme(BentoTheme.BENTO_LIGHT);\n        } else {\n            setTheme(BentoTheme.BENTO_LIGHT);\n        }\n    },\n};\n\nexport { BentoTheme };\nexport default plugin;\n","/**\n * Defines the props used by `bento-base-filter` that must be implemented\n * on every filter as `defineProps`.\n *\n * The interface can be extended if new values are required.\n * The object can be extended if new values are required.\n *\n * @template CustomValue Defines the type of the `value` and `defaultValue` props.\n * @template CustomOptions Defines the type of the options used by the filter (default: `undefined`).\n *\n * @example\n * Using the interface\n *\n * ```typescript\n * import { type BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n * interface CustomOptions {\n *      option: string;\n * }\n *\n * withDefaults(defineProps<BentoBaseFilterProps<string, CustomOptions>>(), {\n *    defaultValue: undefined,\n * })\n * ```\n *\n * @example\n * Using the object\n *\n * ```typescript\n * import { BentoBaseFilterProps } from '@adyen/bento-vue2'\n *\n * defineProps({\n *   ...BentoBaseFilterProps,\n *   options: {\n *      type: Object,\n *      default: () => ({\n *          option: null\n *      })\n *   }\n * })\n * ```\n */\nexport interface BentoBaseFilterProps<CustomValue, CustomOptions = undefined> {\n    /**\n     * Disables the filter from being interacted with.\n     */\n    disabled?: boolean;\n\n    /**\n     * Default value of the filter to reset to.\n     */\n    defaultValue?: CustomValue;\n\n    /**\n     * Filter name/key referencing the actual property name in the data set.\n     * Should be unique per filter bar.\n     */\n    field: string;\n\n    /**\n     * Label text to be displayed\n     */\n    label: string;\n\n    /**\n     * Renders the base filter's slot content only - leaving out the button and the popover.\n     * Used for the allFiltersModal component.\n     */\n    onlySlot?: boolean;\n\n    /**\n     * List of options that are needed to setup the filter\n     * Available options:\n     *   - firstDayOfWeek: Allows you to set the first day of the week. 0 is sunday, 1 is monday, 6 is saturday\n     *   - isDateDisabled: Indicate if a date should be disabled or not\n     *   - tooltipPosition: The position of the tooltip attached to the filter button\n     *   - tooltipText: The content of the tooltip attached to the filter button\n     */\n    options?: CustomOptions;\n\n    /**\n     * Current value of the filter\n     */\n    value: CustomValue;\n}\n\nexport const BentoBaseFilterProps = Object.freeze({\n    /**\n     * Disables the filter from being interacted with.\n     */\n    disabled: { type: Boolean, default: false },\n\n    /**\n     * Default value of the filter to reset to.\n     */\n    defaultValue: {\n        type: [Object, Number, Boolean, Array, String, Date],\n        default: null,\n    },\n\n    /**\n     * Filter name/key referencing the actual property name in the data set.\n     * Should be unique per filter bar.\n     */\n    field: { type: String, required: true },\n\n    /**\n     * Label text to be displayed\n     */\n    label: { type: String, required: true },\n\n    /**\n     * Renders the base filter's slot content only - leaving out the button and the popover.\n     * Used for the allFiltersModal component.\n     */\n    onlySlot: { type: Boolean, default: false },\n\n    /**\n     * The current value of the filter, used for v-model.\n     */\n    value: {\n        type: [Object, Number, Boolean, Array, String, Date],\n        default: undefined,\n    },\n});\n\n/**\n * Defines the mandatory emits that need to be defined by the implementation of any filter\n *\n * @template CustomValue Defines the type of the value being passed to the emit. Same as the type set in `BentoBaseFilterProps`\n *\n * @example\n * Using the interface\n *\n * ```typescript\n * import { type BentoBaseFilterEvents } from '@adyen/bento-vue2'\n *\n * defineEmits<BentoBaseFilterEvents<string>>()\n * ```\n *\n * @example\n * Using the object\n *\n * ```typescript\n * import { BentoBaseFilterEvents } from '@adyen/bento-vue2'\n *\n * defineEmits(BentoBaseFilterEvents)\n * ```\n */\nexport interface BentoBaseFilterEvents<CustomValue> {\n    /**\n     * Used in the All filters modal\n     */\n    (e: 'input', newFilterValue: CustomValue): void;\n\n    /**\n     * Used in the Filter Bar\n     */\n    (e: 'update', newFilterValue: CustomValue): void;\n}\n\nexport const BentoBaseFilterEvents = ['input', 'update'];\n"],"names":["isPlainObject","value","isArray","isValueEmpty","el","isEqual","first","second","deepCopy","copyStructure","key","useBentoBaseFilter","appliedFilter","defaultFilter","internalFilterValue","ref","initialStructureOrValue","onMounted","watch","newValue","isFilterInactive","computed","isSecondaryButtonDisabled","isApplyButtonDisabled","clearFilter","callback","resetFilter","openFilter","toTypedSchema","formSchema","getInitialFormValues","schema","z","normalizeFormPath","issue","useForm","validationSchema","errors","shallowRef","errorBag","values","cleanErrors","resetForm","submitted","validSchema","error","path","useBentoThemeKey","useBentoTheme","bentoThemeController","_a","getCurrentInstance","printDevelopmentWarning","getSize","modifiers","toggleHighlight","binding","enabled","extraPadding","rounded","_b","size","s","applyHighlight","updateHighlight","removeHighlight","BentoHighlightDirective","installToast","Vue","toastStackInjectionKey","createToastStack","BentoTheme","BentoTheme2","getTheme","getThemeForSystemPreference","setTheme","theme","currentTheme","systemTheme","themeToSet","installTheme","themeProvider","plugin","withToast","withUtilityClasses","withDesignTokensCSSInjection","deprecate","BentoBaseFilterProps","BentoBaseFilterEvents"],"mappings":"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"}

package/dist/radio-group.js

@@ -1,4 +1,4 @@
-import { b as t, B as e, a as n } from "./chunks/radio-group.B8ukv-pw.js";
+import { b as t, B as e, a as n } from "./chunks/radio-group.0JNwgkZa.js";
 import { R as B } from "./chunks/radio-input.kzb4gxLW.js";
 export {
   t as BentoRadioButton,

package/dist/rich-text-editor.js

@@ -1,4 +1,4 @@
-import { r as t } from "./chunks/rich-text-editor.DzH-Z5oi.js";
+import { r as t } from "./chunks/rich-text-editor.NFLhgVJo.js";
 export {
   t as BentoRichTextEditor
 };

package/dist/selection-card.js

@@ -1,4 +1,4 @@
-import { B as t, s as a, a as n } from "./chunks/selection-card-group.D4rcUyvV.js";
+import { B as t, s as a, a as n } from "./chunks/selection-card-group.u-2Y_9o2.js";
 export {
   t as BentoSelectionCard,
   a as BentoSelectionCardGroup,

package/dist/styles/bento-dark.css

@@ -110,6 +110,9 @@
   --b-input-field-input-box-focus-border-width: 1.5px;
   --b-input-field-input-box-height: 36px;
   --b-input-field-password-validation-title-font-weight: 700;
+  --b-highlight-box-shadow-ripple-color: rgba(0, 161, 82, 0.4);
+  --b-highlight-box-shadow-shadow-color: rgba(0, 161, 82, 0.2);
+  --b-highlight-box-shadow-outline-color: #00a152;
   --b-header-actions-margin-top-desktop: 0;
   --b-header-with-views-all-views-popover-menu-item-dragging-z-index: 1;
   --b-filter-button-label-line-height: 20px;
@@ -1137,6 +1140,8 @@
   --b-input-field-password-validation-list-text-margin-left: var(--b-spacer-040);
   --b-input-field-password-validation-list-gap: var(--b-spacer-060);
   --b-info-icon-color: var(--b-color-label-primary);
+  --b-highlight-extra-padding-inset: calc(0px - var(--b-spacer-030)) calc(0px - var(--b-spacer-040));
+  --b-highlight-rounded-border-radius: var(--b-border-radius-m);
   --b-header-component-title-margin-top: var(--b-spacer-020);
   --b-header-actions-margin-top: var(--b-spacer-070);
   --b-header-timestamp-margin-block: var(--b-spacer-020);

package/dist/styles/bento-light.css

@@ -109,6 +109,9 @@
   --b-input-field-input-box-focus-border-width: 1.5px;
   --b-input-field-input-box-height: 36px;
   --b-input-field-password-validation-title-font-weight: 700;
+  --b-highlight-box-shadow-ripple-color: rgba(0, 161, 82, 0.4);
+  --b-highlight-box-shadow-shadow-color: rgba(0, 161, 82, 0.2);
+  --b-highlight-box-shadow-outline-color: #00a152;
   --b-header-actions-margin-top-desktop: 0;
   --b-header-with-views-all-views-popover-menu-item-dragging-z-index: 1;
   --b-filter-button-label-line-height: 20px;
@@ -1136,6 +1139,8 @@
   --b-input-field-password-validation-list-text-margin-left: var(--b-spacer-040);
   --b-input-field-password-validation-list-gap: var(--b-spacer-060);
   --b-info-icon-color: var(--b-color-label-primary);
+  --b-highlight-extra-padding-inset: calc(0px - var(--b-spacer-030)) calc(0px - var(--b-spacer-040));
+  --b-highlight-rounded-border-radius: var(--b-border-radius-m);
   --b-header-component-title-margin-top: var(--b-spacer-020);
   --b-header-actions-margin-top: var(--b-spacer-070);
   --b-header-timestamp-margin-block: var(--b-spacer-020);

package/dist/styles/bento.css

@@ -109,6 +109,9 @@
   --b-input-field-input-box-focus-border-width: 1.5px;
   --b-input-field-input-box-height: 36px;
   --b-input-field-password-validation-title-font-weight: 700;
+  --b-highlight-box-shadow-ripple-color: rgba(0, 161, 82, 0.4);
+  --b-highlight-box-shadow-shadow-color: rgba(0, 161, 82, 0.2);
+  --b-highlight-box-shadow-outline-color: #00a152;
   --b-header-actions-margin-top-desktop: 0;
   --b-header-with-views-all-views-popover-menu-item-dragging-z-index: 1;
   --b-filter-button-label-line-height: 20px;
@@ -1136,6 +1139,8 @@
   --b-input-field-password-validation-list-text-margin-left: var(--b-spacer-040);
   --b-input-field-password-validation-list-gap: var(--b-spacer-060);
   --b-info-icon-color: var(--b-color-label-primary);
+  --b-highlight-extra-padding-inset: calc(0px - var(--b-spacer-030)) calc(0px - var(--b-spacer-040));
+  --b-highlight-rounded-border-radius: var(--b-border-radius-m);
   --b-header-component-title-margin-top: var(--b-spacer-020);
   --b-header-actions-margin-top: var(--b-spacer-070);
   --b-header-timestamp-margin-block: var(--b-spacer-020);

package/dist/styles/legacy.css

@@ -109,6 +109,9 @@
   --b-input-field-input-box-focus-border-width: 1.5px;
   --b-input-field-input-box-height: 36px;
   --b-input-field-password-validation-title-font-weight: 700;
+  --b-highlight-box-shadow-ripple-color: rgba(0, 161, 82, 0.4);
+  --b-highlight-box-shadow-shadow-color: rgba(0, 161, 82, 0.2);
+  --b-highlight-box-shadow-outline-color: #00a152;
   --b-header-actions-margin-top-desktop: 0;
   --b-header-with-views-all-views-popover-menu-item-dragging-z-index: 1;
   --b-filter-button-label-line-height: 20px;
@@ -1136,6 +1139,8 @@
   --b-input-field-password-validation-list-text-margin-left: var(--b-spacer-040);
   --b-input-field-password-validation-list-gap: var(--b-spacer-060);
   --b-info-icon-color: var(--b-color-label-primary);
+  --b-highlight-extra-padding-inset: calc(0px - var(--b-spacer-030)) calc(0px - var(--b-spacer-040));
+  --b-highlight-rounded-border-radius: var(--b-border-radius-m);
   --b-header-component-title-margin-top: var(--b-spacer-020);
   --b-header-actions-margin-top: var(--b-spacer-070);
   --b-header-timestamp-margin-block: var(--b-spacer-020);

package/dist/styles/styleguide.css

@@ -109,6 +109,9 @@
   --b-input-field-input-box-focus-border-width: 1.5px;
   --b-input-field-input-box-height: 36px;
   --b-input-field-password-validation-title-font-weight: 700;
+  --b-highlight-box-shadow-ripple-color: rgba(0, 161, 82, 0.4);
+  --b-highlight-box-shadow-shadow-color: rgba(0, 161, 82, 0.2);
+  --b-highlight-box-shadow-outline-color: #00a152;
   --b-header-actions-margin-top-desktop: 0;
   --b-header-with-views-all-views-popover-menu-item-dragging-z-index: 1;
   --b-filter-button-label-line-height: 20px;
@@ -1191,6 +1194,8 @@
   --b-input-field-password-validation-list-text-margin-left: var(--b-spacer-040);
   --b-input-field-password-validation-list-gap: var(--b-spacer-060);
   --b-info-icon-color: var(--b-color-label-primary);
+  --b-highlight-extra-padding-inset: calc(0px - var(--b-spacer-030)) calc(0px - var(--b-spacer-040));
+  --b-highlight-rounded-border-radius: var(--b-border-radius-m);
   --b-header-component-title-margin-top: var(--b-spacer-020);
   --b-header-actions-margin-top: var(--b-spacer-070);
   --b-header-timestamp-margin-block: var(--b-spacer-020);

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "@adyen/bento-vue2",
-  "version": "1.77.0",
+  "version": "1.78.0",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -2994,7 +2994,7 @@
         },
         {
           "name": "checkbox-group",
-          "description": "A checkbox group component should be used whenever it is necessary to group a set of checkboxes that are related together\nThis component conforms to the official WAI-ARIA guidelines for grouping controls: https://www.w3.org/WAI/tutorials/forms/grouping/\n\nimport { BentoCheckboxGroup } from '@adyen/bento-vue2/';\n\nexport default {\n    components: { BentoCheckboxGroup },\n    template: `\n            <bento-checkbox-group\n               label=\"Your group label\"\n               :items=\"[\n                   { value: 1, label: 'Your label' },\n                   { value: 2, label: 'Another label', description: 'Your sub label' },\n                ]\"\n             />\n    `\n};",
+          "description": "",
           "attributes": [
             {
               "name": "description",
@@ -3069,7 +3069,7 @@
               }
             },
             {
-              "name": "v-model",
+              "name": "modelValue",
               "description": "Determines the initially selected value of the group. Corresponds to the BentoCheckboxButtonItem's value.\nDefaults to no value selected.",
               "value": {
                 "kind": "expression",
@@ -4579,13 +4579,13 @@
               "default": "undefined"
             },
             {
-              "name": "hasActiveFilters",
-              "description": "If there are any active filters.",
+              "name": "visibleRowsState",
+              "description": "Determines the state of the current results: { filtered: boolean, allItemsVisible: boolean } to render the correct select all menu options",
               "value": {
                 "kind": "expression",
-                "type": "boolean"
+                "type": "BentoDataGridVisibleRowsState"
               },
-              "default": "false"
+              "default": "undefined"
             },
             {
               "name": "hasDraggableColumns",
@@ -5701,6 +5701,16 @@
               },
               "default": "undefined"
             },
+            {
+              "name": "modelValue",
+              "required": false,
+              "description": "Selected date",
+              "value": {
+                "kind": "expression",
+                "type": "union"
+              },
+              "default": "null"
+            },
             {
               "name": "value",
               "required": false,
@@ -5732,6 +5742,16 @@
               "default": "false"
             }
           ],
+          "events": [
+            {
+              "name": "update:model-value",
+              "description": "Emitted when the component's model changes."
+            },
+            {
+              "name": "input",
+              "description": "Emitted when the component's model changes."
+            }
+          ],
           "source": {
             "module": "./src/components/date-range-picker/date-range-picker.vue",
             "symbol": "default"
@@ -5739,7 +5759,7 @@
         },
         {
           "name": "date-range-picker-calendar",
-          "description": "Calendar for range dates. Contains the logic to handle the range forms.",
+          "description": "",
           "attributes": [
             {
               "name": "allowTimeInput",
@@ -5866,6 +5886,14 @@
             "symbol": "default"
           }
         },
+        {
+          "name": "date-range-picker-default-example",
+          "description": "",
+          "source": {
+            "module": "./src/components/date-range-picker/__tests__/date-range-picker-default-example.vue",
+            "symbol": "default"
+          }
+        },
         {
           "name": "decorative-checkbox",
           "description": "",
@@ -13048,12 +13076,12 @@
           ],
           "events": [
             {
-              "name": "input",
-              "description": "Emitted when an option inside the group is selected. Enables Vue2 \"v-model\""
+              "name": "update:model-value",
+              "description": "Emitted when the component's model changes."
             },
             {
-              "name": "update:model-value",
-              "description": "Emitted when an option inside the group is selected. Enables Vue3 \"v-model\""
+              "name": "input",
+              "description": "Emitted when the component's model changes."
             }
           ],
           "slots": [
@@ -14279,12 +14307,12 @@
           ],
           "events": [
             {
-              "name": "input",
-              "description": "Emitted when the selection card is clicked. Enables Vue2 \"v-model\""
+              "name": "update:model-value",
+              "description": "Emitted when the component's model changes."
             },
             {
-              "name": "update:model-value",
-              "description": "Emitted when the selection card is clicked. Enables Vue3 \"v-model\""
+              "name": "input",
+              "description": "Emitted when the component's model changes."
             }
           ],
           "slots": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adyen/bento-vue2",
-  "version": "1.77.0",
+  "version": "1.78.0",
   "description": "Adyen Bento Vue2 components",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -48,7 +48,7 @@
     "unified": "11.0.5",
     "uuid": "11.0.5",
     "vue-demi": "0.14.10",
-    "@adyen/bento-design-tokens": "1.77.0"
+    "@adyen/bento-design-tokens": "1.78.0"
   },
   "dependenciesMeta": {
     "@adyen/bento-vue-i18n-demi": {
@@ -127,12 +127,12 @@
     "vue-style-loader": "4.1.3",
     "vue-template-compiler": "2.7.16",
     "vue-tsc": "1.0.24",
-    "@adyen/bento-cli": "0.7.2",
+    "@adyen/bento-cli": "0.7.3",
     "@adyen/bento-core": "0.0.1",
-    "@adyen/bento-tailwind": "0.7.2",
+    "@adyen/bento-tailwind": "0.7.3",
     "@adyen/bento-vue-i18n-demi": "0.1.0",
-    "@adyen/ui-assets-icons-16": "7.3.2",
-    "@adyen/ui-assets-payment-method-icons": "10.4.2"
+    "@adyen/ui-assets-icons-16": "7.3.3",
+    "@adyen/ui-assets-payment-method-icons": "10.4.3"
   },
   "optionalDependencies": {
     "vue-router": "~3.6"

package/dist/chunks/checkbox-group.C3RH5Gcg.js

@@ -1,152 +0,0 @@
-import { defineComponent as y, toRef as _, computed as l, watch as c, ref as v } from "vue";
-import { a as n, B as E } from "./checkbox.itbBlXev.js";
-import { g as x } from "./generate-uid.NJ8tVoha.js";
-import { d as k } from "./typography.hlOAxsEn.js";
-import { u as C } from "./use-form-layout-loading.D3lALhtC.js";
-import { E as S } from "./field-label.Auq-Pzho.js";
-import { C as M } from "./controls-group.82mB_GDw.js";
-import { n as I } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
-import "../assets/checkbox-group.css";
-var s = /* @__PURE__ */ ((r) => (r.HORIZONTAL = "horizontal", r.VERTICAL = "vertical", r))(s || {});
-const p = "bento-checkbox-group", T = y({
-  name: p,
-  components: { BentoCheckbox: E, ControlsGroup: M, ErrorMessage: S },
-  model: { prop: "modelValue" },
-  props: {
-    /**
-     * Descriptive supporting text visbile underneath the label.
-     */
-    description: { type: String, default: null },
-    /**
-     * If set to true, renders all checkboxes in the group in a disabled state.
-     */
-    disabled: { type: Boolean, default: !1 },
-    /**
-     * Renders all checkboxes in an error state with an error message.
-     */
-    errorMessage: { type: String, default: null },
-    /**
-     * The form id the checkbox group is associated with. Defaults to null, as a checkbox group can also be used standalone.
-     */
-    formId: { type: String, default: null },
-    /**
-     * If set to true, renders all checkboxes in the group in an error state.
-     *
-     * @deprecated Use "errorMessage" prop instead
-     */
-    hasError: { type: Boolean, default: !1 },
-    /**
-     * Shows/hides the group label.
-     */
-    hideLabel: { type: Boolean, default: null },
-    /**
-     * The checkbox group's items.
-     */
-    items: { type: Array, required: !0 },
-    /**
-     * The name associated with the group. Required for accessibility purposes.
-     */
-    label: { type: String, required: !0 },
-    /**
-     * Determines the initially selected value of the group. Corresponds to the BentoCheckboxButtonItem's value.
-     * Defaults to no value selected.
-     */
-    modelValue: { type: Array, default: () => [] },
-    /**
-     * Indicates the field is optional.
-     */
-    optional: { type: Boolean, default: !1 },
-    /**
-     * If set to true, renders all checkboxes in the group in a readonly state.
-     */
-    readonly: { type: Boolean, default: !1 },
-    /**
-     * Indicates the field is required.
-     */
-    required: { type: Boolean, default: !1 },
-    /**
-     * Tooltip message.
-     */
-    tooltipText: { type: String, default: null },
-    /**
-     * The checkbox group's layout. It can be vertical or horizontal. Defaults to vertical.
-     */
-    variant: {
-      type: String,
-      default: s.VERTICAL,
-      validator: (r) => Object.values(s).includes(r)
-    }
-  },
-  emits: [n.UPDATE, n.INPUT],
-  setup(r, { emit: e, slots: a }) {
-    const o = x("error"), { isReadOnly: u } = C(_(r, "readonly")), f = l(
-      () => !r.disabled && !u.value && (!!r.errorMessage || r.hasError)
-    ), h = l(
-      () => !r.disabled && !u.value && !!r.errorMessage
-    ), b = l(() => ({
-      "b-checkbox-group__checkboxes--horizontal": r.variant === s.HORIZONTAL
-    })), i = (t) => !!a[t], m = l(() => i("content") && r.variant !== "vertical");
-    c(
-      m,
-      (t) => {
-        if (t)
-          throw new Error("The content slot is only available for the vertical checkbox group layout");
-      },
-      { immediate: !0 }
-    );
-    const d = v(r.modelValue);
-    c(
-      () => r.modelValue,
-      () => {
-        d.value = r.modelValue;
-      }
-    );
-    const g = (t) => {
-      d.value = t, e(n.UPDATE, t), e(n.INPUT, t);
-    };
-    return r.hasError && k(
-      'BentoCheckboxGroup "hasError" property',
-      `Use the BentoCheckboxGroup "errorMessage" property instead to indicate that there is a modifier error.
-                    Having the field as "undefined" will hide/remove the error.
-                    <bento-checkbox-group errorMessage="Error message text" />`,
-      "2.0.0"
-    ), {
-      // Values
-      COMPONENT_NAME: p,
-      errorId: o,
-      isReadOnly: u,
-      shouldShowGroupError: f,
-      shouldShowGroupErrorMessage: h,
-      conditionalClasses: b,
-      inputValue: d,
-      hasContentSlot: i,
-      // Methods
-      onInput: g
-    };
-  }
-});
-var w = function() {
-  var e = this, a = e._self._c;
-  return e._self._setupProxy, a("div", { staticClass: "b-checkbox-group" }, [a("controls-group", { staticClass: "b-checkbox-group__checkboxes", class: e.conditionalClasses, attrs: { "aria-describedby": e.shouldShowGroupErrorMessage ? e.errorId : "", "component-name": e.COMPONENT_NAME, description: e.description, disabled: e.disabled, form: e.formId, "hide-label": e.hideLabel, label: e.label, optional: e.optional, required: e.required, "tooltip-text": e.tooltipText } }, e._l(e.items, function(o) {
-    return a("bento-checkbox", { key: o.value, attrs: { "model-value": e.inputValue, value: o.value, disabled: e.disabled || o.disabled, "has-error": e.shouldShowGroupError || o.hasError, "error-message": e.shouldShowGroupError ? null : o.errorMessage, readonly: e.isReadOnly || o.readonly, tag: o.tag }, on: { "update:model-value": e.onInput }, scopedSlots: e._u([{ key: "default", fn: function() {
-      return [e._v(e._s(o.label))];
-    }, proxy: !0 }, o.description ? { key: "description", fn: function() {
-      return [e._v(e._s(o.description))];
-    }, proxy: !0 } : null, e.hasContentSlot("content") ? { key: "content", fn: function() {
-      return [e._t("content", null, null, o)];
-    }, proxy: !0 } : null], null, !0) });
-  }), 1), e.shouldShowGroupErrorMessage ? a("error-message", { staticClass: "b-checkbox-group__error-message", attrs: { id: e.errorId, "error-message": e.errorMessage } }) : e._e()], 1);
-}, B = [], O = /* @__PURE__ */ I(
-  T,
-  w,
-  B,
-  !1,
-  null,
-  "66fbd49c"
-);
-const q = O.exports;
-export {
-  s as B,
-  q as c
-};
-//# sourceMappingURL=checkbox-group.C3RH5Gcg.js.map