Fixed #1836 - For OrderList

pull/1846/head
mertsincan 2021-12-01 16:57:00 +03:00
parent e468f64b80
commit 5deb7b18c0
1 changed files with 122 additions and 19 deletions

View File

@ -1,32 +1,135 @@
import { VNode } from 'vue';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
interface OrderListProps {
export interface OrderListReorderEvent {
/**
* Browser event
*/
originalEvent: Event;
/**
* Ordered list
*/
value: any[];
/**
* Direction of the change; "up", "down", "bottom", "top"
*/
direction: string;
}
export interface OrderListSelectionChangeEvent {
/**
* Browser event
*/
originalEvent: Event;
/**
* Ordered list
*/
value: any[];
}
export interface OrderListProps {
/**
* Value of the component.
*/
modelValue?: any[];
dataKey?: string;
/**
* Name of the field that uniquely identifies the a record in the data.
*/
dataKey?: string | undefined;
/**
* Selected items in the list.
*/
selection?: any[];
metaKeySelection?: boolean;
/**
* Defines whether metaKey is requred or not for the selection.
* When true metaKey needs to be pressed to select or unselect an item and
* when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically.
* Default value is true.
*/
metaKeySelection?: boolean | undefined;
/**
* Inline style of the the list element.
*/
listStyle?: any;
responsive?: boolean;
breakpoint?: string;
/**
* Whether the list optimizes layout based on screen size.
* Default value is true.
*/
responsive?: boolean | undefined;
/**
* The breakpoint to define the maximum width boundary when responsiveness is enabled.
* Default value is '960px'.
*/
breakpoint?: string | undefined;
}
interface OrderListItemSlotInterface {
item: any;
index: number;
export interface OrderListSlots {
/**
* Custom header template.
*/
header: () => VNode[];
/**
* Custom item template.
* @param {Object} scope - item slot's params.
*/
item: (scope: {
/**
* Item of the component
*/
item: any;
/**
* Index of the item.
*/
index: number;
}) => VNode[];
/**
* Custom controls start template.
*/
controlsstart: () => VNode[];
/**
* Custom controls end template.
*/
controlsend: () => VNode[];
}
declare class OrderList {
$props: OrderListProps;
$emit(eventName: 'update:modelValue', value: any[]): this;
$emit(eventName: 'update:selection', value: any[]): this;
$emit(eventName: 'reorder', e: { originalEvent: Event, value: any[]; direction: string}): this;
$emit(eventName: 'selection-change', e: { originalEvent: Event, value: any[]}): this;
$slots: {
header: VNode[];
item: OrderListItemSlotInterface;
controlsstart: VNode[];
controlsend: VNode[];
export declare type OrderListEmits = {
/**
* Emitted when the value changes.
* @param {*} value - New value.
*/
'update:modelValue': (value: any[]) => void;
/**
* Emitted when the selection changes.
* @param {*} value - New value.
*/
'update:selection': (value: any[]) => void;
/**
* Callback to invoke when the list is reordered.
* @param {OrderListReorderEvent} event - Custom reorder event.
*/
'reorder': (event: OrderListReorderEvent) => void;
/**
* Callback to invoke when selection changes.
* @param {OrderListSelectionChangeEvent} event - Custom selection change event.
*/
'selection-change': (event: OrderListSelectionChangeEvent) => void;
}
declare class OrderList extends ClassComponent<OrderListProps, OrderListSlots, OrderListEmits> { }
declare module '@vue/runtime-core' {
interface GlobalComponents {
OrderList: GlobalComponentConstructor<OrderList>
}
}
/**
*
* OrderList is used to managed the order of a collection.
*
* Demos:
*
* - [OrderList](https://www.primefaces.org/primevue/showcase/#/orderlist)
*
*/
export default OrderList;