Skip to content

fix: refine TypeScript types #1853

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
akki-jat merged 1 commit into from
Feb 13, 2025
Merged

fix: refine TypeScript types #1853

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
218 changes: 111 additions & 107 deletions index.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
// Originally written by: Akshay Jat https://github.com/akki-jat
import { DefineComponent } from 'vue';

export interface MultiselectMixinOptions {
export interface MultiselectMixinProps {
/**
* Decide whether to filter the results based on search query.
* Useful for async filtering, where we search through more complex data.
Expand Down Expand Up @@ -177,7 +177,7 @@ export interface MultiselectMixinOptions {
filteringSortFunc?: (a: any, b: any) => number;
}

export interface PointerMixinOptions {
export interface PointerMixinProps {
/**
* Enable/disable highlighting of the pointed value.
* @type {Boolean}
Expand All @@ -187,116 +187,120 @@ export interface PointerMixinOptions {
optionHeight?: number;
}

export const multiselectMixin: DefineComponent<MultiselectMixinOptions>;
export const pointerMixin: DefineComponent<PointerMixinOptions>;
export interface ComponentProps {
/**
* name attribute to match optional label element
* @default ''
* @type {String}
*/
name?: string;
/**
* Presets the selected options value.
* @type {Object||Array||String||Integer||null}
*/
modelValue?: object | any[] | string | number | null;
/**
* String to show when pointing to an option
* @default 'Press enter to select'
* @type {String}
*/
selectLabel?: string;
/**
* String to show when pointing to an option
* @default 'Press enter to select'
* @type {String}
*/
selectGroupLabel?: string;
/**
* String to show next to selected option
* @default 'Selected'
* @type {String}
*/
selectedLabel?: string;
/**
* String to show when pointing to an already selected option
* @default 'Press enter to remove'
* @type {String}
*/
deselectLabel?: string;
/**
* String to show when pointing to an already selected option
* @default 'Press enter to remove'
* @type {String}
*/
deselectGroupLabel?: string;
/**
* Decide whether to show pointer labels
* @default true
* @type {Boolean}
*/
showLabels?: boolean;
/**
* Limit the display of selected options. The rest will be hidden within the limitText string.
* @default 99999
* @type {Integer}
*/
limit?: number;
/**
* Sets maxHeight style value of the dropdown
* @default 300
* @type {Integer}
*/
maxHeight?: number;
/**
* Function that process the message shown when selected
* elements pass the defined limit.
* @default 'and * more'
* @param {Int} count Number of elements more than limit
* @type {Function}
*/
limitText?: (count: number) => string;
/**
* Set true to trigger the loading spinner.
* @default False
* @type {Boolean}
*/
loading?: boolean;
/**
* Disables the multiselect if true.
* @default false
* @type {Boolean}
*/
disabled?: boolean;
/**
* Enables search input's spellcheck if true.
* @default false
* @type {Boolean}
*/
spellcheck?: boolean;
/**
* Fixed opening direction
* @default ''
* @type {String}
*/
openDirection?: string;
/**
* Shows slot with message about empty options
* @default true
* @type {Boolean}
*/
showNoOptions?: boolean;
showNoResults?: boolean;
tabindex?: number;
required?: boolean;
}

export type MultiselectProps = ComponentProps & MultiselectMixinProps & PointerMixinProps;

export const multiselectMixin: DefineComponent<MultiselectMixinProps>;
export const pointerMixin: DefineComponent<PointerMixinProps>;
export const Multiselect: DefineComponent<
{
/**
* name attribute to match optional label element
* @default ''
* @type {String}
*/
name?: string;
/**
* Presets the selected options value.
* @type {Object||Array||String||Integer}
*/
modelValue?: object | any[] | string | number;
/**
* String to show when pointing to an option
* @default 'Press enter to select'
* @type {String}
*/
selectLabel?: string;
/**
* String to show when pointing to an option
* @default 'Press enter to select'
* @type {String}
*/
selectGroupLabel?: string;
/**
* String to show next to selected option
* @default 'Selected'
* @type {String}
*/
selectedLabel?: string;
/**
* String to show when pointing to an already selected option
* @default 'Press enter to remove'
* @type {String}
*/
deselectLabel?: string;
/**
* String to show when pointing to an already selected option
* @default 'Press enter to remove'
* @type {String}
*/
deselectGroupLabel?: string;
/**
* Decide whether to show pointer labels
* @default true
* @type {Boolean}
*/
showLabels?: boolean;
/**
* Limit the display of selected options. The rest will be hidden within the limitText string.
* @default 99999
* @type {Integer}
*/
limit?: number;
/**
* Sets maxHeight style value of the dropdown
* @default 300
* @type {Integer}
*/
maxHeight?: number;
/**
* Function that process the message shown when selected
* elements pass the defined limit.
* @default 'and * more'
* @param {Int} count Number of elements more than limit
* @type {Function}
*/
limitText?: (count: number) => string;
/**
* Set true to trigger the loading spinner.
* @default False
* @type {Boolean}
*/
loading?: boolean;
/**
* Disables the multiselect if true.
* @default false
* @type {Boolean}
*/
disabled?: boolean;
/**
* Enables search input's spellcheck if true.
* @default false
* @type {Boolean}
*/
spellcheck?: boolean;
/**
* Fixed opening direction
* @default ''
* @type {String}
*/
openDirection?: string;
/**
* Shows slot with message about empty options
* @default true
* @type {Boolean}
*/
showNoOptions?: boolean;
showNoResults?: boolean;
tabindex?: number;
required?: boolean;
},
ComponentProps,
{},
{},
{},
{ activate(): void; deactivate(): void },
typeof multiselectMixin | typeof pointerMixin
>;

export default Multiselect;
export default Multiselect;