@dimasbaguspm/versaur 0.0.16 → 0.0.17

package/dist/js/{switch-input-Bx6_2zG9.js → email-input-CVyrFzqL.js}

@@ -1,8 +1,8 @@
-import { c as cva, j as jsxRuntimeExports, a as cn } from "./index-DOdDlCoL.js";
-import React__default, { useState, useRef, createContext, useContext, useEffect, useId, useCallback } from "react";
-import { I as Icon, C as Calculator, B as Button, b as Calendar, T as Text } from "./calendar-CUjVZ7Ap.js";
-import { a as Modal, M as Menu } from "./menu-Bm-yPIMN.js";
-import { CalculatorIcon, Check, Clock } from "lucide-react";
+import { a as cva, j as jsxRuntimeExports, c as cn } from "./index-C1uJQB34.js";
+import React__default, { useState, useRef, createContext, useContext, forwardRef, useId, useEffect } from "react";
+import { I as Icon, C as Calculator, d as Button, h as Text } from "./tile-B9bt2AY6.js";
+import { M as Modal } from "./modal-FqewbVts.js";
+import { CalculatorIcon, Check, Calendar, SearchIcon, Clock, Banknote, MailIcon } from "lucide-react";
 const textInputVariants = cva(
   "block w-full rounded-md border bg-white transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none disabled:bg-gray-50",
   {
@@ -39,64 +39,64 @@ const textInputVariants = cva(
   ({
     variant: e = "primary",
     label: t,
-    leftContent: n,
-    rightContent: o,
-    helperText: s,
-    error: c,
+    leftContent: i,
+    rightContent: s,
+    helperText: n,
+    error: l,
     className: u,
-    disabled: a,
+    disabled: o,
     id: r,
-    ...i
+    ...d
   }, x) => {
-    const l = React__default.useId(), g = r || l, d = !!c;
+    const c = React__default.useId(), a = r || c, g = !!l;
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
       t && /* @__PURE__ */ jsxRuntimeExports.jsx(
         "label",
         {
-          htmlFor: g,
+          htmlFor: a,
           className: "block text-sm font-medium text-foreground mb-2",
           children: t
         }
       ),
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full", u), children: [
-        n && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        i && /* @__PURE__ */ jsxRuntimeExports.jsx(
           "span",
           {
             className: "absolute left-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
             "data-testid": "left-content",
-            children: n
+            children: i
           }
         ),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           "input",
           {
             ref: x,
-            id: g,
-            "aria-invalid": d,
-            "aria-disabled": a,
-            disabled: a,
+            id: a,
+            "aria-invalid": g,
+            "aria-disabled": o,
+            disabled: o,
             className: cn(
               textInputVariants({
-                variant: d ? "danger" : e
+                variant: g ? "danger" : e
               }),
-              n ? "pl-9" : "pl-3",
-              o ? "pr-9" : "pr-3",
+              i ? "pl-9" : "pl-3",
+              s ? "pr-9" : "pr-3",
               "h-10"
             ),
-            ...i
+            ...d
           }
         ),
-        o && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        s && /* @__PURE__ */ jsxRuntimeExports.jsx(
           "span",
           {
             className: "absolute right-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
             "data-testid": "right-content",
-            children: o
+            children: s
           }
         )
       ] }),
-      d && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: c }),
-      !d && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: s })
+      g && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: l }),
+      !g && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: n })
     ] });
   }
 );
