@rehagro/ui 1.0.49 → 1.0.51

package/dist/index.mjs

@@ -1,5 +1,5 @@
 "use client";
-import React9, { forwardRef, createContext, useState, useRef, useCallback, useEffect, useMemo, useContext } from 'react';
+import React9, { forwardRef, createContext, useState, useRef, useMemo, useEffect, useCallback, useContext } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
 
@@ -1580,6 +1580,19 @@ var CheckIcon2 = ({ className }) => /* @__PURE__ */ jsx(
     )
   }
 );
+var RadioIcon = ({ isSelected }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: [
+      "rh-inline-flex rh-items-center rh-justify-center",
+      "rh-w-4 rh-h-4 rh-shrink-0",
+      "rh-border rh-rounded-full rh-transition-colors rh-duration-150",
+      isSelected ? "rh-border-primary" : "rh-border-border rh-bg-surface"
+    ].filter(Boolean).join(" "),
+    "aria-hidden": "true",
+    children: isSelected && /* @__PURE__ */ jsx("span", { className: "rh-w-2.5 rh-h-2.5 rh-rounded-full rh-bg-primary" })
+  }
+);
 var Select = forwardRef(function Select2(props, ref) {
   const {
     options,
@@ -1590,6 +1603,7 @@ var Select = forwardRef(function Select2(props, ref) {
     size = "md",
     radius = "xs",
     helperText,
+    radio = false,
     disabled = false,
     className = "",
     wrapperClassName = "",
@@ -1853,7 +1867,7 @@ var Select = forwardRef(function Select2(props, ref) {
                   ].filter(Boolean).join(" "),
                   children: [
                     /* @__PURE__ */ jsx("span", { className: "rh-flex-1 rh-truncate rh-text-text", children: option.label }),
-                    multiple ? /* @__PURE__ */ jsx(
+                    radio ? /* @__PURE__ */ jsx(RadioIcon, { isSelected }) : multiple ? /* @__PURE__ */ jsx(
                       "span",
                       {
                         className: [
@@ -2041,6 +2055,7 @@ var DateSelect = forwardRef(
     const helperId = React9.useId();
     const [isOpen, setIsOpen] = useState(false);
     const [isHelperDismissed, setIsHelperDismissed] = useState(false);
+    const [dropdownAlign, setDropdownAlign] = useState("left");
     const [internalValue, setInternalValue] = useState(
       props.defaultValue ?? { mode: "day" }
     );
@@ -2057,8 +2072,9 @@ var DateSelect = forwardRef(
     const [yearGridStart, setYearGridStart] = useState(
       Math.floor((/* @__PURE__ */ new Date()).getFullYear() / 12) * 12
     );
-    const wrapperRef = React9.useRef(null);
-    const innerRef = React9.useRef(null);
+    const wrapperRef = useRef(null);
+    const innerRef = useRef(null);
+    const dropdownRef = useRef(null);
     React9.useImperativeHandle(ref, () => innerRef.current);
     const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
     const yearStart = startYear ?? currentYear - 10;
@@ -2092,7 +2108,22 @@ var DateSelect = forwardRef(
       if (!isControlled) setInternalValue(newValue);
       props.onChange?.(newValue);
     };
-    const displayText = React9.useMemo(() => {
+    const handleMonthClear = () => {
+      const newValue = { mode: "month" };
+      if (!isControlled) setInternalValue(newValue);
+      props.onChange?.(newValue);
+    };
+    const handleDayClear = () => {
+      const newValue = { mode: "day" };
+      if (!isControlled) setInternalValue(newValue);
+      props.onChange?.(newValue);
+    };
+    const handleYearClear = () => {
+      const newValue = { mode: "year" };
+      if (!isControlled) setInternalValue(newValue);
+      props.onChange?.(newValue);
+    };
+    const displayText = useMemo(() => {
       if (value.mode === "year" && value.year) return value.year.toString();
       if (value.mode === "month" && value.year != null)
         return `${MONTHS_SHORT[value.month || 0]} ${value.year}`;
@@ -2103,7 +2134,7 @@ var DateSelect = forwardRef(
       }
       return null;
     }, [value]);
-    React9.useEffect(() => {
+    useEffect(() => {
       if (!isOpen) return;
       const handleClickOutside = (e) => {
         if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
@@ -2113,7 +2144,7 @@ var DateSelect = forwardRef(
       document.addEventListener("mousedown", handleClickOutside);
       return () => document.removeEventListener("mousedown", handleClickOutside);
     }, [isOpen]);
-    React9.useEffect(() => {
+    useEffect(() => {
       if (!isOpen) return;
       const handleEscape = (e) => {
         if (e.key === "Escape") {
@@ -2124,6 +2155,18 @@ var DateSelect = forwardRef(
       document.addEventListener("keydown", handleEscape);
       return () => document.removeEventListener("keydown", handleEscape);
     }, [isOpen]);
+    useEffect(() => {
+      if (!isOpen || !innerRef.current || !dropdownRef.current) return;
+      const triggerRect = innerRef.current.getBoundingClientRect();
+      const dropdownWidth = activeMode === "interval" ? 720 : 385;
+      const spaceLeft = triggerRect.left;
+      const spaceRight = window.innerWidth - triggerRect.right;
+      if (spaceLeft < dropdownWidth && spaceRight >= dropdownWidth) {
+        setDropdownAlign("right");
+      } else {
+        setDropdownAlign("left");
+      }
+    }, [isOpen, activeMode]);
     const getDaysInMonth2 = (year, month) => new Date(year, month + 1, 0).getDate();
     const getFirstDayOfMonth2 = (year, month) => new Date(year, month, 1).getDay();
     const isSameDay = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
@@ -2200,7 +2243,18 @@ var DateSelect = forwardRef(
           },
           year
         );
-      }) })
+      }) }),
+      /* @__PURE__ */ jsx("div", { className: "rh-flex rh-items-center rh-justify-between rh-pt-3 rh-mt-3 rh-border-t rh-border-border/30", children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: handleYearClear,
+          className: "rh-flex rh-items-center rh-gap-1.5 rh-text-sm rh-text-text rh-font-medium rh-px-2 rh-py-1.5 rh-rounded-sm hover:rh-bg-background rh-transition-colors rh-duration-150",
+          children: [
+            /* @__PURE__ */ jsx(EraserIcon, { className: "rh-w-4 rh-h-4" }),
+            "Limpar"
+          ]
+        }
+      ) })
     ] });
     const renderMonthGrid = () => /* @__PURE__ */ jsxs("div", { className: "rh-p-1", children: [
       /* @__PURE__ */ jsxs("div", { className: "rh-flex rh-items-center rh-justify-between", children: [
@@ -2248,7 +2302,18 @@ var DateSelect = forwardRef(
           },
           month
         );
-      }) })
+      }) }),
+      /* @__PURE__ */ jsx("div", { className: "rh-flex rh-items-center rh-justify-between rh-pt-3 rh-mt-3 rh-border-t rh-border-border/30", children: /* @__PURE__ */ jsxs(
+        "button",
+        {
+          onClick: handleMonthClear,
+          className: "rh-flex rh-items-center rh-gap-1.5 rh-text-sm rh-text-text rh-font-medium rh-px-2 rh-py-1.5 rh-rounded-sm hover:rh-bg-background rh-transition-colors rh-duration-150",
+          children: [
+            /* @__PURE__ */ jsx(EraserIcon, { className: "rh-w-4 rh-h-4" }),
+            "Limpar"
+          ]
+        }
+      ) })
     ] });
     const renderIntervalNav = () => /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsxs("div", { className: "rh-flex rh-gap-4 rh-p-1", children: [
@@ -2506,7 +2571,18 @@ var DateSelect = forwardRef(
               },
               i
             )) }),
-            renderDayGrid(selectedYear, selectedMonth)
+            renderDayGrid(selectedYear, selectedMonth),
+            /* @__PURE__ */ jsx("div", { className: "rh-flex rh-items-center rh-justify-between rh-pt-3 rh-mt-3 rh-border-t rh-border-border/30", children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                onClick: handleDayClear,
+                className: "rh-flex rh-items-center rh-gap-1.5 rh-text-sm rh-text-text rh-font-medium rh-px-2 rh-py-1.5 rh-rounded-sm hover:rh-bg-background rh-transition-colors rh-duration-150",
+                children: [
+                  /* @__PURE__ */ jsx(EraserIcon, { className: "rh-w-4 rh-h-4" }),
+                  "Limpar"
+                ]
+              }
+            ) })
           ] });
         case "month":
           return renderMonthGrid();
