ml-uikit 1.1.6 → 1.1.8

package/dist/index.es30.js

@@ -1,154 +1,44 @@
-import * as a from "react";
-import { cva as s } from "class-variance-authority";
-import { cn as r } from "./index.es60.js";
-import { Button as u } from "./index.es10.js";
-import { Input as p } from "./index.es28.js";
-import { Textarea as l } from "./index.es56.js";
-function h({ className: e, ...t }) {
-  return /* @__PURE__ */ a.createElement(
-    "div",
-    {
-      "data-slot": "input-group",
-      role: "group",
-      className: r(
-        "group/input-group relative flex w-full items-center rounded-[8px] border border-[#e6e6e6] bg-white text-[14px] leading-[20px] text-foreground transition-colors",
-        "h-10 has-[>textarea]:h-auto",
-        // Variants based on alignment.
-        "has-[>[data-align=inline-start]]:[&>input]:pl-2",
-        "has-[>[data-align=inline-end]]:[&>input]:pr-2",
-        "has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3",
-        "has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3",
-        // Focus state.
-        "focus-within:border-[#1D1C20]",
-        // Error state.
-        "has-[[data-slot][aria-invalid=true]]:border-[#ff3b30]",
-        // Disabled state.
-        "data-[disabled=true]:cursor-not-allowed data-[disabled=true]:bg-[#f2f2f2] data-[disabled=true]:text-[#9ca3af]",
-        e
+import { j as s } from "./index.es62.js";
+import * as o from "react";
+import { EyeOff as c, Eye as d } from "lucide-react";
+import { cn as f } from "./index.es63.js";
+import { Input as u } from "./index.es29.js";
+const x = o.forwardRef(
+  ({
+    className: a,
+    showLabel: r = "Show password",
+    hideLabel: i = "Hide password",
+    disabled: e,
+    ...l
+  }, n) => {
+    const [t, p] = o.useState(!1);
+    return /* @__PURE__ */ s.jsxs("div", { className: "relative w-full", children: [
+      /* @__PURE__ */ s.jsx(
+        u,
+        {
+          ref: n,
+          type: t ? "text" : "password",
+          disabled: e,
+          className: f("pr-10", a),
+          ...l
+        }
       ),
-      ...t
-    }
-  );
-}
-const d = s(
-  "flex h-auto cursor-text select-none items-center justify-center gap-2 py-1.5 text-sm font-medium text-[#7f7d83] group-data-[disabled=true]/input-group:text-[#b3b3b3] [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      align: {
-        "inline-start": "order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]",
-        "inline-end": "order-last pr-3 has-[>button]:mr-[-0.4rem] has-[>kbd]:mr-[-0.35rem]",
-        "block-start": "[.border-b]:pb-3 order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5",
-        "block-end": "[.border-t]:pt-3 order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5"
-      }
-    },
-    defaultVariants: {
-      align: "inline-start"
-    }
+      /* @__PURE__ */ s.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => p((m) => !m),
+          disabled: e,
+          "aria-label": t ? i : r,
+          className: "absolute right-3 top-1/2 -translate-y-1/2 text-[#7f7d83] transition-colors hover:text-[#111111] focus-visible:outline-none disabled:cursor-not-allowed disabled:text-[#b3b3b3]",
+          children: t ? /* @__PURE__ */ s.jsx(c, { className: "h-4 w-4" }) : /* @__PURE__ */ s.jsx(d, { className: "h-4 w-4" })
+        }
+      )
+    ] });
   }
 );
