@adyen/bento-vue3 1.26.0 → 1.27.0

package/dist/@types/components.d.ts

@@ -18,6 +18,8 @@ import {
     BentoCodeSnippet,
     BentoCountry,
     BentoCurrency,
+    BentoDashboardSection,
+    BentoDashboardTemplate,
     BentoDataGrid,
     BentoDataGridTemplate,
     BentoDate,
@@ -105,6 +107,8 @@ declare module 'vue' {
         BentoCountry: typeof BentoCountry;
         BentoCodeSnippet: typeof BentoCodeSnippet;
         BentoCurrency: typeof BentoCurrency;
+        BentoDashboardSection: typeof BentoDashboardSection;
+        BentoDashboardTemplate: typeof BentoDashboardTemplate;
         BentoDataGrid: typeof BentoDataGrid;
         BentoDataGridTemplate: typeof BentoDataGridTemplate;
         BentoDate: typeof BentoDate;

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

@@ -0,0 +1,12 @@
+export declare const storybookDocsParameter: (codeSource: string, language?: string) => {
+    docs: {
+        source: {
+            code: string;
+            language: string;
+        };
+    };
+};
+export declare const getPokemonFromApi: (pokemonName?: string) => Promise<{
+    label: any;
+    value: any;
+}[]>;

package/dist/@types/packages/vue2/src/components/button/components/button-actions/button-actions.types.d.ts

@@ -7,6 +7,7 @@ export interface BentoButtonActionObject extends BentoButtonProps {
     iconLeft?: VueNodeElement;
     iconRight?: VueNodeElement;
     state?: BentoLoadingButtonState | `${BentoLoadingButtonState}`;
+    iconOnly?: boolean;
 }
 export type BentoButtonActionsList = Array<BentoButtonActionObject>;
 export declare enum BentoButtonActionsLayoutBasic {

package/dist/@types/packages/vue2/src/components/button/components/button-actions/button-actions.vue.d.ts

@@ -1,7 +1,7 @@
 import { PropType } from "../../../../../../vue3/node_modules/vue";
 import { BentoButtonActionsLayout, BentoButtonActionsList } from './button-actions.types';
 /**
- * ButtonActions component component manages a set of actions a user can choose from by displaying a group of buttons.
+ * ButtonActions component manages a set of actions a user can choose from by displaying a group of buttons.
  *
  * @example
  * import { BentoButtonActions } from '@adyen/bento-vue2';

package/dist/@types/packages/vue2/src/components/code-snippet/code-snippet.types.d.ts

@@ -13,7 +13,8 @@ export declare enum BentoCodeSnippetSupportedLanguage {
     JSON = "json",
     XML = "xml",
     JAVA = "java",
-    JAVASCRIPT = "javascript"
+    JAVASCRIPT = "javascript",
+    PYTHON = "python"
 }
 export declare enum BentoCodeSnippetEvent {
     ACTION = "action",

package/dist/@types/packages/vue2/src/components/code-snippet/code-snippet.vue.d.ts

@@ -28,7 +28,7 @@ declare const _default: import("../../../../vue3/node_modules/vue").DefineCompon
      * Language name for syntax highlighting rules
      */
     lang: {
-        type: PropType<"json" | "xml" | "java" | "javascript" | BentoCodeSnippetSupportedLanguage>;
+        type: PropType<"json" | "xml" | "java" | "javascript" | "python" | BentoCodeSnippetSupportedLanguage>;
         default: BentoCodeSnippetSupportedLanguage;
         validator: (value: BentoCodeSnippetSupportedLanguage) => boolean;
     };
@@ -117,7 +117,7 @@ declare const _default: import("../../../../vue3/node_modules/vue").DefineCompon
      * Language name for syntax highlighting rules
      */
     lang: {
-        type: PropType<"json" | "xml" | "java" | "javascript" | BentoCodeSnippetSupportedLanguage>;
+        type: PropType<"json" | "xml" | "java" | "javascript" | "python" | BentoCodeSnippetSupportedLanguage>;
         default: BentoCodeSnippetSupportedLanguage;
         validator: (value: BentoCodeSnippetSupportedLanguage) => boolean;
     };
@@ -181,7 +181,7 @@ declare const _default: import("../../../../vue3/node_modules/vue").DefineCompon
     content: string;
     loading: boolean;
     expandable: boolean;
-    lang: "json" | "xml" | "java" | "javascript" | BentoCodeSnippetSupportedLanguage;
+    lang: "json" | "xml" | "java" | "javascript" | "python" | BentoCodeSnippetSupportedLanguage;
     langLabel: string;
     editable: boolean;
     actionable: boolean;

package/dist/@types/packages/vue2/src/components/code-snippet/utils/get-lang-loader.d.ts

@@ -3,6 +3,7 @@ import { json } from '@codemirror/lang-json';
 import { xml } from '@codemirror/lang-xml';
 import { javascript } from '@codemirror/lang-javascript';
 import { java } from '@codemirror/lang-java';
+import { python } from '@codemirror/lang-python';
 /**
  * Returns a language loder for `CodeMirror`.
  * Supported languages: json, xml, javascript & java
@@ -10,4 +11,4 @@ import { java } from '@codemirror/lang-java';
  * @param language Language to be used
  * @returns Language configuration loader to be used in codemirror
  */
-export declare const getLangLoader: (language: BentoCodeSnippetSupportedLanguage | `${BentoCodeSnippetSupportedLanguage}`) => () => Promise<typeof json | typeof xml | typeof javascript | typeof java>;
+export declare const getLangLoader: (language: BentoCodeSnippetSupportedLanguage | `${BentoCodeSnippetSupportedLanguage}`) => () => Promise<typeof json | typeof xml | typeof javascript | typeof java | typeof python>;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-calculate-column-width/use-calculate-column-width.d.ts

@@ -75,6 +75,7 @@ export declare const useCalculateColumnWidth: (newColumns: Ref<BentoColumn[]>, n
             inverse?: boolean;
             iconLeft?: object | Element | (object | Element)[];
             iconRight?: object | Element | (object | Element)[];
+            iconOnly?: boolean;
             title?: string;
             event?: import("../../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
             isShort?: true;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-column-hovering/use-column-hovering.d.ts

@@ -29,6 +29,7 @@ export declare const useColumnHovering: (columnSets: Ref<DatagridConfigSettingsC
             inverse?: boolean;
             iconLeft?: object | Element | (object | Element)[];
             iconRight?: object | Element | (object | Element)[];
+            iconOnly?: boolean;
             title?: string;
             event?: import("../../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
             isShort?: true;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-column-reorderer/use-column-reorderer.d.ts

@@ -37,6 +37,7 @@ export declare const useColumnReorderer: (columnsRef: MaybeRef<BentoColumn[]>, h
                 inverse?: boolean;
                 iconLeft?: object | Element | (object | Element)[];
                 iconRight?: object | Element | (object | Element)[];
+                iconOnly?: boolean;
                 title?: string;
                 event?: import("../../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
                 isShort?: true;
@@ -96,6 +97,7 @@ export declare const useColumnReorderer: (columnsRef: MaybeRef<BentoColumn[]>, h
                 inverse?: boolean;
                 iconLeft?: object | Element | (object | Element)[];
                 iconRight?: object | Element | (object | Element)[];
+                iconOnly?: boolean;
                 title?: string;
                 event?: import("../../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
                 isShort?: true;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-config-settings/use-config-settings.d.ts

@@ -43,6 +43,7 @@ export declare const useConfigSettings: (columnsRef: MaybeRef<BentoColumn[]>, em
             inverse?: boolean;
             iconLeft?: object | Element | (object | Element)[];
             iconRight?: object | Element | (object | Element)[];
+            iconOnly?: boolean;
             title?: string;
             event?: import("../../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
             isShort?: true;

package/dist/@types/packages/vue2/src/components/data-grid/composables/use-resizer.d.ts

@@ -46,6 +46,7 @@ export declare const useResizer: (columns: Ref<BentoColumn[]>, emit: (event: Dat
             inverse?: boolean;
             iconLeft?: object | Element | (object | Element)[];
             iconRight?: object | Element | (object | Element)[];
+            iconOnly?: boolean;
             title?: string;
             event?: import("../components/data-grid-cell-actions/data-grid-cell-actions.types").BentoColumnCellActionEvent;
             isShort?: true;

package/dist/@types/packages/vue2/src/components/data-grid/data-grid.types.d.ts

@@ -30,7 +30,8 @@ export declare enum BentoDatagridStyleState {
     SCROLL = "scroll",
     STICKY_FILTERS = "sticky-filters",
     OVERFLOW_SHADOW_LEFT = "overflow-shadow-left",
-    OVERFLOW_SHADOW_RIGHT = "overflow-shadow-right"
+    OVERFLOW_SHADOW_RIGHT = "overflow-shadow-right",
+    NO_SPACING_TOP = "no-spacing-top"
 }
 export declare enum BentoDatagridSortDirection {
     ASCENDING = "asc",

package/dist/@types/packages/vue2/src/components/data-grid/data-grid.vue.d.ts

@@ -304,6 +304,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_mo
         type: PropType<BentoDatagridDataItemId[]>;
         default: () => any[];
     };
+    /**
+     * Renders the data grid with no top spacing, to render inside containers that already have spacing
+     */
+    noSpacingTop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.
      * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.
@@ -607,6 +614,13 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_mo
         type: PropType<BentoDatagridDataItemId[]>;
         default: () => any[];
     };
+    /**
+     * Renders the data grid with no top spacing, to render inside containers that already have spacing
+     */
+    noSpacingTop: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     /**
      * Sortby handles proper rendering of sort icon in header. Sorting currently is only supported server side.
      * It does make sure the currently sorted column has a more visible sort icon, and the sort icon points in the right direction.
@@ -675,6 +689,7 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_mo
     selectable: boolean;
     selection: BentoDatagridDataItemId[];
     highlightedRows: BentoDatagridDataItemId[];
+    noSpacingTop: boolean;
     tabTitle: string;
 }>, Record<NonNullable<string | number>, (_: any) => any> & Record<NonNullable<string | number>, (_: any) => any> & {
     header: (_: {}) => any;

package/dist/@types/packages/vue2/src/components/dropdown/components/dropdown-options-container/dropdown-options-container.vue.d.ts

@@ -1,6 +1,6 @@
 import { PropType } from "../../../../../../vue3/node_modules/vue";
 import { BentoListboxOptions } from "../../../../types";
-import { BentoDropdownEmptyStateProps, BentoDropdownLazyLoadType, BentoDropdownSize, BentoDropdownVirtulisationOptions } from '../../dropdown.types';
+import { BentoDropdownEmptyStateProps, BentoDropdownLazyLoadType, BentoDropdownVirtulisationOptions } from '../../dropdown.types';
 /**
  * Dropdown options container.
  * It lists all the available options.
@@ -59,14 +59,6 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../../vue3/n
         type: StringConstructor;
         required: true;
     };
-    /**
-     * Dropdown input size
-     */
-    inputSize: {
-        type: PropType<"DropdownInputDefault" | "DropdownInputSmall" | BentoDropdownSize>;
-        default: BentoDropdownSize;
-        validator: (value: BentoDropdownSize) => boolean;
-    };
     /**
      * Function that allows the options to be disabled
      *
@@ -213,14 +205,6 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../../vue3/n
         type: StringConstructor;
         required: true;
     };
-    /**
-     * Dropdown input size
-     */
-    inputSize: {
-        type: PropType<"DropdownInputDefault" | "DropdownInputSmall" | BentoDropdownSize>;
-        default: BentoDropdownSize;
-        validator: (value: BentoDropdownSize) => boolean;
-    };
     /**
      * Function that allows the options to be disabled
      *
@@ -336,7 +320,6 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../../../vue3/n
     loading: boolean;
     emptyState: BentoDropdownEmptyStateProps;
     virtualScroll: BentoDropdownVirtulisationOptions;
-    inputSize: "DropdownInputDefault" | "DropdownInputSmall" | BentoDropdownSize;
 }>, Record<NonNullable<string | number>, (_: any) => any>>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/@types/packages/vue2/src/components/filter-bar/components/all-filters-modal/all-filters-modal.vue.d.ts

@@ -75,6 +75,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -185,6 +186,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -287,6 +289,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -390,6 +393,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -492,6 +496,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -594,6 +599,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                     iconLeft?: object | Element | (object | Element)[];
                     iconRight?: object | Element | (object | Element)[];
                     state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                    iconOnly?: boolean;
                     condensed?: boolean;
                     critical?: boolean;
                     disabled?: boolean;
@@ -1512,6 +1518,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;
@@ -1622,6 +1629,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;
@@ -1724,6 +1732,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;
@@ -1827,6 +1836,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;
@@ -1929,6 +1939,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;
@@ -2031,6 +2042,7 @@ declare const _default: import("../../../../../../vue3/node_modules/vue").Define
                         iconLeft?: object | Element | (object | Element)[];
                         iconRight?: object | Element | (object | Element)[];
                         state?: "start" | "success" | import("../../../button").BentoLoadingButtonState | "loading" | "fail";
+                        iconOnly?: boolean;
                         condensed?: boolean;
                         critical?: boolean;
                         disabled?: boolean;

package/dist/@types/packages/vue2/src/components/structured-list/components/structered-list-item/structured-list-item.vue.d.ts

@@ -1,4 +1,3 @@
-import { PropType, Ref } from "../../../../../../vue3/node_modules/vue";
 /**
  * This is an item of the `BentoStructuredList` meant to be used only with that component.
  * It consists of a label/value pair, and also the optional copy and search modifiers.
@@ -24,88 +23,71 @@ import { PropType, Ref } from "../../../../../../vue3/node_modules/vue";
  *     `
  * }
  */
-declare const _default: import("../../../../../../vue3/node_modules/vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import("../../../../../../vue3/node_modules/vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
     /**
      * Label to display for the value
      */
-    label: {
-        type: StringConstructor;
-        required: true;
-    };
+    label: string;
     /**
      * Text to display in info icon tooltip in the label to display for the value
      */
-    labelInfo: {
-        type: StringConstructor;
-        default: any;
-    };
+    labelInfo?: string;
     /**
      * Text to copy when the user clicks `Copy` icon
      */
-    copy: {
-        type: StringConstructor;
-        default: any;
-    };
+    copy?: string;
     /**
      * Function to trigger when user clicks `Search` icon
      */
-    search: {
-        type: PropType<(event: Event) => void>;
-        default: any;
-    };
+    search?: (event: Event) => void;
     /**
      * Text to display when the user hovers over `Search` icon
      */
-    searchTooltip: {
-        type: StringConstructor;
-        default: any;
-    };
-}, {
-    conditionalClasses: import("../../../../../../vue3/node_modules/vue").ComputedRef<{
-        'b-structured-list-item--condensed': boolean;
-    }>;
-    labelTypographyVariant: import("../../../../../../vue3/node_modules/vue").ComputedRef<"caption" | "body">;
-    labelsWidth: Ref<string>;
-}, unknown, {}, {}, import("../../../../../../vue3/node_modules/vue").ComponentOptionsMixin, import("../../../../../../vue3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../../vue3/node_modules/vue").VNodeProps & import("../../../../../../vue3/node_modules/vue").AllowedComponentProps & import("../../../../../../vue3/node_modules/vue").ComponentCustomProps, Readonly<import("../../../../../../vue3/node_modules/vue").ExtractPropTypes<{
+    searchTooltip?: string;
+    /**
+     * Truncates the value of the item
+     */
+    truncate?: boolean;
+}>, {}, unknown, {}, {}, import("../../../../../../vue3/node_modules/vue").ComponentOptionsMixin, import("../../../../../../vue3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../../../vue3/node_modules/vue").VNodeProps & import("../../../../../../vue3/node_modules/vue").AllowedComponentProps & import("../../../../../../vue3/node_modules/vue").ComponentCustomProps, Readonly<import("../../../../../../vue3/node_modules/vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     /**
      * Label to display for the value
      */
-    label: {
-        type: StringConstructor;
-        required: true;
-    };
+    label: string;
     /**
      * Text to display in info icon tooltip in the label to display for the value
      */
-    labelInfo: {
-        type: StringConstructor;
-        default: any;
-    };
+    labelInfo?: string;
     /**
      * Text to copy when the user clicks `Copy` icon
      */
-    copy: {
-        type: StringConstructor;
-        default: any;
-    };
+    copy?: string;
     /**
      * Function to trigger when user clicks `Search` icon
      */
-    search: {
-        type: PropType<(event: Event) => void>;
-        default: any;
-    };
+    search?: (event: Event) => void;
     /**
      * Text to display when the user hovers over `Search` icon
      */
-    searchTooltip: {
-        type: StringConstructor;
-        default: any;
-    };
-}>>, {
-    search: (event: Event) => void;
-    copy: string;
-    labelInfo: string;
-    searchTooltip: string;
+    searchTooltip?: string;
+    /**
+     * Truncates the value of the item
+     */
+    truncate?: boolean;
+}>>>, {}>, {
+    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("../../../../../../vue3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../../../vue3/node_modules/vue").PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/@types/packages/vue2/src/components/structured-list/structured-list.vue.d.ts

@@ -1,4 +1,3 @@
-import { PropType } from "../../../../vue3/node_modules/vue";
 import { BentoStructuredListLayoutOptions } from './structured-list.types';
 /**
  * This is a list used to display pairs of information in a clear and organized manner.
@@ -23,14 +22,11 @@ import { BentoStructuredListLayoutOptions } from './structured-list.types';
  *     `
  * }
  */
-declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_modules/vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_modules/vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * Width of the labels container, in pixels. Overrides layout prop.
      */
-    labelsWidth: {
-        type: NumberConstructor;
-        default: any;
-    };
+    labelsWidth?: number;
     /**
      * The layout of the label value pair in percentage.
      * If labelsWidth is set, layout will be overriden by the static pixel value.
@@ -43,19 +39,15 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_mo
      * '42-58'
      * '50-50'
      */
-    layout: {
-        type: PropType<BentoStructuredListLayoutOptions>;
-        default: string;
-        validator: (value: BentoStructuredListLayoutOptions) => boolean;
-    };
-}, {}, unknown, {}, {}, import("../../../../vue3/node_modules/vue").ComponentOptionsMixin, import("../../../../vue3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../vue3/node_modules/vue").VNodeProps & import("../../../../vue3/node_modules/vue").AllowedComponentProps & import("../../../../vue3/node_modules/vue").ComponentCustomProps, Readonly<import("../../../../vue3/node_modules/vue").ExtractPropTypes<{
+    layout?: BentoStructuredListLayoutOptions;
+}>, {
+    labelsWidth: any;
+    layout: string;
+}>, {}, unknown, {}, {}, import("../../../../vue3/node_modules/vue").ComponentOptionsMixin, import("../../../../vue3/node_modules/vue").ComponentOptionsMixin, {}, string, import("../../../../vue3/node_modules/vue").VNodeProps & import("../../../../vue3/node_modules/vue").AllowedComponentProps & import("../../../../vue3/node_modules/vue").ComponentCustomProps, Readonly<import("../../../../vue3/node_modules/vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * Width of the labels container, in pixels. Overrides layout prop.
      */
-    labelsWidth: {
-        type: NumberConstructor;
-        default: any;
-    };
+    labelsWidth?: number;
     /**
      * The layout of the label value pair in percentage.
      * If labelsWidth is set, layout will be overriden by the static pixel value.
@@ -68,18 +60,31 @@ declare const _default: __VLS_WithTemplateSlots<import("../../../../vue3/node_mo
      * '42-58'
      * '50-50'
      */
-    layout: {
-        type: PropType<BentoStructuredListLayoutOptions>;
-        default: string;
-        validator: (value: BentoStructuredListLayoutOptions) => boolean;
-    };
-}>>, {
+    layout?: BentoStructuredListLayoutOptions;
+}>, {
+    labelsWidth: any;
+    layout: string;
+}>>>, {
     layout: BentoStructuredListLayoutOptions;
     labelsWidth: number;
 }>, {
     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("../../../../vue3/node_modules/vue").PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import("../../../../vue3/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;