1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[804],{64296:function(e,n,a){(window.__NEXT_P=window.__NEXT_P||[]).push(["/components/bootstrap/pagination",function(){return a(7318)}])},7318:function(e,n,a){"use strict";a.r(n);var i=a(85893),t=a(33272),s=a(67294),l=a(34051),r=a(31555),c=a(52686),o=a(34289),d=a(52205),m=a(9966),x=a(60834),h=a(72867);let j=()=>{let[e,n]=(0,s.useState)(!1),[a,j]=(0,s.useState)(!1),[g,P]=(0,s.useState)(!1),[Z,I]=(0,s.useState)(!1),[u,N]=(0,s.useState)(!1),[p,v]=(0,s.useState)(!1);return(0,i.jsxs)("div",{children:[(0,i.jsx)(t.Z,{title:"Pagination"}),(0,i.jsx)(h.Z,{titles:"Pagination",active:"Pagination",items:["Componets"]}),(0,i.jsxs)(l.Z,{children:[(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{className:"w-100 w-sm-auto",children:"Basic pagination"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>n(!e),className:"showcode text-nowrap d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsx)("p",{children:"Pagination to indicate Link series of related content exists across multiple pages."}),(0,i.jsxs)(d.Z,{className:"mb-0",children:[(0,i.jsx)(d.Z.Item,{children:1}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Item,{children:4}),(0,i.jsx)(d.Z.Item,{children:5}),(0,i.jsx)(d.Z.Next,{})]}),(0,i.jsx)(m.Z,{in:e,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:'\n <Pagination className="mb-0">\n <Pagination.Item>{1}</Pagination.Item>\n <Pagination.Item>{2}</Pagination.Item>\n <Pagination.Item>{3}</Pagination.Item>\n <Pagination.Item>{4}</Pagination.Item>\n <Pagination.Item>{5}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n'})})})]})]})}),(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{children:"Active pagination"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>j(!a),className:"showcode d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsxs)("p",{children:["Use ",(0,i.jsx)("code",{className:"highlighter-rouge",children:".active"})," to indicate the current page."]}),(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Item,{children:"Prev"}),(0,i.jsx)(d.Z.Item,{active:!0,children:1}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Item,{children:4}),(0,i.jsx)(d.Z.Item,{children:"Next"})]}),(0,i.jsx)(m.Z,{in:a,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:"\n <Pagination>\n <Pagination.Item>Prev</Pagination.Item>\n <Pagination.Item active>{1}</Pagination.Item>\n <Pagination.Item>{2}</Pagination.Item>\n <Pagination.Item>{3}</Pagination.Item>\n <Pagination.Item>{4}</Pagination.Item>\n <Pagination.Item>Next</Pagination.Item>\n</Pagination>\n\n"})})})]})]})})]}),(0,i.jsxs)(l.Z,{children:[(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{children:"Disable Pagination"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>P(!g),className:"showcode d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsxs)("p",{children:["Use ",(0,i.jsx)("code",{className:"highlighter-rouge",children:".disabled"})," for links that appear un-clickable."]}),(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.First,{}),(0,i.jsx)(d.Z.Prev,{}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{active:!0,children:3}),(0,i.jsx)(d.Z.Item,{children:4}),(0,i.jsx)(d.Z.Next,{}),(0,i.jsx)(d.Z.Last,{})]}),(0,i.jsx)(m.Z,{in:g,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:"\n <Pagination>\n <Pagination.First />\n <Pagination.Prev />\n <Pagination.Item>{2}</Pagination.Item>\n <Pagination.Item active>{3}</Pagination.Item>\n <Pagination.Item>{4}</Pagination.Item>\n <Pagination.Next />\n <Pagination.Last />\n</Pagination>\n\n"})})})]})]})}),(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{children:"Pagination Samples"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>I(!Z),className:"showcode d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsx)("p",{children:"Pagination to indicate Link series of related content exists across multiple pages."}),(0,i.jsxs)(l.Z,{children:[(0,i.jsx)(r.Z,{md:12,lg:6,children:(0,i.jsx)(x.Z,{"aria-label":"Page",className:"my-2",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.First,{}),(0,i.jsx)(d.Z.Prev,{}),(0,i.jsx)(d.Z.Item,{active:!0,children:4}),(0,i.jsx)(d.Z.Ellipsis,{}),(0,i.jsx)(d.Z.Item,{children:10}),(0,i.jsx)(d.Z.Next,{}),(0,i.jsx)(d.Z.Last,{})]})})}),(0,i.jsx)(r.Z,{md:6,lg:6,children:(0,i.jsx)(x.Z,{"aria-label":"Page example",className:"my-2",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Prev,{}),(0,i.jsx)(d.Z.Item,{children:1}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Next,{})]})})})]}),(0,i.jsx)(m.Z,{in:Z,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:"\n <Row>\n <Col md={12} lg={6}>\n <Nav aria-label=\"Page\" className='my-2'>\n <Pagination>\n <Pagination.First />\n <Pagination.Prev />\n <Pagination.Item active>{4}</Pagination.Item>\n <Pagination.Ellipsis />\n <Pagination.Item>{10}</Pagination.Item>\n <Pagination.Next />\n <Pagination.Last />\n </Pagination>\n </Nav>\n </Col>\n <Col md={6} lg={6}>\n <Nav aria-label=\"Page example\" className='my-2'>\n <Pagination>\n <Pagination.Prev />\n <Pagination.Item >{1}</Pagination.Item>\n <Pagination.Item >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n </Nav>\n </Col>\n</Row>\n"})})})]})]})})]}),(0,i.jsxs)(l.Z,{children:[(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{children:"Pagination Sizes"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>N(!u),className:"showcode d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsxs)("p",{children:["Use ",(0,i.jsx)("code",{className:"highlighter-rouge",children:".pagination-lg"})," or ",(0,i.jsx)("code",{className:"highlighter-rouge",children:".pagination-sm"})," for additional sizes."]}),(0,i.jsx)(x.Z,{"aria-label":"Page example",children:(0,i.jsxs)(d.Z,{size:"lg",children:[(0,i.jsx)(d.Z.Prev,{}),(0,i.jsx)(d.Z.Item,{active:!0,children:1}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Next,{})]})}),(0,i.jsx)("br",{}),(0,i.jsx)(x.Z,{"aria-label":"Page example",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Item,{children:"Prev"}),(0,i.jsx)(d.Z.Item,{active:!0,children:1}),(0,i.jsx)(d.Z.Item,{children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Item,{children:4}),(0,i.jsx)(d.Z.Item,{children:"Next"})]})}),(0,i.jsx)(m.Z,{in:u,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:'\n <Nav aria-label="Page example">\n\n <Pagination size="lg" >\n <Pagination.Prev />\n <Pagination.Item active >{1}</Pagination.Item>\n <Pagination.Item >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n\n</Nav><br />\n<Nav aria-label="Page example">\n\n\n <Pagination >\n <Pagination.Item >Prev</Pagination.Item>\n <Pagination.Item active >{1}</Pagination.Item>\n <Pagination.Item >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Item >{4}</Pagination.Item>\n <Pagination.Item >Next</Pagination.Item>\n </Pagination>\n</Nav>\n'})})})]})]})}),(0,i.jsx)(r.Z,{md:12,xl:6,children:(0,i.jsxs)(c.Z,{children:[(0,i.jsxs)(c.Z.Header,{children:[(0,i.jsx)(c.Z.Title,{children:"Pagination Alignments"}),(0,i.jsx)(o.Z,{className:"ms-auto",children:(0,i.jsx)(o.Z.Check,{type:"switch",label:"Show Code",id:"custom-switch",onClick:()=>v(!p),className:"showcode d-flex ms-auto mx-2"})})]}),(0,i.jsxs)(c.Z.Body,{children:[(0,i.jsxs)("p",{children:["Change the alignment of pagination components with ",(0,i.jsx)("b",{children:"flexbox Utilities"})]}),(0,i.jsx)(x.Z,{"aria-label":"Page example",className:"justify-content-left",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Prev,{disabled:!0}),(0,i.jsx)(d.Z.Item,{children:1}),(0,i.jsx)(d.Z.Item,{active:!0,children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Next,{})]})}),(0,i.jsx)("br",{}),(0,i.jsx)(x.Z,{"aria-label":"Page example",className:"justify-content-center",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Prev,{disabled:!0}),(0,i.jsx)(d.Z.Item,{children:1}),(0,i.jsx)(d.Z.Item,{active:!0,children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Next,{})]})}),(0,i.jsx)("br",{}),(0,i.jsx)(x.Z,{"aria-label":"Page example",className:"justify-content-end",children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Prev,{disabled:!0}),(0,i.jsx)(d.Z.Item,{children:1}),(0,i.jsx)(d.Z.Item,{active:!0,children:2}),(0,i.jsx)(d.Z.Item,{children:3}),(0,i.jsx)(d.Z.Next,{})]})}),(0,i.jsx)(m.Z,{in:p,className:"mt-2",children:(0,i.jsx)("pre",{children:(0,i.jsx)("code",{children:"\n <Nav aria-label=\"Page example\" className='justify-content-left'>\n\n <Pagination >\n <Pagination.Prev disabled />\n <Pagination.Item >{1}</Pagination.Item>\n <Pagination.Item active >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n\n\n</Nav><br />\n<Nav aria-label=\"Page example\" className='justify-content-center'>\n\n <Pagination >\n <Pagination.Prev disabled />\n <Pagination.Item >{1}</Pagination.Item>\n <Pagination.Item active >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n\n</Nav><br />\n<Nav aria-label=\"Page example\" className='justify-content-end'>\n\n <Pagination >\n <Pagination.Prev disabled />\n <Pagination.Item >{1}</Pagination.Item>\n <Pagination.Item active >{2}</Pagination.Item>\n <Pagination.Item >{3}</Pagination.Item>\n <Pagination.Next />\n </Pagination>\n\n</Nav>\n\n"})})})]})]})})]})]})};j.layout="Contentlayout",n.default=j},72867:function(e,n,a){"use strict";var i=a(85893);a(67294);var t=a(26699);let s=e=>(0,i.jsx)("div",{children:(0,i.jsxs)("div",{className:"page-header",children:[(0,i.jsx)("h1",{className:"page-title",children:e.titles}),(0,i.jsx)("div",{children:(0,i.jsxs)(t.Z,{children:[e.items.map((e,n)=>(0,i.jsx)(t.Z.Item,{href:"#!",children:e},n)),(0,i.jsx)(t.Z.Item,{href:"#!",active:!0,children:e.active})]})})]})});n.Z=s},33272:function(e,n,a){"use strict";a.d(n,{Z:function(){return c}});var i=a(85893);a(67294);var t=a(9008),s=a.n(t),l={src:"/_next/static/media/favicon.00e6795d.ico",height:16,width:16,blurWidth:0,blurHeight:0};let r=e=>{let{title:n}=e;return(0,i.jsxs)(s(),{children:[(0,i.jsx)("title",{children:" Fandoro Technologies
1- Making Businesses Responsible"}),(0,i.jsx)("link",{rel:"icon",href:l.src}),(0,i.jsx)("meta",{name:"description",content:"Fandoro Technologies - making businesses responsible"}),(0,i.jsx)("meta",{name:"author",content:"Fandoro Technologies Private Limited"}),(0,i.jsx)("meta",{name:"keywords",content:"next js dashboard template, admin dashboard nextjs, next js admin template, next js admin panel, admin dashboard, nextjs react bootstrap, react bootstrap with next js, next js admin dashboard, nextjs admin dashboard template, admin panel template, admin template react bootstrap, nextjs dashboard,next js react bootstrap"})]})};var c=r},9008:function(e,n,a){e.exports=a(42636)},26699:function(e,n,a){"use strict";a.d(n,{Z:function(){return m}});var i=a(93967),t=a.n(i),s=a(67294),l=a(76792),r=a(13551),c=a(85893);let o=s.forwardRef(({bsPrefix:e,active:n=!1,children:a,className:i,as:s="li",linkAs:o=r.Z,linkProps:d={},href:m,title:x,target:h,...j},g)=>{let P=(0,l.vE)(e,"breadcrumb-item");return(0,c.jsx)(s,{ref:g,...j,className:t()(P,i,{active:n}),"aria-current":n?"page":void 0,children:n?a:(0,c.jsx)(o,{...d,href:m,title:x,target:h,children:a})})});o.displayName="BreadcrumbItem";let d=s.forwardRef(({bsPrefix:e,className:n,listProps:a={},children:i,label:s="breadcrumb",as:r="nav",...o},d)=>{let m=(0,l.vE)(e,"breadcrumb");return(0,c.jsx)(r,{"aria-label":s,className:n,ref:d,...o,children:(0,c.jsx)("ol",{...a,className:t()(m,null==a?void 0:a.className),children:i})})});d.displayName="Breadcrumb";var m=Object.assign(d,{Item:o})},52205:function(e,n,a){"use strict";a.d(n,{Z:function(){return Z}});var i=a(93967),t=a.n(i),s=a(67294),l=a(76792),r=a(13551),c=a(85893);let o=s.forwardRef(({active:e=!1,disabled:n=!1,className:a,style:i,activeLabel:s="(current)",children:l,linkStyle:o,linkClassName:d,as:m=r.Z,...x},h)=>(0,c.jsx)("li",{ref:h,style:i,className:t()(a,"page-item",{active:e,disabled:n}),children:(0,c.jsxs)(e||n?"span":m,{className:t()("page-link",d),style:o,...x,children:[l,e&&s&&(0,c.jsx)("span",{className:"visually-hidden",children:s})]})}));function d(e,n,a=e){let i=s.forwardRef(({children:e,...i},t)=>(0,c.jsxs)(o,{...i,ref:t,children:[(0,c.jsx)("span",{"aria-hidden":"true",children:e||n}),(0,c.jsx)("span",{className:"visually-hidden",children:a})]}));return i.displayName=e,i}o.displayName="PageItem";let m=d("First","\xab"),x=d("Prev","â¹","Previous"),h=d("Ellipsis","â¦","More"),j=d("Next","âº"),g=d("Last","\xbb"),P=s.forwardRef(({bsPrefix:e,className:n,size:a,...i},s)=>{let r=(0,l.vE)(e,"pagination");return(0,c.jsx)("ul",{ref:s,...i,className:t()(n,r,a&&`${r}-${a}`)})});P.displayName="Pagination";var Z=Object.assign(P,{First:m,Prev:x,Ellipsis:h,Item:o,Next:j,Last:g})}},function(e){e.O(0,[9774,2888,179],function(){return e(e.s=64296)}),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.