-function v({
-  className: e,
-  align: t = "inline-start",
-  ...o
-}) {
-  return /* @__PURE__ */ a.createElement(
-    "div",
-    {
-      role: "group",
-      "data-slot": "input-group-addon",
-      "data-align": t,
-      className: r(d({ align: t }), e),
-      onClick: (n) => {
-        n.target.closest("button") || n.currentTarget.parentElement?.querySelector("input")?.focus();
-      },
-      ...o
-    }
-  );
-}
-const c = s(
-  "flex items-center gap-2 text-sm shadow-none",
-  {
-    variants: {
-      size: {
-        xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5",
-        sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
-        "icon-xs": "size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
-        "icon-sm": "size-8 p-0 has-[>svg]:p-0"
-      }
-    },
-    defaultVariants: {
-      size: "xs"
-    }
-  }
-);
-function k({
-  className: e,
-  type: t = "button",
-  variant: o = "ghost",
-  size: n = "xs",
-  ...i
-}) {
-  return /* @__PURE__ */ a.createElement(
-    u,
-    {
-      type: t,
-      "data-size": n,
-      variant: o,
-      className: r(c({ size: n }), e),
-      ...i
-    }
-  );
-}
-function z({ className: e, ...t }) {
-  return /* @__PURE__ */ a.createElement(
-    "span",
-    {
-      className: r(
-        "text-muted-foreground flex items-center gap-2 text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none",
-        e
-      ),
-      ...t
-    }
-  );
-}
-function w({
-  className: e,
-  ...t
-}) {
-  return /* @__PURE__ */ a.createElement(
-    p,
-    {
-      "data-slot": "input-group-control",
-      className: r(
-        "flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent",
-        e
-      ),
-      ...t
-    }
-  );
-}
-function G({
-  className: e,
-  ...t
-}) {
-  return /* @__PURE__ */ a.createElement(
-    l,
-    {
-      "data-slot": "input-group-control",
-      className: r(
-        "flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent",
-        e
-      ),
-      ...t
-    }
-  );
-}
+x.displayName = "PasswordInput";
 export {
-  h as InputGroup,
-  v as InputGroupAddon,
-  k as InputGroupButton,
-  w as InputGroupInput,
-  z as InputGroupText,
-  G as InputGroupTextarea
+  x as PasswordInput
 };
 //# sourceMappingURL=index.es30.js.map

