Fixed #4366 - DataTable: Icon slots issues

pull/4402/head
Tuğçe Küçükoğlu 2023-09-06 12:08:44 +03:00
parent dedb871b78
commit 0e05407663
4 changed files with 102 additions and 54 deletions

View File

@ -1211,36 +1211,60 @@ export interface DataTableSlots {
/** /**
* Custom paginator first page link icon template. * Custom paginator first page link icon template.
*/ */
paginatorfirstpagelinkicon(): VNode[]; paginatorfirstpagelinkicon(scope: {
/**
* Style class of the paginator first page link icon.
* @param {Object} scope - paginatorfirstpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator previous page link icon template. * Custom paginator previous page link icon template.
*/ */
paginatorprevpagelinkicon(): VNode[]; paginatorprevpagelinkicon(scope: {
/**
* Style class of the paginator prev page link icon.
* @param {Object} scope - paginatorprevpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator next page link icon template. * Custom paginator next page link icon template.
*/ */
paginatornextpagelinkicon(): VNode[]; paginatornextpagelinkicon(scope: {
/**
* Style class of the paginator next page link icon.
* @param {Object} scope - paginatornextpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator last page link icon template. * Custom paginator last page link icon template.
*/ */
paginatorlastpagelinkicon(): VNode[]; paginatorlastpagelinkicon(scope: {
/**
* Style class of the paginator last page link icon.
* @param {Object} scope - paginatorlastpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginatorrowsperpagedropdownicon template. * Custom paginatorrowsperpagedropdownicon template.
* @param {Object} scope - paginator rowsperpagedropdownicon's params. * @param {Object} scope - paginatorrowsperpagedropdownicon's params.
*/ */
paginatorrowsperpagedropdownicon(scope: { paginatorrowsperpagedropdownicon(scope: {
/** /**
* Style class of the paginator rowsperpagedropdown icon. * Style class of the paginator rows per page dropdown icon.
*/ */
class: string; class: string;
}): VNode[]; }): VNode[];
/** /**
* Custom paginatorjumptopagedropdownicon template. * Custom paginatorjumptopagedropdownicon template.
* @param {Object} scope - paginator jumptopagedropdownicon's params. * @param {Object} scope - paginatorjumptopagedropdownicon's params.
*/ */
paginatorjumptopagedropdownicon(scope: { paginatorjumptopagedropdownicon(scope: {
/** /**
* Style class of the paginator jumptopagedropdown icon. * Style class of the paginator jump to page dropdown icon.
*/ */
class: string; class: string;
}): VNode[]; }): VNode[];

View File

@ -33,20 +33,20 @@
<template v-if="$slots.paginatorend" #end> <template v-if="$slots.paginatorend" #end>
<slot name="paginatorend"></slot> <slot name="paginatorend"></slot>
</template> </template>
<template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon> <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
<slot name="paginatorfirstpagelinkicon"></slot> <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon> <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
<slot name="paginatorprevpagelinkicon"></slot> <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon> <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
<slot name="paginatornextpagelinkicon"></slot> <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon> <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
<slot name="paginatorlastpagelinkicon"></slot> <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon> <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
<slot name="paginatorjumptopagedropdownicon"></slot> <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps"> <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
<slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot> <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
@ -251,17 +251,17 @@
<template v-if="$slots.paginatorend" #end> <template v-if="$slots.paginatorend" #end>
<slot name="paginatorend"></slot> <slot name="paginatorend"></slot>
</template> </template>
<template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon> <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
<slot name="paginatorfirstpagelinkicon"></slot> <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon> <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
<slot name="paginatorprevpagelinkicon"></slot> <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon> <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
<slot name="paginatornextpagelinkicon"></slot> <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon> <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
<slot name="paginatorlastpagelinkicon"></slot> <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps"> <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
<slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot> <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>

View File

@ -642,36 +642,60 @@ export interface TreeTableSlots {
/** /**
* Custom paginator first page link icon template. * Custom paginator first page link icon template.
*/ */
paginatorfirstpagelinkicon(): VNode[]; paginatorfirstpagelinkicon(scope: {
/**
* Style class of the paginator first page link icon.
* @param {Object} scope - paginatorfirstpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator previous page link icon template. * Custom paginator previous page link icon template.
*/ */
paginatorprevpagelinkicon(): VNode[]; paginatorprevpagelinkicon(scope: {
/**
* Style class of the paginator prev page link icon.
* @param {Object} scope - paginatorprevpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator next page link icon template. * Custom paginator next page link icon template.
*/ */
paginatornextpagelinkicon(): VNode[]; paginatornextpagelinkicon(scope: {
/**
* Style class of the paginator next page link icon.
* @param {Object} scope - paginatornextpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginator last page link icon template. * Custom paginator last page link icon template.
*/ */
paginatorlastpagelinkicon(): VNode[]; paginatorlastpagelinkicon(scope: {
/**
* Style class of the paginator last page link icon.
* @param {Object} scope - paginatorlastpagelinkicon's params.
*/
class: string;
}): VNode[];
/** /**
* Custom paginatorrowsperpagedropdownicon template. * Custom paginatorrowsperpagedropdownicon template.
* @param {Object} scope - paginator rowsperpagedropdownicon's params. * @param {Object} scope - paginatorrowsperpagedropdownicon's params.
*/ */
paginatorrowsperpagedropdownicon(scope: { paginatorrowsperpagedropdownicon(scope: {
/** /**
* Style class of the paginator rowsperpagedropdown icon. * Style class of the paginator rows per page dropdown icon.
*/ */
class: string; class: string;
}): VNode[]; }): VNode[];
/** /**
* Custom paginatorjumptopagedropdownicon template. * Custom paginatorjumptopagedropdownicon template.
* @param {Object} scope - paginator jumptopagedropdownicon's params. * @param {Object} scope - paginatorjumptopagedropdownicon's params.
*/ */
paginatorjumptopagedropdownicon(scope: { paginatorjumptopagedropdownicon(scope: {
/** /**
* Style class of the paginator jumptopagedropdown icon. * Style class of the paginator jump to page dropdown icon.
*/ */
class: string; class: string;
}): VNode[]; }): VNode[];

View File

@ -32,20 +32,20 @@
<template v-if="$slots.paginatorend" #end> <template v-if="$slots.paginatorend" #end>
<slot name="paginatorend"></slot> <slot name="paginatorend"></slot>
</template> </template>
<template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon> <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
<slot name="paginatorfirstpagelinkicon"></slot> <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon> <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
<slot name="paginatorprevpagelinkicon"></slot> <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon> <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
<slot name="paginatornextpagelinkicon"></slot> <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon> <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
<slot name="paginatorlastpagelinkicon"></slot> <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon> <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
<slot name="paginatorjumptopagedropdownicon"></slot> <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps"> <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
<slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot> <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>
@ -138,20 +138,20 @@
<template v-if="$slots.paginatorend" #end> <template v-if="$slots.paginatorend" #end>
<slot name="paginatorend"></slot> <slot name="paginatorend"></slot>
</template> </template>
<template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon> <template v-if="$slots.paginatorfirstpagelinkicon" #firstpagelinkicon="slotProps">
<slot name="paginatorfirstpagelinkicon"></slot> <slot name="paginatorfirstpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon> <template v-if="$slots.paginatorprevpagelinkicon" #prevpagelinkicon="slotProps">
<slot name="paginatorprevpagelinkicon"></slot> <slot name="paginatorprevpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon> <template v-if="$slots.paginatornextpagelinkicon" #nextpagelinkicon="slotProps">
<slot name="paginatornextpagelinkicon"></slot> <slot name="paginatornextpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon> <template v-if="$slots.paginatorlastpagelinkicon" #lastpagelinkicon="slotProps">
<slot name="paginatorlastpagelinkicon"></slot> <slot name="paginatorlastpagelinkicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon> <template v-if="$slots.paginatorjumptopagedropdownicon" #jumptopagedropdownicon="slotProps">
<slot name="paginatorjumptopagedropdownicon"></slot> <slot name="paginatorjumptopagedropdownicon" :class="slotProps.class"></slot>
</template> </template>
<template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps"> <template v-if="$slots.paginatorrowsperpagedropdownicon" #rowsperpagedropdownicon="slotProps">
<slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot> <slot name="paginatorrowsperpagedropdownicon" :class="slotProps.class"></slot>