@@ -281,42 +281,42 @@ const DEFAULT_HEADER = "Enter Amount", CalculatorInput = ({
   if (!e)
     throw new Error("CheckboxOption must be used within CheckboxInput");
   return e;
-}, CheckboxOption = React__default.forwardRef(({ children: e, description: t, className: n, disabled: o, id: s, ...c }, u) => {
-  const a = useCheckboxContext(), r = React__default.useId(), i = s || r, x = o || a.disabled, l = a.error ? "danger" : a.variant || "primary";
+}, CheckboxOption = React__default.forwardRef(({ children: e, description: t, className: i, disabled: s, id: n, ...l }, u) => {
+  const o = useCheckboxContext(), r = React__default.useId(), d = n || r, x = s || o.disabled, c = o.error ? "danger" : o.variant || "primary";
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
       "input",
       {
         ref: u,
         type: "checkbox",
-        id: i,
+        id: d,
         disabled: x,
         className: cn(
           checkboxVariants({
-            variant: l,
-            size: a.size
+            variant: c,
+            size: o.size
           }),
           // Custom checkmark styling using ::after - centered positioning with size variants
           'after:content-[""] after:absolute after:left-1/2 after:top-[45%] after:-translate-x-1/2 after:-translate-y-1/2 after:border-b-2 after:border-r-2 after:border-white after:rotate-45 after:opacity-0 after:transition-opacity after:duration-200',
           // Size-specific checkmark dimensions
-          a.size === "sm" && "after:w-[3px] after:h-[6px]",
-          a.size === "md" && "after:w-[4px] after:h-[8px]",
-          a.size === "lg" && "after:w-[6px] after:h-[10px]",
+          o.size === "sm" && "after:w-[3px] after:h-[6px]",
+          o.size === "md" && "after:w-[4px] after:h-[8px]",
+          o.size === "lg" && "after:w-[6px] after:h-[10px]",
           "checked:after:opacity-100",
           // Outline variants use colored checkmark
-          l?.includes("outline") && "checked:after:border-current",
-          n
+          c?.includes("outline") && "checked:after:border-current",
+          i
         ),
-        ...c
+        ...l
       }
     ) }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "label",
         {
-          htmlFor: i,
+          htmlFor: d,
           className: checkboxLabelVariants({
-            size: a.size,
+            size: o.size,
             disabled: x
           }),
           children: e
@@ -327,9 +327,9 @@ const DEFAULT_HEADER = "Enter Amount", CalculatorInput = ({
         {
           className: cn(
             "text-gray-600 mt-1",
-            a.size === "sm" && "text-xs",
-            a.size === "md" && "text-xs",
-            a.size === "lg" && "text-sm",
+            o.size === "sm" && "text-xs",
+            o.size === "md" && "text-xs",
+            o.size === "lg" && "text-sm",
             x && "opacity-50"
           ),
           children: t
@@ -343,43 +343,41 @@ const CheckboxInputRoot = React__default.forwardRef(
   ({
     variant: e = "primary",
     size: t = "md",
-    label: n,
-    helperText: o,
-    error: s,
-    direction: c = "vertical",
+    label: i,
+    helperText: s,
+    error: n,
+    direction: l = "vertical",
     className: u,
-    disabled: a,
+    disabled: o,
     children: r,
-    ...i
+    ...d
   }, x) => {
-    const l = !!s, g = {
+    const c = !!n, a = {
       variant: e,
       size: t,
-      disabled: a,
-      error: l
+      disabled: o,
+      error: c
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(CheckboxContext.Provider, { value: g, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: x, className: cn("w-full", u), ...i, children: [
-      n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: checkboxGroupVariants({ direction: c }), children: r }),
-      l && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
-      !l && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(CheckboxContext.Provider, { value: a, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: x, className: cn("w-full", u), ...d, children: [
+      i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: i }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: checkboxGroupVariants({ direction: l }), children: r }),
+      c && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: n }),
+      !c && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
     ] }) });
   }
 );
 CheckboxInputRoot.displayName = "CheckboxInput";
 const CheckboxInput = Object.assign(CheckboxInputRoot, {
   Option: CheckboxOption
-}), ChipInputContext = createContext(
-  null
-), useChipInputContext = () => {
-  const e = useContext(ChipInputContext);
+}), ChipMultipleInputContext = createContext(null), useChipMultipleInputContext = () => {
+  const e = useContext(ChipMultipleInputContext);
   if (!e)
-    throw new Error("useChipInputContext must be used within ChipInputContext");
+    throw new Error(
+      "useChipMultipleInputContext must be used within ChipMultipleInputContext"
+    );
   return e;
 }, chipOptionVariants = cva(
-  [
-    "inline-flex items-center bg-white font-regular transition-colors duration-200 cursor-pointer border border-border"
-  ].join(" "),
+  "inline-flex items-center bg-white font-regular transition-colors duration-200 cursor-pointer border border-border",
   {
     variants: {
       variant: {
@@ -456,83 +454,77 @@ const CheckboxInput = Object.assign(CheckboxInputRoot, {
         rounded: "rounded-lg"
       },
       size: {
-        sm: "px-2 py-1 text-xs gap-1",
-        md: "px-3 py-1.5 text-sm gap-1.5",
-        lg: "px-4 py-2 text-base gap-2"
+        sm: "px-3 py-1 text-xs min-h-[32px]",
+        md: "px-4 py-2 text-sm min-h-[40px]",
+        lg: "px-5 py-2.5 text-base min-h-[48px]"
       }
-    },
-    defaultVariants: {
-      variant: "primary",
-      selected: !1,
-      shape: "circle",
-      size: "sm"
     }
   }
-), ChipOption = React__default.forwardRef(
+), ChipMultipleOption = React__default.forwardRef(
   ({
     children: e,
     className: t,
-    disabled: n,
-    id: o,
-    value: s,
-    check: c,
+    disabled: i,
+    id: s,
+    value: n,
+    check: l,
     defaultCheck: u = !1,
-    ...a
+    ...o
   }, r) => {
-    const i = useChipInputContext(), x = React__default.useId(), l = o || x, g = n || i.disabled, d = i.error ? "danger" : i.variant || "primary", m = i.shape || "circle", f = i.size || "sm", h = i.value?.includes(s) ?? !1, w = (j) => {
-      if (!g) {
-        const b = i.value || [];
+    const d = useChipMultipleInputContext(), x = React__default.useId(), c = s || x, a = i || d.disabled, g = d.error ? "danger" : d.variant || "primary", h = d.shape || "circle", b = d.size || "sm", f = d.value?.includes(n) ?? !1, y = (w) => {
+      if (!a) {
+        const R = d.value || [];
         let C;
-        h ? C = b.filter((I) => I !== s) : C = [...b, s], i.onChange?.(C);
+        f ? C = R.filter((k) => k !== n) : C = [...R, n], d.onChange?.(C);
       }
-      a.onChange?.(j);
-    }, y = f === "lg" ? 20 : f === "md" ? 18 : 16;
+      o.onChange?.(w);
+    }, m = b === "lg" ? 20 : b === "md" ? 18 : 16;
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "input",
         {
           ref: r,
           type: "checkbox",
-          id: l,
-          name: `${i.name}[]`,
-          value: s,
-          checked: h,
-          disabled: g,
-          onChange: w,
+          id: c,
+          name: `${d.name}[]`,
+          value: n,
+          checked: f,
+          disabled: a,
+          onChange: y,
           className: "sr-only",
-          ...a
+          ...o
         }
       ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "label",
         {
-          htmlFor: l,
-          "data-selected": h,
+          htmlFor: c,
+          "data-selected": f,
           className: cn(
             chipOptionVariants({
-              variant: d,
-              selected: h,
-              shape: m,
-              size: f
+              variant: g,
+              selected: f,
+              shape: h,
+              size: b
             }),
-            g && "opacity-50 cursor-not-allowed pointer-events-none",
+            a && "opacity-50 cursor-not-allowed pointer-events-none",
             t
           ),
           children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center", children: [
-            (c || u) && /* @__PURE__ */ jsxRuntimeExports.jsx(
+            (l || u) && /* @__PURE__ */ jsxRuntimeExports.jsx(
               "span",
               {
                 className: cn(
                   "flex items-center",
                   "transition-transform transition-opacity duration-200",
-                  h ? "opacity-100 scale-100 mr-1" : "opacity-0 scale-75"
+                  f ? "opacity-100 scale-100 mr-1" : "opacity-0 scale-75"
                 ),
                 "aria-hidden": "true",
-                children: h && (c || /* @__PURE__ */ jsxRuntimeExports.jsx(
+                children: f && (l || /* @__PURE__ */ jsxRuntimeExports.jsx(
                   Check,
                   {
-                    size: y,
-                    className: d === "primary" ? "text-primary" : d === "secondary" ? "text-secondary" : d === "tertiary" ? "text-tertiary" : d === "ghost" ? "text-ghost" : d === "success" ? "text-success" : d === "info" ? "text-info" : d === "warning" ? "text-warning" : d === "danger" ? "text-danger" : "text-primary"
+                    size: m,
+                    className: g === "primary" ? "text-primary" : g === "secondary" ? "text-secondary" : g === "tertiary" ? "text-tertiary" : g === "ghost" ? "text-ghost" : g === "success" ? "text-success" : g === "info" ? "text-info" : g === "warning" ? "text-warning" : g === "danger" ? "text-danger" : "text-primary"
                   }
                 ))
               }
@@ -544,299 +536,96 @@ const CheckboxInput = Object.assign(CheckboxInputRoot, {
     ] });
   }
 );
-ChipOption.displayName = "ChipOption";
-const ChipInputRoot = React__default.forwardRef(
+ChipMultipleOption.displayName = "ChipMultipleOption";
+const ChipMultipleInputRoot = React__default.forwardRef(
   ({
     variant: e = "primary",
     shape: t = "circle",
-    size: n = "sm",
-    label: o,
-    helperText: s,
-    error: c,
+    size: i = "sm",
+    label: s,
+    helperText: n,
+    error: l,
     className: u,
-    disabled: a,
+    disabled: o,
     name: r,
-    value: i = [],
+    value: d = [],
     onChange: x,
-    children: l,
-    ...g
-  }, d) => {
-    const m = !!c, f = {
+    children: c,
+    ...a
+  }, g) => {
+    const h = !!l, b = {
       variant: e,
       shape: t,
-      size: n,
-      disabled: a,
-      error: m,
+      size: i,
+      disabled: o,
+      error: h,
       name: r,
-      value: i,
+      value: d,
       onChange: x
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(ChipInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: d, className: cn("w-full", u), ...g, children: [
-      o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: o }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-2", children: l }),
-      m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: c }),
-      !m && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(ChipMultipleInputContext.Provider, { value: b, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: g, className: cn("w-full", u), ...a, children: [
+      s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: s }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-2", children: c }),
+      h && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: l }),
+      !h && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: n })
     ] }) });
   }
-), ChipInput = Object.assign(ChipInputRoot, {
-  Option: ChipOption
-}), dateSinglePickerInputVariants = textInputVariants, DateSinglePickerTrigger = React__default.forwardRef(
-  ({
-    leftContent: e,
-    rightContent: t,
-    hasError: n,
-    variant: o = "primary",
-    value: s,
-    placeholder: c = "Select date",
-    formatDate: u,
-    className: a,
-    ...r
-  }, i) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    "button",
-    {
-      ref: i,
-      type: "button",
-      "aria-invalid": n,
-      className: cn(
-        dateSinglePickerInputVariants({
-          variant: n ? "danger" : o
-        }),
-        e ? "pl-9" : "pl-3",
-        t ? "pr-9" : "pr-3",
-        "h-10 flex items-center justify-between cursor-pointer w-full relative",
-        "text-left",
-        a
-      ),
-      ...r,
-      children: [
-        e && /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "span",
-          {
-            className: "absolute left-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
-            "data-testid": "left-content",
-            children: e
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "span",
-          {
-            className: cn(
-              "flex-1",
-              e ? "ml-2" : "",
-              t ? "mr-2" : ""
-            ),
-            children: u ? u(s) : c
-          }
-        ),
-        t && /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "span",
-          {
-            className: "absolute right-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
-            "data-testid": "right-content",
-            children: t
-          }
-        )
-      ]
-    }
-  )
-);
-DateSinglePickerTrigger.displayName = "DateSinglePickerTrigger";
-const DateSinglePickerDocked = ({
-  open: e,
-  value: t,
-  onChange: n,
-  handleMenuClose: o
-}) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu, { isOpen: e, onOutsideClick: o, children: [
-  /* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Trigger, { className: "absolute top-[90%] left-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { "aria-hidden": "true" }) }),
-  /* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Content, { className: "drop-shadow-lg rounded-lg bg-white border border-neutral", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-    Calendar,
-    {
-      value: t,
-      onChange: (s) => {
-        s instanceof Date && n(s);
-      }
-    }
-  ) })
-] }), DateSinglePickerModal = ({
-  open: e,
-  setOpen: t,
-  value: n,
-  onChange: o,
-  label: s,
-  buttonRef: c
-}) => {
-  const [u, a] = useState(
-    n
-  );
-  useEffect(() => {
-    a(n);
-  }, [n, e]);
-  const r = () => {
-    t(!1), a(n), c.current?.focus();
-  }, i = () => {
-    u && (o(u), t(!1), c.current?.focus());
-  };
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
-    Modal,
-    {
-      isOpen: e,
-      onOpenChange: t,
-      placement: "top",
-      size: "md",
-      "aria-label": s ? String(s) : "Select date",
-      disableOverlayClose: !1,
-      disableEscClose: !1,
-      children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Body, { className: "px-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Calendar,
-          {
-            value: u,
-            onChange: (x) => {
-              x instanceof Date && a(x);
-            }
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal.Footer, { className: "px-6", children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            Button,
-            {
-              onClick: r,
-              variant: "ghost",
-              type: "button",
-              size: "sm",
-              children: "Cancel"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            Button,
-            {
-              onClick: i,
-              variant: "primary",
-              type: "button",
-              disabled: !u,
-              size: "sm",
-              children: "Confirm"
-            }
-          )
-        ] })
-      ]
-    }
-  );
-};
-function useDateSinglePicker({ id: e }) {
-  const [t, n] = useState(!1), o = useId(), s = e || o, c = useRef(null), u = useCallback(
-    (r) => {
-      (r.key === "ArrowDown" || r.key === "Enter" || r.key === " ") && n(!0);
-    },
-    []
-  ), a = useCallback(() => {
-    n(!1), c.current?.focus();
-  }, []);
-  return {
-    open: t,
-    setOpen: n,
-    inputId: s,
-    buttonRef: c,
-    handleKeyDown: u,
-    handleMenuClose: a
-  };
+), ChipMultipleInput = Object.assign(ChipMultipleInputRoot, {
+  Option: ChipMultipleOption
+});
+function defaultDateFormatter(e) {
+  if (!e) return "";
+  const t = new Date(e);
+  return isNaN(t.getTime()) ? e : t.toLocaleDateString(void 0, {
+    year: "numeric",
+    month: "short",
+    day: "numeric"
+  });
 }
-const DateSinglePickerInput = React__default.forwardRef(
-  ({
-    value: e,
-    onChange: t,
-    label: n,
-    leftContent: o,
-    rightContent: s,
-    helperText: c,
-    error: u,
-    variant: a = "primary",
-    disabled: r,
-    placeholder: i = "Select date",
-    id: x,
-    type: l = "docked",
-    ...g
-  }, d) => {
-    if (e === void 0 || typeof t != "function")
-      throw new Error(
-        "DateSinglePickerInput is a controlled component: value and onChange are required."
-      );
-    const {
-      open: m,
-      setOpen: f,
-      inputId: h,
-      buttonRef: w,
-      handleKeyDown: y,
-      handleMenuClose: j
-    } = useDateSinglePicker({ id: x }), b = !!u, C = (R) => R ? R.toLocaleDateString(void 0, {
-      year: "numeric",
-      month: "short",
-      day: "numeric"
-    }) : typeof i == "string" ? i : "Select date", I = (R) => typeof g.formatDate == "function" ? g.formatDate(R) : C(R), k = () => f((R) => !R), p = y, E = (R) => {
-      t?.(R), w.current?.focus();
-    };
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative w-full", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
-        n && /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "label",
-          {
-            htmlFor: h,
-            className: "block text-sm font-medium text-foreground mb-2",
-            children: n
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          DateSinglePickerTrigger,
-          {
-            ref: (R) => {
-              w.current = R, typeof d == "function" ? d(R) : d && (d.current = R);
-            },
-            id: h,
-            "aria-haspopup": "dialog",
-            "aria-expanded": m,
-            "aria-controls": m ? `${h}-calendar` : void 0,
-            "aria-invalid": b,
-            "aria-disabled": r,
-            disabled: r,
-            leftContent: o,
-            rightContent: s,
-            hasError: b,
-            variant: a,
-            value: e,
-            placeholder: typeof i == "string" ? i : "Select date",
-            formatDate: I,
-            onClick: k,
-            onKeyDown: p,
-            tabIndex: 0,
-            ...g
-          }
-        ),
-        b && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: u }),
-        c && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-muted-foreground", children: c })
-      ] }),
-      l === "docked" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-        DateSinglePickerDocked,
-        {
-          open: m,
-          value: e,
-          onChange: E,
-          inputId: h,
-          handleMenuClose: j
-        }
-      ) : /* @__PURE__ */ jsxRuntimeExports.jsx(
-        DateSinglePickerModal,
-        {
-          open: m,
-          setOpen: f,
-          value: e,
-          onChange: E,
-          label: typeof n == "string" ? n : void 0,
-          buttonRef: w
-        }
-      )
-    ] });
-  }
-), radioGroupVariants = cva("space-y-2", {
+const DateSinglePickerInput = React__default.forwardRef(function e({ value: t = "", onChange: i, label: s, formatter: n, ...l }, u) {
+  const o = useRef(null), r = (a) => {
+    o.current = a, typeof u == "function" ? u(a) : u && typeof u == "object" && (u.current = a);
+  }, d = () => {
+    o.current && (typeof o.current.showPicker == "function" ? o.current.showPicker() : o.current.focus());
+  }, x = (a) => {
+    i(a.target.value);
+  }, c = (n ?? defaultDateFormatter)(t);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      TextInput,
+      {
+        type: "text",
+        value: c,
+        label: s,
+        readOnly: !0,
+        tabIndex: 0,
+        "aria-hidden": "true",
+        onClick: d,
+        leftContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: Calendar, color: "inherit", size: "sm" }),
+        "data-testid": "date-single-picker-visible-input",
+        ...l
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "input",
+      {
+        ref: r,
+        type: "date",
+        value: t,
+        onChange: x,
+        style: {
+          position: "absolute",
+          opacity: 0,
+          pointerEvents: "none",
+          width: 0,
+          height: 0
+        },
+        tabIndex: -1,
+        "aria-label": typeof s == "string" ? s : void 0
+      }
+    )
+  ] });
+}), radioGroupVariants = cva("space-y-2", {
   variants: {
     direction: {
       vertical: "space-y-2 space-x-0",
@@ -913,21 +702,21 @@ const DateSinglePickerInput = React__default.forwardRef(
     );
   return e;
 }, RadioOption = React__default.forwardRef(
-  ({ children: e, description: t, className: n, disabled: o, id: s, value: c, ...u }, a) => {
-    const r = useRadioInputContext(), i = React__default.useId(), x = s || i, l = o || r.disabled, g = r.error ? "danger" : r.variant || "primary";
+  ({ children: e, description: t, className: i, disabled: s, id: n, value: l, ...u }, o) => {
+    const r = useRadioInputContext(), d = React__default.useId(), x = n || d, c = s || r.disabled, a = r.error ? "danger" : r.variant || "primary";
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
         "input",
         {
-          ref: a,
+          ref: o,
           type: "radio",
           id: x,
           name: r.name,
-          value: c,
-          disabled: l,
+          value: l,
+          disabled: c,
           className: cn(
             radioOptionVariants({
-              variant: g,
+              variant: a,
               size: r.size
             }),
             // Custom radio dot styling using ::before - centered positioning with size variants
@@ -938,8 +727,8 @@ const DateSinglePickerInput = React__default.forwardRef(
             r.size === "lg" && "before:w-[10px] before:h-[10px]",
             "checked:before:opacity-100",
             // Outline variants use colored radio dot
-            g?.includes("outline") && "checked:before:bg-current",
-            n
+            a?.includes("outline") && "checked:before:bg-current",
+            i
           ),
           ...u
         }
@@ -951,7 +740,7 @@ const DateSinglePickerInput = React__default.forwardRef(
             htmlFor: x,
             className: radioLabelVariants({
               size: r.size,
-              disabled: l
+              disabled: c
             }),
             children: e
           }
@@ -964,7 +753,7 @@ const DateSinglePickerInput = React__default.forwardRef(
               r.size === "sm" && "text-xs",
               r.size === "md" && "text-xs",
               r.size === "lg" && "text-sm",
-              l && "opacity-50"
+              c && "opacity-50"
             ),
             children: t
           }
@@ -976,58 +765,48 @@ const DateSinglePickerInput = React__default.forwardRef(
   ({
     variant: e = "primary",
     size: t = "md",
-    label: n,
-    helperText: o,
-    error: s,
-    direction: c = "vertical",
+    label: i,
+    helperText: s,
+    error: n,
+    direction: l = "vertical",
     className: u,
-    disabled: a,
+    disabled: o,
     name: r,
-    children: i,
+    children: d,
     ...x
-  }, l) => {
-    const g = !!s, d = {
+  }, c) => {
+    const a = !!n, g = {
       variant: e,
       size: t,
-      disabled: a,
-      error: g,
+      disabled: o,
+      error: a,
       name: r
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(RadioInputContext.Provider, { value: d, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: l, className: cn("w-full", u), ...x, children: [
-      n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: radioGroupVariants({ direction: c }), children: i }),
-      g && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
-      !g && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(RadioInputContext.Provider, { value: g, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: c, className: cn("w-full", u), ...x, children: [
+      i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: i }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: radioGroupVariants({ direction: l }), children: d }),
+      a && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: n }),
+      !a && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
     ] }) });
   }
 ), RadioInput = Object.assign(RadioInputRoot, {
   Option: RadioOption
 }), segmentGroupVariants$1 = cva(
-  "inline-flex rounded-lg border overflow-hidden bg-neutral/50 p-1",
+  "flex flex-row rounded-full border overflow-hidden p-1 gap-0.25",
   {
     variants: {
       variant: {
         // Core variants using Versaur color system
-        primary: "border-primary/20",
-        secondary: "border-secondary/20",
-        tertiary: "border-tertiary/20",
-        ghost: "border-ghost/20",
+        primary: "border-primary-light",
+        secondary: "border-secondary-light",
+        tertiary: "border-tertiary-light",
+        ghost: "border-ghost-light",
         neutral: "border-gray-200",
-        // Outline variants
-        "primary-outline": "border-primary",
-        "secondary-outline": "border-secondary",
-        "tertiary-outline": "border-tertiary",
-        "ghost-outline": "border-ghost",
-        "neutral-outline": "border-gray-400",
         // Semantic variants
-        success: "border-success/20",
-        "success-outline": "border-success",
-        info: "border-info/20",
-        "info-outline": "border-info",
-        warning: "border-warning/20",
-        "warning-outline": "border-warning",
-        danger: "border-danger/20",
-        "danger-outline": "border-danger"
+        success: "border-success-light",
+        info: "border-info-light",
+        warning: "border-warning-light",
+        danger: "border-danger-light"
       },
       size: {
         sm: "text-xs",
@@ -1046,7 +825,7 @@ const DateSinglePickerInput = React__default.forwardRef(
     }
   }
 ), segmentOptionVariants$1 = cva(
-  "relative flex flex-row items-center px-3 py-2 text-center font-medium transition-all duration-200 cursor-pointer border-0 bg-transparent outline-none focus:ring-2 focus:ring-offset-1",
+  "inline relative flex flex-row items-center px-3 py-2 text-center font-medium transition-all duration-200 cursor-pointer border-0 bg-transparent outline-none focus:ring-2 focus:ring-offset-1 flex-1",
   {
     variants: {
       variant: {
@@ -1056,21 +835,11 @@ const DateSinglePickerInput = React__default.forwardRef(
         tertiary: "text-ghost hover:text-tertiary focus:ring-tertiary/30",
         ghost: "text-ghost hover:text-ghost focus:ring-ghost/30",
         neutral: "text-ghost hover:text-gray-700 focus:ring-gray-400/30",
-        // Outline variants
-        "primary-outline": "text-primary hover:bg-primary/10 focus:ring-primary/30",
-        "secondary-outline": "text-secondary hover:bg-secondary/10 focus:ring-secondary/30",
-        "tertiary-outline": "text-tertiary hover:bg-tertiary/10 focus:ring-tertiary/30",
-        "ghost-outline": "text-ghost hover:bg-ghost/10 focus:ring-ghost/30",
-        "neutral-outline": "text-gray-600 hover:bg-gray-100 focus:ring-gray-500/30",
         // Semantic variants
         success: "text-ghost hover:text-success focus:ring-success/30",
-        "success-outline": "text-success hover:bg-success/10 focus:ring-success/30",
         info: "text-ghost hover:text-info focus:ring-info/30",
-        "info-outline": "text-info hover:bg-info/10 focus:ring-info/30",
         warning: "text-ghost hover:text-warning focus:ring-warning/30",
-        "warning-outline": "text-warning hover:bg-warning/10 focus:ring-warning/30",
-        danger: "text-ghost hover:text-danger focus:ring-danger/30",
-        "danger-outline": "text-danger hover:bg-danger/10 focus:ring-danger/30"
+        danger: "text-ghost hover:text-danger focus:ring-danger/30"
       },
       size: {
         sm: "px-2 py-1.5 text-xs",
@@ -1078,10 +847,10 @@ const DateSinglePickerInput = React__default.forwardRef(
         lg: "px-4 py-2.5 text-base"
       },
       rounded: {
-        first: "rounded-l-md",
+        first: "rounded-l-full",
         middle: "",
-        last: "rounded-r-md",
-        single: "rounded-md"
+        last: "rounded-r-full",
+        single: "rounded-full"
       }
     },
     defaultVariants: {
@@ -1093,26 +862,16 @@ const DateSinglePickerInput = React__default.forwardRef(
 ), getSegmentSelectedClasses$1 = (e) => {
   const t = {
     // Core variants - override hover text color changes
-    primary: "bg-primary text-white shadow-sm hover:text-white",
-    secondary: "bg-secondary text-white shadow-sm hover:text-white",
-    tertiary: "bg-tertiary text-white shadow-sm hover:text-white",
-    ghost: "bg-ghost text-white shadow-sm hover:text-white",
-    neutral: "bg-gray-500 text-white shadow-sm hover:text-white",
-    // Outline variants - override hover text color changes
-    "primary-outline": "bg-primary text-white shadow-sm hover:text-white",
-    "secondary-outline": "bg-secondary text-white shadow-sm hover:text-white",
-    "tertiary-outline": "bg-tertiary text-white shadow-sm hover:text-white",
-    "ghost-outline": "bg-ghost text-white shadow-sm hover:text-white",
-    "neutral-outline": "bg-gray-500 text-white shadow-sm hover:text-white",
+    primary: "bg-primary text-white hover:text-white",
+    secondary: "bg-secondary text-white hover:text-white",
+    tertiary: "bg-tertiary text-white hover:text-white",
+    ghost: "bg-ghost text-white hover:text-white",
+    neutral: "bg-gray-500 text-white hover:text-white",
     // Semantic variants - override hover text color changes
-    success: "bg-success text-white shadow-sm hover:text-white",
-    "success-outline": "bg-success text-white shadow-sm hover:text-white",
-    info: "bg-info text-white shadow-sm hover:text-white",
-    "info-outline": "bg-info text-white shadow-sm hover:text-white",
-    warning: "bg-warning text-white shadow-sm hover:text-white",
-    "warning-outline": "bg-warning text-white shadow-sm hover:text-white",
-    danger: "bg-danger text-white shadow-sm hover:text-white",
-    "danger-outline": "bg-danger text-white shadow-sm hover:text-white"
+    success: "bg-success text-white hover:text-white",
+    info: "bg-info text-white hover:text-white",
+    warning: "bg-warning text-white hover:text-white",
+    danger: "bg-danger text-white hover:text-white"
   };
   return t[e || "primary"] || t.primary;
 }, SegmentSingleInputContext = createContext(null), useSegmentSingleInputContext = () => {
@@ -1123,26 +882,26 @@ const DateSinglePickerInput = React__default.forwardRef(
     );
   return e;
 }, SegmentOption$1 = React__default.forwardRef(
-  ({ children: e, className: t, disabled: n, id: o, value: s, position: c = "middle", ...u }, a) => {
-    const r = useSegmentSingleInputContext(), i = React__default.useId(), x = o || i, l = n || r.disabled, g = r.error ? "danger" : r.variant || "primary", d = r.value === s, m = (f) => {
-      if (!l) {
-        const h = r.value === s ? null : s;
-        r.onChange?.(h);
+  ({ children: e, className: t, disabled: i, id: s, value: n, position: l = "middle", ...u }, o) => {
+    const r = useSegmentSingleInputContext(), d = React__default.useId(), x = s || d, c = i || r.disabled, a = r.error ? "danger" : r.variant || "primary", g = r.value === n, h = (b) => {
+      if (!c) {
+        const f = r.value === n ? null : n;
+        r.onChange?.(f);
       }
-      u.onChange?.(f);
+      u.onChange?.(b);
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "input",
         {
-          ref: a,
+          ref: o,
           type: "radio",
           id: x,
           name: r.name,
-          value: s,
-          checked: d,
-          disabled: l,
-          onChange: m,
+          value: n,
+          checked: g,
+          disabled: c,
+          onChange: h,
           className: "sr-only",
           ...u
         }
@@ -1152,17 +911,14 @@ const DateSinglePickerInput = React__default.forwardRef(
         {
           htmlFor: x,
           className: cn(
+            "flex flex-row items-center justify-center",
             segmentOptionVariants$1({
-              variant: g,
+              variant: a,
               size: r.size,
-              rounded: c
+              rounded: l
             }),
-            // Apply selected state styling
-            d && getSegmentSelectedClasses$1(g),
-            d && "relative z-10",
-            // Apply disabled styling directly since labels don't support disabled attribute
-            l && "opacity-50 cursor-not-allowed pointer-events-none",
-            r.fullWidth && "flex-1 min-w-0",
+            g && getSegmentSelectedClasses$1(a),
+            c && "opacity-50 cursor-not-allowed pointer-events-none",
             t
           ),
           children: e
@@ -1176,93 +932,71 @@ const SegmentSingleInputRoot = React__default.forwardRef(
   ({
     variant: e = "primary",
     size: t = "md",
-    label: n,
-    helperText: o,
-    error: s,
-    className: c,
-    disabled: u,
-    name: a,
-    value: r,
-    onChange: i,
-    children: x,
-    fullWidth: l = !1,
-    ...g
-  }, d) => {
-    const m = !!s, f = {
+    label: i,
+    helperText: s,
+    error: n,
+    disabled: l,
+    name: u,
+    value: o,
+    onChange: r,
+    children: d,
+    ...x
+  }, c) => {
+    const a = !!n, g = {
       variant: e,
       size: t,
-      disabled: u,
-      error: m,
-      name: a,
-      value: r,
-      onChange: i,
-      fullWidth: l
-    }, h = React__default.Children.toArray(x), w = h.map((y, j) => {
-      if (React__default.isValidElement(y)) {
-        let b;
-        return h.length === 1 ? b = "single" : j === 0 ? b = "first" : j === h.length - 1 ? b = "last" : b = "middle", React__default.cloneElement(
-          y,
-          { position: b }
+      disabled: l,
+      error: a,
+      name: u,
+      value: o,
+      onChange: r
+    }, h = React__default.Children.toArray(d), b = h.map((f, y) => {
+      if (React__default.isValidElement(f)) {
+        let m;
+        return h.length === 1 ? m = "single" : y === 0 ? m = "first" : y === h.length - 1 ? m = "last" : m = "middle", React__default.cloneElement(
+          f,
+          { position: m }
         );
       }
-      return y;
+      return f;
     });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentSingleInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        ref: d,
-        className: cn(l ? "w-full" : "", c),
-        ...g,
-        children: [
-          n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: cn(
-                segmentGroupVariants$1({
-                  variant: m ? "danger" : e,
-                  size: t,
-                  error: m
-                }),
-                l ? "flex w-full" : ""
-              ),
-              children: w
-            }
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentSingleInputContext.Provider, { value: g, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: c, ...x, children: [
+      i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: i }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          className: cn(
+            segmentGroupVariants$1({
+              variant: a ? "danger" : e,
+              size: t,
+              error: a
+            })
           ),
-          m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
-          !m && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
-        ]
-      }
-    ) });
+          children: b
+        }
+      ),
+      a && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: n }),
+      !a && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
+    ] }) });
   }
 ), SegmentSingleInput = Object.assign(SegmentSingleInputRoot, {
   Option: SegmentOption$1
 }), segmentGroupVariants = cva(
-  "inline-flex rounded-lg border overflow-hidden bg-neutral/50 p-1",
+  "flex flex-row rounded-full border overflow-hidden p-1 gap-0.25",
   {
     variants: {
       variant: {
         // Core variants using Versaur color system
-        primary: "border-primary/20",
-        secondary: "border-secondary/20",
-        tertiary: "border-tertiary/20",
-        ghost: "border-ghost/20",
+        primary: "border-primary-light",
+        secondary: "border-secondary-light",
+        tertiary: "border-tertiary-light",
+        ghost: "border-ghost-light",
         neutral: "border-gray-200",
-        // Outline variants
-        "primary-outline": "border-primary",
-        "secondary-outline": "border-secondary",
-        "tertiary-outline": "border-tertiary",
-        "ghost-outline": "border-ghost",
-        "neutral-outline": "border-gray-400",
         // Semantic variants
-        success: "border-success/20",
-        "success-outline": "border-success",
-        info: "border-info/20",
-        "info-outline": "border-info",
-        warning: "border-warning/20",
-        "warning-outline": "border-warning",
-        danger: "border-danger/20",
-        "danger-outline": "border-danger"
+        success: "border-success-light",
+        info: "border-info-light",
+        warning: "border-warning-light",
+        danger: "border-danger-light"
       },
       size: {
         sm: "text-xs",
@@ -1281,7 +1015,7 @@ const SegmentSingleInputRoot = React__default.forwardRef(
     }
   }
 ), segmentOptionVariants = cva(
-  "relative flex flex-row items-center px-3 py-2 text-center font-medium transition-all duration-200 cursor-pointer border-0 bg-transparent outline-none focus:ring-2 focus:ring-offset-1 flex-1",
+  "inline relative flex flex-row items-center px-3 py-2 text-center font-medium transition-all duration-200 cursor-pointer border-0 bg-transparent outline-none focus:ring-2 focus:ring-offset-1 flex-1",
   {
     variants: {
       variant: {
@@ -1291,21 +1025,11 @@ const SegmentSingleInputRoot = React__default.forwardRef(
         tertiary: "text-ghost hover:text-tertiary focus:ring-tertiary/30",
         ghost: "text-ghost hover:text-ghost focus:ring-ghost/30",
         neutral: "text-ghost hover:text-gray-700 focus:ring-gray-400/30",
-        // Outline variants
-        "primary-outline": "text-primary hover:bg-primary/10 focus:ring-primary/30",
-        "secondary-outline": "text-secondary hover:bg-secondary/10 focus:ring-secondary/30",
-        "tertiary-outline": "text-tertiary hover:bg-tertiary/10 focus:ring-tertiary/30",
-        "ghost-outline": "text-ghost hover:bg-ghost/10 focus:ring-ghost/30",
-        "neutral-outline": "text-gray-600 hover:bg-gray-100 focus:ring-gray-500/30",
         // Semantic variants
         success: "text-ghost hover:text-success focus:ring-success/30",
-        "success-outline": "text-success hover:bg-success/10 focus:ring-success/30",
         info: "text-ghost hover:text-info focus:ring-info/30",
-        "info-outline": "text-info hover:bg-info/10 focus:ring-info/30",
         warning: "text-ghost hover:text-warning focus:ring-warning/30",
-        "warning-outline": "text-warning hover:bg-warning/10 focus:ring-warning/30",
-        danger: "text-ghost hover:text-danger focus:ring-danger/30",
-        "danger-outline": "text-danger hover:bg-danger/10 focus:ring-danger/30"
+        danger: "text-ghost hover:text-danger focus:ring-danger/30"
       },
       size: {
         sm: "px-2 py-1.5 text-xs",
@@ -1313,10 +1037,10 @@ const SegmentSingleInputRoot = React__default.forwardRef(
         lg: "px-4 py-2.5 text-base"
       },
       rounded: {
-        first: "rounded-l-md",
+        first: "rounded-l-full",
         middle: "",
-        last: "rounded-r-md",
-        single: "rounded-md"
+        last: "rounded-r-full",
+        single: "rounded-full"
       }
     },
     defaultVariants: {
@@ -1328,26 +1052,16 @@ const SegmentSingleInputRoot = React__default.forwardRef(
 ), getSegmentSelectedClasses = (e) => {
   const t = {
     // Core variants - override hover text color changes
-    primary: "bg-primary text-white shadow-sm hover:text-white",
-    secondary: "bg-secondary text-white shadow-sm hover:text-white",
-    tertiary: "bg-tertiary text-white shadow-sm hover:text-white",
-    ghost: "bg-ghost text-white shadow-sm hover:text-white",
-    neutral: "bg-gray-500 text-white shadow-sm hover:text-white",
-    // Outline variants - override hover text color changes
-    "primary-outline": "bg-primary text-white shadow-sm hover:text-white",
-    "secondary-outline": "bg-secondary text-white shadow-sm hover:text-white",
-    "tertiary-outline": "bg-tertiary text-white shadow-sm hover:text-white",
-    "ghost-outline": "bg-ghost text-white shadow-sm hover:text-white",
-    "neutral-outline": "bg-gray-500 text-white shadow-sm hover:text-white",
+    primary: "bg-primary text-white hover:text-white",
+    secondary: "bg-secondary text-white hover:text-white",
+    tertiary: "bg-tertiary text-white hover:text-white",
+    ghost: "bg-ghost text-white hover:text-white",
+    neutral: "bg-gray-500 text-white hover:text-white",
     // Semantic variants - override hover text color changes
-    success: "bg-success text-white shadow-sm hover:text-white",
-    "success-outline": "bg-success text-white shadow-sm hover:text-white",
-    info: "bg-info text-white shadow-sm hover:text-white",
-    "info-outline": "bg-info text-white shadow-sm hover:text-white",
-    warning: "bg-warning text-white shadow-sm hover:text-white",
-    "warning-outline": "bg-warning text-white shadow-sm hover:text-white",
-    danger: "bg-danger text-white shadow-sm hover:text-white",
-    "danger-outline": "bg-danger text-white shadow-sm hover:text-white"
+    success: "bg-success text-white hover:text-white",
+    info: "bg-info text-white hover:text-white",
+    warning: "bg-warning text-white hover:text-white",
+    danger: "bg-danger text-white hover:text-white"
   };
   return t[e || "primary"] || t.primary;
 }, SegmentMultipleInputContext = createContext(null), useSegmentMultipleInputContext = () => {
@@ -1358,27 +1072,27 @@ const SegmentSingleInputRoot = React__default.forwardRef(
     );
   return e;
 }, SegmentOption = React__default.forwardRef(
-  ({ children: e, className: t, disabled: n, id: o, value: s, position: c = "middle", ...u }, a) => {
-    const r = useSegmentMultipleInputContext(), i = React__default.useId(), x = o || i, l = n || r.disabled, g = r.error ? "danger" : r.variant || "primary", d = r.value?.includes(s) ?? !1, m = (f) => {
-      if (!l) {
-        const h = r.value || [];
-        let w;
-        d ? w = h.filter((y) => y !== s) : w = [...h, s], r.onChange?.(w);
+  ({ children: e, className: t, disabled: i, id: s, value: n, position: l = "middle", ...u }, o) => {
+    const r = useSegmentMultipleInputContext(), d = React__default.useId(), x = s || d, c = i || r.disabled, a = r.error ? "danger" : r.variant || "primary", g = r.value?.includes(n) ?? !1, h = (b) => {
+      if (!c) {
+        const f = r.value || [];
+        let y;
+        g ? y = f.filter((m) => m !== n) : y = [...f, n], r.onChange?.(y);
       }
-      u.onChange?.(f);
+      u.onChange?.(b);
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "input",
         {
-          ref: a,
+          ref: o,
           type: "checkbox",
           id: x,
           name: `${r.name}[]`,
-          value: s,
-          checked: d,
-          disabled: l,
-          onChange: m,
+          value: n,
+          checked: g,
+          disabled: c,
+          onChange: h,
           className: "sr-only",
           ...u
         }
@@ -1388,16 +1102,14 @@ const SegmentSingleInputRoot = React__default.forwardRef(
         {
           htmlFor: x,
           className: cn(
+            "flex flex-row items-center justify-center",
             segmentOptionVariants({
-              variant: g,
+              variant: a,
               size: r.size,
-              rounded: c
+              rounded: l
             }),
-            // Apply selected state styling
-            d && getSegmentSelectedClasses(g),
-            d && "relative z-10",
-            // Apply disabled styling directly since labels don't support disabled attribute
-            l && "opacity-50 cursor-not-allowed pointer-events-none",
+            g && getSegmentSelectedClasses(a),
+            c && "opacity-50 cursor-not-allowed pointer-events-none",
             t
           ),
           children: e
@@ -1411,70 +1123,83 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
   ({
     variant: e = "primary",
     size: t = "md",
-    label: n,
-    helperText: o,
-    error: s,
-    className: c,
-    disabled: u,
-    name: a,
-    value: r = [],
-    onChange: i,
-    children: x,
-    fullWidth: l = !1,
-    ...g
-  }, d) => {
-    const m = !!s, f = {
+    label: i,
+    helperText: s,
+    error: n,
+    disabled: l,
+    name: u,
+    value: o = [],
+    onChange: r,
+    children: d,
+    ...x
+  }, c) => {
+    const a = !!n, g = {
       variant: e,
       size: t,
-      disabled: u,
-      error: m,
-      name: a,
-      value: r,
-      onChange: i
-    }, h = React__default.Children.toArray(x), w = h.map((y, j) => {
-      if (React__default.isValidElement(y)) {
-        let b;
-        return h.length === 1 ? b = "single" : j === 0 ? b = "first" : j === h.length - 1 ? b = "last" : b = "middle", React__default.cloneElement(
-          y,
-          { position: b }
+      disabled: l,
+      error: a,
+      name: u,
+      value: o,
+      onChange: r
+    }, h = React__default.Children.toArray(d), b = h.map((f, y) => {
+      if (React__default.isValidElement(f)) {
+        let m;
+        return h.length === 1 ? m = "single" : y === 0 ? m = "first" : y === h.length - 1 ? m = "last" : m = "middle", React__default.cloneElement(
+          f,
+          { position: m }
         );
       }
-      return y;
+      return f;
     });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentMultipleInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
-      "div",
-      {
-        ref: d,
-        className: cn(
-          l ? "flex w-full flex-col" : "w-full",
-          c
-        ),
-        ...g,
-        children: [
-          n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
-          /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: cn(
-                segmentGroupVariants({
-                  variant: m ? "danger" : e,
-                  size: t,
-                  error: m
-                }),
-                l && "flex w-full"
-              ),
-              children: w
-            }
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentMultipleInputContext.Provider, { value: g, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: c, ...x, children: [
+      i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: i }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          className: cn(
+            segmentGroupVariants({
+              variant: a ? "danger" : e,
+              size: t,
+              error: a
+            })
           ),
-          m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
-          !m && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
-        ]
-      }
-    ) });
+          children: b
+        }
+      ),
+      a && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: n }),
+      !a && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
+    ] }) });
   }
 ), SegmentMultipleInput = Object.assign(SegmentMultipleInputRoot, {
   Option: SegmentOption
-}), selectInputVariants = cva(
+}), SearchInput = forwardRef(
+  ({
+    autoComplete: e = "off",
+    spellCheck: t = !1,
+    inputMode: i = "search",
+    placeholder: s = "Search...",
+    maxLength: n = 256,
+    enterKeyHint: l = "search",
+    "aria-label": u = "Search",
+    // internal default, not in props
+    ...o
+  }, r) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+    TextInput,
+    {
+      ref: r,
+      type: "search",
+      inputMode: i,
+      autoComplete: e,
+      spellCheck: t,
+      placeholder: s,
+      maxLength: n,
+      enterKeyHint: l,
+      "aria-label": u,
+      leftContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: SearchIcon, color: "inherit", size: "sm" }),
+      ...o
+    }
+  )
+), selectInputVariants = cva(
   "block w-full rounded-md border bg-white transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none disabled:bg-gray-50 appearance-none bg-no-repeat bg-right pr-10",
   {
     variants: {
@@ -1510,43 +1235,43 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
   ({
     variant: e = "primary",
     label: t,
-    helperText: n,
-    error: o,
-    className: s,
-    disabled: c,
+    helperText: i,
+    error: s,
+    className: n,
+    disabled: l,
     id: u,
-    placeholder: a,
+    placeholder: o,
     children: r,
-    ...i
+    ...d
   }, x) => {
-    const l = React__default.useId(), g = u || l, d = !!o;
+    const c = React__default.useId(), a = u || c, g = !!s;
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         "label",
         {
-          htmlFor: g,
+          htmlFor: a,
           className: "block text-sm font-medium text-foreground mb-2",
           children: t
         }
       ),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full", s), children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full", n), children: [
         /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "select",
           {
             ref: x,
-            id: g,
-            "aria-invalid": d,
-            "aria-disabled": c,
-            disabled: c,
+            id: a,
+            "aria-invalid": g,
+            "aria-disabled": l,
+            disabled: l,
             className: cn(
               selectInputVariants({
-                variant: d ? "danger" : e
+                variant: g ? "danger" : e
               }),
               "h-10 pl-3"
             ),
-            ...i,
+            ...d,
             children: [
-              a && /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: "", disabled: !0, hidden: !0, children: a }),
+              o && /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: "", disabled: !0, hidden: !0, children: o }),
               r
             ]
           }
@@ -1570,8 +1295,8 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
           }
         ) })
       ] }),