package/dist/index.es30.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es30.js","sources":["../src/components/ui/input-group.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\nimport { Textarea } from \"@/components/ui/textarea\"\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      className={cn(\n        \"group/input-group relative flex w-full items-center rounded-[8px] border border-[#e6e6e6] bg-white text-[14px] leading-[20px] text-foreground transition-colors\",\n        \"h-10 has-[>textarea]:h-auto\",\n\n        // Variants based on alignment.\n        \"has-[>[data-align=inline-start]]:[&>input]:pl-2\",\n        \"has-[>[data-align=inline-end]]:[&>input]:pr-2\",\n        \"has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3\",\n        \"has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3\",\n\n        // Focus state.\n        \"focus-within:border-[#1D1C20]\",\n\n        // Error state.\n        \"has-[[data-slot][aria-invalid=true]]:border-[#ff3b30]\",\n\n        // Disabled state.\n        \"data-[disabled=true]:cursor-not-allowed data-[disabled=true]:bg-[#f2f2f2] data-[disabled=true]:text-[#9ca3af]\",\n\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupAddonVariants = cva(\n  \"flex h-auto cursor-text select-none items-center justify-center gap-2 py-1.5 text-sm font-medium text-[#7f7d83] group-data-[disabled=true]/input-group:text-[#b3b3b3] [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      align: {\n        \"inline-start\":\n          \"order-first pl-3 has-[>button]:ml-[-0.45rem] has-[>kbd]:ml-[-0.35rem]\",\n        \"inline-end\":\n          \"order-last pr-3 has-[>button]:mr-[-0.4rem] has-[>kbd]:mr-[-0.35rem]\",\n        \"block-start\":\n          \"[.border-b]:pb-3 order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5\",\n        \"block-end\":\n          \"[.border-t]:pt-3 order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  }\n)\n\nfunction InputGroupAddon({\n  className,\n  align = \"inline-start\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof inputGroupAddonVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={align}\n      className={cn(inputGroupAddonVariants({ align }), className)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus()\n      }}\n      {...props}\n    />\n  )\n}\n\nconst inputGroupButtonVariants = cva(\n  \"flex items-center gap-2 text-sm shadow-none\",\n  {\n    variants: {\n      size: {\n        xs: \"h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5\",\n        sm: \"h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5\",\n        \"icon-xs\":\n          \"size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0\",\n        \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  }\n)\n\nfunction InputGroupButton({\n  className,\n  type = \"button\",\n  variant = \"ghost\",\n  size = \"xs\",\n  ...props\n}: Omit<React.ComponentProps<typeof Button>, \"size\"> &\n  VariantProps<typeof inputGroupButtonVariants>) {\n  return (\n    <Button\n      type={type}\n      data-size={size}\n      variant={variant}\n      className={cn(inputGroupButtonVariants({ size }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"text-muted-foreground flex items-center gap-2 text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupInput({\n  className,\n  ...props\n}: React.ComponentProps<\"input\">) {\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 dark:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction InputGroupTextarea({\n  className,\n  ...props\n}: React.ComponentProps<\"textarea\">) {\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 dark:bg-transparent\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupText,\n  InputGroupInput,\n  InputGroupTextarea,\n}\n"],"names":["InputGroup","className","props","React","cn","inputGroupAddonVariants","cva","InputGroupAddon","align","e","inputGroupButtonVariants","InputGroupButton","type","variant","size","Button","InputGroupText","InputGroupInput","Input","InputGroupTextarea","Textarea"],"mappings":"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"}
+{"version":3,"file":"index.es30.js","sources":["../src/components/ui/password-input.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Eye, EyeOff } from \"lucide-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nimport { Input } from \"./input\";\n\ntype PasswordInputProps = Omit<React.ComponentProps<\"input\">, \"type\"> & {\n  showLabel?: string;\n  hideLabel?: string;\n};\n\nconst PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(\n  (\n    {\n      className,\n      showLabel = \"Show password\",\n      hideLabel = \"Hide password\",\n      disabled,\n      ...props\n    },\n    ref,\n  ) => {\n    const [isVisible, setIsVisible] = React.useState(false);\n\n    return (\n      <div className=\"relative w-full\">\n        <Input\n          ref={ref}\n          type={isVisible ? \"text\" : \"password\"}\n          disabled={disabled}\n          className={cn(\"pr-10\", className)}\n          {...props}\n        />\n        <button\n          type=\"button\"\n          onClick={() => setIsVisible((value) => !value)}\n          disabled={disabled}\n          aria-label={isVisible ? hideLabel : showLabel}\n          className=\"absolute right-3 top-1/2 -translate-y-1/2 text-[#7f7d83] transition-colors hover:text-[#111111] focus-visible:outline-none disabled:cursor-not-allowed disabled:text-[#b3b3b3]\"\n        >\n          {isVisible ? (\n            <EyeOff className=\"h-4 w-4\" />\n          ) : (\n            <Eye className=\"h-4 w-4\" />\n          )}\n        </button>\n      </div>\n    );\n  },\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\nexport type { PasswordInputProps };\n"],"names":["PasswordInput","React","className","showLabel","hideLabel","disabled","props","ref","isVisible","setIsVisible","jsxs","jsx","Input","cn","value","EyeOff","Eye"],"mappings":";;;;;AAYA,MAAMA,IAAgBC,EAAM;AAAA,EAC1B,CACE;AAAA,IACE,WAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,WAAAC,IAAY;AAAA,IACZ,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAM,CAACC,GAAWC,CAAY,IAAIR,EAAM,SAAS,EAAK;AAEtD,WACES,gBAAAA,EAAAA,KAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,MAAAC,gBAAAA,EAAAA;AAAAA,QAACC;AAAA,QAAA;AAAA,UACC,KAAAL;AAAA,UACA,MAAMC,IAAY,SAAS;AAAA,UAC3B,UAAAH;AAAA,UACA,WAAWQ,EAAG,SAASX,CAAS;AAAA,UAC/B,GAAGI;AAAA,QAAA;AAAA,MAAA;AAAA,MAENK,gBAAAA,EAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS,MAAMF,EAAa,CAACK,MAAU,CAACA,CAAK;AAAA,UAC7C,UAAAT;AAAA,UACA,cAAYG,IAAYJ,IAAYD;AAAA,UACpC,WAAU;AAAA,UAET,UAAAK,0BACEO,GAAA,EAAO,WAAU,WAAU,IAE5BJ,gBAAAA,EAAAA,IAACK,GAAA,EAAI,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAE7B,GACF;AAAA,EAEJ;AACF;AACAhB,EAAc,cAAc;"}

package/dist/index.es31.js

