1mpacto-react-ui 2.0.16 → 2.0.18

package/dist/components/Chips/Chips.config.mjs

@@ -0,0 +1,35 @@
+import { configFont as e } from "../../config/components/font.mjs";
+import { configtypography as a } from "../../config/components/typography.mjs";
+import l from "./style.module.scss.mjs";
+const s = {
+  fonts: e,
+  size: {
+    reguler: {
+      style: l["chips-reguler"],
+      typography: "laba-subtitle-rb"
+    },
+    small: {
+      style: l["chips-small"],
+      typography: "laba-subtitle-sb"
+    },
+    l: {
+      style: l["chips-l"],
+      typography: "payhere-label-r"
+    },
+    s: {
+      style: l["chips-s"],
+      typography: "payhere-body-esm"
+    }
+  },
+  typography: a,
+  variants: {
+    "filled-laba-blue-10": l["filled-laba-blue-10"],
+    "filled-gray-300": l["filled-gray-300"],
+    "filled-blue-gray-100": l["filled-blue-gray-100"],
+    "ghost-laba-grey-02": l["ghost-laba-grey-02"],
+    "nude-laba-grey-10": l["nude-laba-grey-10"]
+  }
+};
+export {
+  s as configChips
+};

package/dist/components/Chips/Chips.mjs

@@ -0,0 +1,37 @@
+import { jsx as i, Fragment as a, jsxs as d } from "react/jsx-runtime";
+import { forwardRef as g, isValidElement as n } from "react";
+import { configChips as e } from "./Chips.config.mjs";
+const u = g((p, f) => {
+  const {
+    className: l,
+    children: m,
+    fonts: c = "inter",
+    size: s = "reguler",
+    variants: y = "filled-laba-blue-10",
+    icon: o = /* @__PURE__ */ i(a, {}),
+    removeIcon: r = /* @__PURE__ */ i(a, {}),
+    typography: t,
+    ...h
+  } = p;
+  return /* @__PURE__ */ d(
+    "span",
+    {
+      className: `${e.fonts[c]} ${e.size[s].style}
+      ${t ? e.typography[t] : e.size[s].typography}
+      ${e.variants[y]} ${l ?? ""}`,
+      ref: f,
+      ...h,
+      children: [
+        typeof o == "function" && o(),
+        n(o) && o,
+        m,
+        typeof r == "function" && r(),
+        n(r) && r
+      ]
+    }
+  );
+});
+u.displayName = "Chips";
+export {
+  u as default
+};

package/dist/components/Chips/style.module.scss.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l={"chips-reguler":"_chips-reguler_s2mpn_1","chips-small":"_chips-small_s2mpn_13","chips-l":"_chips-l_s2mpn_25","chips-s":"_chips-s_s2mpn_13","filled-laba-blue-10":"_filled-laba-blue-10_s2mpn_49","filled-blue-gray-100":"_filled-blue-gray-100_s2mpn_54","filled-gray-300":"_filled-gray-300_s2mpn_59","ghost-laba-grey-02":"_ghost-laba-grey-02_s2mpn_64","nude-laba-grey-10":"_nude-laba-grey-10_s2mpn_70"};exports.default=l;

package/dist/components/Chips/style.module.scss.mjs

@@ -0,0 +1,14 @@
+const l = {
+  "chips-reguler": "_chips-reguler_s2mpn_1",
+  "chips-small": "_chips-small_s2mpn_13",
+  "chips-l": "_chips-l_s2mpn_25",
+  "chips-s": "_chips-s_s2mpn_13",
+  "filled-laba-blue-10": "_filled-laba-blue-10_s2mpn_49",
+  "filled-blue-gray-100": "_filled-blue-gray-100_s2mpn_54",
+  "filled-gray-300": "_filled-gray-300_s2mpn_59",
+  "ghost-laba-grey-02": "_ghost-laba-grey-02_s2mpn_64",
+  "nude-laba-grey-10": "_nude-laba-grey-10_s2mpn_70"
+};
+export {
+  l as default
+};