-      d && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: o }),
-      !d && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: n })
+      g && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: s }),
+      !g && i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: i })
     ] });
   }
 );
@@ -1617,22 +1342,22 @@ const textAreaInputVariants = cva(
   ({
     variant: e = "primary",
     label: t,
-    helperText: n,
-    error: o,
-    className: s,
-    disabled: c,
+    helperText: i,
+    error: s,
+    className: n,
+    disabled: l,
     id: u,
-    minRows: a = 3,
+    minRows: o = 3,
     maxRows: r,
-    fieldSizing: i = "fixed",
+    fieldSizing: d = "fixed",
     style: x,
-    rows: l,
-    ...g
-  }, d) => {
-    const m = React__default.useId(), f = u || m, h = !!o, w = l || a, y = i === "content" ? void 0 : r, j = {
-      ...i === "content" && { fieldSizing: "content" },
-      ...y && {
-        maxHeight: `${y * 1.5}rem`
+    rows: c,
+    ...a
+  }, g) => {
+    const h = React__default.useId(), b = u || h, f = !!s, y = c || o, m = d === "content" ? void 0 : r, w = {
+      ...d === "content" && { fieldSizing: "content" },
+      ...m && {
+        maxHeight: `${m * 1.5}rem`
         // Approximate line height
       },
       ...x
@@ -1641,33 +1366,33 @@ const textAreaInputVariants = cva(
       t && /* @__PURE__ */ jsxRuntimeExports.jsx(
         "label",
         {
-          htmlFor: f,
+          htmlFor: b,
           className: "block text-sm font-medium text-foreground mb-2",
           children: t
         }
       ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("relative w-full", s), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("relative w-full", n), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
         "textarea",
         {
-          ref: d,
-          id: f,
-          rows: w,
-          "aria-invalid": h,
-          "aria-disabled": c,
-          disabled: c,
-          style: j,
+          ref: g,
+          id: b,
+          rows: y,
+          "aria-invalid": f,
+          "aria-disabled": l,
+          disabled: l,
+          style: w,
           className: cn(
             textAreaInputVariants({
-              variant: h ? "danger" : e,
-              fieldSizing: i
+              variant: f ? "danger" : e,
+              fieldSizing: d
             }),
             "px-3 py-2"
           ),
-          ...g
+          ...a
         }
       ) }),
-      h && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: o }),
-      !h && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: n })
+      f && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: s }),
+      !f && i && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: i })
     ] });
   }
 );
