@adyen/bento-vue3 1.40.0 → 1.42.0

package/dist/@types/packages/vue2/src/components/image/image.vue.d.ts

@@ -1,74 +1,45 @@
-import { PropType } from "../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
-import { BentoImageAspectRatio, BentoImageObjectFit } from './image.types';
-declare const _default: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
-    /**
-     * Url to image, same as src attribute of `<img>` tag
-     */
-    src: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Accessible text describing the image, same as alt attribute of `<img>` tag
-     */
-    alt: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Aspect ratio of the image, maps to css aspect-ratio
-     */
-    aspectRatio: {
-        type: PropType<BentoImageAspectRatio | `${BentoImageAspectRatio}`>;
-        default: any;
-        validator: (value: BentoImageAspectRatio) => boolean;
-    };
-    /**
-     * Object fitting strategy, maps to css object-fit
-     */
-    objectFit: {
-        type: PropType<BentoImageObjectFit | `${BentoImageObjectFit}`>;
-        default: any;
-        validator: (value: BentoImageObjectFit) => boolean;
-    };
-}>, {
-    imageStyles: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComputedRef<{
-        aspectRatio: string;
-        objectFit: "fill" | "contain" | "cover" | BentoImageObjectFit;
-    }>;
-}, {}, {}, {}, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
-    /**
-     * Url to image, same as src attribute of `<img>` tag
-     */
-    src: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Accessible text describing the image, same as alt attribute of `<img>` tag
-     */
-    alt: {
-        type: StringConstructor;
-        required: true;
-    };
-    /**
-     * Aspect ratio of the image, maps to css aspect-ratio
-     */
-    aspectRatio: {
-        type: PropType<BentoImageAspectRatio | `${BentoImageAspectRatio}`>;
-        default: any;
-        validator: (value: BentoImageAspectRatio) => boolean;
-    };
-    /**
-     * Object fitting strategy, maps to css object-fit
-     */
-    objectFit: {
-        type: PropType<BentoImageObjectFit | `${BentoImageObjectFit}`>;
-        default: any;
-        validator: (value: BentoImageObjectFit) => boolean;
-    };
-}>> & Readonly<{}>, {
-    aspectRatio: "square" | "landscape" | "4:3" | "3:3" | "16:9" | "2:1" | "portrait" | "3:4" | "2:3" | "9:16" | "1:2" | "1:1" | BentoImageAspectRatio;
-    objectFit: "fill" | "contain" | "cover" | BentoImageObjectFit;
+import { BentoImageAspectRatio, BentoImageProps } from '@adyen/bento-core/src/components/image/image.types';
+/**
+ * Image component used for resizing images to certain aspect ratios and fit strategies.
+ *
+ * @example
+ * import { BentoImage } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoImage },
+ *     template: `
+ *       <bento-image
+ *           :src="imageSrc"
+ *           alt="alternative text"
+ *           aspect-ratio="landscape"
+ *           object-fit="cover"
+ *
+ *       />
+ *     `
+ * }
+ */
+declare const _default: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoImageProps>, {
+    aspectRatio: any;
+    objectFit: any;
+}>>, {}, {}, {}, {}, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoImageProps>, {
+    aspectRatio: any;
+    objectFit: any;
+}>>> & Readonly<{}>, {
+    aspectRatio: BentoImageAspectRatio | `${BentoImageAspectRatio}` | null;
+    objectFit: import("@adyen/bento-core/src/components/image/image.types").BentoImageObjectFit | `${import("@adyen/bento-core/src/components/image/image.types").BentoImageObjectFit}` | null;
 }, {}, {}, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};

package/dist/@types/packages/vue2/src/components/image/index.d.ts

@@ -1,2 +1,2 @@
 export { default as BentoImage } from './image.vue';
-export * from './image.types';
+export * from '@adyen/bento-core/src/components/image/image.types';

package/dist/@types/packages/vue2/src/components/input-field/input-field.vue.d.ts

@@ -180,6 +180,8 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
     focus: () => void;
 } & {
     keydown: (event: KeyboardEvent) => void;
+} & {
+    keyup: (event: KeyboardEvent) => void;
 } & {
     input: (inputValue: string) => void;
 }, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
