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

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

@@ -1,5 +1,154 @@
-import { DBCustomSelectProps, CustomSelectOptionType } from "./model";
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+import { DBCustomSelectProps, DBCustomSelectState, CustomSelectOptionType } from "./model";
+import { cls, getBoolean, getBooleanAsString, getHideProp, stringPropVisible } from "../../utils";
+import { DEFAULT_CLOSE_BUTTON, DEFAULT_LABEL, DEFAULT_MESSAGE, DEFAULT_VALID_MESSAGE } from "../../shared/constants";
+import DBCustomSelectList from "../custom-select-list/custom-select-list.vue";
+import DBCustomSelectListItem from "../custom-select-list-item/custom-select-list-item.vue";
+import DBCustomSelectDropdown from "../custom-select-dropdown/custom-select-dropdown.vue";
+import DBInfotext from "../infotext/infotext.vue";
+import DBTag from "../tag/tag.vue";
+import DBButton from "../button/button.vue";
+import DBTooltip from "../tooltip/tooltip.vue";
+import DBInput from "../input/input.vue";
+declare const _id: import("vue").Ref<string | undefined, string | undefined>;
+declare const _messageId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _validMessageId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _invalidMessageId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _invalidMessage: import("vue").Ref<string | undefined, string | undefined>;
+declare const _selectId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _labelId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _summaryId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _placeholderId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _infoTextId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _validity: import("vue").Ref<"invalid" | "valid" | "no-validation" | undefined, "invalid" | "valid" | "no-validation" | undefined>;
+declare const _selectedLabels: import("vue").Ref<string | undefined, string | undefined>;
+declare const _selectedLabelsId: import("vue").Ref<string | undefined, string | undefined>;
+declare const _voiceOverFallback: import("vue").Ref<string | undefined, string | undefined>;
+declare const _selectedOptions: import("vue").Ref<{
+    disabled?: boolean | undefined;
+    id?: string | undefined;
+    label?: string | undefined;
+    value?: string | undefined;
+    isGroupTitle?: boolean | undefined;
+    showDivider?: boolean | undefined;
+    icon?: import("@db-ux/core-foundations").IconTypes | undefined;
+    showIcon?: boolean | string | undefined;
+}[] | undefined, CustomSelectOptionType[] | {
+    disabled?: boolean | undefined;
+    id?: string | undefined;
+    label?: string | undefined;
+    value?: string | undefined;
+    isGroupTitle?: boolean | undefined;
+    showDivider?: boolean | undefined;
+    icon?: import("@db-ux/core-foundations").IconTypes | undefined;
+    showIcon?: boolean | string | undefined;
+}[] | undefined>;
+declare const selectAllEnabled: import("vue").Ref<boolean, boolean>;
+declare const searchEnabled: import("vue").Ref<boolean, boolean>;
+declare const _values: import("vue").Ref<string[] | undefined, string[] | undefined>;
+declare const _options: import("vue").Ref<{
+    disabled?: boolean | undefined;
+    id?: string | undefined;
+    label?: string | undefined;
+    value?: string | undefined;
+    isGroupTitle?: boolean | undefined;
+    showDivider?: boolean | undefined;
+    icon?: import("@db-ux/core-foundations").IconTypes | undefined;
+    showIcon?: boolean | string | undefined;
+}[] | undefined, CustomSelectOptionType[] | {
+    disabled?: boolean | undefined;
+    id?: string | undefined;
+    label?: string | undefined;
+    value?: string | undefined;
+    isGroupTitle?: boolean | undefined;
+    showDivider?: boolean | undefined;
+    icon?: import("@db-ux/core-foundations").IconTypes | undefined;
+    showIcon?: boolean | string | undefined;
+}[] | undefined>;
+declare const _hasNoOptions: import("vue").Ref<boolean, boolean>;
+declare const selectAllChecked: import("vue").Ref<boolean, boolean>;
+declare const _ref: import("vue").Ref<any, any>;
+declare const detailsRef: import("vue").Ref<any, any>;
+declare const selectRef: import("vue").Ref<any, any>;
+declare const selectAllRef: import("vue").Ref<any, any>;
+declare const searchInputRef: import("vue").Ref<any, any>;
+declare function hasValidState(): ReturnType<DBCustomSelectState["hasValidState"]>;
+declare function handleDropdownToggle(event: any): ReturnType<DBCustomSelectState["handleDropdownToggle"]>;
+declare function getSelectAllLabel(): ReturnType<DBCustomSelectState["getSelectAllLabel"]>;
+declare function getOptionLabel(option: CustomSelectOptionType): ReturnType<DBCustomSelectState["getOptionLabel"]>;
+declare function getOptionChecked(value?: string): ReturnType<DBCustomSelectState["getOptionChecked"]>;
+declare function getTagRemoveLabel(index: number): ReturnType<DBCustomSelectState["getTagRemoveLabel"]>;
+declare function handleTagRemove(option: CustomSelectOptionType, event: any): ReturnType<DBCustomSelectState["handleTagRemove"]>;
+declare function handleKeyboardPress(event: any): ReturnType<DBCustomSelectState["handleKeyboardPress"]>;
+declare function handleClose(event: any): ReturnType<DBCustomSelectState["handleClose"]>;
+declare function handleSelect(value?: string): ReturnType<DBCustomSelectState["handleSelect"]>;
+declare function handleSelectAll(): ReturnType<DBCustomSelectState["handleSelectAll"]>;
+declare function handleSearch(event: any): ReturnType<DBCustomSelectState["handleSearch"]>;
+declare function handleClearAll(): ReturnType<DBCustomSelectState["handleClearAll"]>;
+declare function satisfyReact(): void;
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<DBCustomSelectProps, {
+    cls: typeof cls;
+    getBoolean: typeof getBoolean;
+    getBooleanAsString: typeof getBooleanAsString;
+    getHideProp: typeof getHideProp;
+    stringPropVisible: typeof stringPropVisible;
+    DEFAULT_CLOSE_BUTTON: typeof DEFAULT_CLOSE_BUTTON;
+    DEFAULT_LABEL: typeof DEFAULT_LABEL;
+    DEFAULT_MESSAGE: typeof DEFAULT_MESSAGE;
+    DEFAULT_VALID_MESSAGE: typeof DEFAULT_VALID_MESSAGE;
+    DBCustomSelectList: typeof DBCustomSelectList;
+    DBCustomSelectListItem: typeof DBCustomSelectListItem;
+    DBCustomSelectDropdown: typeof DBCustomSelectDropdown;
+    DBInfotext: typeof DBInfotext;
+    DBTag: typeof DBTag;
+    DBButton: typeof DBButton;
+    DBTooltip: typeof DBTooltip;
+    DBInput: typeof DBInput;
+    _id: typeof _id;
+    _messageId: typeof _messageId;
+    _validMessageId: typeof _validMessageId;
+    _invalidMessageId: typeof _invalidMessageId;
+    _invalidMessage: typeof _invalidMessage;
+    _selectId: typeof _selectId;
+    _labelId: typeof _labelId;
+    _summaryId: typeof _summaryId;
+    _placeholderId: typeof _placeholderId;
+    _infoTextId: typeof _infoTextId;
+    _validity: typeof _validity;
+    _selectedLabels: typeof _selectedLabels;
+    _selectedLabelsId: typeof _selectedLabelsId;
+    _voiceOverFallback: typeof _voiceOverFallback;
+    _selectedOptions: typeof _selectedOptions;
+    selectAllEnabled: typeof selectAllEnabled;
+    searchEnabled: typeof searchEnabled;
+    _values: typeof _values;
+    _options: typeof _options;
+    _hasNoOptions: typeof _hasNoOptions;
+    selectAllChecked: typeof selectAllChecked;
+    _ref: typeof _ref;
+    detailsRef: typeof detailsRef;
+    selectRef: typeof selectRef;
+    selectAllRef: typeof selectAllRef;
+    searchInputRef: typeof searchInputRef;
+    hasValidState: typeof hasValidState;
+    handleDropdownToggle: typeof handleDropdownToggle;
+    getSelectAllLabel: typeof getSelectAllLabel;
+    getOptionLabel: typeof getOptionLabel;
+    getOptionChecked: typeof getOptionChecked;
+    getTagRemoveLabel: typeof getTagRemoveLabel;
+    handleTagRemove: typeof handleTagRemove;
+    handleKeyboardPress: typeof handleKeyboardPress;
+    handleClose: typeof handleClose;
+    handleSelect: typeof handleSelect;
+    handleSelectAll: typeof handleSelectAll;
+    handleSearch: typeof handleSearch;
+    handleClearAll: typeof handleClearAll;
+    satisfyReact: typeof satisfyReact;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:values": (...args: any[]) => void;
 }, string, import("vue").PublicProps, Readonly<DBCustomSelectProps> & Readonly<{
     "onUpdate:values"?: ((...args: any[]) => any) | undefined;
@@ -7,51 +156,101 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSe
     name: string;
     form: string;
     label: string;
-    disabled: boolean;
-    variant: "above" | "floating";
+    disabled: boolean | string;
+    variant: import("../../shared/model").LabelVariantType;
     children: any;
     className: string;
     id: string;
-    icon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
-    width: string;
-    showIcon: boolean;
+    icon: import("@db-ux/core-foundations").IconTypes;
+    showIcon: boolean | string;
     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;
+    placement: import("../../shared/model").PlacementVerticalType;
+    validation: import("../../shared/model").ValidationType;
+    required: boolean | string;
+    showLabel: boolean | string;
     placeholder: string;
     message: string;
     validMessage: string;
     invalidMessage: string;
-    messageIcon: import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete;
-    showMessage: boolean;
+    messageIcon: import("@db-ux/core-foundations").IconTypes;
+    showMessage: boolean | string;
     open: boolean;
-    multiple: boolean;
+    multiple: boolean | string;
     options: CustomSelectOptionType[];
+    ariaListLabel: string;
     amountText: string;
-    clearSelectionLabel: string;
-    deSelectAllLabel: string;
-    dropdownWidth: "string" | "full" | "auto" | "fixed";
+    clearSelectionText: string;
+    dropdownWidth: import("../custom-select-dropdown/model").CustomSelectDropdownWidthType | string;
+    formFieldWidth: import("../../shared/model").WidthType | string;
     loadingText: string;
     mobileCloseButtonText: string;
     noResultsText: string;
+    removeTagsTexts: string[];
+    searchLabel: string;
+    searchPlaceholder: string;
+    selectAllLabel: string;
+    selectedType: import("./model").SelectedTypeType;
+    showClearSelection: boolean;
+    showLoading: boolean;
+    showNoResults: boolean;
+    showSearch: boolean;
+    showSelectAll: boolean;
     onAmountChange: (amount: number) => void;
+    onOptionSelected: (values: string[]) => void;
+    onDropdownToggle: (event: any) => void;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: 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 | string;
+    variant: import("../../shared/model").LabelVariantType;
+    children: any;
+    className: string;
+    id: string;
+    icon: import("@db-ux/core-foundations").IconTypes;
+    showIcon: boolean | string;
+    values: string[];
+    placement: import("../../shared/model").PlacementVerticalType;
+    validation: import("../../shared/model").ValidationType;
+    required: boolean | string;
+    showLabel: boolean | string;
+    placeholder: string;
+    message: string;
+    validMessage: string;
+    invalidMessage: string;
+    messageIcon: import("@db-ux/core-foundations").IconTypes;
+    showMessage: boolean | string;
+    open: boolean;
+    multiple: boolean | string;
+    options: CustomSelectOptionType[];
+    ariaListLabel: string;
+    amountText: string;
+    clearSelectionText: string;
+    dropdownWidth: import("../custom-select-dropdown/model").CustomSelectDropdownWidthType | string;
+    formFieldWidth: import("../../shared/model").WidthType | string;
+    loadingText: string;
+    mobileCloseButtonText: string;
+    noResultsText: string;
     removeTagsTexts: string[];
     searchLabel: string;
     searchPlaceholder: string;
     selectAllLabel: string;
-    selectedType: "text" | "amount" | "tag";
+    selectedType: import("./model").SelectedTypeType;
     showClearSelection: boolean;
     showLoading: boolean;
     showNoResults: boolean;
     showSearch: boolean;
     showSelectAll: boolean;
+    onAmountChange: (amount: number) => void;
+    onOptionSelected: (values: string[]) => void;
     onDropdownToggle: (event: any) => void;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,4 +1,4 @@
-import { BaseFormProps, CloseEventState, CustomFormProps, FormMessageProps, FormState, GlobalProps, GlobalState, IconProps, PlacementVerticalType, PopoverState, RequiredProps, ShowIconProps, ShowLabelProps, ValidationType, WidthProps } from '../../shared/model';
+import { BaseFormProps, CloseEventState, CustomFormProps, FormMessageProps, FormState, FromValidState, GlobalProps, GlobalState, IconProps, PlacementVerticalType, PopoverState, RequiredProps, ShowIconProps, ShowLabelProps, ValidationType, WidthType } 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';
@@ -22,7 +22,41 @@ export type CustomSelectOptionType = {
 } & DBCustomSelectListItemExtraProps;
 export declare const SelectedTypeList: readonly ["amount", "text", "tag"];
 export type SelectedTypeType = (typeof SelectedTypeList)[number];
+export type DBCustomSelectEvents = {
+    /**
+     * Optional: if select-type="amount" when amount changes
+     * @param amount The amount of selected checkboxes
+     */
+    onAmountChange?: (amount: number) => void;
+    /**
+     * Optional: if select-type="amount" when amount changes
+     * @param amount The amount of selected checkboxes
+     */
+    amountChange?: (amount: number) => void;
+    /**
+     * Triggers after some option was clicked in dropdown
+     * @param values the changed values
+     */
+    onOptionSelected?: (values: string[]) => void;
+    /**
+     * Triggers after some option was clicked in dropdown
+     * @param values the changed values
+     */
+    optionSelected?: (values: string[]) => void;
+    /**
+     * Informs the user when dropdown was toggled.
+     */
+    onDropdownToggle?: (event: any) => void;
+    /**
+     * Informs the user when dropdown was toggled.
+     */
+    dropdownToggle?: (event: any) => void;
+};
 export type DBCustomSelectDefaultProps = {
+    /**
+     * Overwrite the default aria-label (props.label) for the custom-select-list
+     */
+    ariaListLabel?: string;
     /**
      * Optional: if select-type="amount" change the shown text
      */
@@ -30,17 +64,17 @@ export type DBCustomSelectDefaultProps = {
     /**
      * Label for the clear selection button
      */
-    clearSelectionLabel?: string;
-    /**
-     * Deselect all checkbox label
-     */
-    deSelectAllLabel?: string;
+    clearSelectionText?: string;
     /**
      * Changes the behavior of the dropdown with.
      * Default: fixed 328px
      * Auto: Based on the size of the form-field
      */
-    dropdownWidth?: CustomSelectDropdownWidthType | 'string';
+    dropdownWidth?: CustomSelectDropdownWidthType | string;
+    /**
+     * Width of the component. Auto width based on children size, full width based on parent elements width.
+     */
+    formFieldWidth?: WidthType | string;
     /**
      * Dropdown - hint if data has to be loaded
      */
@@ -52,21 +86,15 @@ export type DBCustomSelectDefaultProps = {
     /**
      * Enables CustomSelect
      */
-    multiple?: boolean;
+    multiple?: boolean | string;
     /**
      * 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
+     * Programmatically open the dropdown. May differ if you don't use onDropdownToggle.
      */
-    onSelect?: (values: string[]) => void;
+    open?: boolean;
     /**
      * You should pass in the options as an array.
      */
@@ -119,16 +147,8 @@ export type DBCustomSelectDefaultProps = {
      * 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 DBCustomSelectProps = GlobalProps & CustomFormProps & BaseFormProps & RequiredProps & FormMessageProps & DBCustomSelectDefaultProps & DBCustomSelectEvents & DBCustomSelectFormFieldDefaultProps & IconProps & ShowIconProps & ShowLabelProps;
 export type DBCustomSelectDefaultState = {
     _validity?: ValidationType;
     _values?: string[];
@@ -142,9 +162,8 @@ export type DBCustomSelectDefaultState = {
     _selectedLabels?: string;
     _selectedLabelsId?: string;
     _infoTextId?: string;
-    _externalChangeTimestamp?: number;
-    _internalChangeTimestamp?: number;
-    _name?: string;
+    _internalChangeTimestamp: number;
+    _documentClickListenerCallbackId?: string;
     getNativeSelectValue: () => string;
     getOptionLabel: (option: CustomSelectOptionType) => string;
     getOptionChecked: (value?: string) => boolean;
@@ -166,8 +185,9 @@ export type DBCustomSelectDefaultState = {
     handleKeyboardPress: (event: any) => void;
     handleArrowDownUp: (event: any) => void;
     handleSearch: (event: any) => void;
+    handleOptionSelected: (_values: string[]) => void;
     getSelectAllLabel: () => string;
     selectAllChecked: boolean;
     selectAllIndeterminate: boolean;
 };
-export type DBCustomSelectState = DBCustomSelectDefaultState & GlobalState & FormState & CloseEventState & PopoverState;
+export type DBCustomSelectState = DBCustomSelectDefaultState & GlobalState & FormState & FromValidState & CloseEventState & PopoverState;

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

@@ -1,12 +1,27 @@
 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<{}>, {
+import { cls } from "../../utils";
+declare const _ref: import("vue").Ref<any, any>;
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<DBCustomSelectDropdownProps, {
+    cls: typeof cls;
+    _ref: typeof _ref;
+}, {}, {}, {}, 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;
-}>;
+    width: import("./model").CustomSelectDropdownWidthType | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<DBCustomSelectDropdownProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBCustomSelectDropdownProps> & Readonly<{}>, {
+    children: any;
+    className: string;
+    id: string;
+    width: import("./model").CustomSelectDropdownWidthType | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,10 +1,24 @@
-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<{}>, {
+import { cls } from "../../utils";
+declare const _ref: import("vue").Ref<any, any>;
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<import("../..").GlobalProps, {
+    cls: typeof cls;
+    _ref: typeof _ref;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("../..").GlobalProps> & Readonly<{}>, {
     children: any;
     className: string;
     id: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<import("../..").GlobalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("../..").GlobalProps> & Readonly<{}>, {
+    children: any;
+    className: string;
+    id: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,13 +1,29 @@
 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<{}>, {
+import { cls } from "../../utils";
+declare const _ref: import("vue").Ref<any, any>;
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<DBCustomSelectListProps, {
+    cls: typeof cls;
+    _ref: typeof _ref;
+}, {}, {}, {}, 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;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: 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>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,28 +1,69 @@
-import { DBCustomSelectListItemProps } from "./model";
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DBCustomSelectListItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+import { DBCustomSelectListItemProps, DBCustomSelectListItemState } from "./model";
+import { cls, getBoolean, getBooleanAsString, getHideProp } from "../../utils";
+import { ChangeEvent } from "../../shared/model";
+declare const _id: import("vue").Ref<string | undefined, string | undefined>;
+declare const hasDivider: import("vue").Ref<boolean | undefined, boolean | undefined>;
+declare const _ref: import("vue").Ref<any, any>;
+declare function handleChange(event: ChangeEvent<HTMLInputElement>): ReturnType<DBCustomSelectListItemState["handleChange"]>;
+declare function getIconAfter(): ReturnType<DBCustomSelectListItemState["getIconAfter"]>;
+declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
+declare var __VLS_1: {};
+type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
+    default?: (props: typeof __VLS_1) => any;
+}>;
+declare const __VLS_self: import("vue").DefineComponent<DBCustomSelectListItemProps, {
+    cls: typeof cls;
+    getBoolean: typeof getBoolean;
+    getBooleanAsString: typeof getBooleanAsString;
+    getHideProp: typeof getHideProp;
+    _id: typeof _id;
+    hasDivider: typeof hasDivider;
+    _ref: typeof _ref;
+    handleChange: typeof handleChange;
+    getIconAfter: typeof getIconAfter;
+}, {}, {}, {}, 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";
+    disabled: boolean | string;
+    type: import("./model").CustomSelectListItemTypeType;
     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;
+    icon: import("@db-ux/core-foundations").IconTypes;
+    showIcon: boolean | string;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    checked: boolean | string;
     groupTitle: string;
     isGroupTitle: boolean;
     showDivider: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: ((props: {}) => any) | undefined;
-}>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: 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 | string;
+    type: import("./model").CustomSelectListItemTypeType;
+    value: any;
+    children: any;
+    className: string;
+    id: string;
+    icon: import("@db-ux/core-foundations").IconTypes;
+    showIcon: boolean | string;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    checked: boolean | string;
+    groupTitle: string;
+    isGroupTitle: boolean;
+    showDivider: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,10 +1,10 @@
 import { DBDividerProps } from "./model";
 declare const _default: import("vue").DefineComponent<DBDividerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DBDividerProps> & Readonly<{}>, {
-    variant: "horizontal" | "vertical";
+    variant: import("./model").DividerVariantType;
     className: string;
     id: string;
-    width: string;
-    emphasis: "weak" | "strong";
+    width: import("../..").WidthType | string;
+    emphasis: import("../..").EmphasisType;
     margin: "none";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;