@@ -1694,9 +1419,9 @@ const timeSegmentButtonVariants = cva(
 ), TimeField = ({
   value: e,
   onChange: t,
-  label: n,
-  "aria-label": o,
-  disabled: s
+  label: i,
+  "aria-label": s,
+  disabled: n
 }) => /* @__PURE__ */ jsxRuntimeExports.jsx(
   "input",
   {
@@ -1705,131 +1430,131 @@ const timeSegmentButtonVariants = cva(
     pattern: "[0-9]*",
     maxLength: 2,
     value: e,
-    onChange: (c) => t(c.target.value),
+    onChange: (l) => t(l.target.value),
     className: "w-12 h-12 text-center text-2xl border-b-2 border-primary bg-transparent focus:outline-none focus:border-primary",
-    "aria-label": o || n,
-    disabled: s,
+    "aria-label": s || i,
+    disabled: n,
     autoComplete: "off"
   }
 ), AmPmSegment = ({
   value: e,
   onChange: t,
-  disabled: n
-}) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1 ml-4", children: ["AM", "PM"].map((o) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+  disabled: i
+}) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1 ml-4", children: ["AM", "PM"].map((s) => /* @__PURE__ */ jsxRuntimeExports.jsx(
   "button",
   {
     type: "button",
     className: cn(
       timeSegmentButtonVariants({
-        active: e === o,
+        active: e === s,
         size: "sm"
       })
     ),
-    "aria-pressed": e === o,
-    onClick: () => t(o),
-    disabled: n,
-    children: o
+    "aria-pressed": e === s,
+    onClick: () => t(s),
+    disabled: i,
+    children: s
   },