package/dist/components/Collapse/Collapse.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),o=require("react"),g=require("./style.module.scss.cjs"),w=({children:l,id:s,open:r,className:a,classNameContainer:c,maxCollapsedHeight:u="0px",triggerCalCulateContainer:d,delayTriggerCalculateHeight:h=0})=>{const[m,v]=o.useState("1000vh"),e=()=>{var i;const t=((i=document==null?void 0:document.getElementById(s))==null?void 0:i.offsetHeight)??0;v(t||"1000vh")};return o.useEffect(()=>{const t=setTimeout(e,h);return window==null||window.addEventListener("resize",e),window==null||window.addEventListener("load",e),()=>{clearTimeout(t),window==null||window.removeEventListener("resize",e),window==null||window.removeEventListener("load",e)}},[d]),n.jsx("div",{className:`${g.default.collapse} ${c??""}`,style:{maxHeight:r?m:u},children:n.jsx("div",{id:s,className:a??"",children:l})})};exports.default=w;

package/dist/components/Collapse/Collapse.mjs

@@ -0,0 +1,35 @@
+import { jsx as i } from "react/jsx-runtime";
+import n from "react";
+import w from "./style.module.scss.mjs";
+const E = ({
+  children: r,
+  id: o,
+  open: a,
+  className: l,
+  classNameContainer: c,
+  maxCollapsedHeight: d = "0px",
+  triggerCalCulateContainer: m,
+  delayTriggerCalculateHeight: h = 0
+}) => {
+  const [u, v] = n.useState("1000vh"), e = () => {
+    var s;
+    const t = ((s = document == null ? void 0 : document.getElementById(o)) == null ? void 0 : s.offsetHeight) ?? 0;
+    v(t || "1000vh");
+  };
+  return n.useEffect(() => {
+    const t = setTimeout(e, h);
+    return window == null || window.addEventListener("resize", e), window == null || window.addEventListener("load", e), () => {
+      clearTimeout(t), window == null || window.removeEventListener("resize", e), window == null || window.removeEventListener("load", e);
+    };
+  }, [m]), /* @__PURE__ */ i(
+    "div",
+    {
+      className: `${w.collapse} ${c ?? ""}`,
+      style: { maxHeight: a ? u : d },
+      children: /* @__PURE__ */ i("div", { id: o, className: l ?? "", children: r })
+    }
+  );
+};
+export {
+  E as default
+};

package/dist/components/Collapse/CollapseV2.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),h=require("react"),y=require("./style.module.scss.cjs"),d=({children:o,open:r,className:l,id:e,classNameContainer:g,maxCollapsedHeight:t="0px"})=>(h.useLayoutEffect(()=>{const n=document.getElementById(e),s=document.getElementById(`inner-${e}`);if(!n||!s)return;const i=new ResizeObserver(()=>{const c=s.getBoundingClientRect().height;n.style.height=`${c}px`});if(r){const c=s.getBoundingClientRect().height;n.style.height=`${c}px`,i.observe(s)}else n.style.height=typeof t=="number"?`${t}px`:t;return()=>{i.disconnect()}},[r,e,t]),u.jsx("div",{id:e,className:`${y.default.collapse} ${g??""}`,style:{height:r?0:t},children:u.jsx("div",{id:`inner-${e}`,className:l??"",children:o})}));exports.default=d;

package/dist/components/Collapse/CollapseV2.mjs

@@ -0,0 +1,30 @@
+import { jsx as o } from "react/jsx-runtime";
+import g from "react";
+import f from "./style.module.scss.mjs";
+const $ = ({ children: l, open: s, className: h, id: e, classNameContainer: u, maxCollapsedHeight: t = "0px" }) => (g.useLayoutEffect(() => {
+  const n = document.getElementById(e), r = document.getElementById(`inner-${e}`);
+  if (!n || !r) return;
+  const i = new ResizeObserver(() => {
+    const c = r.getBoundingClientRect().height;
+    n.style.height = `${c}px`;
+  });
+  if (s) {
+    const c = r.getBoundingClientRect().height;
+    n.style.height = `${c}px`, i.observe(r);
+  } else
+    n.style.height = typeof t == "number" ? `${t}px` : t;
+  return () => {
+    i.disconnect();
+  };
+}, [s, e, t]), /* @__PURE__ */ o(
+  "div",
+  {
+    id: e,
+    className: `${f.collapse} ${u ?? ""}`,
+    style: { height: s ? 0 : t },
+    children: /* @__PURE__ */ o("div", { id: `inner-${e}`, className: h ?? "", children: l })
+  }
+));
+export {
+  $ as default
+};

package/dist/components/Collapse/style.module.scss.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="_collapse_qzzyu_1",l={collapse:e};exports.collapse=e;exports.default=l;

package/dist/components/Collapse/style.module.scss.mjs

