cr-ui-lib 1.1.113 → 1.1.115

package/dist/index.mjs

@@ -3620,8 +3620,12 @@ function SingleSelectDropdown({
       setIsOpen(!isOpen);
     }
   };
+  const hasMounted = useRef(false);
+  useEffect(() => {
+    hasMounted.current = true;
+  }, []);
   const openList = () => {
-    if (!disabled) {
+    if (!disabled && !isOpen && hasMounted.current) {
       setIsOpen(true);
     }
   };
@@ -3829,7 +3833,6 @@ function SingleSelectDropdown({
           "input",
           {
             type: "text",
-            autoFocus: true,
             onClick: openList,
             onFocus: openList,
             className: twMerge(
@@ -5593,6 +5596,84 @@ var PopupWrapper = ({
   );
 };
 var PopupWrapper_default = PopupWrapper;
+var PopupWrapperV2 = ({
+  children,
+  className,
+  isOpen = false,
+  stayMounted = false,
+  closePopup,
+  hasClosePopup = false,
+  isPortal = false,
+  ...rest
+}) => {
+  const anchorRef = useRef(null);
+  const [portalStyle, setPortalStyle] = useState({});
+  useEffect(() => {
+    if (!isPortal || !isOpen) return;
+    const updatePosition = () => {
+      const anchor = anchorRef.current;
+      if (!anchor) return;
+      const parent = anchor.parentElement;
+      if (!parent) return;
+      const rect = parent.getBoundingClientRect();
+      setPortalStyle({
+        position: "fixed",
+        top: rect.bottom + 4,
+        right: window.innerWidth - rect.right,
+        width: "20rem",
+        zIndex: 9999
+      });
+    };
+    updatePosition();
+    window.addEventListener("scroll", updatePosition, true);
+    window.addEventListener("resize", updatePosition);
+    return () => {
+      window.removeEventListener("scroll", updatePosition, true);
+      window.removeEventListener("resize", updatePosition);
+    };
+  }, [isPortal, isOpen]);
+  if (!stayMounted && !isOpen) return null;
+  const content = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      style: isPortal ? portalStyle : void 0,
+      className: twMerge(
+        isPortal ? "shadow-lg bg-white rounded-lg p-4 w-80 border border-opacity-10" : "absolute right-0 top-1 mt-10 shadow-lg bg-white rounded-lg p-4 w-80 z-10 border border-opacity-10",
+        isOpen ? "block" : "hidden",
+        className
+      ),
+      children: [
+        hasClosePopup && /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx("div", { onClick: closePopup, className: "cursor-pointer", children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "17.5",
+            height: "17.5",
+            viewBox: "0 0 14 14",
+            fill: "none",
+            children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: "M11.0837 3.739L10.2612 2.9165L7.00033 6.17734L3.73949 2.9165L2.91699 3.739L6.17783 6.99984L2.91699 10.2607L3.73949 11.0832L7.00033 7.82234L10.2612 11.0832L11.0837 10.2607L7.82283 6.99984L11.0837 3.739Z",
+                fill: "#4B5563"
+              }
+            )
+          }
+        ) }) }),
+        children
+      ]
+    }
+  );
+  if (isPortal) {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { ref: anchorRef, style: { display: "none" } }),
+      createPortal(content, document.body)
+    ] });
+  }
+  return content;
+};
+var PopupWrapperV2_default = PopupWrapperV2;
 var SideNav = ({
   children,
   wrapperClassName,
@@ -5675,6 +5756,6 @@ var BoxBody = ({
 };
 var BoxBody_default = BoxBody;
 
-export { Box_default as Box, BoxBody_default as BoxBody, BoxHeaders_default as BoxHeader, Button_default as Button, CollapseButton_default as CollapseButton, CommonInput_default as CommonInput, CommonInputSingle_default as CommonInputSingle, DateRange_default as DateRangePicker, DynamicTable_default as DynamicTable, DynamicTableV2_default as DynamicTableV2, ErrorToast_default as ErrorToast, GraphedCard_default as GraphedCard, GroupedCheckboxDropdown_default as GroupedCheckboxDropdown, Label_default as Label, Modal_default as Modal, MultiBarGraph_default as MultiBarGraph, MultiLineGraph_default as MultiLineGraph, MultipleAutoSuggestionInput_default as MultipleAutoSuggestionInput, NavBar_default as NavBar, Pagination, PlainButton_default as PlainButton, PopupWrapper_default as PopupWrapper, SelectionButton_default as SelectionButton, SideNav_default as SideNav, SimpleCard_default as SimpleCard, SingleDateInput_default as SingleDateInput, SingleLineGraph_default as SingleLineGraph, SingleListInput_default as SingleListInput, SingleSelectDropdown, SuccessToast_default as SuccessToast, TableHeader_default as TableHeader, TimeInput_default as TimeInput, isSameDateMDY, toEndOfDay, toMidnight, validateAndFormatInput, validateDate, validateDateRange };
+export { Box_default as Box, BoxBody_default as BoxBody, BoxHeaders_default as BoxHeader, Button_default as Button, CollapseButton_default as CollapseButton, CommonInput_default as CommonInput, CommonInputSingle_default as CommonInputSingle, DateRange_default as DateRangePicker, DynamicTable_default as DynamicTable, DynamicTableV2_default as DynamicTableV2, ErrorToast_default as ErrorToast, GraphedCard_default as GraphedCard, GroupedCheckboxDropdown_default as GroupedCheckboxDropdown, Label_default as Label, Modal_default as Modal, MultiBarGraph_default as MultiBarGraph, MultiLineGraph_default as MultiLineGraph, MultipleAutoSuggestionInput_default as MultipleAutoSuggestionInput, NavBar_default as NavBar, Pagination, PlainButton_default as PlainButton, PopupWrapper_default as PopupWrapper, PopupWrapperV2_default as PopupWrapperV2, SelectionButton_default as SelectionButton, SideNav_default as SideNav, SimpleCard_default as SimpleCard, SingleDateInput_default as SingleDateInput, SingleLineGraph_default as SingleLineGraph, SingleListInput_default as SingleListInput, SingleSelectDropdown, SuccessToast_default as SuccessToast, TableHeader_default as TableHeader, TimeInput_default as TimeInput, isSameDateMDY, toEndOfDay, toMidnight, validateAndFormatInput, validateDate, validateDateRange };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map