-  o
+  s
 )) }), TimePickerInput = ({
   value: e,
   onChange: t,
-  label: n,
-  helperText: o,
-  disabled: s,
-  error: c,
-  placement: u,
-  "aria-label": a,
+  label: i,
+  helperText: s,
+  disabled: n,
+  error: l,
+  placement: u = "top",
+  "aria-label": o,
   "aria-labelledby": r,
-  "aria-describedby": i
+  "aria-describedby": d
 }) => {
-  const [x, l] = useState(!1), g = (k) => {
-    const p = k.match(/^(\d{1,2}):(\d{2})\s?(AM|PM)$/i);
+  const [x, c] = useState(!1), a = (j) => {
+    const p = j.match(/^(\d{1,2}):(\d{2})\s?(AM|PM)$/i);
     return p ? {
       hour: p[1],
       minute: p[2],
       period: p[3].toUpperCase()
     } : { hour: "", minute: "", period: "AM" };
-  }, [{ hour: d, minute: m, period: f }, h] = useState(() => g(e)), w = () => {
-    s || (h(g(e)), l(!0));
-  }, y = (k) => {
-    let p = k.replace(/[^\d]/g, "");
-    p.length > 2 && (p = p.slice(0, 2)), Number(p) > 12 && (p = "12"), h((E) => ({ ...E, hour: p }));
-  }, j = (k) => {
-    let p = k.replace(/[^\d]/g, "");
-    p.length > 2 && (p = p.slice(0, 2)), Number(p) > 59 && (p = "59"), h((E) => ({ ...E, minute: p }));
-  }, b = (k) => {
-    h((p) => ({ ...p, period: k }));
+  }, [{ hour: g, minute: h, period: b }, f] = useState(() => a(e)), y = () => {
+    n || (f(a(e)), c(!0));
+  }, m = (j) => {
+    let p = j.replace(/[^\d]/g, "");
+    p.length > 2 && (p = p.slice(0, 2)), Number(p) > 12 && (p = "12"), f((E) => ({ ...E, hour: p }));
+  }, w = (j) => {
+    let p = j.replace(/[^\d]/g, "");
+    p.length > 2 && (p = p.slice(0, 2)), Number(p) > 59 && (p = "59"), f((E) => ({ ...E, minute: p }));
+  }, R = (j) => {
+    f((p) => ({ ...p, period: j }));
   }, C = () => {
-    h(g(e)), l(!1);
-  }, I = () => {
-    const k = d.padStart(2, "0") || "12", p = m.padStart(2, "0") || "00";
-    t(`${k}:${p} ${f}`), l(!1);
+    f(a(e)), c(!1);
+  }, k = () => {
+    const j = g.padStart(2, "0") || "12", p = h.padStart(2, "0") || "00";
+    t(`${j}:${p} ${b}`), c(!1);
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       TextInput,
       {
-        label: n,
+        label: i,
         value: e,
-        onClick: w,
+        onClick: y,
         readOnly: !0,
-        disabled: s,
-        error: c,
-        helperText: o,
-        "aria-label": a,
+        disabled: n,
+        error: l,
+        helperText: s,
+        "aria-label": o,
         "aria-labelledby": r,
-        "aria-describedby": i,
+        "aria-describedby": d,
         className: "cursor-pointer bg-white",
-        rightContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: Clock, size: "sm", color: "ghost" })
+        leftContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: Clock, size: "sm", color: "inherit" })
       }
     ),
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       Modal,
       {
         isOpen: x,
-        onOpenChange: l,
+        onOpenChange: c,
         placement: u,
-        size: "sm",
-        "aria-label": a,
+        size: "fit-content",
+        "aria-label": o,
         "aria-labelledby": r,
-        "aria-describedby": i,
+        "aria-describedby": d,
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Header, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "span", fontSize: "lg", fontWeight: "semibold", children: "Select time" }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Body, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 justify-center py-2", children: [
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               TimeField,
               {
-                value: d,
-                onChange: y,
+                value: g,
+                onChange: m,
                 label: "Hour",
                 "aria-label": "Hour",
-                disabled: s
+                disabled: n
               }
             ),
             /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "span", fontSize: "2xl", className: "select-none", children: ":" }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               TimeField,
               {
-                value: m,
-                onChange: j,
+                value: h,
+                onChange: w,
                 label: "Minute",
                 "aria-label": "Minute",
-                disabled: s
+                disabled: n
               }
             ),
             /* @__PURE__ */ jsxRuntimeExports.jsx(
               AmPmSegment,
               {
-                value: f === "AM" ? "AM" : "PM",
-                onChange: b,
-                disabled: s
+                value: b === "AM" ? "AM" : "PM",
+                onChange: R,
+                disabled: n
               }
             )
           ] }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal.Footer, { children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "md", onClick: C, children: "Cancel" }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "primary", size: "md", onClick: I, children: "Confirm" })
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "sm", onClick: C, children: "Cancel" }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "primary-ghost", size: "sm", onClick: k, children: "Confirm" })
           ] })
         ]
       }