@@ -333,6 +335,7 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modu
     onFocus?: () => any;
     onInput?: (inputValue: string) => any;
     onKeydown?: (event: KeyboardEvent) => any;
+    onKeyup?: (event: KeyboardEvent) => any;
     "onEscape-pressed"?: () => any;
     "onUpdate:dropdown"?: (updatedDropdownProps: BentoInputDropdownProps) => any;
     "onDropdown-input"?: (selectedValue: BentoListboxSelectedValue) => any;

package/dist/@types/packages/vue2/src/components/input-field-password/index.d.ts

@@ -0,0 +1,3 @@
+export { default as BentoInputFieldPassword } from './input-field-password.vue';
+export * from './utilities/input-field-password.validation';
+export type { BentoInputFieldPasswordValidationListItem, BentoInputFieldPasswordValidation, BentoInputFieldPasswordProps, } from './input-field-password.types';

package/dist/@types/packages/vue2/src/components/input-field-password/input-field-password.types.d.ts

@@ -0,0 +1,77 @@
+import { BentoInputField, BentoInputFieldValue } from "../input-field";
+/**
+ * Public
+ */
+export interface BentoInputFieldPasswordValidationListItem {
+    label: string;
+    validate: (value: BentoInputFieldValue, ...args: any[]) => boolean;
+    additionalArgs?: any[];
+}
+export interface BentoInputFieldPasswordValidation {
+    title?: string;
+    suggestion?: string;
+    list: BentoInputFieldPasswordValidationListItem[];
+}
+export interface BentoInputFieldPasswordProps {
+    /**
+     * Reduces height of the input
+     */
+    condensed?: BentoInputFieldProps['condensed'];
+    /**
+     * Disables the possibility of changing value in the input-field
+     */
+    disabled?: BentoInputFieldProps['disabled'];
+    /**
+     * Renders input-field with an error state and the error message beneath the input box
+     */
+    errorMessage?: BentoInputFieldProps['errorMessage'];
+    /**
+     * Text displayed as the placeholder of the input-field
+     */
+    placeholder?: BentoInputFieldProps['placeholder'];
+    /**
+     * Setting this property to true will set the input field to read only state.
+     */
+    readonly?: BentoInputFieldProps['readonly'];
+    /**
+     * Text displayed as the value of the input-field
+     */
+    value?: BentoInputFieldProps['value'];
+    /**
+     * Label to be shown with the input field
+     */
+    label?: string;
+    /**
+     * Configuration object for password field validation.
+     *
+     * This object defines the validation criteria and associated messages for a password field.
+     * It includes the following properties:
+     *
+     * - `title`: The title displayed at the top of the validation hint.
+     * - `suggestion`: The message displayed at the bottom of the validation hint, providing additional guidance.
+     * - `list`: An array of callback functions to be executed on the value after each user input, validating the password against the specified rules.
+     *
+     * By default, the validation checks that:
+     *
+     * - The value has a minimum length of 8 characters.
+     * - The value contains at least one lowercase letter.
+     * - The value contains at least one uppercase letter.
+     * - The value contains at least one numeric digit.
+     * - The value contains at least one special character.
+     *
+     *
+     */
+    validation?: BentoInputFieldPasswordValidation;
+    /**
+     * Whether the password validation hint is displayed when the input field is activated via focus or input
+     */
+    withHint?: boolean;
+}
+/**
+ * Private
+ */
+export declare enum BentoInputFieldPasswordType {
+    TEXT = "text",
+    PASSWORD = "password"
+}
+export type BentoInputFieldProps = InstanceType<typeof BentoInputField>['$props'];

package/dist/@types/packages/vue2/src/components/input-field-password/input-field-password.vue.d.ts