@@ -0,0 +1,7 @@
+const l = "_collapse_qzzyu_1", s = {
+  collapse: l
+};
+export {
+  l as collapse,
+  s as default
+};

package/dist/components/DatePicker/DatePicker.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("react/jsx-runtime"),m=require("react"),w=require("@internationalized/date"),Z=require("../Calendar/Calendar.cjs"),p=require("react-aria"),J=require("../Popover/Popover.cjs"),S=l=>{let r;const i=new Date(l??new Date);return l&&(r=w.parseDate(new Date(i.setHours(i.getHours()+7)).toISOString().slice(0,10))),r},K=l=>{const{minDate:r,maxDate:i,value:c,defaultValue:b,withConfirm:H=!1,isCustomTime:D=!1,className:j,classNameButton:I,buttonClick:C,buttonReset:M,buttonSubmit:y,prevIcon:q,nextIcon:R,onChange:d,id:k="date-picker",idPopover:N="date-picker-popover",floatingOptions:O={},offsetPopover:V=5,zIndexPopper:L=1,hiddenHeader:z}=l,g=p.useDateFormatter(),{locale:F}=p.useLocale(),_=S(r),$=S(i),f=m.useRef(null),[h,v]=m.useState(),[a,x]=m.useState(),A=s=>{var T;const o=new Date;let e=s.toDate(w.getLocalTimeZone());e.setHours(o.getHours(),o.getMinutes(),o.getSeconds());const t=r?new Date(r):null,n=i?new Date(i):null;if(D){if(e=new Date(new Date(e).setHours((a==null?void 0:a.hour)??0,a==null?void 0:a.minut,a==null?void 0:a.second)),t&&(t==null?void 0:t.toDateString())===new Date(e).toDateString()&&(t==null?void 0:t.toTimeString())>=(e==null?void 0:e.toTimeString())){if(t&&(t.getHours()>e.getHours()||t.getHours()===e.getHours()&&t.getMinutes()>e.getMinutes()))return;e=new Date(t.setSeconds(t.getSeconds()+1))}if(n&&(n==null?void 0:n.toDateString())===new Date(e).toDateString()&&(n==null?void 0:n.toTimeString())<(e==null?void 0:e.toTimeString())){if(n&&(n.getHours()<e.getHours()||n.getHours()===e.getHours()&&n.getMinutes()<e.getMinutes()))return;e=new Date(n.setSeconds(n.getSeconds()-1))}}else t&&g.format(e)===g.format(t)&&t.getTime()>=e.getTime()?e=new Date(t.setSeconds(t.getSeconds()+1)):n&&g.format(e)===g.format(n)&&n.getTime()<=e.getTime()&&(e=new Date(n.setSeconds(n.getSeconds()-1)));typeof d=="function"&&(d(e),(T=f.current)==null||T.setShow(!1))},P=(s,o)=>{v(s),(o??(!H&&!D))&&A(s)},B=s=>{const{start:o}=s;x(o)},E=s=>{const o=new Date(c??new Date);x({hour:o.getHours(),minut:o.getMinutes(),second:o.getSeconds()}),v(S(c))},G=()=>{h&&P(h,!0)};return u.jsxs(u.Fragment,{children:[u.jsx("div",{id:k,onClick:s=>{var o;(o=f.current)==null||o.handlerShow(s),E()},className:I,children:typeof C=="function"?C(c):c?new Date(c).toDateString():"Pilih Tanggal"}),u.jsx(J.default,{zIndex:L,ref:f,offset:V,id:N,floatingOptions:{placement:"bottom-end",...O},children:u.jsx("div",{className:j??"",children:u.jsx(p.I18nProvider,{locale:"id-ID",children:u.jsx(Z.default,{minValue:_,maxValue:$,minDate:r,maxDate:i,time:{start:a},locale:F,value:h,typeTime:"SINGLE",buttonReset:M,buttonSubmit:y,prevIcon:q,nextIcon:R,createCalendar:w.createCalendar,defaultValue:S(c),onChange:P,handlerReset:()=>{var s;typeof d=="function"&&(d(b),(s=f.current)==null||s.setShow(!1))},handlerSubmit:G,handlerChangeTime:B,withConfirm:H,isCustomTime:D,type:["date","month","year"],hiddenHeader:z})})})})]})};exports.default=K;

package/dist/components/DatePicker/DatePicker.mjs