@@ -1913,27 +1638,27 @@ const timeSegmentButtonVariants = cva(
 ), SwitchTrack = ({
   color: e = "primary",
   size: t = "md",
-  disabled: n = !1,
-  className: o,
-  checked: s
+  disabled: i = !1,
+  className: s,
+  checked: n
 }) => /* @__PURE__ */ jsxRuntimeExports.jsx(
   "span",
   {
     className: cn(
-      switchVariants({ color: e, size: t, disabled: n, checked: s }),
+      switchVariants({ color: e, size: t, disabled: i, checked: n }),
       "rounded-full pointer-events-none",
-      o
+      s
     ),
     "aria-hidden": "true"
   }
-), SwitchThumb = ({ size: e = "md", checked: t = !1 }) => /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(thumbVariants({ size: e, checked: t })), "aria-hidden": "true" }), SwitchLabel = ({ label: e, htmlFor: t, placement: n = "top", disabled: o = !1 }) => e ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+), SwitchThumb = ({ size: e = "md", checked: t = !1 }) => /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(thumbVariants({ size: e, checked: t })), "aria-hidden": "true" }), SwitchLabel = ({ label: e, htmlFor: t, placement: i = "top", disabled: s = !1 }) => e ? /* @__PURE__ */ jsxRuntimeExports.jsx(
   "label",
   {
     htmlFor: t,
     className: cn(
       "text-sm select-none font-medium text-foreground",
-      n === "inline" ? "ml-2 mb-0" : "mb-1",
-      o && "opacity-50 cursor-not-allowed"
+      i === "inline" ? "ml-2 mb-0" : "mb-1",
+      s && "opacity-50 cursor-not-allowed"
     ),
     children: e
   }
@@ -1941,21 +1666,21 @@ const timeSegmentButtonVariants = cva(
   ({
     checked: e,
     defaultChecked: t,
-    onCheckedChange: n,
-    color: o = "primary",
-    size: s = "md",
-    label: c,
+    onCheckedChange: i,
+    color: s = "primary",
+    size: n = "md",
+    label: l,
     labelPlacement: u = "top",
-    disabled: a = !1,
+    disabled: o = !1,
     className: r,
-    id: i,
+    id: d,
     ariaLabel: x,
-    ...l
-  }, g) => {
-    const [d, m] = useState(
+    ...c
+  }, a) => {
+    const [g, h] = useState(
       t ?? !1
-    ), f = useId(), h = i || f, w = typeof e == "boolean", y = w ? e : d, j = (b) => {
-      w || m(b.target.checked), n?.(b.target.checked);
+    ), b = useId(), f = d || b, y = typeof e == "boolean", m = y ? e : g, w = (R) => {
+      y || h(R.target.checked), i?.(R.target.checked);
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
@@ -1969,10 +1694,10 @@ const timeSegmentButtonVariants = cva(
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             SwitchLabel,
             {
-              label: c,
-              htmlFor: h,
+              label: l,
+              htmlFor: f,
               placement: u,
-              disabled: a
+              disabled: o
             }
           ),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -1986,27 +1711,27 @@ const timeSegmentButtonVariants = cva(
                 /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "input",
                   {
-                    ref: g,
+                    ref: a,
                     type: "checkbox",
-                    id: h,
-                    "aria-label": x || c,
-                    checked: y,
-                    disabled: a,
-                    onChange: j,
+                    id: f,
+                    "aria-label": x || l,
+                    checked: m,
+                    disabled: o,
+                    onChange: w,
                     className: "absolute inset-0 w-full h-full opacity-0 cursor-pointer z-10",
-                    ...l
+                    ...c
                   }
                 ),
                 /* @__PURE__ */ jsxRuntimeExports.jsx(
                   SwitchTrack,
                   {
-                    color: o,
-                    size: s,
-                    disabled: a,
-                    checked: y
+                    color: s,
+                    size: n,
+                    disabled: o,
+                    checked: m
                   }
                 ),
-                /* @__PURE__ */ jsxRuntimeExports.jsx(SwitchThumb, { size: s, checked: y })
+                /* @__PURE__ */ jsxRuntimeExports.jsx(SwitchThumb, { size: n, checked: m })
               ]
             }
           )
@@ -2016,20 +1741,80 @@ const timeSegmentButtonVariants = cva(
   }
 );
 SwitchInput.displayName = "SwitchInput";
