@moontra/moonui 6.14.0 → 6.15.0

package/dist/index.mjs

@@ -195,18 +195,20 @@ var Alert = React12.forwardRef(
   }
 );
 Alert.displayName = "Alert";
-var AlertTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "h5",
-  {
-    ref,
-    className: cn(
-      "moonui-theme",
-      "font-semibold leading-tight tracking-tight mb-1",
-      className
-    ),
-    ...props
-  }
-));
+var AlertTitle = React12.forwardRef(
+  ({ className, as: Comp = "div", ...props }, ref) => /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      className: cn(
+        "moonui-theme",
+        "font-semibold leading-tight tracking-tight mb-1",
+        className
+      ),
+      ...props
+    }
+  )
+);
 AlertTitle.displayName = "AlertTitle";
 var AlertDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
@@ -1147,14 +1149,16 @@ var CardHeader = React12.forwardRef(({ className, ...props }, ref) => {
   );
 });
 CardHeader.displayName = "CardHeader";
-var CardTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "h3",
-  {
-    ref,
-    className: cn("moonui-theme", "text-lg font-semibold leading-none tracking-tight", className),
-    ...props
-  }
-));
+var CardTitle = React12.forwardRef(
+  ({ className, as: Comp = "h3", ...props }, ref) => /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      className: cn("moonui-theme", "text-lg font-semibold leading-none tracking-tight", className),
+      ...props
+    }
+  )
+);
 CardTitle.displayName = "CardTitle";
 var CardDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "p",
@@ -4244,20 +4248,23 @@ var DatePicker = React12.forwardRef(function DatePicker2({
   };
   const displayValue = internalDate && isValid(internalDate) ? format(internalDate, formatString) : null;
   const iconElement = icon || /* @__PURE__ */ jsx(Calendar$1, { className: "h-4 w-4" });
-  return /* @__PURE__ */ jsx("div", { ref, className: "moonui-theme", children: /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-      Button,
-      {
-        variant: variant === "ghost" ? "ghost" : "outline",
-        className: cn(
-          datePickerVariants({ variant, size, state }),
-          !displayValue && "text-muted-foreground",
-          className
-        ),
-        disabled: disabled || readOnly,
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx("div", { ref, className: "moonui-theme", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: variant === "ghost" ? "ghost" : "outline",
+          className: cn(
+            datePickerVariants({ variant, size, state }),
+            !displayValue && "text-muted-foreground",
+            // #345: temizle butonu artık MUTLAK konumlu bir kardeş — uzun tarih
+            // metninin altına girmemesi için sağda yer ayrılıyor.
+            allowClear && displayValue && !readOnly && !disabled && "pr-9",
+            className
+          ),
+          disabled: disabled || readOnly,
+          ...props,
+          children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: /* @__PURE__ */ jsxs(
             motion.div,
             {
               initial: { opacity: 0, y: -2 },
@@ -4272,87 +4279,74 @@ var DatePicker = React12.forwardRef(function DatePicker2({
               ]
             },
             displayValue || "placeholder"
-          ) }),
-          allowClear && displayValue && !readOnly && !disabled && /* @__PURE__ */ jsxs(
+          ) })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        PopoverContent,
+        {
+          className: "w-[360px] p-0 shadow-2xl rounded-2xl border border-border bg-background/95 backdrop-blur-sm !z-[9999]",
+          align: "start",
+          sideOffset: 12,
+          children: /* @__PURE__ */ jsxs(
             motion.div,
             {
-              initial: { opacity: 0, scale: 0.8 },
-              animate: { opacity: 1, scale: 1 },
-              exit: { opacity: 0, scale: 0.8 },
-              whileHover: { scale: 1.1 },
-              whileTap: { scale: 0.9 },
-              className: "ml-2 h-4 w-4 shrink-0 opacity-50 hover:opacity-100 transition-opacity cursor-pointer",
-              onClick: handleClear,
-              role: "button",
-              tabIndex: 0,
-              onKeyDown: (e) => {
-                if (e.key === "Enter" || e.key === " ") {
-                  e.preventDefault();
-                  handleClear(e);
-                }
-              },
+              ...pageTransitions2,
+              className: "rounded-2xl bg-background overflow-hidden",
               children: [
-                /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Clear date" }),
                 /* @__PURE__ */ jsx(
-                  "svg",
+                  Calendar,
                   {
-                    width: "15",
-                    height: "15",
-                    viewBox: "0 0 15 15",
-                    fill: "none",
-                    xmlns: "http://www.w3.org/2000/svg",
-                    children: /* @__PURE__ */ jsx(
-                      "path",
-                      {
-                        d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",
-                        fill: "currentColor",
-                        fillRule: "evenodd",
-                        clipRule: "evenodd"
-                      }
-                    )
+                    mode: "single",
+                    selected: internalDate,
+                    onSelect: handleSelect,
+                    disabled: isDateDisabled,
+                    showOutsideDays: false,
+                    className: cn("rounded-2xl", calendarProps?.className),
+                    ...calendarProps
                   }
-                )
+                ),
+                showTodayButton && /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-3", children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: handleToday,
+                    className: "w-full justify-center hover:bg-accent hover:text-accent-foreground transition-all duration-200",
+                    children: "Today"
+                  }
+                ) })
               ]
             }
           )
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsx(
-      PopoverContent,
+        }
+      )
+    ] }),
+    allowClear && displayValue && !readOnly && !disabled && /* @__PURE__ */ jsx(
+      "button",
       {
-        className: "w-[360px] p-0 shadow-2xl rounded-2xl border border-border bg-background/95 backdrop-blur-sm !z-[9999]",
-        align: "start",
-        sideOffset: 12,
-        children: /* @__PURE__ */ jsxs(
-          motion.div,
+        type: "button",
+        onClick: handleClear,
+        "aria-label": "Clear date",
+        className: "absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 shrink-0 opacity-50 hover:opacity-100 transition-opacity",
+        children: /* @__PURE__ */ jsx(
+          "svg",
           {
-            ...pageTransitions2,
-            className: "rounded-2xl bg-background overflow-hidden",
-            children: [
-              /* @__PURE__ */ jsx(
-                Calendar,
-                {
-                  mode: "single",
-                  selected: internalDate,
-                  onSelect: handleSelect,
-                  disabled: isDateDisabled,
-                  showOutsideDays: false,
-                  className: cn("rounded-2xl", calendarProps?.className),
-                  ...calendarProps
-                }
-              ),
-              showTodayButton && /* @__PURE__ */ jsx("div", { className: "border-t px-4 py-3", children: /* @__PURE__ */ jsx(
-                Button,
-                {
-                  variant: "ghost",
-                  size: "sm",
-                  onClick: handleToday,
-                  className: "w-full justify-center hover:bg-accent hover:text-accent-foreground transition-all duration-200",
-                  children: "Today"
-                }
-              ) })
-            ]
+            width: "15",
+            height: "15",
+            viewBox: "0 0 15 15",
+            fill: "none",
+            "aria-hidden": "true",
+            xmlns: "http://www.w3.org/2000/svg",
+            children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",
+                fill: "currentColor",
+                fillRule: "evenodd",
+                clipRule: "evenodd"
+              }
+            )
           }
         )
       }