rently-components 0.1.30 → 0.1.31

package/dist/components/Calendar.d.ts

@@ -1,10 +1,11 @@
+import { type Dispatch, type SetStateAction } from "react";
 interface Props {
     locale?: "en" | "es";
-    selected?: Date | undefined;
-    setSelected: (date: Date | undefined) => void;
+    date?: Date | undefined;
+    setDate: Dispatch<SetStateAction<Date | undefined>>;
     rootClassName?: string;
     buttonDayClassName?: string;
     containerMonthDaysClassName?: string;
 }
-declare const Calendar: ({ locale, selected, setSelected, rootClassName, buttonDayClassName, containerMonthDaysClassName, }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Calendar: ({ locale, date, setDate, rootClassName, buttonDayClassName, containerMonthDaysClassName, }: Props) => import("react/jsx-runtime").JSX.Element;
 export default Calendar;

package/dist/components/DatePicker.d.ts

@@ -1,12 +1,13 @@
-import { type ComponentProps, type ComponentType, type SVGProps } from "react";
+import { type ComponentProps, type ComponentType, type Dispatch, type SetStateAction, type SVGProps } from "react";
 import "dayjs/locale/es";
 import "dayjs/locale/en";
 interface Props extends ComponentProps<"button"> {
     placeholder: string;
-    setSelected: (date: Date | undefined) => void;
-    selected?: Date | undefined;
+    setDate: Dispatch<SetStateAction<Date | undefined>>;
+    date?: Date;
     Icon?: ComponentType<SVGProps<SVGSVGElement>>;
     locale?: "en" | "es";
+    error?: string;
 }
-declare const DatePicker: ({ placeholder, locale, className, Icon, selected, setSelected, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const DatePicker: ({ placeholder, locale, className, Icon, date, setDate, error, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export default DatePicker;

package/dist/components/Input.d.ts

@@ -2,7 +2,8 @@ import type { ComponentProps, ComponentType, SVGProps } from "react";
 interface Props extends ComponentProps<"input"> {
     Icon?: ComponentType<SVGProps<SVGSVGElement>>;
     containerClassName?: string;
+    inputClassName?: string;
     error?: string;
 }
-declare const Input: ({ Icon, error, containerClassName, ...other }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const Input: ({ Icon, error, inputClassName, className, ...other }: Props) => import("react/jsx-runtime").JSX.Element;
 export default Input;

package/dist/index.es.js

@@ -204,8 +204,8 @@ React keys must be passed directly to JSX without using spread:
       }
       if (k = null, F !== void 0 && (n(F), k = "" + F), i(D) && (n(D.key), k = "" + D.key), "key" in D) {
         F = {};
-        for (var X in D)
-          X !== "key" && (F[X] = D[X]);
+        for (var J in D)
+          J !== "key" && (F[J] = D[J]);
       } else F = D;
       return k && a(
         F,
@@ -605,7 +605,7 @@ const ti = (e, t) => {
     b,
     L,
     $
-  ], X = () => ["none", U, L, $], V = () => ["none", U, L, $], q = () => [U, L, $], Z = () => [We, "full", ...O()];
+  ], J = () => ["none", U, L, $], V = () => ["none", U, L, $], q = () => [U, L, $], Z = () => [We, "full", ...O()];
   return {
     cacheSize: 500,
     theme: {
@@ -2552,28 +2552,28 @@ const ti = (e, t) => {
        * @see https://tailwindcss.com/docs/rotate
        */
       rotate: [{
-        rotate: X()
+        rotate: J()
       }],
       /**
        * Rotate X
        * @see https://tailwindcss.com/docs/rotate
        */
       "rotate-x": [{
-        "rotate-x": X()
+        "rotate-x": J()
       }],
       /**
        * Rotate Y
        * @see https://tailwindcss.com/docs/rotate
        */
       "rotate-y": [{
-        "rotate-y": X()
+        "rotate-y": J()
       }],
       /**
        * Rotate Z
        * @see https://tailwindcss.com/docs/rotate
        */
       "rotate-z": [{
-        "rotate-z": X()
+        "rotate-z": J()
       }],
       /**
        * Scale
@@ -3033,30 +3033,31 @@ const ti = (e, t) => {
     },
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
-}, zi = /* @__PURE__ */ wi(Bi), J = (...e) => zi(Dr(e)), Id = ({ Icon: e, error: t, containerClassName: n, ...r }) => /* @__PURE__ */ p.jsxs(
+}, zi = /* @__PURE__ */ wi(Bi), X = (...e) => zi(Dr(e)), Id = ({ Icon: e, error: t, inputClassName: n, className: r, ...o }) => /* @__PURE__ */ p.jsxs(
   "div",
   {
-    className: J(
+    className: X(
       "rounded-lg border-border-1 border flex justify-between items-center h-10 bg-bg-1 pr-3 focus-within:ring-border-1/80 focus-within:ring-2",
       t && "border-danger focus-within:ring-danger/80",
-      n
+      r
     ),
     children: [
       /* @__PURE__ */ p.jsx(
         "input",
         {
           type: "text",
-          className: J(
+          className: X(
             "border-none outline-none flex-1 h-full w-full text-sm pl-3 placeholder:text-text-2 text-text-1",
-            t && "placeholder:text-danger/80"
+            t && "placeholder:text-danger/80",
+            n
           ),
-          ...r
+          ...o
         }
       ),
       e && /* @__PURE__ */ p.jsx(
         e,
         {
-          className: J("w-5 h-5 text-text-2", t && "text-danger/80")
+          className: X("w-5 h-5 text-text-2", t && "text-danger/80")
         }
       )
     ]
@@ -5849,9 +5850,9 @@ var Wn = "PopperContent", [zl, Hl] = $o(Wn), zo = u.forwardRef(
         c && jl({ ...K }),
         Il({
           ...K,
-          apply: ({ elements: k, rects: G, availableWidth: X, availableHeight: V }) => {
+          apply: ({ elements: k, rects: G, availableWidth: J, availableHeight: V }) => {
             const { width: q, height: Z } = G.reference, se = k.floating.style;
-            se.setProperty("--radix-popper-available-width", `${X}px`), se.setProperty("--radix-popper-available-height", `${V}px`), se.setProperty("--radix-popper-anchor-width", `${q}px`), se.setProperty("--radix-popper-anchor-height", `${Z}px`);
+            se.setProperty("--radix-popper-available-width", `${J}px`), se.setProperty("--radix-popper-available-height", `${V}px`), se.setProperty("--radix-popper-anchor-width", `${q}px`), se.setProperty("--radix-popper-anchor-height", `${Z}px`);
           }
         }),
         P && Ll({ element: P, padding: a }),
@@ -6405,7 +6406,7 @@ var le = 10, [ps, Oe] = tt(Le), hu = "SelectContentImpl", gu = /* @__PURE__ */ U
     }, [C]), kn();
     const E = u.useCallback(
       (k) => {
-        const [G, ...X] = Y().map((Z) => Z.ref.current), [V] = X.slice(-1), q = document.activeElement;
+        const [G, ...J] = Y().map((Z) => Z.ref.current), [V] = J.slice(-1), q = document.activeElement;
         for (const Z of k)
           if (Z === q || (Z?.scrollIntoView({ block: "nearest" }), Z === G && _ && (_.scrollTop = 0), Z === V && _ && (_.scrollTop = _.scrollHeight), Z?.focus(), document.activeElement !== q)) return;
       },
@@ -6426,11 +6427,11 @@ var le = 10, [ps, Oe] = tt(Le), hu = "SelectContentImpl", gu = /* @__PURE__ */ U
             x: Math.abs(Math.round(V.pageX) - (M.current?.x ?? 0)),
             y: Math.abs(Math.round(V.pageY) - (M.current?.y ?? 0))
           };
-        }, X = (V) => {
+        }, J = (V) => {
           k.x <= 10 && k.y <= 10 ? V.preventDefault() : C.contains(V.target) || x(!1), document.removeEventListener("pointermove", G), M.current = null;
         };
-        return M.current !== null && (document.addEventListener("pointermove", G), document.addEventListener("pointerup", X, { capture: !0, once: !0 })), () => {
-          document.removeEventListener("pointermove", G), document.removeEventListener("pointerup", X, { capture: !0 });
+        return M.current !== null && (document.addEventListener("pointermove", G), document.addEventListener("pointerup", J, { capture: !0, once: !0 })), () => {
+          document.removeEventListener("pointermove", G), document.removeEventListener("pointerup", J, { capture: !0 });
         };
       }
     }, [C, x, M]), u.useEffect(() => {
@@ -6440,17 +6441,17 @@ var le = 10, [ps, Oe] = tt(Le), hu = "SelectContentImpl", gu = /* @__PURE__ */ U
       };
     }, [x]);
     const [W, y] = _s((k) => {
-      const G = Y().filter((q) => !q.disabled), X = G.find((q) => q.ref.current === document.activeElement), V = Os(G, k, X);
+      const G = Y().filter((q) => !q.disabled), J = G.find((q) => q.ref.current === document.activeElement), V = Os(G, k, J);
       V && setTimeout(() => V.ref.current.focus());
     }), D = u.useCallback(
-      (k, G, X) => {
-        const V = !R.current && !X;
+      (k, G, J) => {
+        const V = !R.current && !J;
         (w.value !== void 0 && w.value === G || V) && (H(k), V && (R.current = !0));
       },
       [w.value]
     ), F = u.useCallback(() => C?.focus(), [C]), B = u.useCallback(
-      (k, G, X) => {
-        const V = !R.current && !X;
+      (k, G, J) => {
+        const V = !R.current && !J;
         (w.value !== void 0 && w.value === G || V) && I(k);
       },
       [w.value]
@@ -6566,7 +6567,7 @@ var vu = "SelectItemAlignedPosition", hs = u.forwardRef((e, t) => {
         ]);
         a.style.minWidth = Te + "px", a.style.right = en + "px";
       }
-      const I = h(), Y = window.innerHeight - le * 2, K = d.scrollHeight, N = window.getComputedStyle(l), R = parseInt(N.borderTopWidth, 10), E = parseInt(N.paddingTop, 10), A = parseInt(N.borderBottomWidth, 10), x = parseInt(N.paddingBottom, 10), M = R + E + K + x + A, W = Math.min(v.offsetHeight * 5, M), y = window.getComputedStyle(d), D = parseInt(y.paddingTop, 10), F = parseInt(y.paddingBottom, 10), B = T.top + T.height / 2 - le, te = Y - B, re = v.offsetHeight / 2, k = v.offsetTop + re, G = R + E + k, X = M - G;
+      const I = h(), Y = window.innerHeight - le * 2, K = d.scrollHeight, N = window.getComputedStyle(l), R = parseInt(N.borderTopWidth, 10), E = parseInt(N.paddingTop, 10), A = parseInt(N.borderBottomWidth, 10), x = parseInt(N.paddingBottom, 10), M = R + E + K + x + A, W = Math.min(v.offsetHeight * 5, M), y = window.getComputedStyle(d), D = parseInt(y.paddingTop, 10), F = parseInt(y.paddingBottom, 10), B = T.top + T.height / 2 - le, te = Y - B, re = v.offsetHeight / 2, k = v.offsetTop + re, G = R + E + k, J = M - G;
       if (G <= B) {
         const q = I.length > 0 && v === I[I.length - 1].ref.current;
         a.style.bottom = "0px";
@@ -6583,7 +6584,7 @@ var vu = "SelectItemAlignedPosition", hs = u.forwardRef((e, t) => {
           B,
           R + d.offsetTop + // viewport might have padding top, include it to avoid a scrollable viewport
           (q ? D : 0) + re
-        ) + X;
+        ) + J;
         a.style.height = se + "px", d.scrollTop = G - B + d.offsetTop;
       }
       a.style.margin = `${le}px 0`, a.style.minHeight = W + "px", a.style.maxHeight = Y + "px", r?.(), requestAnimationFrame(() => g.current = !0);
@@ -7193,7 +7194,7 @@ const cd = [
 }) => /* @__PURE__ */ p.jsxs(
   $u,
   {
-    className: J(
+    className: X(
       "text-sm px-3 py-2 rounded-lg bg-bg-1 text-text-1 cursor-pointer hover:bg-bg-2 outline-none",
       t
     ),
@@ -7211,7 +7212,7 @@ const cd = [
 }) => /* @__PURE__ */ p.jsxs(
   Tu,
   {
-    className: J(
+    className: X(
       "bg-bg-1 *:data-[slot=select-value]:overflow-hidden whitespace-nowrap justify-between data-placeholder:text-text-2 text-text-1 flex items-center gap-3 rounded-lg text-sm cursor-pointer px-3 h-10 border border-border-1 outline-none",
       "data-[state=open]:ring-2 data-[state=open]:ring-border-1/80",
       e,
@@ -7224,7 +7225,7 @@ const cd = [
       /* @__PURE__ */ p.jsx(Mu, { asChild: !0, children: /* @__PURE__ */ p.jsx(
         Dt,
         {
-          className: J("w-5 h-5 text-text-2", t && "text-danger/80")
+          className: X("w-5 h-5 text-text-2", t && "text-danger/80")
         }
       ) })
     ]
@@ -7245,7 +7246,7 @@ const cd = [
   ju,
   {
     "data-slot": "select-content",
-    className: J(
+    className: X(
       "rounded-lg z-999 overflow-y-auto min-w-[var(--radix-select-trigger-width)] bg-bg-1 border border-border-2 data-[state=open]:animate-popover-in shadow-sm",
       "p-px",
       n === "popper" && "max-h-82 w-full min-w-(--radix-select-trigger-width) scroll-my-1",
@@ -7291,7 +7292,7 @@ const cd = [
 }) => /* @__PURE__ */ p.jsxs(
   "div",
   {
-    className: J(
+    className: X(
       "fixed top-0 left-0 inset-0 shrink-0 overflow-y-auto overflow-x-hidden z-999 transition-all",
       r ? "pointer-events-auto lg:w-72" : "pointer-events-none lg:pointer-events-auto lg:w-21",
       t
@@ -7300,7 +7301,7 @@ const cd = [
       /* @__PURE__ */ p.jsx(
         "div",
         {
-          className: J(
+          className: X(
             "bg-overlay w-full h-full transition-opacity lg:hidden backdrop-blur-xs",
             r ? "opacity-100" : "opacity-0"
           ),
@@ -7310,7 +7311,7 @@ const cd = [
       /* @__PURE__ */ p.jsxs(
         "nav",
         {
-          className: J(
+          className: X(
             "absolute px-5 w-72 py-5 top-0 shrink-0 transition-all left-0 h-full bg-bg-1 lg:border-r lg:border-r-border-2",
             r ? "translate-x-0" : "-translate-x-full lg:translate-x-0 lg:w-21"
           ),
@@ -7320,7 +7321,7 @@ const cd = [
               /* @__PURE__ */ p.jsx(
                 "span",
                 {
-                  className: J(
+                  className: X(
                     "text-text-1 transition-opacity font-bold text-2xl",
                     r ? "opacity-100" : "opacity-0"
                   ),
@@ -7332,7 +7333,7 @@ const cd = [
               /* @__PURE__ */ p.jsx(
                 "p",
                 {
-                  className: J(
+                  className: X(
                     "mb-2 text-text-2 text-sm transition-opacity",
                     r ? "opacity-100" : "opacity-0"
                   ),
@@ -7345,7 +7346,7 @@ const cd = [
                   "button",
                   {
                     onClick: g,
-                    className: J(
+                    className: X(
                       "h-10 w-full group transition-[width] rounded-lg overflow-hidden text-sm text-text-2 px-3 cursor-pointer flex items-center gap-3",
                       "hover:text-text-1 transition-[color]",
                       d && "bg-primary-500 text-text-3 hover:text-text-3",
@@ -7355,7 +7356,7 @@ const cd = [
                       /* @__PURE__ */ p.jsx(
                         h,
                         {
-                          className: J(
+                          className: X(
                             "w-5 h-5 text-text-2 group-hover:text-text-1 transition-colors shrink-0",
                             d && "text-text-3 group-hover:text-text-3"
                           )
@@ -7364,7 +7365,7 @@ const cd = [
                       /* @__PURE__ */ p.jsx(
                         "p",
                         {
-                          className: J(
+                          className: X(
                             "transition-opacity",
                             r ? "opacity-100" : "opacity-0"
                           ),
@@ -7387,13 +7388,13 @@ const cd = [
   currentStep: t = 0,
   className: n,
   labelClassName: r
-}) => /* @__PURE__ */ p.jsx("div", { className: J("flex items-center gap-4", n), children: e.map((o, s) => {
+}) => /* @__PURE__ */ p.jsx("div", { className: X("flex items-center gap-4", n), children: e.map((o, s) => {
   const i = t >= s;
   return /* @__PURE__ */ p.jsxs(qs, { children: [
     /* @__PURE__ */ p.jsx("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ p.jsxs(
       "button",
       {
-        className: J(
+        className: X(
           "relative w-10 h-10 rounded-lg cursor-pointer bg-bg-1 text-text-2 border border-border-2 font-bold",
           i && "bg-primary-500 border-none text-text-3"
         ),
@@ -7402,7 +7403,7 @@ const cd = [
           /* @__PURE__ */ p.jsx(
             "p",
             {
-              className: J(
+              className: X(
                 "absolute left-1/2 -translate-x-1/2 top-full text-center w-fit text-sm font-normal translate-y-px",
                 i && "text-text-1",
                 r
@@ -7462,7 +7463,7 @@ const cd = [
   className: t,
   children: n,
   ...r
-}) => /* @__PURE__ */ p.jsx("button", { className: J(gd({ variant: e, className: t })), ...r, children: n }), pn = Xs(vd), Bd = (e) => /* @__PURE__ */ p.jsx(
+}) => /* @__PURE__ */ p.jsx("button", { className: X(gd({ variant: e, className: t })), ...r, children: n }), pn = Xs(vd), Bd = (e) => /* @__PURE__ */ p.jsx(
   Vu,
   {
     className: "h-6 w-10 bg-bg-1 rounded-full relative cursor-pointer data-[state=checked]:bg-primary-500 border-border-2 border",
@@ -7478,7 +7479,7 @@ const cd = [
   return /* @__PURE__ */ p.jsx(
     "div",
     {
-      className: J(
+      className: X(
         "text-sm px-3 w-fit py-1 rounded-lg border outline-none",
         n[t]
       ),
@@ -7577,11 +7578,11 @@ function $s() {
         }, R.valueOf = function() {
           return this.$d.getTime();
         }, R.startOf = function(E, A) {
-          var x = this, M = !!I.u(A) || A, W = I.p(E), y = function(X, V) {
-            var q = I.w(x.$u ? Date.UTC(x.$y, V, X) : new Date(x.$y, V, X), x);
+          var x = this, M = !!I.u(A) || A, W = I.p(E), y = function(J, V) {
+            var q = I.w(x.$u ? Date.UTC(x.$y, V, J) : new Date(x.$y, V, J), x);
             return M ? q : q.endOf(l);
-          }, D = function(X, V) {
-            return I.w(x.toDate()[X].apply(x.toDate("s"), (M ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(V)), x);
+          }, D = function(J, V) {
+            return I.w(x.toDate()[J].apply(x.toDate("s"), (M ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice(V)), x);
           }, F = this.$W, B = this.$M, te = this.$D, re = "set" + (this.$u ? "UTC" : "");
           switch (W) {
             case g:
@@ -7638,7 +7639,7 @@ function $s() {
             return V && (V[q] || V(A, M)) || Z[q].slice(0, se);
           }, G = function(V) {
             return I.s(y % 12 || 12, V, "0");
-          }, X = re || function(V, q, Z) {
+          }, J = re || function(V, q, Z) {
             var se = V < 12 ? "AM" : "PM";
             return Z ? se.toLowerCase() : se;
           };
@@ -7678,9 +7679,9 @@ function $s() {
                 case "hh":
                   return G(2);
                 case "a":
-                  return X(y, D, !0);
+                  return J(y, D, !0);
                 case "A":
-                  return X(y, D, !1);
+                  return J(y, D, !1);
                 case "m":
                   return String(D);
                 case "mm":
@@ -7943,8 +7944,8 @@ const Ed = (e, t) => {
   }
 ], _d = ({
   locale: e = "en",
-  selected: t,
-  setSelected: n,
+  date: t,
+  setDate: n,
   rootClassName: r,
   buttonDayClassName: o,
   containerMonthDaysClassName: s
@@ -7956,7 +7957,7 @@ const Ed = (e, t) => {
   return /* @__PURE__ */ p.jsxs(
     "div",
     {
-      className: J(
+      className: X(
         "border-border-2 border py-3 px-4 bg-bg-1 rounded-lg w-fit",
         r
       ),
@@ -8024,7 +8025,7 @@ const Ed = (e, t) => {
         /* @__PURE__ */ p.jsxs(
           "div",
           {
-            className: J("grid grid-cols-7 gap-y-2", s),
+            className: X("grid grid-cols-7 gap-y-2", s),
             children: [
               kd.map((h) => /* @__PURE__ */ p.jsx(
                 "p",
@@ -8041,7 +8042,7 @@ const Ed = (e, t) => {
                   {
                     variant: "ghost",
                     onClick: () => n(h.toDate()),
-                    className: J(
+                    className: X(
                       "text-center outline-none text-text-1 justify-self-center text-sm w-full justify-center w-8 h-8 font-normal",
                       !g && "text-text-2",
                       b && "bg-bg-2 text-text-1 font-medium",
@@ -8068,7 +8069,7 @@ const Ed = (e, t) => {
 }) => /* @__PURE__ */ p.jsx(
   Ec,
   {
-    className: J(
+    className: X(
       "fixed inset-0 z-50 bg-overlay",
       "data-[state=open]:animate-overlay-in data-[state=closed]:animate-overlay-out",
       e
@@ -8084,7 +8085,7 @@ const Ed = (e, t) => {
   /* @__PURE__ */ p.jsx(
     Rc,
     {
-      className: J(
+      className: X(
         "fixed left-1/2 top-1/2 z-50 w-full max-w-md -translate-x-1/2 -translate-y-1/2",
         "bg-bg-1 border border-border-2 rounded-xl p-6 shadow-lg",
         "data-[state=open]:animate-dialog-in data-[state=closed]:animate-dialog-out",
@@ -8095,10 +8096,10 @@ const Ed = (e, t) => {
       children: t
     }
   )
-] }), Hs = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx("div", { className: J("flex flex-col gap-1.5 mb-4", e), ...t }), Vs = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx("div", { className: J("flex justify-end gap-3 mt-6", e), ...t }), Ys = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx(
+] }), Hs = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx("div", { className: X("flex flex-col gap-1.5 mb-4", e), ...t }), Vs = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx("div", { className: X("flex justify-end gap-3 mt-6", e), ...t }), Ys = ({ className: e, ...t }) => /* @__PURE__ */ p.jsx(
   Pc,
   {
-    className: J("text-lg font-semibold text-text-1", e),
+    className: X("text-lg font-semibold text-text-1", e),
     ...t
   }
 ), Us = ({
@@ -8107,7 +8108,7 @@ const Ed = (e, t) => {
 }) => /* @__PURE__ */ p.jsx(
   Ac,
   {
-    className: J("text-sm text-text-2", e),
+    className: X("text-sm text-text-2", e),
     ...t
   }
 ), Gs = ({
@@ -8117,7 +8118,7 @@ const Ed = (e, t) => {
 }) => /* @__PURE__ */ p.jsx(
   kc,
   {
-    className: J(
+    className: X(
       "absolute right-4 top-4 rounded-md p-1 text-text-2 hover:text-text-1 hover:bg-bg-2 transition-colors",
       "focus:outline-none focus:ring-2 focus:ring-border-1/80",
       e
@@ -8193,24 +8194,31 @@ const Hd = ({
   locale: t = "es",
   className: n,
   Icon: r,
-  selected: o,
-  setSelected: s,
-  ...i
+  date: o,
+  setDate: s,
+  error: i,
+  ...a
 }) => {
-  const a = ye(o).locale(t).format("DD-MM-YYYY");
+  const c = ye(o).locale(t).format("DD-MM-YYYY");
   return /* @__PURE__ */ p.jsxs(ru, { children: [
     /* @__PURE__ */ p.jsx(ou, { asChild: !0, children: /* @__PURE__ */ p.jsxs(
       "button",
       {
-        className: J(
+        className: X(
           "h-10 px-3 flex items-center bg-bg-1 gap-3 rounded-lg border border-border-1 text-sm text-text-2 min-w-sm justify-between cursor-pointer",
           o && "text-text-1",
+          i && "border-danger",
           n
         ),
-        ...i,
+        ...a,
         children: [
-          o ? a : e,
-          r ? /* @__PURE__ */ p.jsx(r, { className: "text-text-2 w-5 h-5" }) : /* @__PURE__ */ p.jsx(Zu, { className: "text-text-2 w-5 h-5" })
+          o ? c : e,
+          r ? /* @__PURE__ */ p.jsx(r, { className: "text-text-2 w-5 h-5" }) : /* @__PURE__ */ p.jsx(
+            Zu,
+            {
+              className: X("text-text-2 w-5 h-5", i && "text-danger")
+            }
+          )
         ]
       }
     ) }),
@@ -8219,14 +8227,14 @@ const Hd = ({
       {
         sideOffset: 8,
         align: "start",
-        className: J(
+        className: X(
           "p-2 z-999 border-border-2 rounded-lg border bg-bg-1 data-[state=open]:animate-popover-in"
         ),
         children: /* @__PURE__ */ p.jsx(
           _d,
           {
-            selected: o,
-            setSelected: s,
+            date: o,
+            setDate: s,
             rootClassName: "border-none p-0"
           }
         )