diff --git a/src/Pager.tsx b/src/Pager.tsx index 2d357787..483ca6db 100644 --- a/src/Pager.tsx +++ b/src/Pager.tsx @@ -8,6 +8,7 @@ export interface PagerProps extends Pick { page: number; active?: boolean; className?: string; + style?: React.CSSProperties; showTitle: boolean; onClick?: (page: number) => void; onKeyPress?: ( @@ -23,6 +24,7 @@ const Pager: React.FC = (props) => { page, active, className, + style, showTitle, onClick, onKeyPress, @@ -54,6 +56,7 @@ const Pager: React.FC = (props) => {
  • = (props) => { prefixCls = 'rc-pagination', selectPrefixCls = 'rc-select', className, + classNames: paginationClassNames, + styles, // control current: currentProp, @@ -332,6 +334,8 @@ const Pagination: React.FC = (props) => { showTitle, itemRender, page: -1, + className: paginationClassNames?.item, + style: styles?.item, }; const prevPage = current - 1 > 0 ? current - 1 : 0; diff --git a/src/interface.ts b/src/interface.ts index 68e2198d..b37a0788 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -18,7 +18,11 @@ export interface PaginationLocale { page_size?: string; } +type SemanticName = 'item'; + export interface PaginationData { + styles?: Partial>; + classNames?: Partial>; className: string; selectPrefixCls: string; prefixCls: string; diff --git a/tests/index.test.tsx b/tests/index.test.tsx index 7efb5407..9b57e113 100644 --- a/tests/index.test.tsx +++ b/tests/index.test.tsx @@ -241,6 +241,19 @@ describe('Controlled Pagination', () => { }); describe('Other props', () => { + it('support classnames and styles', () => { + const { container } = render( + , + ); + const item = container.querySelector('.rc-pagination-item'); + expect(item).toHaveClass('custom-test'); + expect(item).toHaveStyle('color: red'); + }); it('should support custom default icon', () => { const nextIcon = () => nextIcon; const prevIcon = () => prevIcon;