@starasia/pagination 1.0.2 → 1.0.3

package/dist/pagination.es.js

@@ -1,5 +1,5 @@
-import { jsxs as b, jsx as o } from "react/jsx-runtime";
-import { useMemo as h } from "react";
+import { jsxs as h, jsx as o } from "react/jsx-runtime";
+import { useMemo as b } from "react";
 const x = `@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
 
 :root {
@@ -28,28 +28,12 @@ const x = `@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght
     --starasia-ui-color-gray-50,
     #f9fafb
   );
-  /* blue color */
-  /* blue */
-  --starasia-ui-pagination-color-primary-blue: var(
-    --starasia-ui-color-blue-700,
-    #1d4ed8
-  );
-  --starasia-ui-pagination-color-secondary-blue: var(
-    --starasia-ui-color-blue-500,
-    #3b82f6
-  );
-  --starasia-ui-pagination-color-tertiary-blue: var(
-    --starasia-ui-color-blue-300,
-    #93c5fd
-  );
-  --starasia-ui-pagination-color-quaternary-blue: var(
-    --starasia-ui-color-blue-100,
-    #dbeafe
-  );
-  --starasia-ui-pagination-color-quinary-blue: var(
-    --starasia-ui-color-blue-50,
-    #eff6ff
-  );
+  /* brand color */
+  --starasia-ui-pagination-color-primary-blue: var(--starasia-ui-brand-primary-default);
+  --starasia-ui-pagination-color-secondary-blue: var(--starasia-ui-brand-primary-default);
+  --starasia-ui-pagination-color-tertiary-blue: var(--starasia-ui-brand-primary-secondary);
+  --starasia-ui-pagination-color-quaternary-blue: var(--starasia-ui-brand-primary-tertiary);
+  --starasia-ui-pagination-color-quinary-blue: var(--starasia-ui-brand-primary-tertiary);
 
   /* border radius */
   --starasia-ui-pagination-border-radius: var(--starasia-ui-radii-base, 4px);
