@db-ux/v-core-components 1.1.1 → 2.0.0-0-custom-select-16b8cce

package/README.md

@@ -7,7 +7,7 @@
 
 A Vue library containing all styles & components of [DB UX Design System (technical components)](https://github.com/db-ux-design-system/core-web).
 
-> **Note:** Find more information about specific components [here](https://db-ux-design-system.github.io/core-web/review/main)
+> **Note:** Find more information about specific components [here](https://design-system.deutschebahn.com/core-web/review/main)
 
 ## Install
 
@@ -97,7 +97,7 @@ Both Inputs in this example do the same:
 
 ## Deutsche Bahn brand
 
-As we'd like to perfectly support our users and customers on their digital journey, the usage of Deutsche Bahn brand and trademarks are bound of clear guidelines and restrictions even when being used with the code that we're provide with this product; Deutsche Bahn fully reserves all rights regarding the Deutsche Bahn brand, even though that we're providing the code of DB UX Design System products free to use and release it under the Apache 2.0 license.
+As we'd like to perfectly support our users and customers on their digital journey, the usage of Deutsche Bahn brand and trademarks are bound of clear guidelines and restrictions even if being used with the code that we're providing with this product; Deutsche Bahn fully reserves all rights regarding the Deutsche Bahn brand, even though that we're providing the code of DB UX Design System products free to use and release it under the Apache 2.0 license.
 Please have a look at our brand portal at <https://marketingportal.extranet.deutschebahn.com/> for any further questions and whom to contact on any brand issues.
 
 For any usage outside of Deutsche Bahn websites and applications you aren't allowed to use any Deutsche Bahn brand and

package/dist/components/accordion-item/accordion-item.vue.d.ts

@@ -1,10 +1,10 @@
 import { DBAccordionItemProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBAccordionItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBAccordionItemProps> & Readonly<{}>, {
+    text: string;
     disabled: boolean;
     children: any;
     className: string;
     id: string;
-    text: string;
     onToggle: (open: boolean) => void;
     defaultOpen: boolean;
     headlinePlain: string;

package/dist/components/badge/badge.vue.d.ts

@@ -1,11 +1,11 @@
 import { DBBadgeProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBBadgeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBBadgeProps> & Readonly<{}>, {
     label: string;
+    text: string;
     children: any;
     className: string;
     id: string;
     size: "medium" | "small";
-    text: string;
     semantic: "adaptive" | "neutral" | "critical" | "informational" | "warning" | "successful";
     placement: "inline" | "corner-top-left" | "corner-top-right" | "corner-center-left" | "corner-center-right" | "corner-bottom-left" | "corner-bottom-right";
     emphasis: "weak" | "strong" | "origin";

package/dist/components/brand/brand.vue.d.ts

@@ -1,11 +1,11 @@
 import { DBBrandProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBBrandProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBBrandProps> & Readonly<{}>, {
+    text: string;
     children: any;
     className: string;
     id: string;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
     showIcon: boolean;
-    text: string;
     hideLogo: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: ((props: {}) => any) | undefined;

package/dist/components/button/button.vue.d.ts

@@ -1,11 +1,12 @@
 import type { DBButtonProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBButtonProps> & Readonly<{}>, {
     name: string;
+    label: string;
+    text: string;
     ariaexpanded: boolean;
     ariapressed: boolean;
     disabled: boolean;
     noText: boolean;
-    label: string;
     type: "button" | "reset" | "submit";
     value: string;
     state: "loading";
@@ -16,10 +17,9 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBButtonPr
     id: string;
     onClick: (event: MouseEvent) => void;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
-    width: "full" | "auto";
+    width: string;
     size: "medium" | "small";
     showIcon: boolean;
-    text: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: ((props: {}) => any) | undefined;
 }>;

package/dist/components/card/card.vue.d.ts

@@ -6,7 +6,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCardProp
     onClick: (event: MouseEvent) => void;
     behavior: "static" | "interactive";
     elevationLevel: "1" | "2" | "3";
-    spacing: "medium" | "small" | "large" | "none";
+    spacing: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: ((props: {}) => any) | undefined;
 }>;

package/dist/components/checkbox/checkbox.vue.d.ts

@@ -5,8 +5,8 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCheckbox
     "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
 }>, {
     name: string;
-    disabled: boolean;
     label: string;
+    disabled: boolean;
     value: any;
     children: any;
     className: string;

package/dist/components/custom-select/custom-select.vue.d.ts

@@ -0,0 +1,60 @@
+import { DBCustomSelectProps, CustomSelectOptionType } from "./model";
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:values": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<DBCustomSelectProps> & Readonly<{
+    "onUpdate:values"?: ((...args: any[]) => any) | undefined;
+}>, {
+    name: string;
+    form: string;
+    label: string;
+    disabled: boolean;
+    variant: "above" | "floating";
+    children: any;
+    className: string;
+    id: string;
+    icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
+    width: string;
+    showIcon: boolean;
+    values: string[];
+    onSelect: (values: string[]) => void;
+    placement: "top" | "bottom" | "top-start" | "top-end" | "bottom-start" | "bottom-end";
+    validation: "invalid" | "valid" | "no-validation";
+    required: boolean;
+    showLabel: boolean;
+    placeholder: string;
+    message: string;
+    validMessage: string;
+    invalidMessage: string;
+    messageIcon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
+    showMessage: boolean;
+    open: boolean;
+    multiple: boolean;
+    options: CustomSelectOptionType[];
+    amountText: string;
+    clearSelectionLabel: string;
+    deSelectAllLabel: string;
+    dropdownWidth: "string" | "full" | "auto" | "fixed";
+    loadingText: string;
+    mobileCloseButtonText: string;
+    noResultsText: string;
+    onAmountChange: (amount: number) => void;
+    removeTagsTexts: string[];
+    searchLabel: string;
+    searchPlaceholder: string;
+    selectAllLabel: string;
+    selectedType: "text" | "amount" | "tag";
+    showClearSelection: boolean;
+    showLoading: boolean;
+    showNoResults: boolean;
+    showSearch: boolean;
+    showSelectAll: boolean;
+    onDropdownToggle: (event: any) => void;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/custom-select/index.d.ts

@@ -0,0 +1 @@
+export { default as DBCustomSelect } from './custom-select.vue';

package/dist/components/custom-select/model.d.ts

@@ -0,0 +1,173 @@
+import { BaseFormProps, CloseEventState, CustomFormProps, FormMessageProps, FormState, GlobalProps, GlobalState, IconProps, PlacementVerticalType, PopoverState, RequiredProps, ShowIconProps, ShowLabelProps, ValidationType, WidthProps } from '../../shared/model';
+import { DBCustomSelectFormFieldDefaultProps } from '../custom-select-form-field/model';
+import { CustomSelectDropdownWidthType } from '../custom-select-dropdown/model';
+import { DBCustomSelectListItemExtraProps } from '../custom-select-list-item/model';
+export type CustomSelectOptionType = {
+    /**
+     * Disables this option
+     */
+    disabled?: boolean;
+    /**
+     * Identifier for option
+     */
+    id?: string;
+    /**
+     * If the value is different from the label you want to show to the user.
+     */
+    label?: string;
+    /**
+     * The value for the option
+     */
+    value?: string;
+} & DBCustomSelectListItemExtraProps;
+export declare const SelectedTypeList: readonly ["amount", "text", "tag"];
+export type SelectedTypeType = (typeof SelectedTypeList)[number];
+export type DBCustomSelectDefaultProps = {
+    /**
+     * Optional: if select-type="amount" change the shown text
+     */
+    amountText?: string;
+    /**
+     * Label for the clear selection button
+     */
+    clearSelectionLabel?: string;
+    /**
+     * Deselect all checkbox label
+     */
+    deSelectAllLabel?: string;
+    /**
+     * Changes the behavior of the dropdown with.
+     * Default: fixed 328px
+     * Auto: Based on the size of the form-field
+     */
+    dropdownWidth?: CustomSelectDropdownWidthType | 'string';
+    /**
+     * Dropdown - hint if data has to be loaded
+     */
+    loadingText?: string;
+    /**
+     * Change the button text for mobile close
+     */
+    mobileCloseButtonText?: string;
+    /**
+     * Enables CustomSelect
+     */
+    multiple?: boolean;
+    /**
+     * Dropdown - hint if there are no options
+     */
+    noResultsText?: string;
+    /**
+     * Optional: if select-type="amount" when amount changes
+     * @param amount The amount of selected checkboxes
+     */
+    onAmountChange?: (amount: number) => void;
+    /**
+     * Triggers after some checkbox was clicked in dropdown
+     * @param values the changed values
+     */
+    onSelect?: (values: string[]) => void;
+    /**
+     * You should pass in the options as an array.
+     */
+    options?: CustomSelectOptionType[];
+    /**
+     * The `placement` attributes values change the position to absolute and adds a transform based on the placement.
+     */
+    placement?: PlacementVerticalType;
+    /**
+     * Optional: if you use selectedType=tag and options, you need to set the removeTagsTexts for screen reader users
+     */
+    removeTagsTexts?: string[];
+    /**
+     * Search label
+     */
+    searchLabel?: string;
+    /**
+     * Search placeholder
+     */
+    searchPlaceholder?: string;
+    /**
+     * Select all checkbox label
+     */
+    selectAllLabel?: string;
+    /**
+     * Change the selected type for values shown in multi select
+     */
+    selectedType?: SelectedTypeType;
+    /**
+     * Show clear selection button (default:true). Hide it if you have very small inputs e.g. in tables.
+     */
+    showClearSelection?: boolean;
+    /**
+     * Dropdown - enable loading infotext and spinner
+     */
+    showLoading?: boolean;
+    /**
+     * Dropdown - enable no options infotext
+     */
+    showNoResults?: boolean;
+    /**
+     * Forces search in header.
+     */
+    showSearch?: boolean;
+    /**
+     * Forces select all checkbox (only for multiple).
+     */
+    showSelectAll?: boolean;
+    /**
+     * Initial value for multi select
+     */
+    values?: string[];
+    /**
+     * Programmatically open the dropdown. May differ if you don't use onDropdownToggle.
+     */
+    open?: boolean;
+    /**
+     * Informs the user when dropdown was toggled.
+     */
+    onDropdownToggle?: (event: any) => void;
+};
+export type DBCustomSelectProps = GlobalProps & CustomFormProps & BaseFormProps & RequiredProps & FormMessageProps & DBCustomSelectDefaultProps & DBCustomSelectFormFieldDefaultProps & WidthProps & IconProps & ShowIconProps & ShowLabelProps;
+export type DBCustomSelectDefaultState = {
+    _validity?: ValidationType;
+    _values?: string[];
+    _options?: CustomSelectOptionType[];
+    _selectedOptions?: CustomSelectOptionType[];
+    _hasNoOptions: boolean;
+    _selectId?: string;
+    _labelId?: string;
+    _summaryId?: string;
+    _placeholderId?: string;
+    _selectedLabels?: string;
+    _selectedLabelsId?: string;
+    _infoTextId?: string;
+    _externalChangeTimestamp?: number;
+    _internalChangeTimestamp?: number;
+    _name?: string;
+    getNativeSelectValue: () => string;
+    getOptionLabel: (option: CustomSelectOptionType) => string;
+    getOptionChecked: (value?: string) => boolean;
+    getOptionKey: (option: CustomSelectOptionType) => string;
+    getTagRemoveLabel: (index: number) => string;
+    selectAllEnabled: boolean;
+    searchEnabled: boolean;
+    amountOptions: number;
+    setDescById: (descId?: string) => void;
+    handleTagRemove: (option: CustomSelectOptionType, event?: any) => void;
+    handleSummaryFocus: () => void;
+    handleSelect: (value?: string) => void;
+    handleSelectAll: () => void;
+    handleClearAll: () => void;
+    handleDropdownToggle: (event: any) => void;
+    handleDocumentClose: (event: any) => void;
+    handleOpenByKeyboardFocus: (onlySearch?: boolean) => void;
+    handleFocusFirstDropdownCheckbox: (activeElement?: Element) => void;
+    handleKeyboardPress: (event: any) => void;
+    handleArrowDownUp: (event: any) => void;
+    handleSearch: (event: any) => void;
+    getSelectAllLabel: () => string;
+    selectAllChecked: boolean;
+    selectAllIndeterminate: boolean;
+};
+export type DBCustomSelectState = DBCustomSelectDefaultState & GlobalState & FormState & CloseEventState & PopoverState;

package/dist/components/custom-select-dropdown/custom-select-dropdown.vue.d.ts

@@ -0,0 +1,15 @@
+import { DBCustomSelectDropdownProps } from "./model";
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectDropdownProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBCustomSelectDropdownProps> & Readonly<{}>, {
+    children: any;
+    className: string;
+    id: string;
+    width: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/custom-select-dropdown/index.d.ts

@@ -0,0 +1 @@
+export { default as DBCustomSelectDropdown } from './custom-select-dropdown.vue';

package/dist/components/custom-select-dropdown/model.d.ts

@@ -0,0 +1,15 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+export declare const CustomSelectDropdownWidthList: readonly ["fixed", "auto", "full"];
+export type CustomSelectDropdownWidthType = (typeof CustomSelectDropdownWidthList)[number];
+export type DBCustomSelectDropdownDefaultProps = {
+    /**
+     * Changes the behavior of the dropdown with.
+     * Default: fixed 328px
+     * Full: Based on the size of the form-field
+     * Auto: Based on the size of the largest list item
+     */
+    width?: CustomSelectDropdownWidthType | string;
+};
+export type DBCustomSelectDropdownProps = DBCustomSelectDropdownDefaultProps & GlobalProps;
+export type DBCustomSelectDropdownDefaultState = {};
+export type DBCustomSelectDropdownState = DBCustomSelectDropdownDefaultState & GlobalState;

package/dist/components/custom-select-form-field/custom-select-form-field.vue.d.ts

@@ -0,0 +1,13 @@
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<import("../../shared/model").GlobalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("../../shared/model").GlobalProps> & Readonly<{}>, {
+    children: any;
+    className: string;
+    id: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/custom-select-form-field/index.d.ts

@@ -0,0 +1 @@
+export { default as DBCustomSelectFormField } from './custom-select-form-field.vue';

package/dist/components/custom-select-form-field/model.d.ts

@@ -0,0 +1,5 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+export type DBCustomSelectFormFieldDefaultProps = {};
+export type DBCustomSelectFormFieldProps = DBCustomSelectFormFieldDefaultProps & GlobalProps;
+export type DBCustomSelectFormFieldDefaultState = {};
+export type DBCustomSelectFormFieldState = DBCustomSelectFormFieldDefaultState & GlobalState;

package/dist/components/custom-select-list/custom-select-list.vue.d.ts

@@ -0,0 +1,16 @@
+import { DBCustomSelectListProps } from "./model";
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectListProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBCustomSelectListProps> & Readonly<{}>, {
+    label: string;
+    children: any;
+    className: string;
+    id: string;
+    multiple: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/custom-select-list/index.d.ts

@@ -0,0 +1 @@
+export { default as DBCustomSelectList } from './custom-select-list.vue';

package/dist/components/custom-select-list/model.d.ts

@@ -0,0 +1,8 @@
+import { GlobalProps, GlobalState } from '../../shared/model';
+export type DBCustomSelectListDefaultProps = {
+    label?: string;
+    multiple?: boolean;
+};
+export type DBCustomSelectListProps = DBCustomSelectListDefaultProps & GlobalProps;
+export type DBCustomSelectListDefaultState = {};
+export type DBCustomSelectListState = DBCustomSelectListDefaultState & GlobalState;

package/dist/components/custom-select-list-item/custom-select-list-item.vue.d.ts

@@ -0,0 +1,31 @@
+import { DBCustomSelectListItemProps } from "./model";
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectListItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:checked": (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<DBCustomSelectListItemProps> & Readonly<{
+    "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
+}>, {
+    name: string;
+    label: string;
+    disabled: boolean;
+    type: "checkbox" | "radio";
+    value: any;
+    children: any;
+    className: string;
+    id: string;
+    icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
+    showIcon: boolean;
+    change: (event: Event) => void;
+    onChange: (event: Event) => void;
+    checked: boolean;
+    groupTitle: string;
+    isGroupTitle: boolean;
+    showDivider: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: ((props: {}) => any) | undefined;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/custom-select-list-item/index.d.ts

@@ -0,0 +1 @@
+export { default as DBCustomSelectListItem } from './custom-select-list-item.vue';

package/dist/components/custom-select-list-item/model.d.ts

@@ -0,0 +1,29 @@
+import { BaseFormProps, ChangeEventProps, ChangeEventState, FormCheckProps, GlobalProps, GlobalState, IconProps, ShowIconProps, ValueProps } from '../../shared/model';
+export declare const CustomSelectListItemTypeList: readonly ["checkbox", "radio"];
+export type CustomSelectListItemTypeType = (typeof CustomSelectListItemTypeList)[number];
+export type DBCustomSelectListItemExtraProps = {
+    /**
+     * If the item is a group title (only text)
+     */
+    isGroupTitle?: boolean;
+    /**
+     * Show a divider on the bottom of the list item for visual grouping (don't use it on every item)
+     */
+    showDivider?: boolean;
+} & IconProps & ShowIconProps;
+export type DBCustomSelectListItemDefaultProps = {
+    /**
+     * Set the title of a group of items - disables radio/checkbox behavior
+     */
+    groupTitle?: string;
+    /**
+     * Change the behavior of the item single(radio) or multiple(checkbox)
+     */
+    type?: CustomSelectListItemTypeType;
+};
+export type DBCustomSelectListItemProps = DBCustomSelectListItemDefaultProps & GlobalProps & BaseFormProps & ValueProps & FormCheckProps & ChangeEventProps<HTMLInputElement> & DBCustomSelectListItemExtraProps;
+export type DBCustomSelectListItemDefaultState = {
+    getIconAfter: () => string | undefined;
+    hasDivider?: boolean;
+};
+export type DBCustomSelectListItemState = DBCustomSelectListItemDefaultState & ChangeEventState<HTMLInputElement> & GlobalState;

package/dist/components/divider/divider.vue.d.ts

@@ -3,7 +3,7 @@ declare const _default: import("vue").DefineComponent<DBDividerProps, {}, {}, {}
     variant: "horizontal" | "vertical";
     className: string;
     id: string;
-    width: "full" | "auto";
+    width: string;
     emphasis: "weak" | "strong";
     margin: "none";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/drawer/drawer.vue.d.ts

@@ -4,11 +4,11 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBDrawerPr
     children: any;
     className: string;
     id: string;
-    width: "full" | "auto";
+    width: string;
     onClose: (event?: any) => void;
     closeButtonId: string;
     closeButtonText: string;
-    spacing: "medium" | "small" | "large" | "none";
+    spacing: string;
     backdrop: "none" | "weak" | "strong" | "invisible";
     direction: "left" | "right" | "up" | "down";
     open: boolean;

package/dist/components/icon/icon.vue.d.ts

@@ -1,11 +1,11 @@
 import type { DBIconProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBIconProps> & Readonly<{}>, {
+    text: string;
     variant: "filled" | "default" | "inverted";
     children: any;
     className: string;
     id: string;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
-    text: string;
     weight: "16" | "20" | "24" | "32" | "48" | "64";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: ((props: {}) => any) | undefined;

package/dist/components/infotext/infotext.vue.d.ts

@@ -1,12 +1,12 @@
 import { DBInfotextProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBInfotextProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBInfotextProps> & Readonly<{}>, {
+    text: string;
     children: any;
     className: string;
     id: string;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
     size: "medium" | "small";
     showIcon: boolean;
-    text: string;
     semantic: "adaptive" | "neutral" | "critical" | "informational" | "warning" | "successful";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: ((props: {}) => any) | undefined;

package/dist/components/input/input.vue.d.ts

@@ -7,8 +7,11 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBInputPro
 }>, {
     name: string;
     step: string | number;
-    disabled: boolean;
+    form: string;
+    input: (event: Event) => void;
     label: string;
+    pattern: string;
+    disabled: boolean;
     type: string;
     value: any;
     variant: "above" | "floating";
@@ -22,13 +25,11 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBInputPro
     blur: (event: FocusEvent) => void;
     change: (event: Event) => void;
     focus: (event: FocusEvent) => void;
-    input: (event: Event) => void;
-    form: string;
-    pattern: string;
     onFocus: (event: FocusEvent) => void;
     onBlur: (event: FocusEvent) => void;
     onChange: (event: Event) => void;
     onInput: (event: Event) => void;
+    ariaDescribedBy: string;
     validation: "invalid" | "valid" | "no-validation";
     required: boolean;
     showLabel: boolean;

package/dist/components/link/link.vue.d.ts

@@ -1,7 +1,8 @@
 import { DBLinkProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBLinkProps> & Readonly<{}>, {
-    disabled: boolean;
     label: string;
+    text: string;
+    disabled: boolean;
     variant: "adaptive" | "brand";
     children: any;
     className: string;
@@ -9,7 +10,6 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBLinkProp
     onClick: (event: MouseEvent) => void;
     size: "medium" | "small";
     showIcon: boolean;
-    text: string;
     target: "_self" | "_blank" | "_parent" | "_top";
     role: string;
     content: "external" | "internal";

package/dist/components/navigation-item/navigation-item.vue.d.ts

@@ -1,14 +1,14 @@
 import { DBNavigationItemProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBNavigationItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBNavigationItemProps> & Readonly<{}>, {
+    text: string;
     disabled: boolean;
     children: any;
     className: string;
     id: string;
     onClick: (event: MouseEvent) => void;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
-    width: "full" | "auto";
+    width: string;
     showIcon: boolean;
-    text: string;
     active: boolean;
     subNavigationExpanded: boolean;
     backButtonId: string;

package/dist/components/notification/notification.vue.d.ts

@@ -1,12 +1,12 @@
 import { DBNotificationProps } from "./model";
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBNotificationProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBNotificationProps> & Readonly<{}>, {
+    text: string;
     variant: "docked" | "standalone" | "overlay";
     children: any;
     className: string;
     id: string;
     icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
     showIcon: boolean;
-    text: string;
     ariaLive: "off" | "assertive" | "polite";
     closeable: boolean;
     headline: any;

package/dist/components/page/model.d.ts

@@ -20,6 +20,10 @@ export type DBPageDefaultProps = {
      * The slot can be used for React to set a header.
      */
     header?: any;
+    /**
+     * Adds `class` to `<main>` element
+     */
+    mainClass?: string;
     /**
      * The variant=fixed uses flex-box to make header and footer static
      */