@@ -0,0 +1,90 @@
+import { BentoInputFieldPasswordProps, BentoInputFieldProps } from './input-field-password.types';
+/**
+ * The input field password is a component designed to support users' preference for entering values securely.
+ * This is an extension of the `bento-input-field` component.
+ *
+ * @example
+ * import { BentoInputFieldPassword } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoInputFieldPassword },
+ *     template: `
+ *          <bento-input-field-password
+ *              label="Label"
+ *              error-message="Error"
+ *              :validation="{
+ *                  title: 'Password must contain at least:',
+ *                  suggestion: 'Avoid using currency symbols or accented letters.',
+ *                  list: [
+ *                      { label: '8 characters', validate: minLength, additionalArgs: [8] },
+ *                      { label: '1 lowercase (a-z)', validate: requireLowercase },
+ *                      { label: '1 uppercase (A-Z)', validate: requireUppercase },
+ *                      { label: '1 numerical (0-9)', validate: requireNumeric },
+ *                      { label: '1 special character', validate: requireSpecialCharacter },
+ *                      {
+ *                          label: 'Always true',
+ *                          validate: () => {
+ *                              const example = 'Example';
+ *
+ *                              return () => example.length > 1;
+ *                          },
+ *                      },
+ *                  ],
+ *              }"
+ *          />
+ *     `
+ * }
+ */
+declare const _default: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoInputFieldPasswordProps>, {
+    condensed: boolean;
+    disabled: boolean;
+    label: any;
+    errorMessage: any;
+    placeholder: string;
+    readonly: boolean;
+    validation: any;
+    value: any;
+    withHint: boolean;
+}>>, {}, {}, {}, {}, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {
+    "input:valid": () => void;
+} & {
+    input: (value: import("../input-field").BentoInputFieldValue) => void;
+}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoInputFieldPasswordProps>, {
+    condensed: boolean;
+    disabled: boolean;
+    label: any;
+    errorMessage: any;
+    placeholder: string;
+    readonly: boolean;
+    validation: any;
+    value: any;
+    withHint: boolean;
+}>>> & Readonly<{
+    onInput?: (value: import("../input-field").BentoInputFieldValue) => any;
+    "onInput:valid"?: () => any;
+}>, {
+    value: BentoInputFieldProps["value"];
+    label: string;
+    condensed: BentoInputFieldProps["condensed"];
+    disabled: BentoInputFieldProps["disabled"];
+    validation: import("./input-field-password.types").BentoInputFieldPasswordValidation;
+    errorMessage: BentoInputFieldProps["errorMessage"];
+    readonly: BentoInputFieldProps["readonly"];
+    placeholder: BentoInputFieldProps["placeholder"];
+    withHint: boolean;
+}, {}, {}, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};

package/dist/@types/packages/vue2/src/components/input-field-password/utilities/input-field-password.validation.d.ts

@@ -0,0 +1,37 @@
+import { BentoInputFieldValue } from "../../input-field";
+/**
+ * Validates if the length of the provided value is greater than or equal to the specified length.
+ *
+ * @param value - The input value to check.
+ * @param length - The minimum required length of the value. Defaults to 8.
+ * @returns `true` if the length of the value is greater than or equal to the specified length, `false` otherwise.
+ */
+export declare function minLength(value: BentoInputFieldValue, length?: number): boolean;
+/**
+ * Validates if the provided value contains at least one lowercase letter.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one lowercase letter, `false` otherwise.
+ */
+export declare function requireLowercase(value: BentoInputFieldValue): boolean;
+/**
+ * Validates if the provided value contains at least one uppercase letter.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one uppercase letter, `false` otherwise.
+ */
+export declare function requireUppercase(value: BentoInputFieldValue): boolean;
+/**
+ * Validates if the provided value contains at least one numerical digit.
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one numerical digit, `false` otherwise.
+ */
+export declare function requireNumeric(value: BentoInputFieldValue): boolean;
+/**
+ * Validates if the provided value contains at least one special character (non-alphanumeric).
+ *
+ * @param value - The input value to check.
+ * @returns `true` if the value contains at least one special character, `false` otherwise.
+ */
+export declare function requireSpecialCharacter(value: BentoInputFieldValue): boolean;

package/dist/@types/packages/vue2/src/components/internal/tooltip/tooltip.vue.d.ts

@@ -1,6 +1,6 @@
 import { PropType } from "../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue";
 import { BentoTooltipPosition } from "../../../../../core/src/components/tooltip/tooltip.types";
