@rubi_who/shadcn-table-pagination/dist/index.umd.js

A reusable Shadcn DataTable component with pagination

!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("@tanstack/react-table"),require("clsx"),require("tailwind-merge"),require("lucide-react"),require("@radix-ui/react-slot"),require("class-variance-authority")):"function"==typeof define&&define.amd?define(["exports","react","@tanstack/react-table","clsx","tailwind-merge","lucide-react","@radix-ui/react-slot","class-variance-authority"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).ShadcnTablePagination={},e.React,e.ReactTable,e.clsx,e.tailwindMerge,e.lucideReact,e.reactSlot,e.classVarianceAuthority)}(this,function(e,r,t,a,n,o,s,i){"use strict";function l(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,a=Array(r);t<r;t++)a[t]=e[t];return a}function c(e,r,t){return(r=function(e){var r=function(e,r){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var a=t.call(e,r);if("object"!=typeof a)return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(e)}(e,"string");return"symbol"==typeof r?r:r+""}(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function u(){return u=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var a in t)({}).hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},u.apply(null,arguments)}function f(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);r&&(a=a.filter(function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable})),t.push.apply(t,a)}return t}function d(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?f(Object(t),!0).forEach(function(r){c(e,r,t[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):f(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})}return e}function p(e,r){if(null==e)return{};var t,a,n=function(e,r){if(null==e)return{};var t={};for(var a in e)if({}.hasOwnProperty.call(e,a)){if(-1!==r.indexOf(a))continue;t[a]=e[a]}return t}(e,r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(a=0;a<o.length;a++)t=o[a],-1===r.indexOf(t)&&{}.propertyIsEnumerable.call(e,t)&&(n[t]=e[t])}return n}function m(e,r){return function(e){if(Array.isArray(e))return e}(e)||function(e,r){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var a,n,o,s,i=[],l=!0,c=!1;try{if(o=(t=t.call(e)).next,0===r);else for(;!(l=(a=o.call(t)).done)&&(i.push(a.value),i.length!==r);l=!0);}catch(e){c=!0,n=e}finally{try{if(!l&&null!=t.return&&(s=t.return(),Object(s)!==s))return}finally{if(c)throw n}}return i}}(e,r)||function(e,r){if(e){if("string"==typeof e)return l(e,r);var t={}.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?l(e,r):void 0}}(e,r)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}var b,y={exports:{}},v={};var g,h,x={};
/**
   * @license React
   * react-jsx-runtime.development.js
   *
   * Copyright (c) Meta Platforms, Inc. and affiliates.
   *
   * This source code is licensed under the MIT license found in the
   * LICENSE file in the root directory of this source tree.
   */function j(){return g||(g=1,"production"!==process.env.NODE_ENV&&function(){function e(r){if(null==r)return null;if("function"==typeof r)return r.$$typeof===O?null:r.displayName||r.name||null;if("string"==typeof r)return r;switch(r){case p:return"Fragment";case b:return"Profiler";case m:return"StrictMode";case h:return"Suspense";case j:return"SuspenseList";case k:return"Activity"}if("object"==typeof r)switch("number"==typeof r.tag&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),r.$$typeof){case d:return"Portal";case v:return(r.displayName||"Context")+".Provider";case y:return(r._context.displayName||"Context")+".Consumer";case g:var t=r.render;return(r=r.displayName)||(r=""!==(r=t.displayName||t.name||"")?"ForwardRef("+r+")":"ForwardRef"),r;case N:return null!==(t=r.displayName||null)?t:e(r.type)||"Memo";case w:t=r._payload,r=r._init;try{return e(r(t))}catch(e){}}return null}function t(e){return""+e}function a(e){try{t(e);var r=!1}catch(e){r=!0}if(r){var a=(r=console).error,n="function"==typeof Symbol&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return a.call(r,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",n),t(e)}}function n(r){if(r===p)return"<>";if("object"==typeof r&&null!==r&&r.$$typeof===w)return"<...>";try{var t=e(r);return t?"<"+t+">":"<...>"}catch(e){return"<...>"}}function o(){return Error("react-stack-top-frame")}function s(){var r=e(this.type);return R[r]||(R[r]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),void 0!==(r=this.props.ref)?r:null}function i(r,t,n,o,i,u,d,p){var m,b=t.children;if(void 0!==b)if(o)if(P(b)){for(o=0;o<b.length;o++)l(b[o]);Object.freeze&&Object.freeze(b)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else l(b);if(_.call(t,"key")){b=e(r);var y=Object.keys(t).filter(function(e){return"key"!==e});o=0<y.length?"{key: someKey, "+y.join(": ..., ")+": ...}":"{key: someKey}",A[b+o]||(y=0<y.length?"{"+y.join(": ..., ")+": ...}":"{}",console.error('A props object containing a "key" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />',o,b,y,b),A[b+o]=!0)}if(b=null,void 0!==n&&(a(n),b=""+n),function(e){if(_.call(e,"key")){var r=Object.getOwnPropertyDescriptor(e,"key").get;if(r&&r.isReactWarning)return!1}return void 0!==e.key}(t)&&(a(t.key),b=""+t.key),"key"in t)for(var v in n={},t)"key"!==v&&(n[v]=t[v]);else n=t;return b&&function(e,r){function t(){c||(c=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",r))}t.isReactWarning=!0,Object.defineProperty(e,"key",{get:t,configurable:!0})}(n,"function"==typeof r?r.displayName||r.name||"Unknown":r),function(e,r,t,a,n,o,i,l){return t=o.ref,e={$$typeof:f,type:e,key:r,props:o,_owner:n},null!==(void 0!==t?t:null)?Object.defineProperty(e,"ref",{enumerable:!1,get:s}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:l}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}(r,b,u,0,null===(m=S.A)?null:m.getOwner(),n,d,p)}function l(e){"object"==typeof e&&null!==e&&e.$$typeof===f&&e._store&&(e._store.validated=1)}var c,u=r,f=Symbol.for("react.transitional.element"),d=Symbol.for("react.portal"),p=Symbol.for("react.fragment"),m=Symbol.for("react.strict_mode"),b=Symbol.for("react.profiler"),y=Symbol.for("react.consumer"),v=Symbol.for("react.context"),g=Symbol.for("react.forward_ref"),h=Symbol.for("react.suspense"),j=Symbol.for("react.suspense_list"),N=Symbol.for("react.memo"),w=Symbol.for("react.lazy"),k=Symbol.for("react.activity"),O=Symbol.for("react.client.reference"),S=u.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,_=Object.prototype.hasOwnProperty,P=Array.isArray,C=console.createTask?console.createTask:function(){return null},R={},T=(u={"react-stack-bottom-frame":function(e){return e()}})["react-stack-bottom-frame"].bind(u,o)(),z=C(n(o)),A={};x.Fragment=p,x.jsx=function(e,r,t,a,o){var s=1e4>S.recentlyCreatedOwnerStacks++;return i(e,r,t,!1,0,o,s?Error("react-stack-top-frame"):T,s?C(n(e)):z)},x.jsxs=function(e,r,t,a,o){var s=1e4>S.recentlyCreatedOwnerStacks++;return i(e,r,t,!0,0,o,s?Error("react-stack-top-frame"):T,s?C(n(e)):z)}}()),x}var N=(h||(h=1,"production"===process.env.NODE_ENV?y.exports=function(){if(b)return v;b=1;var e=Symbol.for("react.transitional.element"),r=Symbol.for("react.fragment");function t(r,t,a){var n=null;if(void 0!==a&&(n=""+a),void 0!==t.key&&(n=""+t.key),"key"in t)for(var o in a={},t)"key"!==o&&(a[o]=t[o]);else a=t;return t=a.ref,{$$typeof:e,type:r,key:n,ref:void 0!==t?t:null,props:a}}return v.Fragment=r,v.jsx=t,v.jsxs=t,v}():y.exports=j()),y.exports);function w(){for(var e=arguments.length,r=new Array(e),t=0;t<e;t++)r[t]=arguments[t];return n.twMerge(a.clsx(r))}var k=["className"],O=["className"],S=["className"],_=["className"],P=["className"],C=["className"];function R(e){var r=e.className,t=p(e,k);return N.jsx("div",{"data-slot":"table-container",className:"relative w-full overflow-x-auto",children:N.jsx("table",d({"data-slot":"table",className:w("w-full caption-bottom text-sm",r)},t))})}function T(e){var r=e.className,t=p(e,O);return N.jsx("thead",d({"data-slot":"table-header",className:w("[&_tr]:border-b",r)},t))}function z(e){var r=e.className,t=p(e,S);return N.jsx("tbody",d({"data-slot":"table-body",className:w("[&_tr:last-child]:border-0",r)},t))}function A(e){var r=e.className,t=p(e,_);return N.jsx("tr",d({"data-slot":"table-row",className:w("hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",r)},t))}function E(e){var r=e.className,t=p(e,P);return N.jsx("th",d({"data-slot":"table-head",className:w("text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",r)},t))}function M(e){var r=e.className,t=p(e,C);return N.jsx("td",d({"data-slot":"table-cell",className:w("p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",r)},t))}var I=["className","variant","size","asChild"],D=i.cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",{variants:{variant:{default:"bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",destructive:"bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",outline:"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",secondary:"bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2 has-[>svg]:px-3",sm:"h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",lg:"h-10 rounded-md px-6 has-[>svg]:px-4",icon:"size-9"}},defaultVariants:{variant:"default",size:"default"}});var $=["className"],q=["className"],L=["className","isActive","size"],V=["className"],F=["className"],U=["className"];function H(e){var r=e.className,t=p(e,$);return N.jsx("nav",d({role:"navigation","aria-label":"pagination","data-slot":"pagination",className:w("mx-auto flex w-full justify-center",r)},t))}function G(e){var r=e.className,t=p(e,q);return N.jsx("ul",d({"data-slot":"pagination-content",className:w("flex flex-row items-center gap-1",r)},t))}function W(e){var r=u({},(function(e){if(null==e)throw new TypeError("Cannot destructure "+e)}(e),e));return N.jsx("li",d({"data-slot":"pagination-item"},r))}function B(e){var r=e.className,t=e.isActive,a=e.size,n=void 0===a?"icon":a,o=p(e,L);return N.jsx("a",d({"aria-current":t?"page":void 0,"data-slot":"pagination-link","data-active":t,className:w(D({variant:t?"outline":"ghost",size:n}),r)},o))}function J(e){var r=e.className,t=p(e,V);return N.jsxs(B,d(d({"aria-label":"Go to previous page",size:"default",className:w("gap-1 px-2.5 sm:pl-2.5",r)},t),{},{children:[N.jsx(o.ChevronLeftIcon,{}),N.jsx("span",{className:"hidden sm:block",children:"Previous"})]}))}function K(e){var r=e.className,t=p(e,F);return N.jsxs(B,d(d({"aria-label":"Go to next page",size:"default",className:w("gap-1 px-2.5 sm:pr-2.5",r)},t),{},{children:[N.jsx("span",{className:"hidden sm:block",children:"Next"}),N.jsx(o.ChevronRightIcon,{})]}))}function X(e){var r=e.className,t=p(e,U);return N.jsxs("span",d(d({"aria-hidden":!0,"data-slot":"pagination-ellipsis",className:w("flex size-9 items-center justify-center",r)},t),{},{children:[N.jsx(o.MoreHorizontalIcon,{className:"size-4"}),N.jsx("span",{className:"sr-only",children:"More pages"})]}))}e.Button=function(e){var r=e.className,t=e.variant,a=e.size,n=e.asChild,o=void 0!==n&&n,i=p(e,I),l=o?s.Slot:"button";return N.jsx(l,d({"data-slot":"button",className:w(D({variant:t,size:a,className:r}))},i))},e.DataTable=function(e){var a,n=e.columns,o=e.data,s=e.noCase,i=void 0===s?"No data available":s,l=e.itemsPerPage,c=void 0===l?3:l,u=e.tableContainerClassName,f=e.tableHeadClassName,d=e.tableRowClassName,p=e.tableCellClassName,b=e.paginationWrapperClassName,y=e.paginationButtonClassName,v=e.paginationLinkActiveClassName,g=e.paginationLinkInactiveClassName,h=m(r.useState(1),2),x=h[0],j=h[1],k=Math.ceil(o.length/c),O=r.useMemo(function(){var e=(x-1)*c;return o.slice(e,e+c)},[o,x,c]),S=t.useReactTable({data:O,columns:n,getCoreRowModel:t.getCoreRowModel()}),_=function(e){j(e>0&&e<=k?e:1)};return N.jsxs("div",{children:[N.jsx("div",{className:w("rounded-md border",u),children:N.jsxs(R,{children:[N.jsx(T,{children:S.getHeaderGroups().map(function(e){return N.jsx(A,{children:e.headers.map(function(e){return N.jsx(E,{className:w("text-center w-[200px]",f),children:e.isPlaceholder?null:t.flexRender(e.column.columnDef.header,e.getContext())},e.id)})},e.id)})}),N.jsx(z,{children:null!==(a=S.getRowModel().rows)&&void 0!==a&&a.length?S.getRowModel().rows.map(function(e){return N.jsx(A,{"data-state":e.getIsSelected()&&"selected",className:w("border-b hover:bg-muted/50 data-[state=selected]:bg-muted",d),children:e.getVisibleCells().map(function(e){return N.jsx(M,{className:w("p-4",p),children:t.flexRender(e.column.columnDef.cell,e.getContext())},e.id)})},e.id)}):N.jsx(A,{children:N.jsx(M,{colSpan:n.length,className:w("h-24 text-center",p),children:N.jsx("span",{dangerouslySetInnerHTML:{__html:i}})})})})]})}),N.jsx(H,{className:w("mt-5 flex justify-end mb-3",b),children:N.jsxs(G,{className:"flex",children:[N.jsx(W,{children:N.jsx(J,{onClick:function(){_(x-1)},className:w("mr-2 px-3 py-1",1===x,"pointer-events-none opacity-50",y)})}),function(){var e=[];if(k<=3){for(var r=1;r<=k;r++)e.push(r);return e}for(var t=Math.max(1,x-1),a=Math.min(k,t+3-1),n=t;n<=a;n++)e.push(n);return e}().map(function(e){return N.jsx(W,{children:N.jsx(B,{href:"#",onClick:function(){_(e)},className:w(x===e?v||"bg-teal-600 text-white":g),children:e})},e)}),k>3&&x<k-1&&N.jsx(W,{children:N.jsx(X,{})}),N.jsx(W,{children:N.jsx(K,{onClick:function(){_(x+1)},className:w(x===k?"pointer-events-none opacity-50":"",y)})})]})})]})},e.buttonVariants=D});
//# sourceMappingURL=index.umd.js.map