@stackline/vue-multiselect-dropdown 2.0.0

package/dist/index.d.cts

@@ -0,0 +1,301 @@
+type PrimitiveItem = string | number | boolean;
+type DropdownItem = PrimitiveItem | Record<string, any>;
+interface DropdownSettings<T = DropdownItem> {
+    singleSelection?: boolean;
+    text?: string;
+    enableCheckAll?: boolean;
+    selectAllText?: string;
+    unSelectAllText?: string;
+    filterSelectAllText?: string;
+    filterUnSelectAllText?: string;
+    enableFilterSelectAll?: boolean;
+    enableSearchFilter?: boolean;
+    searchBy?: string[];
+    maxHeight?: number;
+    badgeShowLimit?: number;
+    classes?: string;
+    limitSelection?: number;
+    disabled?: boolean;
+    searchPlaceholderText?: string;
+    groupBy?: string | ((item: T) => string);
+    showCheckbox?: boolean;
+    noDataLabel?: string;
+    searchAutofocus?: boolean;
+    lazyLoading?: boolean;
+    labelKey?: string;
+    primaryKey?: string;
+    position?: 'top' | 'bottom';
+    autoPosition?: boolean;
+    loading?: boolean;
+    selectGroup?: boolean;
+    addNewItemOnFilter?: boolean;
+    addNewButtonText?: string;
+    escapeToClose?: boolean;
+    clearAll?: boolean;
+    closeDropDownOnSelection?: boolean;
+    tagToBody?: boolean;
+    appendToBody?: boolean;
+    /** @deprecated Use `skin` instead. Kept as a compatibility alias. */
+    theme?: 'classic' | 'material' | 'dark' | 'custom' | 'brand' | string;
+    skin?: 'classic' | 'material' | 'dark' | 'custom' | 'brand' | string;
+    ariaLabel?: string;
+    listboxAriaLabel?: string;
+    searchAriaLabel?: string;
+    clearSearchAriaLabel?: string;
+    clearAllAriaLabel?: string;
+    removeItemAriaLabel?: string | ((item: T) => string);
+    openDropdownAriaLabel?: string;
+    closeDropdownAriaLabel?: string;
+    loadingText?: string;
+}
+interface DropdownRenderContext<T = DropdownItem> {
+    item: T;
+    label: string;
+    selected: boolean;
+    disabled: boolean;
+    query: string;
+    toggle: () => void;
+    remove: () => void;
+}
+interface VueMultiselectDropdownHandle<T = DropdownItem> {
+    openDropdown: () => void;
+    closeDropdown: () => void;
+    clearSelection: () => void;
+    focusSearch: () => void;
+    selectAll: () => void;
+    deSelectAll: () => void;
+    getSelectedItems: () => T[];
+}
+interface VueMultiselectPlugin {
+    install: (Vue: any) => void;
+}
+
+type CreateElement = (...args: any[]) => any;
+type GroupedItems<T> = Array<{
+    name: string;
+    items: T[];
+}>;
+declare const VueMultiselectDropdown: {
+    name: string;
+    model: {
+        prop: string;
+        event: string;
+    };
+    props: {
+        data: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        value: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        selectedItems: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        defaultSelectedItems: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        settings: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        renderItem: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderBadge: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderEmptyState: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+    };
+    data(this: any): {
+        isOpen: boolean;
+        query: string;
+        focusedKey: string;
+        internalSelected: any;
+        menuStyle: {};
+        bodyListMaxHeight: number | undefined;
+        menuPlaceholder: Comment | null;
+        menuAttachedToBody: boolean;
+        effectivePosition: string;
+        instanceId: string;
+    };
+    computed: {
+        resolvedSettings(this: any): any;
+        selected(this: any): any;
+        filteredItems(this: any): any;
+        groupedItems(this: any): GroupedItems<DropdownItem>;
+        visibleSelected(this: any): any;
+        hiddenSelectedCount(this: any): number;
+        openDirection(this: any): "up" | "down";
+        shouldAppendToBody(this: any): boolean;
+    };
+    watch: {
+        isOpen(this: any, value: boolean): void;
+        selected(this: any): void;
+        filteredItems(this: any): void;
+        settings: {
+            deep: boolean;
+            handler(this: any): void;
+        };
+    };
+    mounted(this: any): void;
+    beforeDestroy(this: any): void;
+    methods: {
+        getLabel(this: any, item: DropdownItem): string;
+        getKey(this: any, item: DropdownItem): string;
+        isSelected(this: any, item: DropdownItem): any;
+        visibleSelectableItems(this: any): any;
+        emitSelection(this: any, items: DropdownItem[]): void;
+        openDropdown(this: any): void;
+        closeDropdown(this: any): void;
+        toggleDropdown(this: any): void;
+        focusSearch(this: any): void;
+        clearSelection(this: any, event?: Event): void;
+        selectAll(this: any, event?: Event): void;
+        deSelectAll(this: any, event?: Event): void;
+        selectGroup(this: any, groupName: string, items: DropdownItem[], event: Event): void;
+        toggleItem(this: any, item: DropdownItem, event?: Event): void;
+        removeItem(this: any, item: DropdownItem, event?: Event): void;
+        addFilterItem(this: any, event: Event): void;
+        onTriggerKeydown(this: any, event: KeyboardEvent): void;
+        onListKeydown(this: any, event: KeyboardEvent): void;
+        focusFirstOption(this: any): void;
+        focusLastOption(this: any): void;
+        focusOption(this: any, item: DropdownItem): void;
+        onInlineKeydown(this: any, event: KeyboardEvent): void;
+        onTriggerClick(this: any, event: Event): void;
+        onDocumentClick(this: any, event: MouseEvent): void;
+        onDocumentKeydown(this: any, event: KeyboardEvent): void;
+        onListScroll(this: any, event: Event): void;
+        attachMenuToBody(this: any): void;
+        restoreMenuToComponent(this: any): void;
+        updateMenuPosition(this: any): void;
+    };
+    render(this: any, h: CreateElement): any;
+};
+declare const StacklineVueMultiselect: {
+    name: string;
+    model: {
+        prop: string;
+        event: string;
+    };
+    props: {
+        data: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        value: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        selectedItems: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        defaultSelectedItems: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        settings: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        renderItem: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderBadge: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderEmptyState: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+    };
+    data(this: any): {
+        isOpen: boolean;
+        query: string;
+        focusedKey: string;
+        internalSelected: any;
+        menuStyle: {};
+        bodyListMaxHeight: number | undefined;
+        menuPlaceholder: Comment | null;
+        menuAttachedToBody: boolean;
+        effectivePosition: string;
+        instanceId: string;
+    };
+    computed: {
+        resolvedSettings(this: any): any;
+        selected(this: any): any;
+        filteredItems(this: any): any;
+        groupedItems(this: any): GroupedItems<DropdownItem>;
+        visibleSelected(this: any): any;
+        hiddenSelectedCount(this: any): number;
+        openDirection(this: any): "up" | "down";
+        shouldAppendToBody(this: any): boolean;
+    };
+    watch: {
+        isOpen(this: any, value: boolean): void;
+        selected(this: any): void;
+        filteredItems(this: any): void;
+        settings: {
+            deep: boolean;
+            handler(this: any): void;
+        };
+    };
+    mounted(this: any): void;
+    beforeDestroy(this: any): void;
+    methods: {
+        getLabel(this: any, item: DropdownItem): string;
+        getKey(this: any, item: DropdownItem): string;
+        isSelected(this: any, item: DropdownItem): any;
+        visibleSelectableItems(this: any): any;
+        emitSelection(this: any, items: DropdownItem[]): void;
+        openDropdown(this: any): void;
+        closeDropdown(this: any): void;
+        toggleDropdown(this: any): void;
+        focusSearch(this: any): void;
+        clearSelection(this: any, event?: Event): void;
+        selectAll(this: any, event?: Event): void;
+        deSelectAll(this: any, event?: Event): void;
+        selectGroup(this: any, groupName: string, items: DropdownItem[], event: Event): void;
+        toggleItem(this: any, item: DropdownItem, event?: Event): void;
+        removeItem(this: any, item: DropdownItem, event?: Event): void;
+        addFilterItem(this: any, event: Event): void;
+        onTriggerKeydown(this: any, event: KeyboardEvent): void;
+        onListKeydown(this: any, event: KeyboardEvent): void;
+        focusFirstOption(this: any): void;
+        focusLastOption(this: any): void;
+        focusOption(this: any, item: DropdownItem): void;
+        onInlineKeydown(this: any, event: KeyboardEvent): void;
+        onTriggerClick(this: any, event: Event): void;
+        onDocumentClick(this: any, event: MouseEvent): void;
+        onDocumentKeydown(this: any, event: KeyboardEvent): void;
+        onListScroll(this: any, event: Event): void;
+        attachMenuToBody(this: any): void;
+        restoreMenuToComponent(this: any): void;
+        updateMenuPosition(this: any): void;
+    };
+    render(this: any, h: CreateElement): any;
+};
+
+declare const VueMultiselect: VueMultiselectPlugin;
+
+export { type DropdownItem, type DropdownRenderContext, type DropdownSettings, type PrimitiveItem, StacklineVueMultiselect, VueMultiselect, VueMultiselectDropdown, type VueMultiselectDropdownHandle, type VueMultiselectPlugin, VueMultiselect as default };

