diff --git a/api-generator/components/tabview.js b/api-generator/components/tabview.js index a632fe72a..41d4879ab 100644 --- a/api-generator/components/tabview.js +++ b/api-generator/components/tabview.js @@ -41,6 +41,18 @@ const TabViewProps = [ default: 'null', description: 'Uses to pass all properties of the HTMLButtonElement to the next button.' }, + { + name: 'prevIcon', + type: 'string', + default: 'null', + description: 'Prev icon of the scrollable tabview.' + }, + { + name: 'nextIcon', + type: 'string', + default: 'null', + description: 'Next icon of the scrollable tabview.' + }, { name: 'pt', type: 'any', diff --git a/components/lib/tabview/TabView.d.ts b/components/lib/tabview/TabView.d.ts index e44dd41fc..c2dc6e423 100755 --- a/components/lib/tabview/TabView.d.ts +++ b/components/lib/tabview/TabView.d.ts @@ -151,6 +151,14 @@ export interface TabViewProps { * @deprecated since v3.26.0. Use 'pt' property instead. */ nextButtonProps?: ButtonHTMLAttributes | undefined; + /** + * Prev icon of the scrollable tabview. + */ + prevIcon?: string | undefined; + /** + * Next icon of the scrollable tabview. + */ + nextIcon?: string | undefined; /** * Uses to pass attributes to DOM elements inside the component. * @type {TabViewPassThroughOptions} diff --git a/components/lib/tabview/TabView.vue b/components/lib/tabview/TabView.vue index 195838a75..86ab2ba9c 100755 --- a/components/lib/tabview/TabView.vue +++ b/components/lib/tabview/TabView.vue @@ -13,7 +13,7 @@ v-bind="{ ...previousButtonProps, ...ptm('prevbutton') }" > - +
@@ -59,7 +59,7 @@ v-bind="{ ...nextButtonProps, ...ptm('nextbutton') }" > - +
@@ -85,7 +85,8 @@ import BaseComponent from 'primevue/basecomponent'; import Ripple from 'primevue/ripple'; import { DomHandler, UniqueComponentId } from 'primevue/utils'; - +import ChevronLeftIcon from 'primevue/icon/chevronleft'; +import ChevronRightIcon from 'primevue/icon/chevronright'; export default { name: 'TabView', extends: BaseComponent, @@ -118,6 +119,14 @@ export default { nextButtonProps: { type: null, default: null + }, + prevIcon: { + type: String, + default: undefined + }, + nextIcon: { + type: String, + default: undefined } }, data() { @@ -391,6 +400,10 @@ export default { }, directives: { ripple: Ripple + }, + components: { + ChevronLeftIcon, + ChevronRightIcon } };