@@ -1,46 +1,381 @@
-import * as e from "react";
-import { OTPInput as c, OTPInputContext as d } from "input-otp";
-import { Minus as p } from "lucide-react";
-import { cn as n } from "./index.es60.js";
-const u = e.forwardRef(({ className: t, containerClassName: r, ...a }, o) => /* @__PURE__ */ e.createElement(
-  c,
-  {
-    ref: o,
-    containerClassName: n(
-      "flex items-center gap-2 has-[:disabled]:opacity-50",
-      r
-    ),
-    className: n("disabled:cursor-not-allowed", t),
-    ...a
-  }
-));
-u.displayName = "InputOTP";
-const f = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement("div", { ref: a, className: n("flex items-center", t), ...r }));
-f.displayName = "InputOTPGroup";
-const O = e.forwardRef(({ index: t, className: r, ...a }, o) => {
-  const s = e.useContext(d), { char: i, hasFakeCaret: l, isActive: m } = s.slots[t];
-  return /* @__PURE__ */ e.createElement(
-    "div",
-    {
-      ref: o,
-      className: n(
-        "relative flex h-9 w-9 items-center justify-center border-y border-r border-input text-sm shadow-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
-        m && "z-10 ring-1 ring-ring",
-        r
+import { j as t } from "./index.es62.js";
+import * as l from "react";
+import { startOfMonth as p, addMonths as z, isAfter as v, isBefore as J, setMonth as ce, setYear as fe, format as me } from "date-fns";
+import { CalendarDays as ue, ChevronLeft as xe, ChevronDown as W, ChevronRight as be } from "lucide-react";
+import { DayPicker as he } from "react-day-picker";
+import { cn as x } from "./index.es63.js";
+import { Button as q } from "./index.es10.js";
+import { Popover as pe, PopoverTrigger as ge, PopoverContent as we } from "./index.es43.js";
+const ve = "dd/MM/yyyy", De = "DD/MM/YYYY - DD/MM/YYYY", je = Array.from(
+  { length: 12 },
+  (e, n) => new Date(2020, n, 1).toLocaleString("default", { month: "long" })
+), N = (e, n, i) => J(e, n) ? n : v(e, i) ? i : e, C = (e) => {
+  if (!(!e?.from && !e?.to))
+    return e.from && e.to && v(e.from, e.to) ? {
+      from: e.to,
+      to: e.from
+    } : {
+      from: e.from,
+      to: e.to
+    };
+}, S = (e, n) => {
+  if (e)
+    return me(e, n);
+}, ye = (e, n) => {
+  const i = S(e?.from, n), m = S(e?.to, n);
+  return !i || !m ? "" : `${i} - ${m}`;
+}, Me = (e, n) => {
+  const i = S(e?.from, n) ?? "DD/MM/YYYY", m = S(e?.to, n) ?? "DD/MM/YYYY";
+  return `${i} - ${m}`;
+};
+function G({
+  label: e,
+  month: n,
+  minMonth: i,
+  maxMonth: m,
+  minDate: Y,
+  maxDate: k,
+  selectedDate: E,
+  disabledMatcher: D,
+  disabled: g,
+  years: j,
+  onMonthChange: u,
+  onSelectDate: y
+}) {
+  const w = () => {
+    u(z(n, -1));
+  }, P = () => {
+    u(z(n, 1));
+  }, A = g || !v(n, i), f = g || !J(n, m);
+  return /* @__PURE__ */ t.jsxs("div", { className: "w-full min-w-0", children: [
+    /* @__PURE__ */ t.jsxs("div", { className: "flex flex-wrap items-center gap-2 sm:flex-nowrap", children: [
+      /* @__PURE__ */ t.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: w,
+          disabled: A,
+          className: x(
+            "inline-flex h-8 w-8 items-center justify-center rounded-md text-[#6e6d71] transition-colors lg:h-9 lg:w-9",
+            "hover:bg-[#f5f5f5] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1d1c20]/20",
+            "disabled:cursor-not-allowed disabled:opacity-40"
+          ),
+          "aria-label": `Previous month for ${e.toLowerCase()}`,
+          children: /* @__PURE__ */ t.jsx(xe, { className: "h-4 w-4 lg:h-5 lg:w-5" })
+        }
       ),
-      ...a
-    },
-    i,
-    l && /* @__PURE__ */ e.createElement("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center" }, /* @__PURE__ */ e.createElement("div", { className: "h-4 w-px animate-caret-blink bg-foreground duration-1000" }))
-  );
-});
-O.displayName = "InputOTPSlot";
-const P = e.forwardRef(({ ...t }, r) => /* @__PURE__ */ e.createElement("div", { ref: r, role: "separator", ...t }, /* @__PURE__ */ e.createElement(p, null)));
-P.displayName = "InputOTPSeparator";
+      /* @__PURE__ */ t.jsxs("div", { className: "relative min-w-0 flex-1", children: [
+        /* @__PURE__ */ t.jsx(
+          "select",
+          {
+            value: n.getMonth(),
+            onChange: (s) => {
+              const a = Number(s.target.value);
+              u(ce(n, a));
+            },
+            disabled: g,
+            className: x(
+              "h-9 w-full appearance-none rounded-md border border-[#b7b7b9] bg-white px-3 pr-8 text-left text-sm font-medium leading-5 text-[#111111] lg:h-10 lg:px-4 lg:pr-10",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1d1c20]/20",
+              "disabled:cursor-not-allowed disabled:bg-[#f2f2f2] disabled:text-[#b3b3b3]"
+            ),
+            "aria-label": `Month for ${e.toLowerCase()}`,
+            children: je.map((s, a) => /* @__PURE__ */ t.jsx("option", { value: a, children: s }, s))
+          }
+        ),
+        /* @__PURE__ */ t.jsx(W, { className: "pointer-events-none absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-[#7f7d83] lg:right-3" })
+      ] }),
+      /* @__PURE__ */ t.jsxs("div", { className: "relative w-[104px] shrink-0 sm:w-[120px]", children: [
+        /* @__PURE__ */ t.jsx(
+          "select",
+          {
+            value: n.getFullYear(),
+            onChange: (s) => {
+              const a = Number(s.target.value);
+              u(fe(n, a));
+            },
+            disabled: g,
+            className: x(
+              "h-9 w-full appearance-none rounded-md border border-[#b7b7b9] bg-white px-3 pr-8 text-left text-sm font-medium leading-5 text-[#111111] lg:h-10 lg:px-4 lg:pr-9",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1d1c20]/20",
+              "disabled:cursor-not-allowed disabled:bg-[#f2f2f2] disabled:text-[#b3b3b3]"
+            ),
+            "aria-label": `Year for ${e.toLowerCase()}`,
+            children: j.map((s) => /* @__PURE__ */ t.jsx("option", { value: s, children: s }, s))
+          }
+        ),
+        /* @__PURE__ */ t.jsx(W, { className: "pointer-events-none absolute right-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-[#7f7d83] lg:right-3" })
+      ] }),
+      /* @__PURE__ */ t.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: P,
+          disabled: f,
+          className: x(
+            "inline-flex h-8 w-8 items-center justify-center rounded-md text-[#6e6d71] transition-colors lg:h-9 lg:w-9",
+            "hover:bg-[#f5f5f5] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1d1c20]/20",
+            "disabled:cursor-not-allowed disabled:opacity-40"
+          ),
+          "aria-label": `Next month for ${e.toLowerCase()}`,
+          children: /* @__PURE__ */ t.jsx(be, { className: "h-4 w-4 lg:h-5 lg:w-5" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ t.jsx("p", { className: "mt-1.5 text-center text-sm font-medium leading-5 text-[#666666] lg:mt-2", children: e }),
+    /* @__PURE__ */ t.jsx(
+      he,
+      {
+        mode: "single",
+        month: n,
+        onMonthChange: u,
+        selected: E,
+        onSelect: y,
+        showOutsideDays: !0,
+        fixedWeeks: !0,
+        hideNavigation: !0,
+        disabled: [
+          { before: Y },
+          { after: k },
+          ...D ? [D] : []
+        ],
+        className: "mt-1 p-0 [--drp-cell-size:1.625rem] md:[--drp-cell-size:1.875rem] xl:[--drp-cell-size:2.125rem]",
+        classNames: {
+          root: "w-full",
+          months: "w-full",
+          month: "w-full",
+          month_caption: "hidden",
+          month_grid: "w-full border-collapse",
+          weekdays: "grid grid-cols-7",
+          weekday: "h-[calc(var(--drp-cell-size)-0.25rem)] text-center text-[11px] font-medium leading-4 text-[#666666] lg:text-xs",
+          weeks: "grid gap-0",
+          week: "grid grid-cols-7",
+          day: "flex h-[var(--drp-cell-size)] w-full items-center justify-center p-0",
+          day_button: "h-[--drp-cell-size] w-[--drp-cell-size] rounded-md border border-transparent bg-transparent p-0 text-[13px] font-normal leading-none text-[#444444] transition-colors hover:border-[#cccccc] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2bbd8f]/25 lg:text-sm",
+          selected: "[&>button]:border-[#2bbd8f] [&>button]:bg-[#2bbd8f] [&>button]:text-[#111111]",
+          today: "font-medium",
+          outside: "text-[#a4a4a8]",
+          disabled: "pointer-events-none text-[#d3d3d6]",
+          hidden: "invisible"
+        }
+      }
+    )
+  ] });
+}
+const Ne = l.forwardRef(
+  ({
+    value: e,
+    defaultValue: n,
+    onValueChange: i,
+    wrapperClassName: m,
+    popoverClassName: Y,
+    popoverSide: k = "bottom",
+    popoverAvoidCollisions: E = !0,
+    className: D,
+    placeholder: g = De,
+    dateFormat: j = ve,
+    minYear: u = 2e3,
+    maxYear: y = 2100,
+    disabled: w,
+    ...P
+  }, A) => {
+    const f = Math.min(u, y), s = Math.max(u, y), a = l.useMemo(
+      () => p(new Date(f, 0, 1)),
+      [f]
+    ), b = l.useMemo(
+      () => p(new Date(s, 11, 1)),
+      [s]
+    ), R = l.useMemo(() => new Date(f, 0, 1), [f]), O = l.useMemo(
+      () => new Date(s, 11, 31),
+      [s]
+    ), $ = l.useMemo(
+      () => Array.from(
+        { length: s - f + 1 },
+        (o, c) => f + c
+      ),
+      [f, s]
+    ), B = e !== void 0, [K, Q] = l.useState(
+      C(n)
+    ), h = C(B ? e : K), L = l.useCallback(
+      (o) => {
+        const c = p(/* @__PURE__ */ new Date()), r = N(
+          p(o?.from ?? c),
+          a,
+          b
+        ), ie = o?.to ? p(o.to) : z(r, 1), de = N(ie, a, b);
+        return {
+          start: r,
+          end: de
+        };
+      },
+      [a, b]
+    ), [T, V] = l.useState(!1), [d, _] = l.useState(
+      h
+    ), H = L(h), [X, U] = l.useState(H.start), [Z, F] = l.useState(H.end), M = l.useCallback(
+      (o) => {
+        const c = C(o);
+        _(c);
+        const r = L(c);
+        U(r.start), F(r.end);
+      },
+      [L]
+    );
+    l.useEffect(() => {
+      T || M(h);
+    }, [h, T, M]);
+    const ee = (o) => {
+      U(N(p(o), a, b));
+    }, te = (o) => {
+      F(N(p(o), a, b));
+    }, oe = (o) => {
+      o && _((c) => {
+        const r = {
+          from: o,
+          to: c?.to
+        };
+        return r.to && v(o, r.to) && (r.to = o), r;
+      });
+    }, ne = (o) => {
+      o && _((c) => {
+        const r = {
+          from: c?.from,
+          to: o
+        };
+        return r.from && v(r.from, o) && (r.from = o), r;
+      });
+    }, se = () => {
+      M(h), V(!1);
+    }, re = () => {
+      const o = C(d);
+      B || Q(o), i?.(o), V(!1);
+    }, le = !!(d?.from && d?.to), I = ye(h, j), ae = Me(d, j);
+    return /* @__PURE__ */ t.jsx("div", { className: x("w-full", m), children: /* @__PURE__ */ t.jsxs(
+      pe,
+      {
+        open: T,
+        onOpenChange: (o) => {
+          w || (o && M(h), V(o));
+        },
+        children: [
+          /* @__PURE__ */ t.jsx(ge, { asChild: !0, children: /* @__PURE__ */ t.jsxs(
+            "button",
+            {
+              ref: A,
+              type: "button",
+              disabled: w,
+              className: x(
+                "flex h-10 w-full items-center justify-between rounded-[8px] border border-[#e6e6e6] bg-white px-3 py-2 text-left text-[14px] leading-[20px] transition-colors",
+                "focus-visible:outline-none focus-visible:border-[#1D1C20] focus-visible:ring-0",
+                "disabled:cursor-not-allowed disabled:bg-[#f2f2f2] disabled:text-[#9ca3af] disabled:opacity-100",
+                D
+              ),
+              ...P,
+              children: [
+                /* @__PURE__ */ t.jsx(
+                  "span",
+                  {
+                    className: x(
+                      "truncate text-[14px] font-normal leading-[20px]",
+                      I ? "text-[#111111]" : "text-[#b3b3b3]"
+                    ),
+                    children: I || g
+                  }
+                ),
+                /* @__PURE__ */ t.jsx(ue, { className: "ml-3 h-4 w-4 shrink-0 text-[#111111]" })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ t.jsxs(
+            we,
+            {
+              side: k,
+              avoidCollisions: E,
+              align: "start",
+              sideOffset: 10,
+              className: x(
+                "w-[min(95vw,760px)] max-h-[var(--radix-popover-content-available-height)] overflow-y-auto overscroll-contain rounded-xl border border-[#d8d8da] bg-[#f7f7f8] p-3 shadow-[0px_12px_24px_rgba(0,0,0,0.08)] sm:p-4",
+                Y
+              ),
+              children: [
+                /* @__PURE__ */ t.jsxs("div", { className: "grid gap-3 md:grid-cols-2 md:gap-4", children: [
+                  /* @__PURE__ */ t.jsx(
+                    G,
+                    {
+                      label: "Start date",
+                      month: X,
+                      minMonth: a,
+                      maxMonth: b,
+                      minDate: R,
+                      maxDate: O,
+                      selectedDate: d?.from,
+                      disabledMatcher: d?.to ? { after: d.to } : void 0,
+                      disabled: w,
+                      years: $,
+                      onMonthChange: ee,
+                      onSelectDate: oe
+                    }
+                  ),
+                  /* @__PURE__ */ t.jsx(
+                    G,
+                    {
+                      label: "End date",
+                      month: Z,
+                      minMonth: a,
+                      maxMonth: b,
+                      minDate: R,
+                      maxDate: O,
+                      selectedDate: d?.to,
+                      disabledMatcher: d?.from ? { before: d.from } : void 0,
+                      disabled: w,
+                      years: $,
+                      onMonthChange: te,
+                      onSelectDate: ne
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ t.jsxs("div", { className: "mt-2.5 border-t border-[#d8d8da] pt-2.5", children: [
+                  /* @__PURE__ */ t.jsx(
+                    "input",
+                    {
+                      readOnly: !0,
+                      value: ae,
+                      className: "h-9 w-full rounded-md border border-[#e6e6e6] bg-white px-3 py-2 text-sm leading-5 text-[#111111] outline-none transition-colors placeholder:text-[#b3b3b3] focus-visible:border-[#1D1C20]",
+                      "aria-label": "Selected date range"
+                    }
+                  ),
+                  /* @__PURE__ */ t.jsxs("div", { className: "mt-2.5 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", children: [
+                    /* @__PURE__ */ t.jsx(
+                      q,
+                      {
+                        type: "button",
+                        variant: "outline",
+                        className: "h-9 rounded-md px-4 text-sm",
+                        onClick: se,
+                        children: "Cancel"
+                      }
+                    ),
+                    /* @__PURE__ */ t.jsx(
+                      q,
+                      {
+                        type: "button",
+                        className: "h-9 rounded-md px-4 text-sm",
+                        disabled: !le,
+                        onClick: re,
+                        children: "Apply"
+                      }
+                    )
+                  ] })
+                ] })
+              ]
+            }
+          )
+        ]
+      }
+    ) });
+  }
+);
+Ne.displayName = "DateRangePicker";
 export {
-  u as InputOTP,
-  f as InputOTPGroup,
-  P as InputOTPSeparator,
-  O as InputOTPSlot
+  Ne as DateRangePicker
 };
 //# sourceMappingURL=index.es31.js.map