@@ -0,0 +1,125 @@
+import { jsxs as A, Fragment as J, jsx as u } from "react/jsx-runtime";
+import p from "react";
+import { createCalendar as K, parseDate as Q, getLocalTimeZone as U } from "@internationalized/date";
+import W from "../Calendar/Calendar.mjs";
+import { useDateFormatter as X, useLocale as Y, I18nProvider as _ } from "react-aria";
+import $ from "../Popover/Popover.mjs";
+const m = (l) => {
+  let a;
+  const i = new Date(l ?? /* @__PURE__ */ new Date());
+  return l && (a = Q(new Date(i.setHours(i.getHours() + 7)).toISOString().slice(0, 10))), a;
+}, ae = (l) => {
+  const {
+    minDate: a,
+    maxDate: i,
+    value: c,
+    defaultValue: P,
+    withConfirm: h = !1,
+    isCustomTime: D = !1,
+    className: T,
+    classNameButton: b,
+    buttonClick: w,
+    buttonReset: y,
+    buttonSubmit: M,
+    prevIcon: k,
+    nextIcon: x,
+    onChange: d,
+    id: N = "date-picker",
+    idPopover: R = "date-picker-popover",
+    floatingOptions: V = {},
+    offsetPopover: L = 5,
+    zIndexPopper: O = 1,
+    hiddenHeader: j
+  } = l, f = X(), { locale: z } = Y(), F = m(a), B = m(i), g = p.useRef(null), [S, H] = p.useState(), [r, C] = p.useState(), E = (s) => {
+    var I;
+    const n = /* @__PURE__ */ new Date();
+    let e = s.toDate(U());
+    e.setHours(n.getHours(), n.getMinutes(), n.getSeconds());
+    const t = a ? new Date(a) : null, o = i ? new Date(i) : null;
+    if (D) {
+      if (e = new Date(new Date(e).setHours((r == null ? void 0 : r.hour) ?? 0, r == null ? void 0 : r.minut, r == null ? void 0 : r.second)), t && (t == null ? void 0 : t.toDateString()) === new Date(e).toDateString() && (t == null ? void 0 : t.toTimeString()) >= (e == null ? void 0 : e.toTimeString())) {
+        if (t && (t.getHours() > e.getHours() || t.getHours() === e.getHours() && t.getMinutes() > e.getMinutes()))
+          return;
+        e = new Date(t.setSeconds(t.getSeconds() + 1));
+      }
+      if (o && (o == null ? void 0 : o.toDateString()) === new Date(e).toDateString() && (o == null ? void 0 : o.toTimeString()) < (e == null ? void 0 : e.toTimeString())) {
+        if (o && (o.getHours() < e.getHours() || o.getHours() === e.getHours() && o.getMinutes() < e.getMinutes()))
+          return;
+        e = new Date(o.setSeconds(o.getSeconds() - 1));
+      }
+    } else
+      t && f.format(e) === f.format(t) && t.getTime() >= e.getTime() ? e = new Date(t.setSeconds(t.getSeconds() + 1)) : o && f.format(e) === f.format(o) && o.getTime() <= e.getTime() && (e = new Date(o.setSeconds(o.getSeconds() - 1)));
+    typeof d == "function" && (d(e), (I = g.current) == null || I.setShow(!1));
+  }, v = (s, n) => {
+    H(s), (n ?? (!h && !D)) && E(s);
+  }, G = (s) => {
+    const { start: n } = s;
+    C(n);
+  }, Z = (s) => {
+    const n = new Date(c ?? /* @__PURE__ */ new Date());
+    C({
+      hour: n.getHours(),
+      minut: n.getMinutes(),
+      second: n.getSeconds()
+    }), H(m(c));
+  }, q = () => {
+    S && v(S, !0);
+  };
+  return /* @__PURE__ */ A(J, { children: [
+    /* @__PURE__ */ u(
+      "div",
+      {
+        id: N,
+        onClick: (s) => {
+          var n;
+          (n = g.current) == null || n.handlerShow(s), Z();
+        },
+        className: b,
+        children: typeof w == "function" ? w(c) : c ? new Date(c).toDateString() : "Pilih Tanggal"
+      }
+    ),
+    /* @__PURE__ */ u(
+      $,
+      {
+        zIndex: O,
+        ref: g,
+        offset: L,
+        id: R,
+        floatingOptions: { placement: "bottom-end", ...V },
+        children: /* @__PURE__ */ u("div", { className: T ?? "", children: /* @__PURE__ */ u(_, { locale: "id-ID", children: /* @__PURE__ */ u(
+          W,
+          {
+            minValue: F,
+            maxValue: B,
+            minDate: a,
+            maxDate: i,
+            time: { start: r },
+            locale: z,
+            value: S,
+            typeTime: "SINGLE",
+            buttonReset: y,
+            buttonSubmit: M,
+            prevIcon: k,
+            nextIcon: x,
+            createCalendar: K,
+            defaultValue: m(c),
+            onChange: v,
+            handlerReset: () => {
+              var s;
+              typeof d == "function" && (d(P), (s = g.current) == null || s.setShow(!1));
+            },
+            handlerSubmit: q,
+            handlerChangeTime: G,
+            withConfirm: h,
+            isCustomTime: D,
+            type: ["date", "month", "year"],
+            hiddenHeader: j
+          }
+        ) }) })
+      }
+    )
+  ] });
+};
+export {
+  ae as default
+};