@@ -148,7 +132,7 @@ const x = `@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght
   background-color: transparent;
   cursor: default;
 }
-`, u = "...", m = (n, i) => {
+`, d = "...", m = (n, i) => {
   let s = i - n + 1;
   return Array.from({ length: s }, (t, a) => a + n);
 }, w = ({
@@ -156,33 +140,33 @@ const x = `@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght
   // pageSize,
   siblingCount: i = 1,
   currentPage: s
-}) => h(() => {
+}) => b(() => {
   const a = n;
   if (i + 5 >= a)
     return m(1, a);
-  const c = Math.max(s - i, 1), d = Math.min(
+  const u = Math.max(s - i, 1), c = Math.min(
     s + i,
     a
-  ), l = c > 2, r = d < a - 2, g = 1, v = a;
-  if (!l && r) {
-    let p = 3 + 2 * i;
-    return [...m(1, p), u, a];
+  ), g = u > 2, r = c < a - 2, p = 1, v = a;
+  if (!g && r) {
+    let l = 3 + 2 * i;
+    return [...m(1, l), d, a];
   }
-  if (l && !r) {
-    let p = 3 + 2 * i, f = m(
-      a - p + 1,
+  if (g && !r) {
+    let l = 3 + 2 * i, y = m(
+      a - l + 1,
       a
     );
-    return [g, u, ...f];
+    return [p, d, ...y];
   }
-  if (l && r) {
-    let p = m(c, d);
-    return [g, u, ...p, u, v];
+  if (g && r) {
+    let l = m(u, c);
+    return [p, d, ...l, d, v];
   }
-}, [n, i, s]), y = "starasia-pagination-styles", k = (n) => {
-  if (!document.getElementById(y)) {
+}, [n, i, s]), f = "starasia-pagination-styles", k = (n) => {
+  if (!document.getElementById(f)) {
     const i = document.createElement("style");
-    i.id = y, i.textContent = n, document.head.appendChild(i);
+    i.id = f, i.textContent = n, document.head.appendChild(i);
   }
 };
 k(x);
@@ -201,28 +185,28 @@ const N = ({
   });
   if (t === 0 || e.length < 2)
     return null;
-  const c = () => {
+  const u = () => {
     n(t + 1);
-  }, d = () => {
+  }, c = () => {
     n(t - 1);
   };
-  let l = e[e.length - 1];
-  return /* @__PURE__ */ b("ul", { className: "starasia-pagination-container", style: { padding: 0 }, children: [
+  let g = e[e.length - 1];
+  return /* @__PURE__ */ h("ul", { className: "starasia-pagination-container", style: { padding: 0 }, children: [
     /* @__PURE__ */ o(
       "li",
       {
         className: `starasia-pagination-item ${t === 1 ? "starasia-pagination-disabled" : null} ${a === "sm" ? "starasia-pagination-item-responsive" : ""}`,
-        onClick: d,
+        onClick: c,
         children: /* @__PURE__ */ o("div", { className: "starasia-pagination-arrow starasia-pagination-left" })
       }
     ),
-    e.map((r, g) => r === u ? /* @__PURE__ */ o(
+    e.map((r, p) => r === d ? /* @__PURE__ */ o(
       "li",
       {
         className: `starasia-pagination-item starasia-pagination-dots ${a === "sm" ? "starasia-pagination-item-responsive" : ""}`,
         children: "…"
       },
-      g
+      p
     ) : /* @__PURE__ */ o(
       "li",
       {
@@ -230,13 +214,13 @@ const N = ({
         onClick: () => n(Number(r)),
         children: r
       },
-      g
+      p
     )),
     /* @__PURE__ */ o(
       "li",
       {
-        className: `starasia-pagination-item ${t === l ? "starasia-pagination-disabled" : null} ${a === "sm" ? "starasia-pagination-item-responsive" : ""}`,
-        onClick: c,
+        className: `starasia-pagination-item ${t === g ? "starasia-pagination-disabled" : null} ${a === "sm" ? "starasia-pagination-item-responsive" : ""}`,
+        onClick: u,
         children: /* @__PURE__ */ o(
           "div",
           {

package/dist/pagination.umd.js

@@ -1,4 +1,4 @@
-(function(r,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],n):(r=typeof globalThis<"u"?globalThis:r||self,n(r.Pagination={},r.jsxRuntime,r.React))})(this,function(r,n,h){"use strict";const b=`@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
+(function(s,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react/jsx-runtime"),require("react")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react"],n):(s=typeof globalThis<"u"?globalThis:s||self,n(s.Pagination={},s.jsxRuntime,s.React))})(this,function(s,n,h){"use strict";const b=`@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
 
 :root {
   /* spacing */
@@ -26,28 +26,12 @@
     --starasia-ui-color-gray-50,
     #f9fafb
   );
-  /* blue color */
-  /* blue */
-  --starasia-ui-pagination-color-primary-blue: var(
-    --starasia-ui-color-blue-700,
-    #1d4ed8
-  );
-  --starasia-ui-pagination-color-secondary-blue: var(
-    --starasia-ui-color-blue-500,
-    #3b82f6
-  );
-  --starasia-ui-pagination-color-tertiary-blue: var(
-    --starasia-ui-color-blue-300,
-    #93c5fd
-  );
-  --starasia-ui-pagination-color-quaternary-blue: var(
-    --starasia-ui-color-blue-100,
-    #dbeafe
-  );
-  --starasia-ui-pagination-color-quinary-blue: var(
-    --starasia-ui-color-blue-50,
-    #eff6ff
-  );
+  /* brand color */
+  --starasia-ui-pagination-color-primary-blue: var(--starasia-ui-brand-primary-default);
+  --starasia-ui-pagination-color-secondary-blue: var(--starasia-ui-brand-primary-default);
+  --starasia-ui-pagination-color-tertiary-blue: var(--starasia-ui-brand-primary-secondary);
+  --starasia-ui-pagination-color-quaternary-blue: var(--starasia-ui-brand-primary-tertiary);
+  --starasia-ui-pagination-color-quinary-blue: var(--starasia-ui-brand-primary-tertiary);
 
   /* border radius */
   --starasia-ui-pagination-border-radius: var(--starasia-ui-radii-base, 4px);
@@ -146,4 +130,4 @@
   background-color: transparent;
   cursor: default;
 }
-`,l="...",d=(t,i)=>{let e=i-t+1;return Array.from({length:e},(s,a)=>a+t)},x=({totalCount:t,siblingCount:i=1,currentPage:e})=>h.useMemo(()=>{const a=t;if(i+5>=a)return d(1,a);const m=Math.max(e-i,1),f=Math.min(e+i,a),p=m>2,o=f<a-2,c=1,S=a;if(!p&&o){let u=3+2*i;return[...d(1,u),l,a]}if(p&&!o){let u=3+2*i,v=d(a-u+1,a);return[c,l,...v]}if(p&&o){let u=d(m,f);return[c,l,...u,l,S]}},[t,i,e]),y="starasia-pagination-styles";(t=>{if(!document.getElementById(y)){const i=document.createElement("style");i.id=y,i.textContent=t,document.head.appendChild(i)}})(b);const w=({onPageChange:t,totalCount:i,siblingCount:e=1,currentPage:s,size:a="md"})=>{const g=x({currentPage:s,totalCount:i,siblingCount:e});if(s===0||g.length<2)return null;const m=()=>{t(s+1)},f=()=>{t(s-1)};let p=g[g.length-1];return n.jsxs("ul",{className:"starasia-pagination-container",style:{padding:0},children:[n.jsx("li",{className:`starasia-pagination-item ${s===1?"starasia-pagination-disabled":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:f,children:n.jsx("div",{className:"starasia-pagination-arrow starasia-pagination-left"})}),g.map((o,c)=>o===l?n.jsx("li",{className:`starasia-pagination-item starasia-pagination-dots ${a==="sm"?"starasia-pagination-item-responsive":""}`,children:"…"},c):n.jsx("li",{className:`starasia-pagination-item ${o===s?"starasia-pagination-selected":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:()=>t(Number(o)),children:o},c)),n.jsx("li",{className:`starasia-pagination-item ${s===p?"starasia-pagination-disabled":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:m,children:n.jsx("div",{className:"starasia-pagination-arrow starasia-pagination-right"})})]})};r.Pagination=w,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+`,g="...",u=(t,i)=>{let e=i-t+1;return Array.from({length:e},(r,a)=>a+t)},x=({totalCount:t,siblingCount:i=1,currentPage:e})=>h.useMemo(()=>{const a=t;if(i+5>=a)return u(1,a);const m=Math.max(e-i,1),y=Math.min(e+i,a),l=m>2,o=y<a-2,d=1,S=a;if(!l&&o){let c=3+2*i;return[...u(1,c),g,a]}if(l&&!o){let c=3+2*i,v=u(a-c+1,a);return[d,g,...v]}if(l&&o){let c=u(m,y);return[d,g,...c,g,S]}},[t,i,e]),f="starasia-pagination-styles";(t=>{if(!document.getElementById(f)){const i=document.createElement("style");i.id=f,i.textContent=t,document.head.appendChild(i)}})(b);const w=({onPageChange:t,totalCount:i,siblingCount:e=1,currentPage:r,size:a="md"})=>{const p=x({currentPage:r,totalCount:i,siblingCount:e});if(r===0||p.length<2)return null;const m=()=>{t(r+1)},y=()=>{t(r-1)};let l=p[p.length-1];return n.jsxs("ul",{className:"starasia-pagination-container",style:{padding:0},children:[n.jsx("li",{className:`starasia-pagination-item ${r===1?"starasia-pagination-disabled":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:y,children:n.jsx("div",{className:"starasia-pagination-arrow starasia-pagination-left"})}),p.map((o,d)=>o===g?n.jsx("li",{className:`starasia-pagination-item starasia-pagination-dots ${a==="sm"?"starasia-pagination-item-responsive":""}`,children:"…"},d):n.jsx("li",{className:`starasia-pagination-item ${o===r?"starasia-pagination-selected":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:()=>t(Number(o)),children:o},d)),n.jsx("li",{className:`starasia-pagination-item ${r===l?"starasia-pagination-disabled":null} ${a==="sm"?"starasia-pagination-item-responsive":""}`,onClick:m,children:n.jsx("div",{className:"starasia-pagination-arrow starasia-pagination-right"})})]})};s.Pagination=w,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@starasia/pagination",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "pagination component for starasia UI",
   "author": "Prawito Hudoro",
   "main": "dist/pagination.umd.js",
@@ -12,6 +12,10 @@
     "dist/*.map",
     "dist/*.css"
   ],
+  "scripts": {
+    "dev": "vite --config vite.config.ts --port 3000",
+    "build": "vite build --config vite.config.ts"
+  },
   "keywords": [],
   "license": "ISC",
   "type": "module",
@@ -33,9 +37,5 @@
     "react-dom": "^18.2.0",
     "@types/react": "^18.2.55",
     "@types/react-dom": "^18.2.19"
-  },
-  "scripts": {
-    "dev": "vite --config vite.config.ts --port 3000",
-    "build": "vite build --config vite.config.ts"
   }
-}
+}