@@ -2626,11 +2702,13 @@ var DateSelect = forwardRef(
           isOpen && /* @__PURE__ */ jsxs(
             "div",
             {
+              ref: dropdownRef,
               className: [
                 "rh-absolute rh-z-50 rh-mt-1 rh-p-5",
                 "rh-bg-surface rh-rounded-md",
                 dropdownRadiusClasses2[radius],
-                activeMode === "interval" ? "rh-w-[720px]" : "rh-w-[385px]"
+                activeMode === "interval" ? "rh-w-[720px]" : "rh-w-[385px]",
+                dropdownAlign === "left" ? "rh-right-0" : "rh-left-0"
               ].filter(Boolean).join(" "),
               style: {
                 top: "100%",
@@ -4265,7 +4343,7 @@ function TableInner({
               style: bodyStyleInline,
               className: [
                 "rh-border-b rh-border-border rh-transition-colors",
-                "hover:rh-bg-background",
+                "hover:rh-bg-background/50",
                 variant === "striped" && index % 2 === 1 ? "rh-bg-background/50" : ""
               ].filter(Boolean).join(" "),
               children: columns.map((column) => /* @__PURE__ */ jsx(
@@ -4287,7 +4365,7 @@ function TableInner({
                         onChange: (value) => column.onEditChange?.(row, index, value),
                         className: "rh-w-full rh-h-full"
                       }
-                    ) : /* @__PURE__ */ jsx("span", { children: column.render(row, index) }),
+                    ) : /* @__PURE__ */ jsx("span", { style: { width: "100%" }, children: column.render(row, index) }),
                     column.actionIcon && /* @__PURE__ */ jsx(
                       "span",
                       {
@@ -4306,7 +4384,7 @@ function TableInner({
             },
             rowKey(row, index)
           )),
-          addRowButton && !loading && /* @__PURE__ */ jsx("tr", { className: "rh-border-border hover:rh-bg-background/100 rh-rounde-lg", children: /* @__PURE__ */ jsx(
+          addRowButton && !loading && /* @__PURE__ */ jsx("tr", { className: "rh-border-border hover:rh-bg-background/50 rh-rounde-lg", children: /* @__PURE__ */ jsx(
             "td",
             {
               colSpan,