UNPKG

@legion-ui-kit/react-core

Version:

<div align="center"> <img height="108" width="116" src="https://legion.digitaltelkom.id/favicon.svg?v=4643a71fb65fa61a5f2b266b769ea7b1" /> <h1 align="center">Legion UI Kit - React Core</h1> </div>

4 lines (3 loc) 1.19 kB
"use client"; import{jsxs as a,jsx as t}from"react/jsx-runtime";import o from"classnames";import i from"./styles.module.scss.js";import{PAGINATION_DEFAULT_PROPS as e}from"./Pagination.constant.js";import{PaginationButton as s}from"./PaginationButton.js";import n from"../Icon/index.js";import{getPageNumbers as l}from"./Pagination.helper.js";import{kebabCase as r}from"../../helpers/typography.js";const m=m=>{const{activePage:c=e.activePage,buttonClassName:p,buttonStyle:g,className:d,onClick:f,totalPage:h=e.totalPage,...u}=m,y=Math.min(Math.max(c,1),h),b=Math.max(h,1),j=o(i.legion_pagination,d),v=o(i.pagination_page,p),N=o(i.pagination_navigation,p),P=a=>()=>{f?.(a)},x=l(b,y);return a("div",{className:j,...u,children:[t(s,{className:N,label:t(n,{icon:"chevron-left"}),onClick:()=>{y>1&&f?.(y-1)},style:g,disabled:1===y}),x.map((a,o)=>{const e=r(`${o}-${a}`);return"dots"===a?t(n,{icon:"ellipsis",className:i.pagination_dots,color:"tertiary"},e):t(s,{className:v,active:a===y,label:a,style:g,onClick:P(a)},e)}),t(s,{className:N,label:t(n,{icon:"chevron-right"}),onClick:()=>{y<b&&f?.(y+1)},style:g,disabled:y===b})]})};export{m as default}; //# sourceMappingURL=Pagination.js.map