+function usePriceInputSync(e, t) {
+  useEffect(() => {
+    typeof e == "number" && !isNaN(e) ? t(`${e}`) : e === "" || e === null || e === void 0 ? t("") : typeof e == "string" && t(e);
+  }, [e, t]);
+}
+const PriceInput = ({
+  value: e,
+  onChange: t,
+  allowNegative: i = !1,
+  inputProps: s,
+  label: n,
+  helperText: l,
+  error: u,
+  variant: o,
+  ...r
+}) => {
+  const d = useRef(null), [x, c] = useState(
+    e === "" ? "" : String(e)
+  );
+  usePriceInputSync(e, c);
+  const a = (g) => {
+    let h = g.target.value.replace(/[^\d.,-]/g, "");
+    i || (h = h.replace(/-/g, "")), c(h), t(h);
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    TextInput,
+    {
+      ref: d,
+      type: "text",
+      label: n,
+      value: x,
+      onChange: a,
+      error: u,
+      helperText: l,
+      placeholder: r.placeholder,
+      leftContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: Banknote, color: "inherit", size: "sm" }),
+      variant: o,
+      inputMode: "numeric",
+      autoComplete: "off",
+      pattern: i ? "^-?[\\d,.]*$" : "^[\\d,.]*$",
+      ...s,
+      ...r
+    }
+  );
+}, EmailInput = forwardRef(
+  (e, t) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+    TextInput,
+    {
+      ...e,
+      ref: t,
+      type: "email",
+      autoComplete: "email",
+      inputMode: "email",
+      leftContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: MailIcon, color: "inherit", size: "sm" })
+    }
+  )
+);
 export {
   CalculatorInput as C,
   DateSinglePickerInput as D,
+  EmailInput as E,
+  PriceInput as P,
   RadioInput as R,
   SegmentSingleInput as S,
   TextInput as T,
   CheckboxInput as a,
-  ChipInput as b,
+  ChipMultipleInput as b,
   SegmentMultipleInput as c,
-  SelectInput as d,
-  TextAreaInput as e,
-  TimePickerInput as f,
-  SwitchInput as g,
-  SwitchTrack as h,
-  SwitchThumb as i,
-  SwitchLabel as j
+  SearchInput as d,
+  SelectInput as e,
+  TextAreaInput as f,
+  TimePickerInput as g,
+  SwitchInput as h,
+  SwitchTrack as i,
+  SwitchThumb as j,
+  SwitchLabel as k
 };