package/dist/components/DatePicker/DateRangePicker.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("react/jsx-runtime"),y=require("react"),Y=require("react-aria"),B=require("../Calendar/CalendarRange.cjs"),n=require("@internationalized/date"),K=require("../Calendar/Calendar.cjs"),H=a=>{let o;const r=new Date(a??new Date);return a&&(o=n.parseDate(new Date(r.setHours(r.getHours()+7)).toISOString().slice(0,10))),o},k=a=>{const o=new Date((a==null?void 0:a.startDate)??new Date),r=new Date((a==null?void 0:a.endDate)??new Date),i=new n.CalendarDate(o.getFullYear(),o.getMonth()+1,o.getDate()),D=new n.CalendarDate(r.getFullYear(),r.getMonth()+1,r.getDate());return a?{start:i,end:D}:void 0},Q=a=>{const{minDate:o,maxDate:r,defaultValue:i,withConfirm:D,prevIcon:M,nextIcon:p,buttonReset:L,buttonSubmit:b,typePicker:j="RANGE",onChange:q,value:c,onReset:E,isCustomTime:w}=a,{locale:_}=Y.useLocale(),I=H(o),N=H(r),[e,C]=y.useState(),[S,T]=y.useState({start:void 0,end:void 0}),Z=t=>{typeof q=="function"&&q(t)},R=(t,s)=>{const d=t.start.toDate(n.getLocalTimeZone()),u=t.end.toDate(n.getLocalTimeZone());C(t),T({start:{hour:0,minut:0,second:0},end:{hour:23,minut:59,second:59}}),(s??!D)&&Z({startDate:d,endDate:new Date(u.setHours(23,59,59))})},x=(t,s)=>{var d,u,g,m,l,f,G,P;if(e!=null&&e.start&&(e!=null&&e.end)&&(T(t),(u=(d=t.start)==null?void 0:d.hour)!=null&&u.toString()&&((m=(g=t.start)==null?void 0:g.minut)!=null&&m.toString())&&((f=(l=t.end)==null?void 0:l.hour)!=null&&f.toString())&&((P=(G=t.end)==null?void 0:G.minut)!=null&&P.toString())&&(s??!D))){const J=e.start.toDate(n.getLocalTimeZone()),z=e.end.toDate(n.getLocalTimeZone()),O=new Date(J.setHours(t.start.hour,t.start.minut)),V=new Date(z.setHours(t.end.hour,t.end.minut,59));O.getTime()<V.getTime()&&Z({startDate:O,endDate:V})}},A=t=>{if(typeof E=="function")E();else if(i&&t){const s=new Date(i.endDate??new Date),d=t.focusedDate.set({month:s.getMonth()+1,year:s.getFullYear()});t.setFocusedDate(d)}C(k(i))},F=()=>{e&&(w?x(S,!0):R(e,!0))};return y.useEffect(()=>{if(c!=null&&c.endDate&&(c!=null&&c.startDate)){const t=new Date(c.startDate),s=new Date(c.endDate),d=t.getHours(),u=t.getMinutes(),g=s.getHours(),m=s.getMinutes(),l=n.toCalendarDate(n.fromDate(t,n.getLocalTimeZone())),f=n.toCalendarDate(n.fromDate(s,n.getLocalTimeZone()));C({start:l,end:f}),T({start:{hour:d,minut:u},end:{hour:g,minut:m}})}},[JSON.stringify(c)]),h.jsx("div",{className:"iru-flex iru-flex-col",children:h.jsxs(Y.I18nProvider,{locale:"id-ID",children:[j==="RANGE"&&h.jsx(B.default,{defaultValue:k(i),value:e,minValue:I,maxValue:N,withConfirm:D,prevIcon:M,nextIcon:p,buttonReset:L,buttonSubmit:b,onChange:t=>R(t),isCustomTime:w,handlerReset:A,handlerSubmit:F,time:S,minDate:o,maxDate:r,handlerChangeTimeRange:x}),j==="SINGLE"&&h.jsx(K.default,{defaultValue:H(i==null?void 0:i.endDate),value:e==null?void 0:e.end,minValue:I,maxValue:N,minDate:o,maxDate:r,withConfirm:D,prevIcon:M,nextIcon:p,buttonReset:L,buttonSubmit:b,locale:_,time:S,typeTime:"RANGE",handlerChangeTime:x,isCustomTime:w,createCalendar:n.createCalendar,onChange:t=>R({start:t,end:t}),handlerReset:A,handlerSubmit:F,type:["date","month","year"]})]})})};exports.default=Q;

