1mpacto-react-ui 2.0.20 → 2.0.22

package/dist/components/Input/InputFloatingInner.mjs

@@ -1,37 +1,36 @@
 import { jsxs as t, jsx as r } from "react/jsx-runtime";
-import { forwardRef as v, isValidElement as s } from "react";
+import { forwardRef as x, isValidElement as s } from "react";
 import e from "./InputFloatingInner.module.scss.mjs";
-import { configInputFloatingInner as F } from "./InputFloatingInner.config.mjs";
-const E = v((m, p) => {
-  var d;
+import { configInputFloatingInner as v } from "./InputFloatingInner.config.mjs";
+const F = x((d, m) => {
   const {
-    isRequired: f,
-    classNameContainer: u,
-    classNameLabelError: N,
-    classNameLabel: $,
-    className: I,
+    isRequired: p,
+    classNameContainer: f,
+    classNameLabelError: u,
+    classNameLabel: N,
+    className: $,
     name: l,
     id: o,
-    label: b,
-    type: h = "text",
+    label: I,
+    type: b = "text",
     startIcon: n,
     endIcon: a,
     error: i,
-    sizeInput: y = "large",
+    sizeInput: h = "large",
     ...c
-  } = m, g = () => typeof n == "function" || s(n), x = () => typeof a == "function" || s(a);
-  return /* @__PURE__ */ t("div", { className: `${e.container} ${(d = F.size) == null ? void 0 : d[y]} ${u ?? ""}`, children: [
+  } = d, y = () => typeof n == "function" || s(n), g = () => typeof a == "function" || s(a);
+  return /* @__PURE__ */ t("div", { className: `${e.container} ${v.size?.[h]} ${f ?? ""}`, children: [
     /* @__PURE__ */ t("div", { className: e["container-input"], children: [
       /* @__PURE__ */ r(
         "input",
         {
           id: o ?? l,
           className: `${e.input} ${i ? e.error : ""} 
-          ${g() ? e["isset-left-icon"] : ""} 
-          ${x() ? e["isset-right-icon"] : ""} 
-        ${I ?? ""}`,
-          ref: p,
-          type: h,
+          ${y() ? e["isset-left-icon"] : ""} 
+          ${g() ? e["isset-right-icon"] : ""} 
+        ${$ ?? ""}`,
+          ref: m,
+          type: b,
           ...c
         }
       ),
@@ -39,10 +38,10 @@ const E = v((m, p) => {
         typeof n == "function" && n(),
         s(n) && n
       ] }),
-      /* @__PURE__ */ t("label", { className: `${e.label} ${$ ?? ""}`, htmlFor: o ?? l, children: [
-        b,
+      /* @__PURE__ */ t("label", { className: `${e.label} ${N ?? ""}`, htmlFor: o ?? l, children: [
+        I,
         " ",
-        f && /* @__PURE__ */ r("span", { className: "iru-text-laba-red-08", children: "*" })
+        p && /* @__PURE__ */ r("span", { className: "iru-text-laba-red-08", children: "*" })
       ] }),
       /* @__PURE__ */ t("div", { className: e["end-icon"], children: [
         typeof a == "function" && a(),
@@ -53,13 +52,13 @@ const E = v((m, p) => {
       "label",
       {
         className: `${e["label-error"]} 
-          ${c.disabled ? e.disabled : ""} ${N ?? ""}`,
+          ${c.disabled ? e.disabled : ""} ${u ?? ""}`,
         children: i
       }
     )
   ] });
 });
-E.displayName = "InputFloatingInner";
+F.displayName = "InputFloatingInner";
 export {
-  E as default
+  F as default
 };

package/dist/components/NumberFormat/NumberFormat.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-runtime"),n=require("react-number-format"),a=require("../../config/bigNumber/index.cjs"),s=require("../../utils/common.cjs"),d=({max:r,min:u,selectedText:l="Rp0",onChange:e,onFocusInput:o,...c})=>f.jsx(n.NumericFormat,{isAllowed:t=>r!==void 0&&s.isAccurateBigNumber(r)&&a.BigNumber(t.value).isGreaterThan(r)?(typeof e=="function"&&e({target:{value:a.BigNumber(r).toString()}}),!1):u!==void 0&&s.isAccurateBigNumber(u)&&a.BigNumber(t.value).isLessThan(u)?(typeof e=="function"&&e({target:{value:a.BigNumber(u).toString()}}),!1):!0,onValueChange:(t,{source:i})=>{typeof e=="function"&&i.includes("event")&&e({target:{value:t.value}})},decimalSeparator:",",thousandSeparator:".",decimalScale:2,valueIsNumericString:!0,thousandsGroupStyle:"thousand",onFocus:t=>{var i;((i=t==null?void 0:t.target)==null?void 0:i.value)===l&&(typeof o=="function"?o(""):typeof e=="function"&&e({target:{value:""}}))},...c});exports.default=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-runtime"),n=require("react-number-format"),i=require("../../config/bigNumber/index.cjs"),o=require("../../utils/common.cjs"),d=({max:r,min:u,selectedText:s="Rp0",onChange:e,onFocusInput:a,...l})=>f.jsx(n.NumericFormat,{isAllowed:t=>r!==void 0&&o.isAccurateBigNumber(r)&&i.BigNumber(t.value).isGreaterThan(r)?(typeof e=="function"&&e({target:{value:i.BigNumber(r).toString()}}),!1):u!==void 0&&o.isAccurateBigNumber(u)&&i.BigNumber(t.value).isLessThan(u)?(typeof e=="function"&&e({target:{value:i.BigNumber(u).toString()}}),!1):!0,onValueChange:(t,{source:c})=>{typeof e=="function"&&c.includes("event")&&e({target:{value:t.value}})},decimalSeparator:",",thousandSeparator:".",decimalScale:2,valueIsNumericString:!0,thousandsGroupStyle:"thousand",onFocus:t=>{t?.target?.value===s&&(typeof a=="function"?a(""):typeof e=="function"&&e({target:{value:""}}))},...l});exports.default=d;

package/dist/components/NumberFormat/NumberFormat.mjs

@@ -1,31 +1,30 @@
 import { jsx as c } from "react/jsx-runtime";
 import { NumericFormat as p } from "react-number-format";
-import { BigNumber as a } from "../../config/bigNumber/index.mjs";
-import { isAccurateBigNumber as f } from "../../utils/common.mjs";
+import { BigNumber as i } from "../../config/bigNumber/index.mjs";
+import { isAccurateBigNumber as o } from "../../utils/common.mjs";
 const S = ({
   max: r,
   min: u,
-  selectedText: l = "Rp0",
-  onChange: t,
-  onFocusInput: o,
-  ...s
+  selectedText: f = "Rp0",
+  onChange: e,
+  onFocusInput: a,
+  ...l
 }) => /* @__PURE__ */ c(
   p,
   {
-    isAllowed: (e) => r !== void 0 && f(r) && a(e.value).isGreaterThan(r) ? (typeof t == "function" && t({ target: { value: a(r).toString() } }), !1) : u !== void 0 && f(u) && a(e.value).isLessThan(u) ? (typeof t == "function" && t({ target: { value: a(u).toString() } }), !1) : !0,
-    onValueChange: (e, { source: i }) => {
-      typeof t == "function" && i.includes("event") && t({ target: { value: e.value } });
+    isAllowed: (t) => r !== void 0 && o(r) && i(t.value).isGreaterThan(r) ? (typeof e == "function" && e({ target: { value: i(r).toString() } }), !1) : u !== void 0 && o(u) && i(t.value).isLessThan(u) ? (typeof e == "function" && e({ target: { value: i(u).toString() } }), !1) : !0,
+    onValueChange: (t, { source: s }) => {
+      typeof e == "function" && s.includes("event") && e({ target: { value: t.value } });
     },
     decimalSeparator: ",",
     thousandSeparator: ".",
     decimalScale: 2,
     valueIsNumericString: !0,
     thousandsGroupStyle: "thousand",
-    onFocus: (e) => {
-      var i;
-      ((i = e == null ? void 0 : e.target) == null ? void 0 : i.value) === l && (typeof o == "function" ? o("") : typeof t == "function" && t({ target: { value: "" } }));
+    onFocus: (t) => {
+      t?.target?.value === f && (typeof a == "function" ? a("") : typeof e == "function" && e({ target: { value: "" } }));
     },
-    ...s
+    ...l
   }
 );
 export {

package/dist/components/Pagination/Pagination.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("react"),r=require("./style.module.scss.cjs"),m=require("../../utils/common.cjs"),G=require("../Calendar/CalendarYear.cjs"),W=require("../Popover/Popover.cjs"),X=require("../Button/Button.cjs"),q=require("./Pagination.config.cjs"),x=(t,s)=>{const u=s-t+1;return Array.from({length:u},(a,N)=>N+t)},k={"en-US":{"Rows per page:":"Rows per page:",of:"of","Go to:":"Go to:"},"id-ID":{"Rows per page:":"Baris per halaman:",of:"dari","Go to:":"Go to:"},"zh-CN":{"Rows per page:":"每页行数：",of:"共","Go to:":"跳至："},"nl-NL":{"Rows per page:":"Rijen per pagina:",of:"van","Go to:":"Ga naar:"}},Z=({totalData:t,totalPage:s,pageNumber:u,pageSize:a,className:N,id:d="1ru-pagination",kind:E="box",prevIcon:g,nextIcon:p,onChange:j,optionPageSize:I=[25,50,75,100],offset:L=1.5,zIndex:O,withGotoPage:A=!1,withMorePage:M=!0,withOptionPageSize:F=!1,locale:$="id-ID",fonts:S="inter"})=>{const w=l.useRef(null),[i,C]=l.useState(u),[T,y]=l.useState(u.toString()),f=1,U=(i-1)*a+1,_=a*i,Y=t?`${m.formatNumber(U,"decimal")}-${_>=t?m.formatNumber(t,"decimal"):m.formatNumber(_,"decimal")}`:0,H=l.useMemo(()=>{const e=Math.ceil(t/a);if(f+5>=e)return x(1,e);const c=Math.max(i-f,1),B=Math.min(i+f,e),R=c>2,P=B<e-2,V=1,Q=e;if(!R&&P){const b=3+2*f;return[...x(1,b),"mr",e]}if(R&&!P){const b=3+2*f,v=x(e-b+1,e);return[V,"ml",...v]}if(R&&P){const b=x(c,B);return[V,"ml",...b,"mr",Q]}},[t,a,f,i]),h=e=>{typeof j=="function"&&(j(e),C(e.pageNumber),y(e.pageNumber.toString()))},J=e=>{if(typeof j=="function"&&M){if(e==="ml"){const c=i-5;C(c<1?1:i-5)}else if(e==="mr"){const c=i+5;C(c>s?s:i+5)}}},K=e=>{y(e);const o=Number(e);o>0&&o<=s&&h({pageSize:a,totalData:t,totalPage:s,pageNumber:o})};return n.jsxs(n.Fragment,{children:[n.jsxs("div",{id:d,className:`${q.configPagination.kind[E]} ${q.configPagination.fonts[S].value} ${N}`,children:[n.jsxs("div",{className:r.default["pagination-size"],children:[n.jsx("span",{children:k[$]["Rows per page:"]}),F&&n.jsx(X.default,{id:`${d}-option-size`,variants:"ghost-blue-gray-100-bg_white",size:"xs",endIcon:n.jsx(G.ChevronDownIcon,{className:"!iru-text-gray-500 !iru-w-[14px] !iru-h-[14px] iru-mx-0.5"}),className:"!iru-rounded-md !iru-min-w-[60px] iru-justify-between",onClick:e=>{var o;return(o=w.current)==null?void 0:o.handlerShow(e)},children:m.formatNumber(a,"decimal")}),n.jsxs("span",{children:[Y," ",k[$].of," ",m.formatNumber(t,"decimal")]})]}),n.jsxs("div",{className:r.default["navigation-container"],children:[n.jsx("button",{id:`${d}-button-prev`,className:`${r.default["button-prev"]}`,disabled:i===1,onClick:()=>h({pageSize:a,totalData:t,totalPage:s,pageNumber:u-1}),children:typeof g=="function"||l.isValidElement(g)?l.isValidElement(g)?g:g():n.jsx(G.ChevronDownIcon,{className:"iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]"})}),(H??[]).map((e,o)=>{if(typeof e!="number"){const c=["ml","mr"].includes(e);return n.jsx("button",{className:r.default["button-container"],disabled:!M,onClick:()=>J(e),children:c?"...":e},o)}return n.jsx("button",{id:`${d}-button-${e}`,className:`${e===u?r.default["pagination-active"]:""} ${r.default["button-container"]}  
-                ${q.configPagination.fonts[S].typographyButtonLabel}`,disabled:e===u,onClick:()=>h({pageSize:a,totalData:t,totalPage:s,pageNumber:e}),children:m.formatNumber(e,"decimal")},o)}),n.jsx("button",{id:`${d}-button-next`,className:`${r.default["button-next"]}`,disabled:i===s||!s,onClick:()=>h({pageSize:a,totalData:t,totalPage:s,pageNumber:u+1}),children:typeof p=="function"||l.isValidElement(p)?l.isValidElement(p)?p:p():n.jsx(G.ChevronDownIcon,{className:"-iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]"})}),A&&n.jsxs("div",{className:r.default["goto-page"],children:[n.jsx("span",{children:k[$]["Go to:"]}),n.jsx("input",{id:`${d}-goto-page`,type:"number",className:r.default["goto-page-input"],value:T,onChange:e=>K(e.target.value),onBlur:()=>y(i.toString())})]})]})]}),n.jsx(W.default,{floatingOptions:{placement:"bottom-end"},ref:w,className:r.default["options-size"],offset:L,zIndex:O,id:`${d}-popover-options-size`,children:I.map((e,o)=>n.jsx("p",{id:`${d}-option-size-${e}`,className:`${r.default.option} ${e===a?r.default.active:""}`,onClick:()=>{var c;h({totalData:t,totalPage:s,pageSize:e,pageNumber:1}),(c=w.current)==null||c.setShow(!1)},children:m.formatNumber(e,"decimal")},o))})]})};exports.default=Z;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),l=require("react"),i=require("./style.module.scss.cjs"),m=require("../../utils/common.cjs"),G=require("../Calendar/CalendarYear.cjs"),W=require("../Popover/Popover.cjs"),X=require("../Button/Button.cjs"),q=require("./Pagination.config.cjs"),x=(t,o)=>{const c=o-t+1;return Array.from({length:c},(r,N)=>N+t)},k={"en-US":{"Rows per page:":"Rows per page:",of:"of","Go to:":"Go to:"},"id-ID":{"Rows per page:":"Baris per halaman:",of:"dari","Go to:":"Go to:"},"zh-CN":{"Rows per page:":"每页行数：",of:"共","Go to:":"跳至："},"nl-NL":{"Rows per page:":"Rijen per pagina:",of:"van","Go to:":"Ga naar:"}},Z=({totalData:t,totalPage:o,pageNumber:c,pageSize:r,className:N,id:u="1ru-pagination",kind:E="box",prevIcon:g,nextIcon:p,onChange:j,optionPageSize:I=[25,50,75,100],offset:L=1.5,zIndex:O,withGotoPage:A=!1,withMorePage:M=!0,withOptionPageSize:F=!1,locale:$="id-ID",fonts:S="inter"})=>{const w=l.useRef(null),[s,C]=l.useState(c),[T,y]=l.useState(c.toString()),f=1,U=(s-1)*r+1,_=r*s,Y=t?`${m.formatNumber(U,"decimal")}-${_>=t?m.formatNumber(t,"decimal"):m.formatNumber(_,"decimal")}`:0,H=l.useMemo(()=>{const e=Math.ceil(t/r);if(f+5>=e)return x(1,e);const d=Math.max(s-f,1),B=Math.min(s+f,e),R=d>2,P=B<e-2,V=1,Q=e;if(!R&&P){const b=3+2*f;return[...x(1,b),"mr",e]}if(R&&!P){const b=3+2*f,v=x(e-b+1,e);return[V,"ml",...v]}if(R&&P){const b=x(d,B);return[V,"ml",...b,"mr",Q]}},[t,r,f,s]),h=e=>{typeof j=="function"&&(j(e),C(e.pageNumber),y(e.pageNumber.toString()))},J=e=>{if(typeof j=="function"&&M){if(e==="ml"){const d=s-5;C(d<1?1:s-5)}else if(e==="mr"){const d=s+5;C(d>o?o:s+5)}}},K=e=>{y(e);const a=Number(e);a>0&&a<=o&&h({pageSize:r,totalData:t,totalPage:o,pageNumber:a})};return n.jsxs(n.Fragment,{children:[n.jsxs("div",{id:u,className:`${q.configPagination.kind[E]} ${q.configPagination.fonts[S].value} ${N}`,children:[n.jsxs("div",{className:i.default["pagination-size"],children:[n.jsx("span",{children:k[$]["Rows per page:"]}),F&&n.jsx(X.default,{id:`${u}-option-size`,variants:"ghost-blue-gray-100-bg_white",size:"xs",endIcon:n.jsx(G.ChevronDownIcon,{className:"!iru-text-gray-500 !iru-w-[14px] !iru-h-[14px] iru-mx-0.5"}),className:"!iru-rounded-md !iru-min-w-[60px] iru-justify-between",onClick:e=>w.current?.handlerShow(e),children:m.formatNumber(r,"decimal")}),n.jsxs("span",{children:[Y," ",k[$].of," ",m.formatNumber(t,"decimal")]})]}),n.jsxs("div",{className:i.default["navigation-container"],children:[n.jsx("button",{id:`${u}-button-prev`,className:`${i.default["button-prev"]}`,disabled:s===1,onClick:()=>h({pageSize:r,totalData:t,totalPage:o,pageNumber:c-1}),children:typeof g=="function"||l.isValidElement(g)?l.isValidElement(g)?g:g():n.jsx(G.ChevronDownIcon,{className:"iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]"})}),(H??[]).map((e,a)=>{if(typeof e!="number"){const d=["ml","mr"].includes(e);return n.jsx("button",{className:i.default["button-container"],disabled:!M,onClick:()=>J(e),children:d?"...":e},a)}return n.jsx("button",{id:`${u}-button-${e}`,className:`${e===c?i.default["pagination-active"]:""} ${i.default["button-container"]}  
+                ${q.configPagination.fonts[S].typographyButtonLabel}`,disabled:e===c,onClick:()=>h({pageSize:r,totalData:t,totalPage:o,pageNumber:e}),children:m.formatNumber(e,"decimal")},a)}),n.jsx("button",{id:`${u}-button-next`,className:`${i.default["button-next"]}`,disabled:s===o||!o,onClick:()=>h({pageSize:r,totalData:t,totalPage:o,pageNumber:c+1}),children:typeof p=="function"||l.isValidElement(p)?l.isValidElement(p)?p:p():n.jsx(G.ChevronDownIcon,{className:"-iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]"})}),A&&n.jsxs("div",{className:i.default["goto-page"],children:[n.jsx("span",{children:k[$]["Go to:"]}),n.jsx("input",{id:`${u}-goto-page`,type:"number",className:i.default["goto-page-input"],value:T,onChange:e=>K(e.target.value),onBlur:()=>y(s.toString())})]})]})]}),n.jsx(W.default,{floatingOptions:{placement:"bottom-end"},ref:w,className:i.default["options-size"],offset:L,zIndex:O,id:`${u}-popover-options-size`,children:I.map((e,a)=>n.jsx("p",{id:`${u}-option-size-${e}`,className:`${i.default.option} ${e===r?i.default.active:""}`,onClick:()=>{h({totalData:t,totalPage:o,pageSize:e,pageNumber:1}),w.current?.setShow(!1)},children:m.formatNumber(e,"decimal")},a))})]})};exports.default=Z;

package/dist/components/Pagination/Pagination.mjs

@@ -1,14 +1,14 @@
-import { jsxs as l, Fragment as Z, jsx as o } from "react/jsx-runtime";
+import { jsxs as l, Fragment as Z, jsx as e } from "react/jsx-runtime";
 import B, { useMemo as z, isValidElement as N } from "react";
-import s from "./style.module.scss.mjs";
+import r from "./style.module.scss.mjs";
 import { formatNumber as u } from "../../utils/common.mjs";
 import { ChevronDownIcon as M } from "../Calendar/CalendarYear.mjs";
 import D from "../Popover/Popover.mjs";
 import nn from "../Button/Button.mjs";
 import { configPagination as j } from "./Pagination.config.mjs";
-const $ = (t, i) => {
-  const m = i - t + 1;
-  return Array.from({ length: m }, (c, w) => w + t);
+const $ = (t, o) => {
+  const a = o - t + 1;
+  return Array.from({ length: a }, (s, w) => w + t);
 }, L = {
   "en-US": {
     "Rows per page:": "Rows per page:",
@@ -32,11 +32,11 @@ const $ = (t, i) => {
   }
 }, dn = ({
   totalData: t,
-  totalPage: i,
-  pageNumber: m,
-  pageSize: c,
+  totalPage: o,
+  pageNumber: a,
+  pageSize: s,
   className: w,
-  id: d = "1ru-pagination",
+  id: m = "1ru-pagination",
   kind: F = "box",
   prevIcon: f,
   nextIcon: g,
@@ -50,11 +50,11 @@ const $ = (t, i) => {
   locale: y = "id-ID",
   fonts: I = "inter"
 }) => {
-  const C = B.useRef(null), [r, R] = B.useState(m), [J, G] = B.useState(m.toString()), p = 1, K = (r - 1) * c + 1, V = c * r, Q = t ? `${u(K, "decimal")}-${V >= t ? u(t, "decimal") : u(V, "decimal")}` : 0, T = z(() => {
-    const n = Math.ceil(t / c);
+  const C = B.useRef(null), [i, R] = B.useState(a), [J, G] = B.useState(a.toString()), p = 1, K = (i - 1) * s + 1, V = s * i, Q = t ? `${u(K, "decimal")}-${V >= t ? u(t, "decimal") : u(V, "decimal")}` : 0, T = z(() => {
+    const n = Math.ceil(t / s);
     if (p + 5 >= n)
       return $(1, n);
-    const a = Math.max(r - p, 1), _ = Math.min(r + p, n), k = a > 2, P = _ < n - 2, A = 1, Y = n;
+    const d = Math.max(i - p, 1), _ = Math.min(i + p, n), k = d > 2, P = _ < n - 2, A = 1, Y = n;
     if (!k && P) {
       const b = 3 + 2 * p;
       return [...$(1, b), "mr", n];
@@ -64,48 +64,45 @@ const $ = (t, i) => {
       return [A, "ml", ...E];
     }
     if (k && P) {
-      const b = $(a, _);
+      const b = $(d, _);
       return [A, "ml", ...b, "mr", Y];
     }
-  }, [t, c, p, r]), h = (n) => {
+  }, [t, s, p, i]), h = (n) => {
     typeof x == "function" && (x(n), R(n.pageNumber), G(n.pageNumber.toString()));
   }, W = (n) => {
     if (typeof x == "function" && S) {
       if (n === "ml") {
-        const a = r - 5;
-        R(a < 1 ? 1 : r - 5);
+        const d = i - 5;
+        R(d < 1 ? 1 : i - 5);
       } else if (n === "mr") {
-        const a = r + 5;
-        R(a > i ? i : r + 5);
+        const d = i + 5;
+        R(d > o ? o : i + 5);
       }
     }
   }, X = (n) => {
     G(n);
-    const e = Number(n);
-    e > 0 && e <= i && h({
-      pageSize: c,
+    const c = Number(n);
+    c > 0 && c <= o && h({
+      pageSize: s,
       totalData: t,
-      totalPage: i,
-      pageNumber: e
+      totalPage: o,
+      pageNumber: c
     });
   };
   return /* @__PURE__ */ l(Z, { children: [
-    /* @__PURE__ */ l("div", { id: d, className: `${j.kind[F]} ${j.fonts[I].value} ${w}`, children: [
-      /* @__PURE__ */ l("div", { className: s["pagination-size"], children: [
-        /* @__PURE__ */ o("span", { children: L[y]["Rows per page:"] }),
-        H && /* @__PURE__ */ o(
+    /* @__PURE__ */ l("div", { id: m, className: `${j.kind[F]} ${j.fonts[I].value} ${w}`, children: [
+      /* @__PURE__ */ l("div", { className: r["pagination-size"], children: [
+        /* @__PURE__ */ e("span", { children: L[y]["Rows per page:"] }),
+        H && /* @__PURE__ */ e(
           nn,
           {
-            id: `${d}-option-size`,
+            id: `${m}-option-size`,
             variants: "ghost-blue-gray-100-bg_white",
             size: "xs",
-            endIcon: /* @__PURE__ */ o(M, { className: "!iru-text-gray-500 !iru-w-[14px] !iru-h-[14px] iru-mx-0.5" }),
+            endIcon: /* @__PURE__ */ e(M, { className: "!iru-text-gray-500 !iru-w-[14px] !iru-h-[14px] iru-mx-0.5" }),
             className: "!iru-rounded-md !iru-min-w-[60px] iru-justify-between",
-            onClick: (n) => {
-              var e;
-              return (e = C.current) == null ? void 0 : e.handlerShow(n);
-            },
-            children: u(c, "decimal")
+            onClick: (n) => C.current?.handlerShow(n),
+            children: u(s, "decimal")
           }
         ),
         /* @__PURE__ */ l("span", { children: [
@@ -116,111 +113,110 @@ const $ = (t, i) => {
           u(t, "decimal")
         ] })
       ] }),
-      /* @__PURE__ */ l("div", { className: s["navigation-container"], children: [
-        /* @__PURE__ */ o(
+      /* @__PURE__ */ l("div", { className: r["navigation-container"], children: [
+        /* @__PURE__ */ e(
           "button",
           {
-            id: `${d}-button-prev`,
-            className: `${s["button-prev"]}`,
-            disabled: r === 1,
+            id: `${m}-button-prev`,
+            className: `${r["button-prev"]}`,
+            disabled: i === 1,
             onClick: () => h({
-              pageSize: c,
+              pageSize: s,
               totalData: t,
-              totalPage: i,
-              pageNumber: m - 1
+              totalPage: o,
+              pageNumber: a - 1
             }),
-            children: typeof f == "function" || N(f) ? N(f) ? f : f() : /* @__PURE__ */ o(M, { className: "iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]" })
+            children: typeof f == "function" || N(f) ? N(f) ? f : f() : /* @__PURE__ */ e(M, { className: "iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]" })
           }
         ),
-        (T ?? []).map((n, e) => {
+        (T ?? []).map((n, c) => {
           if (typeof n != "number") {
-            const a = ["ml", "mr"].includes(n);
-            return /* @__PURE__ */ o(
+            const d = ["ml", "mr"].includes(n);
+            return /* @__PURE__ */ e(
               "button",
               {
-                className: s["button-container"],
+                className: r["button-container"],
                 disabled: !S,
                 onClick: () => W(n),
-                children: a ? "..." : n
+                children: d ? "..." : n
               },
-              e
+              c
             );
           }
-          return /* @__PURE__ */ o(
+          return /* @__PURE__ */ e(
             "button",
             {
-              id: `${d}-button-${n}`,
-              className: `${n === m ? s["pagination-active"] : ""} ${s["button-container"]}  
+              id: `${m}-button-${n}`,
+              className: `${n === a ? r["pagination-active"] : ""} ${r["button-container"]}  
                 ${j.fonts[I].typographyButtonLabel}`,
-              disabled: n === m,
+              disabled: n === a,
               onClick: () => h({
-                pageSize: c,
+                pageSize: s,
                 totalData: t,
-                totalPage: i,
+                totalPage: o,
                 pageNumber: n
               }),
               children: u(n, "decimal")
             },
-            e
+            c
           );
         }),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ e(
           "button",
           {
-            id: `${d}-button-next`,
-            className: `${s["button-next"]}`,
-            disabled: r === i || !i,
+            id: `${m}-button-next`,
+            className: `${r["button-next"]}`,
+            disabled: i === o || !o,
             onClick: () => h({
-              pageSize: c,
+              pageSize: s,
               totalData: t,
-              totalPage: i,
-              pageNumber: m + 1
+              totalPage: o,
+              pageNumber: a + 1
             }),
-            children: typeof g == "function" || N(g) ? N(g) ? g : g() : /* @__PURE__ */ o(M, { className: "-iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]" })
+            children: typeof g == "function" || N(g) ? N(g) ? g : g() : /* @__PURE__ */ e(M, { className: "-iru-rotate-90 !iru-text-gray-500 !iru-w-[14px] !iru-h-[14px]" })
           }
         ),
-        v && /* @__PURE__ */ l("div", { className: s["goto-page"], children: [
-          /* @__PURE__ */ o("span", { children: L[y]["Go to:"] }),
-          /* @__PURE__ */ o(
+        v && /* @__PURE__ */ l("div", { className: r["goto-page"], children: [
+          /* @__PURE__ */ e("span", { children: L[y]["Go to:"] }),
+          /* @__PURE__ */ e(
             "input",
             {
-              id: `${d}-goto-page`,
+              id: `${m}-goto-page`,
               type: "number",
-              className: s["goto-page-input"],
+              className: r["goto-page-input"],
               value: J,
               onChange: (n) => X(n.target.value),
-              onBlur: () => G(r.toString())
+              onBlur: () => G(i.toString())
             }
           )
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ e(
       D,
       {
         floatingOptions: { placement: "bottom-end" },
         ref: C,
-        className: s["options-size"],
+        className: r["options-size"],
         offset: U,
         zIndex: q,
-        id: `${d}-popover-options-size`,
-        children: O.map((n, e) => /* @__PURE__ */ o(
+        id: `${m}-popover-options-size`,
+        children: O.map((n, c) => /* @__PURE__ */ e(
           "p",
           {
-            id: `${d}-option-size-${n}`,
-            className: `${s.option} ${n === c ? s.active : ""}`,
+            id: `${m}-option-size-${n}`,
+            className: `${r.option} ${n === s ? r.active : ""}`,
             onClick: () => {
-              var a;
               h({
                 totalData: t,
-                totalPage: i,
+                totalPage: o,
                 pageSize: n,
                 pageNumber: 1
-              }), (a = C.current) == null || a.setShow(!1);
+              }), C.current?.setShow(!1);
             },
             children: u(n, "decimal")
           },
-          e
+          c
         ))
       }
     )

package/dist/components/SelectDropdownContainer/SelectDropdownContainer.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-runtime"),t=require("react"),ne=require("react-select"),oe=require("../Popover/Popover.cjs"),re=require("./SelectDropdownContainer.module.scss.cjs"),V=require("../../hooks/useDeepCompareEffect.cjs"),p=require("./SelectDropdownContainer.config.cjs"),y=t.forwardRef((m,N)=>{const{width:h,children:E,components:I,classNameContainer:x="",classNameContainerShowSelect:M="",classNameContainerSelect:$="",classNameLabelError:b="",error:q,onChange:v,externalValue:l=!1,defaultValueButtonDropdown:r={},autoClose:j=!0,onMenuOpen:z=()=>{},autoCloseOutside:L=!0,styleInnerPopper:_={},onMenuClose:T=()=>{},zIndexPopper:W=0,id:k="select-dropdown-container",idPopover:F="select-dropdown-container-popover",useAutoPlacement:A,flipOptions:B,autoPlacementOptions:H,withSearch:G=!1,floatingOptions:J={},offsetPopover:K=5,selectProps:Q={},errorLabel:U="payhere",controlType:w="payhere",actionValueChange:X=()=>{},...Y}=m,s=t.useRef(null),a=t.useRef(null),[Z,g]=t.useState(""),[o,S]=t.useState(!1),[i,c]=t.useState({}),[D,P]=t.useState(0),C=e=>{var n;(n=a.current)==null||n.setShow(e),S(e)},ee=()=>{if(l)return m.isMulti?r:[r]},O=e=>{var n;(n=a.current)==null||n.handlerShow(e),P(s.current.offsetWidth),S(d=>!d)},R=()=>{var e;L&&((e=a.current)==null||e.setShow(!1))},te=(e,n)=>{var d;j&&(S(!1),(d=a.current)==null||d.setShow(!1)),typeof v=="function"&&v(e,n),l||c(e)},u=()=>{s.current&&P(s.current.offsetWidth)};return V.useDeepCompareEffect(()=>{l&&c(r),X(r)},[l,r]),t.useEffect(()=>{o?z():o||(T(),g(""))},[o]),t.useImperativeHandle(N,()=>({selectValue:i,setSelectValue:c,handlerClose:R,handlerShow:O,show:o,setShow:C}),[o,V.useDeepCompareMemoize(i)]),t.useEffect(()=>(window.addEventListener("resize",u),window.addEventListener("load",u),()=>{window.removeEventListener("resize",u),window.removeEventListener("load",u)}),[s]),f.jsxs("div",{id:k,className:`${re.default.container} ${x} ${o?`${M} open-popover`:null}`,ref:s,children:[E({selectValue:i,setSelectValue:c,handlerClose:R,handlerShow:O,show:o,setShow:C}),f.jsx(oe.default,{ref:a,offset:K,useAutoPlacement:A,flipOptions:B,autoPlacementOptions:H,zIndex:W,styleInnerPopover:_,id:F,width:typeof h=="function"?h(D,i):h||D,className:`${$} ${p.configSelectDropdownContainer.classNamePopover[w]}`,floatingOptions:J,children:f.jsx(ne,{className:"iru-w-full",defaultValue:ee(),inputValue:Z,onInputChange:(e,{action:n})=>{n==="input-change"&&g(e)},openMenuOnFocus:!0,autoFocus:!1,backspaceRemovesValue:!1,components:{IndicatorSeparator:null,...I},controlShouldRenderValue:!1,hideSelectedOptions:!1,isClearable:!1,menuIsOpen:!0,tabSelectsValue:!1,styles:G?p.configSelectDropdownContainer.variant[w]:p.configSelectDropdownContainer.noSearchVariant[w],noOptionsMessage:()=>"Tidak ada data.",onChange:te,selectProps:{...Q,setShowDropdown:C},...Y})}),f.jsx("div",{className:`${p.configSelectDropdownContainer.error[U]} ${b}`,children:q})]})});y.displayName="SelectDropdownContainer";exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),e=require("react"),te=require("react-select"),ne=require("../Popover/Popover.cjs"),oe=require("./SelectDropdownContainer.module.scss.cjs"),R=require("../../hooks/useDeepCompareEffect.cjs"),f=require("./SelectDropdownContainer.config.cjs"),V=e.forwardRef((C,y)=>{const{width:p,children:N,components:E,classNameContainer:I="",classNameContainerShowSelect:x="",classNameContainerSelect:M="",classNameLabelError:$="",error:b,onChange:m,externalValue:l=!1,defaultValueButtonDropdown:o={},autoClose:q=!0,onMenuOpen:j=()=>{},autoCloseOutside:z=!0,styleInnerPopper:L={},onMenuClose:_=()=>{},zIndexPopper:T=0,id:W="select-dropdown-container",idPopover:k="select-dropdown-container-popover",useAutoPlacement:F,flipOptions:A,autoPlacementOptions:B,withSearch:H=!1,floatingOptions:G={},offsetPopover:J=5,selectProps:K={},errorLabel:Q="payhere",controlType:h="payhere",actionValueChange:U=()=>{},...X}=C,r=e.useRef(null),s=e.useRef(null),[Y,v]=e.useState(""),[n,w]=e.useState(!1),[i,c]=e.useState({}),[g,D]=e.useState(0),S=t=>{s.current?.setShow(t),w(t)},Z=()=>{if(l)return C.isMulti?o:[o]},P=t=>{s.current?.handlerShow(t),D(r.current.offsetWidth),w(a=>!a)},O=()=>{z&&s.current?.setShow(!1)},ee=(t,a)=>{q&&(w(!1),s.current?.setShow(!1)),typeof m=="function"&&m(t,a),l||c(t)},u=()=>{r.current&&D(r.current.offsetWidth)};return R.useDeepCompareEffect(()=>{l&&c(o),U(o)},[l,o]),e.useEffect(()=>{n?j():n||(_(),v(""))},[n]),e.useImperativeHandle(y,()=>({selectValue:i,setSelectValue:c,handlerClose:O,handlerShow:P,show:n,setShow:S}),[n,R.useDeepCompareMemoize(i)]),e.useEffect(()=>(window.addEventListener("resize",u),window.addEventListener("load",u),()=>{window.removeEventListener("resize",u),window.removeEventListener("load",u)}),[r]),d.jsxs("div",{id:W,className:`${oe.default.container} ${I} ${n?`${x} open-popover`:null}`,ref:r,children:[N({selectValue:i,setSelectValue:c,handlerClose:O,handlerShow:P,show:n,setShow:S}),d.jsx(ne.default,{ref:s,offset:J,useAutoPlacement:F,flipOptions:A,autoPlacementOptions:B,zIndex:T,styleInnerPopover:L,id:k,width:typeof p=="function"?p(g,i):p||g,className:`${M} ${f.configSelectDropdownContainer.classNamePopover[h]}`,floatingOptions:G,children:d.jsx(te,{className:"iru-w-full",defaultValue:Z(),inputValue:Y,onInputChange:(t,{action:a})=>{a==="input-change"&&v(t)},openMenuOnFocus:!0,autoFocus:!1,backspaceRemovesValue:!1,components:{IndicatorSeparator:null,...E},controlShouldRenderValue:!1,hideSelectedOptions:!1,isClearable:!1,menuIsOpen:!0,tabSelectsValue:!1,styles:H?f.configSelectDropdownContainer.variant[h]:f.configSelectDropdownContainer.noSearchVariant[h],noOptionsMessage:()=>"Tidak ada data.",onChange:ee,selectProps:{...K,setShowDropdown:S},...X})}),d.jsx("div",{className:`${f.configSelectDropdownContainer.error[Q]} ${$}`,children:b})]})});V.displayName="SelectDropdownContainer";exports.default=V;