Fixed #1836 - For Chips
parent
b1d44b2fcf
commit
2fde235d74
|
@ -1,27 +1,100 @@
|
|||
import { VNode } from 'vue';
|
||||
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
|
||||
|
||||
interface ChipsProps {
|
||||
modelValue?: any[];
|
||||
max?: number;
|
||||
addOnBlur?: boolean;
|
||||
allowDuplicate?: boolean;
|
||||
separator?: string;
|
||||
class?: string;
|
||||
style?: any;
|
||||
}
|
||||
|
||||
interface ChipsChipSlotInterface {
|
||||
export interface ChipsAddEvent {
|
||||
/**
|
||||
* Browser event.
|
||||
*/
|
||||
originalEvent: Event;
|
||||
/**
|
||||
* Added/Removed item value.
|
||||
*/
|
||||
value: any;
|
||||
}
|
||||
|
||||
declare class Chips {
|
||||
$props: ChipsProps;
|
||||
$emit(eventName: 'update:modelValue', value: any[]): this;
|
||||
$emit(eventName: 'add', e: { originalEvent: Event, value: any }): this;
|
||||
$emit(eventName: 'remove', e: { originalEvent: Event, value: any }): this;
|
||||
$slots: {
|
||||
chip: ChipsChipSlotInterface;
|
||||
/**
|
||||
* @extends ChipsAddEvent
|
||||
*/
|
||||
export interface ChipsRemoveEvent extends ChipsAddEvent { }
|
||||
|
||||
export interface ChipsProps {
|
||||
/**
|
||||
* Value of the component.
|
||||
*/
|
||||
modelValue?: any[];
|
||||
/**
|
||||
* Maximum number of entries allowed.
|
||||
*/
|
||||
max?: number | undefined;
|
||||
/**
|
||||
* Whether to add an item when the input loses focus.
|
||||
*/
|
||||
addOnBlur?: boolean | undefined;
|
||||
/**
|
||||
* Whether to allow duplicate values or not.
|
||||
* Default value is true.
|
||||
*/
|
||||
allowDuplicate?: boolean | undefined;
|
||||
/**
|
||||
* Separator char to add an item when pressed in addition to the enter key. Currently only possible value is ","
|
||||
*/
|
||||
separator?: string | undefined;
|
||||
/**
|
||||
* Style class of the component input field.
|
||||
*/
|
||||
class?: string | undefined;
|
||||
/**
|
||||
* Inline style of the component.
|
||||
*/
|
||||
style?: any;
|
||||
}
|
||||
|
||||
export interface ChipsSlots {
|
||||
/**
|
||||
* Custom chip template.
|
||||
* @param {Object} scope - chip slot's params.
|
||||
*/
|
||||
chip: (scope: {
|
||||
/**
|
||||
* Value of the component
|
||||
*/
|
||||
value: any;
|
||||
}) => VNode[];
|
||||
}
|
||||
|
||||
export declare type ChipsEmits = {
|
||||
/**
|
||||
* Emitted when the value changes.
|
||||
* @param {*} value - New value.
|
||||
*/
|
||||
'update:modelValue': (value: any[]) => void;
|
||||
/**
|
||||
* Callback to invoke when a chip is added.
|
||||
* @param {ChipsAddEvent} event - Custom add event.
|
||||
*/
|
||||
'add': (event: ChipsAddEvent) => void;
|
||||
/**
|
||||
* Callback to invoke when a chip is removed.
|
||||
* @param {ChipsRemoveEvent} event - Custom remove event.
|
||||
*/
|
||||
'remove': (event: ChipsRemoveEvent) => void;
|
||||
}
|
||||
|
||||
declare class Chips extends ClassComponent<ChipsProps, ChipsSlots, ChipsEmits> { }
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
interface GlobalComponents {
|
||||
Chips: GlobalComponentConstructor<Chips>
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* Chips is used to enter multiple values on an input field.
|
||||
*
|
||||
* Demos:
|
||||
*
|
||||
* - [Chips](https://www.primefaces.org/primevue/showcase/#/chips)
|
||||
*
|
||||
*/
|
||||
export default Chips;
|
||||
|
|
Loading…
Reference in New Issue