package/dist/components/DatePicker/DateRangePicker.mjs

@@ -0,0 +1,112 @@
+import { jsx as H, jsxs as U } from "react/jsx-runtime";
+import O, { useEffect as W } from "react";
+import { useLocale as X, I18nProvider as _ } from "react-aria";
+import $ from "../Calendar/CalendarRange.mjs";
+import { toCalendarDate as J, fromDate as Z, getLocalTimeZone as m, createCalendar as v, parseDate as tt, CalendarDate as q } from "@internationalized/date";
+import et from "../Calendar/Calendar.mjs";
+const x = (n) => {
+  let o;
+  const a = new Date(n ?? /* @__PURE__ */ new Date());
+  return n && (o = tt(new Date(a.setHours(a.getHours() + 7)).toISOString().slice(0, 10))), o;
+}, z = (n) => {
+  const o = new Date((n == null ? void 0 : n.startDate) ?? /* @__PURE__ */ new Date()), a = new Date((n == null ? void 0 : n.endDate) ?? /* @__PURE__ */ new Date()), s = new q(o.getFullYear(), o.getMonth() + 1, o.getDate()), D = new q(a.getFullYear(), a.getMonth() + 1, a.getDate());
+  return n ? { start: s, end: D } : void 0;
+}, ct = (n) => {
+  const {
+    minDate: o,
+    maxDate: a,
+    defaultValue: s,
+    withConfirm: D,
+    prevIcon: y,
+    nextIcon: T,
+    buttonReset: M,
+    buttonSubmit: E,
+    typePicker: I = "RANGE",
+    onChange: N,
+    value: i,
+    onReset: b,
+    isCustomTime: w
+  } = n, { locale: B } = X(), F = x(o), G = x(a), [e, l] = O.useState(), [p, C] = O.useState({ start: void 0, end: void 0 }), A = (t) => {
+    typeof N == "function" && N(t);
+  }, S = (t, r) => {
+    const c = t.start.toDate(m()), d = t.end.toDate(m());
+    l(t), C({ start: { hour: 0, minut: 0, second: 0 }, end: { hour: 23, minut: 59, second: 59 } }), (r ?? !D) && A({ startDate: c, endDate: new Date(d.setHours(23, 59, 59)) });
+  }, R = (t, r) => {
+    var c, d, u, f, g, h, V, Y;
+    if (e != null && e.start && (e != null && e.end) && (C(t), (d = (c = t.start) == null ? void 0 : c.hour) != null && d.toString() && ((f = (u = t.start) == null ? void 0 : u.minut) != null && f.toString()) && ((h = (g = t.end) == null ? void 0 : g.hour) != null && h.toString()) && ((Y = (V = t.end) == null ? void 0 : V.minut) != null && Y.toString()) && (r ?? !D))) {
+      const K = e.start.toDate(m()), Q = e.end.toDate(m()), j = new Date(K.setHours(t.start.hour, t.start.minut)), k = new Date(Q.setHours(t.end.hour, t.end.minut, 59));
+      j.getTime() < k.getTime() && A({ startDate: j, endDate: k });
+    }
+  }, L = (t) => {
+    if (typeof b == "function")
+      b();
+    else if (s && t) {
+      const r = new Date(s.endDate ?? /* @__PURE__ */ new Date()), c = t.focusedDate.set({
+        month: r.getMonth() + 1,
+        year: r.getFullYear()
+      });
+      t.setFocusedDate(c);
+    }
+    l(z(s));
+  }, P = () => {
+    e && (w ? R(p, !0) : S(e, !0));
+  };
+  return W(() => {
+    if (i != null && i.endDate && (i != null && i.startDate)) {
+      const t = new Date(i.startDate), r = new Date(i.endDate), c = t.getHours(), d = t.getMinutes(), u = r.getHours(), f = r.getMinutes(), g = J(Z(t, m())), h = J(Z(r, m()));
+      l({ start: g, end: h }), C({ start: { hour: c, minut: d }, end: { hour: u, minut: f } });
+    }
+  }, [JSON.stringify(i)]), /* @__PURE__ */ H("div", { className: "iru-flex iru-flex-col", children: /* @__PURE__ */ U(_, { locale: "id-ID", children: [
+    I === "RANGE" && /* @__PURE__ */ H(
+      $,
+      {
+        defaultValue: z(s),
+        value: e,
+        minValue: F,
+        maxValue: G,
+        withConfirm: D,
+        prevIcon: y,
+        nextIcon: T,
+        buttonReset: M,
+        buttonSubmit: E,
+        onChange: (t) => S(t),
+        isCustomTime: w,
+        handlerReset: L,
+        handlerSubmit: P,
+        time: p,
+        minDate: o,
+        maxDate: a,
+        handlerChangeTimeRange: R
+      }
+    ),
+    I === "SINGLE" && /* @__PURE__ */ H(
+      et,
+      {
+        defaultValue: x(s == null ? void 0 : s.endDate),
+        value: e == null ? void 0 : e.end,
+        minValue: F,
+        maxValue: G,
+        minDate: o,
+        maxDate: a,
+        withConfirm: D,
+        prevIcon: y,
+        nextIcon: T,
+        buttonReset: M,
+        buttonSubmit: E,
+        locale: B,
+        time: p,
+        typeTime: "RANGE",
+        handlerChangeTime: R,
+        isCustomTime: w,
+        createCalendar: v,
+        onChange: (t) => S({ start: t, end: t }),
+        handlerReset: L,
+        handlerSubmit: P,
+        type: ["date", "month", "year"]
+      }
+    )
+  ] }) });
+};
+export {
+  ct as default
+};