package/dist/index.d.ts

@@ -0,0 +1,301 @@
+type PrimitiveItem = string | number | boolean;
+type DropdownItem = PrimitiveItem | Record<string, any>;
+interface DropdownSettings<T = DropdownItem> {
+    singleSelection?: boolean;
+    text?: string;
+    enableCheckAll?: boolean;
+    selectAllText?: string;
+    unSelectAllText?: string;
+    filterSelectAllText?: string;
+    filterUnSelectAllText?: string;
+    enableFilterSelectAll?: boolean;
+    enableSearchFilter?: boolean;
+    searchBy?: string[];
+    maxHeight?: number;
+    badgeShowLimit?: number;
+    classes?: string;
+    limitSelection?: number;
+    disabled?: boolean;
+    searchPlaceholderText?: string;
+    groupBy?: string | ((item: T) => string);
+    showCheckbox?: boolean;
+    noDataLabel?: string;
+    searchAutofocus?: boolean;
+    lazyLoading?: boolean;
+    labelKey?: string;
+    primaryKey?: string;
+    position?: 'top' | 'bottom';
+    autoPosition?: boolean;
+    loading?: boolean;
+    selectGroup?: boolean;
+    addNewItemOnFilter?: boolean;
+    addNewButtonText?: string;
+    escapeToClose?: boolean;
+    clearAll?: boolean;
+    closeDropDownOnSelection?: boolean;
+    tagToBody?: boolean;
+    appendToBody?: boolean;
+    /** @deprecated Use `skin` instead. Kept as a compatibility alias. */
+    theme?: 'classic' | 'material' | 'dark' | 'custom' | 'brand' | string;
+    skin?: 'classic' | 'material' | 'dark' | 'custom' | 'brand' | string;
+    ariaLabel?: string;
+    listboxAriaLabel?: string;
+    searchAriaLabel?: string;
+    clearSearchAriaLabel?: string;
+    clearAllAriaLabel?: string;
+    removeItemAriaLabel?: string | ((item: T) => string);
+    openDropdownAriaLabel?: string;
+    closeDropdownAriaLabel?: string;
+    loadingText?: string;
+}
+interface DropdownRenderContext<T = DropdownItem> {
+    item: T;
+    label: string;
+    selected: boolean;
+    disabled: boolean;
+    query: string;
+    toggle: () => void;
+    remove: () => void;
+}
+interface VueMultiselectDropdownHandle<T = DropdownItem> {
+    openDropdown: () => void;
+    closeDropdown: () => void;
+    clearSelection: () => void;
+    focusSearch: () => void;
+    selectAll: () => void;
+    deSelectAll: () => void;
+    getSelectedItems: () => T[];
+}
+interface VueMultiselectPlugin {
+    install: (Vue: any) => void;
+}
+
+type CreateElement = (...args: any[]) => any;
+type GroupedItems<T> = Array<{
+    name: string;
+    items: T[];
+}>;
+declare const VueMultiselectDropdown: {
+    name: string;
+    model: {
+        prop: string;
+        event: string;
+    };
+    props: {
+        data: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        value: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        selectedItems: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        defaultSelectedItems: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        settings: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        renderItem: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderBadge: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderEmptyState: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+    };
+    data(this: any): {
+        isOpen: boolean;
+        query: string;
+        focusedKey: string;
+        internalSelected: any;
+        menuStyle: {};
+        bodyListMaxHeight: number | undefined;
+        menuPlaceholder: Comment | null;
+        menuAttachedToBody: boolean;
+        effectivePosition: string;
+        instanceId: string;
+    };
+    computed: {
+        resolvedSettings(this: any): any;
+        selected(this: any): any;
+        filteredItems(this: any): any;
+        groupedItems(this: any): GroupedItems<DropdownItem>;
+        visibleSelected(this: any): any;
+        hiddenSelectedCount(this: any): number;
+        openDirection(this: any): "up" | "down";
+        shouldAppendToBody(this: any): boolean;
+    };
+    watch: {
+        isOpen(this: any, value: boolean): void;
+        selected(this: any): void;
+        filteredItems(this: any): void;
+        settings: {
+            deep: boolean;
+            handler(this: any): void;
+        };
+    };
+    mounted(this: any): void;
+    beforeDestroy(this: any): void;
+    methods: {
+        getLabel(this: any, item: DropdownItem): string;
+        getKey(this: any, item: DropdownItem): string;
+        isSelected(this: any, item: DropdownItem): any;
+        visibleSelectableItems(this: any): any;
+        emitSelection(this: any, items: DropdownItem[]): void;
+        openDropdown(this: any): void;
+        closeDropdown(this: any): void;
+        toggleDropdown(this: any): void;
+        focusSearch(this: any): void;
+        clearSelection(this: any, event?: Event): void;
+        selectAll(this: any, event?: Event): void;
+        deSelectAll(this: any, event?: Event): void;
+        selectGroup(this: any, groupName: string, items: DropdownItem[], event: Event): void;
+        toggleItem(this: any, item: DropdownItem, event?: Event): void;
+        removeItem(this: any, item: DropdownItem, event?: Event): void;
+        addFilterItem(this: any, event: Event): void;
+        onTriggerKeydown(this: any, event: KeyboardEvent): void;
+        onListKeydown(this: any, event: KeyboardEvent): void;
+        focusFirstOption(this: any): void;
+        focusLastOption(this: any): void;
+        focusOption(this: any, item: DropdownItem): void;
+        onInlineKeydown(this: any, event: KeyboardEvent): void;
+        onTriggerClick(this: any, event: Event): void;
+        onDocumentClick(this: any, event: MouseEvent): void;
+        onDocumentKeydown(this: any, event: KeyboardEvent): void;
+        onListScroll(this: any, event: Event): void;
+        attachMenuToBody(this: any): void;
+        restoreMenuToComponent(this: any): void;
+        updateMenuPosition(this: any): void;
+    };
+    render(this: any, h: CreateElement): any;
+};
+declare const StacklineVueMultiselect: {
+    name: string;
+    model: {
+        prop: string;
+        event: string;
+    };
+    props: {
+        data: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        value: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        selectedItems: {
+            type: ArrayConstructor;
+            default: undefined;
+        };
+        defaultSelectedItems: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        settings: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        renderItem: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderBadge: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+        renderEmptyState: {
+            type: FunctionConstructor;
+            default: undefined;
+        };
+    };
+    data(this: any): {
+        isOpen: boolean;
+        query: string;
+        focusedKey: string;
+        internalSelected: any;
+        menuStyle: {};
+        bodyListMaxHeight: number | undefined;
+        menuPlaceholder: Comment | null;
+        menuAttachedToBody: boolean;
+        effectivePosition: string;
+        instanceId: string;
+    };
+    computed: {
+        resolvedSettings(this: any): any;
+        selected(this: any): any;
+        filteredItems(this: any): any;
+        groupedItems(this: any): GroupedItems<DropdownItem>;
+        visibleSelected(this: any): any;
+        hiddenSelectedCount(this: any): number;
+        openDirection(this: any): "up" | "down";
+        shouldAppendToBody(this: any): boolean;
+    };
+    watch: {
+        isOpen(this: any, value: boolean): void;
+        selected(this: any): void;
+        filteredItems(this: any): void;
+        settings: {
+            deep: boolean;
+            handler(this: any): void;
+        };
+    };
+    mounted(this: any): void;
+    beforeDestroy(this: any): void;
+    methods: {
+        getLabel(this: any, item: DropdownItem): string;
+        getKey(this: any, item: DropdownItem): string;
+        isSelected(this: any, item: DropdownItem): any;
+        visibleSelectableItems(this: any): any;
+        emitSelection(this: any, items: DropdownItem[]): void;
+        openDropdown(this: any): void;
+        closeDropdown(this: any): void;
+        toggleDropdown(this: any): void;
+        focusSearch(this: any): void;
+        clearSelection(this: any, event?: Event): void;
+        selectAll(this: any, event?: Event): void;
+        deSelectAll(this: any, event?: Event): void;
+        selectGroup(this: any, groupName: string, items: DropdownItem[], event: Event): void;
+        toggleItem(this: any, item: DropdownItem, event?: Event): void;
+        removeItem(this: any, item: DropdownItem, event?: Event): void;
+        addFilterItem(this: any, event: Event): void;
+        onTriggerKeydown(this: any, event: KeyboardEvent): void;
+        onListKeydown(this: any, event: KeyboardEvent): void;
+        focusFirstOption(this: any): void;
+        focusLastOption(this: any): void;
+        focusOption(this: any, item: DropdownItem): void;
+        onInlineKeydown(this: any, event: KeyboardEvent): void;
+        onTriggerClick(this: any, event: Event): void;
+        onDocumentClick(this: any, event: MouseEvent): void;
+        onDocumentKeydown(this: any, event: KeyboardEvent): void;
+        onListScroll(this: any, event: Event): void;
+        attachMenuToBody(this: any): void;
+        restoreMenuToComponent(this: any): void;
+        updateMenuPosition(this: any): void;
+    };
+    render(this: any, h: CreateElement): any;
+};
+
+declare const VueMultiselect: VueMultiselectPlugin;
+
+export { type DropdownItem, type DropdownRenderContext, type DropdownSettings, type PrimitiveItem, StacklineVueMultiselect, VueMultiselect, VueMultiselectDropdown, type VueMultiselectDropdownHandle, type VueMultiselectPlugin, VueMultiselect as default };