-import { PopperContainerAriaRole } from "../../popper-container";
+import { FallbackPositionProp, PopperContainerAriaRole } from "../../popper-container";
 import { VueNodeElement } from "../../../types";
 /**
  * Tooltip container, to be used internally to render the tooltip container where the text is shown.
@@ -53,12 +53,28 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Allows to configure to fallback position to the one specified, it could be 'auto' or ['right', 'top', ...].
+     * Useful when not using auto as starting placement.
+     * @see {@link https://floating-ui.com/docs/flip#fallbackplacements}
+     */
+    fallbackPosition: {
+        type: PropType<FallbackPositionProp>;
+        default: () => string[];
+    };
+    /**
+     * Disables focus-trap for tooltip.
+     * Useful for maintaining focus on the target element.
+     */
+    disabledFocusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {
     PopperContainerAriaRole: typeof PopperContainerAriaRole;
     conditionalClasses: import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComputedRef<{
         "b-tooltip--hidden": boolean;
     }>;
-    tabIndex: import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComputedRef<number>;
 }, {}, {}, {}, import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
     /**
      * The tooltip's id. Necessary for accessibility purposes.
@@ -107,11 +123,30 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Allows to configure to fallback position to the one specified, it could be 'auto' or ['right', 'top', ...].
+     * Useful when not using auto as starting placement.
+     * @see {@link https://floating-ui.com/docs/flip#fallbackplacements}
+     */
+    fallbackPosition: {
+        type: PropType<FallbackPositionProp>;
+        default: () => string[];
+    };
+    /**
+     * Disables focus-trap for tooltip.
+     * Useful for maintaining focus on the target element.
+     */
+    disabledFocusTrap: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{}>, {
     id: string;
     position: import("../../popper-container").PopperContainerPositionBasic;
     isShown: boolean;
     offset: number;
+    disabledFocusTrap: boolean;
+    fallbackPosition: FallbackPositionProp;
 }, {}, {
     BentoTypography: {
         new (...args: any[]): import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").CreateComponentPublicInstanceWithMixins<Readonly<import("../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<{
@@ -287,7 +322,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
                 default: boolean;
             };
             fallbackPosition: {
-                type: PropType<import("../../popper-container").FallbackPositionProp>;
+                type: PropType<FallbackPositionProp>;
                 default: any;
             };
             fixedPositioning: {
@@ -349,7 +384,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
             ariaRole: PopperContainerAriaRole;
             arrow: any;
             disabledFocusTrap: boolean;
-            fallbackPosition: import("../../popper-container").FallbackPositionProp;
+            fallbackPosition: FallbackPositionProp;
             fixedPositioning: boolean;
             isHidden: boolean;
             matchWidth: boolean;
@@ -390,7 +425,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
                 default: boolean;
             };
             fallbackPosition: {
-                type: PropType<import("../../popper-container").FallbackPositionProp>;
+                type: PropType<FallbackPositionProp>;
                 default: any;
             };
             fixedPositioning: {
@@ -450,7 +485,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
             ariaRole: PopperContainerAriaRole;
             arrow: any;
             disabledFocusTrap: boolean;
-            fallbackPosition: import("../../popper-container").FallbackPositionProp;
+            fallbackPosition: FallbackPositionProp;
             fixedPositioning: boolean;
             isHidden: boolean;
             matchWidth: boolean;
@@ -488,7 +523,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
             default: boolean;
         };
         fallbackPosition: {
-            type: PropType<import("../../popper-container").FallbackPositionProp>;
+            type: PropType<FallbackPositionProp>;
             default: any;
         };
         fixedPositioning: {
@@ -536,7 +571,7 @@ declare const _default: import("../../../../../../node_modules/.pnpm/vue@3.5.13_
         ariaRole: PopperContainerAriaRole;
         arrow: any;
         disabledFocusTrap: boolean;
-        fallbackPosition: import("../../popper-container").FallbackPositionProp;
+        fallbackPosition: FallbackPositionProp;
         fixedPositioning: boolean;
         isHidden: boolean;
         matchWidth: boolean;

package/dist/@types/packages/vue2/src/components/layout/components/layout-row/layout-row.vue.d.ts

@@ -0,0 +1,54 @@
+import { type BentoLayoutRowProps } from '../../layout.types';
+/**
+ * Page row is subcomponent of Layout meant to be used to generate the row layout.
+ *
+ * @example
+ * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoLayout, BentoLayoutRow },
+ *     template: `
+ *          <bento-layout>
+ *              <bento-layout-row columns-layout="3-9">
+ *                  <template #col-1>Narrow 3-9</template>
+ *                  <template #col-2>Wide 3-9</template>
+ *              </bento-layout-row>
+ *              <bento-layout-row>
+ *                  <template #col-1>6-6</template>
+ *                  <template #col-2>6-6</template>
+ *              </bento-layout-row>
+ *          </bento-layout>
+ *     `
+ * }
+ */
+declare const _default: __VLS_WithTemplateSlots<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoLayoutRowProps>, {
+    columnsLayout: string;
+}>>, {}, {}, {}, {}, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoLayoutRowProps>, {
+    columnsLayout: string;
+}>>> & Readonly<{}>, {
+    columnsLayout: import("../../layout.types").BentoLayoutRowColumnLayout;
+}, {}, {}, {}, string, import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>, {
+    default: (_: {}) => any;
+    'col-1': (_: {}) => any;
+    'col-2': (_: {}) => any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/@types/packages/vue2/src/components/layout/index.d.ts

@@ -0,0 +1,3 @@
+export { default as BentoLayout } from './layout.vue';
+export { default as BentoLayoutRow } from './components/layout-row/layout-row.vue';
+export type { BentoLayoutVariant, BentoLayoutSize, BentoLayoutRowColumnLayout, BentoLayoutProps, BentoLayoutRowProps, } from './layout.types';

package/dist/@types/packages/vue2/src/components/layout/layout.keys.d.ts

@@ -0,0 +1 @@
+export declare const LAYOUT_SIZE_INJECTION_KEY: unique symbol;

package/dist/@types/packages/vue2/src/components/layout/layout.types.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @private
+ */
+export declare const BentoLayoutVariantOptions: readonly ["page", "component"];
+export declare const BentoLayoutSizeOptions: readonly ["full-width", "narrow", "half-width"];
+export declare const BentoLayoutRowColumnLayoutOptions: readonly ["3-9", "9-3", "4-8", "8-4", "6-6"];
+export type BentoLayoutVariant = (typeof BentoLayoutVariantOptions)[number];
+export type BentoLayoutSize = (typeof BentoLayoutSizeOptions)[number];
+export type BentoLayoutRowColumnLayout = (typeof BentoLayoutRowColumnLayoutOptions)[number];
+export interface BentoLayoutProps {
+    /** Defines if the layout is used in a page or only a section */
+    variant?: BentoLayoutVariant;
+    /** Defines the size of the page */
+    size?: BentoLayoutSize;
+}
+export interface BentoLayoutRowProps {
+    /** Sets the layout of the columns when multiple columns are used */
+    columnsLayout?: BentoLayoutRowColumnLayout;
+}

package/dist/@types/packages/vue2/src/components/layout/layout.vue.d.ts

@@ -0,0 +1,53 @@
+import { BentoLayoutProps } from './layout.types';
+/**
+ * Layout is a basic scaffolding of a page that defines spacing, some functionality and responsive behaviour of its top level sections.
+ *
+ * @example
+ * import { BentoLayout, BentoLayoutRow } from '@adyen/bento-vue2';
+ *
+ * export default {
+ *     components: { BentoLayout, BentoLayoutRow },
+ *     template: `
+ *          <bento-layout size="narrow">
+ *              <bento-layout-row>
+ *                  Row 1
+ *              </bento-layout-row>
+ *              <bento-layout-row>
+ *                  Row 2
+ *              </bento-layout-row>
+ *          </bento-layout>
+ *     `
+ * }
+ */
+declare const _default: __VLS_WithTemplateSlots<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").DefineComponent<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoLayoutProps>, {
+    size: string;
+    variant: string;
+}>>, {}, {}, {}, {}, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PublicProps, Readonly<import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<BentoLayoutProps>, {
+    size: string;
+    variant: string;
+}>>> & Readonly<{}>, {
+    variant: import("./layout.types").BentoLayoutVariant;
+    size: import("./layout.types").BentoLayoutSize;
+}, {}, {}, {}, string, import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").ComponentProvideOptions, true, {}, any>, {
+    default: (_: {}) => any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../../node_modules/.pnpm/vue@3.5.13_typescript@5.6.3/node_modules/vue").PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? P[K] & {
+        default: D[K];
+    } : P[K];
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};