package/dist/components/DatePicker/FilterDate.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),r=require("react"),Q=require("./DateRangePicker.cjs"),U=require("../Popover/Popover.cjs"),m=require("../Calendar/style.module.scss.cjs"),k=require("../../utils/common.cjs"),X=require("../Button/Button.cjs"),Z=({value:o,prevIcon:T,nextIcon:K,buttonReset:g,buttonSubmit:q,className:H,classNameButton:N,buttonClick:c,buttonList:w,typePicker:R="RANGE",onChange:Y,idPopover:W="filter-date-popover",id:P="filter-date",floatingOptions:B={},offsetPopover:E=5,zIndexPopper:O=0,defaultValueLabel:l,isCustomTime:$=!1,mountedExecuteChange:_=!0,formatingDate:D})=>{const S=[{key:"thisDay",value:"Hari ini"},{key:"thisWeek",value:"Minggu ini"},{key:"thisMonth",value:"Bulan ini"},{key:"thisYear",value:"Tahun ini"},{key:"yesterday",value:"Kemarin"},{key:"lastWeek",value:"Minggu lalu"},{key:"lastMonth",value:"Bulan lalu"},{key:"lastYear",value:"Tahun lalu"},{key:"custom",value:"Kustom"}],b=r.useRef(null),[n,M]=r.useState(),[z,i]=r.useState(),[x,p]=r.useState(),d=(e,t)=>{const a=new Date(e??new Date);return t==="start"?new Date(a.setHours(0,0,0)):new Date(a.setHours(23,59,59))},V=()=>{const e=new Date;return{startDate:e,endDate:e}},v=()=>{const e=new Date;e.setDate(e.getDate()-e.getDay());const t=new Date;return t.setDate(t.getDate()+(6-t.getDay())),{startDate:e,endDate:t}},A=()=>{const e=new Date,t=new Date(e.getFullYear(),e.getMonth(),1),a=new Date(e.getFullYear(),e.getMonth()+1,0);return{startDate:t,endDate:a}},G=()=>{const e=new Date(new Date().getFullYear(),0,1),t=new Date(new Date().getFullYear(),11,31);return{startDate:e,endDate:t}},I=()=>{const e=new Date(new Date().setDate(new Date().getDate()-1));return{startDate:e,endDate:e}},J=()=>{const e=new Date;e.setDate(e.getDate()-(7+e.getDay()));const t=new Date;return t.setDate(t.getDate()-(t.getDay()+1)),{startDate:e,endDate:t}},C=()=>{const e=new Date,t=new Date(e.getFullYear(),e.getMonth()-1,1),a=new Date(e.getFullYear(),e.getMonth(),0);return{startDate:t,endDate:a}},L=()=>{const e=new Date(new Date().getFullYear()-1,0,1),t=new Date(new Date().getFullYear()-1,11,31);return{startDate:e,endDate:t}},u=(e,t,a)=>{var h;if(p(e),typeof Y=="function"){let j=e;D==="string"&&e?j={startDate:k.formatDate(e.startDate,D),endDate:k.formatDate(e.endDate,D)}:typeof D=="boolean"&&e&&(j={startDate:k.formatDate(e.startDate,"yyyy-MM-dd'T'HH:mm:ss.SSSxxx"),endDate:k.formatDate(e.endDate,"yyyy-MM-dd'T'HH:mm:ss.SSSxxx")}),(h=b.current)==null||h.setShow(!1),Y(j,t??"",a)}},f=(e,t)=>{M(e);let a;if((e==null?void 0:e.key)!=="custom"){switch(i(e),e==null?void 0:e.key){case"thisDay":a=V();break;case"thisWeek":a=v();break;case"thisMonth":a=A();break;case"thisYear":a=G();break;case"yesterday":a=I();break;case"lastWeek":a=J();break;case"lastMonth":a=C();break;case"lastYear":a=L();break}a&&t&&u({startDate:d(a.startDate,"start"),endDate:d(a.endDate,"end")},e==null?void 0:e.value,e)}},y=(e,t)=>{const a=(w??S).find(h=>h.key===e);!e&&!a?(t&&u(),f(void 0,t),i(void 0)):typeof e=="object"?(t&&u({startDate:d(e.startDate,"start"),endDate:d(e.endDate,"end")},"Kustom",{key:"custom",value:"Kustom"}),f({key:"custom",value:"Kustom"},t),i({key:"custom",value:"Kustom"})):(f(a,t),i(a))},F=()=>{var e;if(o){p(o);const t=(e=w??S)==null?void 0:e.find(a=>a.key===o.label||a.value===o.label);Object.keys(t||{}).length>0&&M(t)}else M(void 0),i(void 0)};return r.useEffect(()=>{F()},[JSON.stringify(o)]),r.useEffect(()=>{y(l??o,_)},[]),s.jsxs(s.Fragment,{children:[s.jsxs("div",{onClick:e=>{var t;(t=b.current)==null||t.handlerShow(e),F()},className:N,id:P,children:[r.isValidElement(c)&&c,typeof c=="function"?c(x,z):"Pilih Filter"]}),s.jsx(U.default,{zIndex:O,ref:b,offset:E,id:W,floatingOptions:{placement:"bottom-end",...B},children:s.jsxs("div",{className:`${m.default["container-filter-date"]} ${H}`,children:[s.jsxs("div",{children:[(w??S).map((e,t)=>s.jsx("div",{className:`${m.default["button-filter-date"]} hover:iru-bg-laba-blue-01 ${(n==null?void 0:n.key)===e.key?"iru-text-laba-blue-10":""}`,onClick:()=>f(e,!0),children:e.value},t)),(n==null?void 0:n.key)!=="custom"&&s.jsx(s.Fragment,{children:typeof g=="function"?s.jsx("div",{className:m.default["button-filter-date-custome"],onClick:()=>y(l,!0),children:g()}):s.jsx(X.default,{className:m.default["button-reset-filter-date"],variants:"nude-laba-blue-10",size:"small",onClick:()=>y(l,!0),children:"Reset"})})]}),(n==null?void 0:n.key)==="custom"&&s.jsx("div",{children:s.jsx(Q.default,{defaultValue:x,value:x,prevIcon:T,nextIcon:K,buttonReset:g,buttonSubmit:q,isCustomTime:$,onChange:e=>{u(e,"Kustom",{key:"custom",value:"Kustom"}),i({key:"custom",value:"Kustom"})},onReset:()=>{y(l,!0)},typePicker:R,withConfirm:!0})})]})})]})};exports.default=Z;