@sikka/hawa 0.26.39-next → 0.27.0

package/dist/index.mjs

@@ -623,8 +623,11 @@ var DropdownMenu = ({
         className: cn(
           className,
           widthStyles[width],
-          "hawa-flex hawa-flex-col hawa-gap-1"
+          "hawa-flex hawa-flex-col hawa-gap-1 hawa-overflow-y-auto"
         ),
+        style: {
+          maxHeight: "var(--radix-dropdown-menu-content-available-height)"
+        },
         align,
         alignOffset
       },
@@ -901,7 +904,7 @@ var Accordion = React9.forwardRef(
         {
           disabled: item.disabled || false,
           className: cn(
-            "hawa-transition-all",
+            "hawa-transition-all hawa-text-start",
             design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-b-none" : {
               "hawa-rounded-t": index === 0,
               "data-[state=closed]:hawa-rounded-b": index === items.length - 1
@@ -6871,11 +6874,7 @@ var ScrollIndicator = ({
 
 // elements/codeBlock/CodeBlock.tsx
 import React54, { useState as useState16 } from "react";
-import {
-  Highlight,
-  themes,
-  Prism
-} from "prism-react-renderer";
+import { Highlight, themes, Prism } from "prism-react-renderer";
 
 // hooks/useClipboard.ts
 import { useState as useState15 } from "react";
@@ -6906,13 +6905,30 @@ function useClipboard({ timeout = 2e3 } = {}) {
 // elements/codeBlock/CodeBlock.tsx
 (typeof global !== "undefined" ? global : window).Prism = Prism;
 __require("prismjs/components/prism-bash");
+var CopyIcon = () => /* @__PURE__ */ React54.createElement(
+  "svg",
+  {
+    "aria-label": "Copy",
+    stroke: "currentColor",
+    fill: "none",
+    strokeWidth: "2",
+    viewBox: "0 0 24 24",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    height: "1em",
+    width: "1em"
+  },
+  /* @__PURE__ */ React54.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+  /* @__PURE__ */ React54.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+);
 var CodeBlock = ({
   tabs,
   code,
   fileName,
-  className,
+  classNames,
   language = "javascript",
   // default to JavaScript if no language is provided
+  wrapText = false,
   width = "full",
   ...props
 }) => {
@@ -6930,16 +6946,50 @@ var CodeBlock = ({
     {
       className: cn(
         widthStyles[width],
-        "hawa-w-full hawa-flex-col hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-my-2 hawa-text-white sm:hawa-text-base",
-        className
+        "hawa-w-full hawa-flex-col hawa-relative hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-my-2 hawa-text-white sm:hawa-text-base",
+        classNames == null ? void 0 : classNames.root
       )
     },
+    /* @__PURE__ */ React54.createElement(
+      "div",
+      {
+        className: cn(
+          "hawa-flex hawa-absolute  hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-z-50  hawa-right-3.5",
+          {
+            "hawa-top-3.5": !tabs && !fileName,
+            "hawa-top-[50px]": tabs && !fileName,
+            "hawa-top-11": !tabs && fileName,
+            "hawa-top-[80px]": tabs && fileName
+          }
+        )
+      },
+      /* @__PURE__ */ React54.createElement(
+        Tooltip,
+        {
+          open: clipboard.copied,
+          side: "left",
+          content: /* @__PURE__ */ React54.createElement("div", null, "Copied!"),
+          triggerProps: { asChild: true }
+        },
+        /* @__PURE__ */ React54.createElement(
+          Button,
+          {
+            size: "smallIcon",
+            onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
+            variant: "outline",
+            className: "hawa-text-gray-200 hawa-opacity-50 "
+          },
+          /* @__PURE__ */ React54.createElement(CopyIcon, null)
+        )
+      )
+    ),
     fileName && /* @__PURE__ */ React54.createElement(
       "div",
       {
         className: cn(
           "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-font-mono hawa-text-foreground",
-          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15"
+          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15",
+          classNames == null ? void 0 : classNames.fileName
         )
       },
       /* @__PURE__ */ React54.createElement(
@@ -6956,9 +7006,9 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          // hawa-bg-gray-300 dark:hawa-bg-red-600
           "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t  hawa-p-1 hawa-bg-primary/15 hawa-pb-0 hawa-font-mono hawa-text-foreground",
-          tabs && fileName && "hawa-rounded-t-none"
+          tabs && fileName && "hawa-rounded-t-none",
+          classNames == null ? void 0 : classNames.tabs
         )
       },
       tabs.map((tab, i) => /* @__PURE__ */ React54.createElement(
@@ -6966,7 +7016,8 @@ var CodeBlock = ({
         {
           key: i,
           className: cn(
-            selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent"
+            selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent",
+            classNames == null ? void 0 : classNames.tab
           )
         },
         /* @__PURE__ */ React54.createElement(
@@ -6985,8 +7036,10 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "hawa-flex hawa-w-full hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-gray-800 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base ",
-          tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded"
+          "hawa-flex hawa-w-full hawa-relative hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-gray-800 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base",
+          tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded",
+          classNames == null ? void 0 : classNames.codeBlockContainer,
+          "hawa-overflow-y-auto"
         )
       },
       /* @__PURE__ */ React54.createElement(
@@ -6996,50 +7049,24 @@ var CodeBlock = ({
           code: tabs ? tabs[selectedTab].code : code || "",
           language
         },
-        ({ className: className2, style, tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ React54.createElement("pre", { className: "hawa-min-h-[37.75px] hawa-w-full hawa-overflow-auto hawa-p-4 hawa-font-mono hawa-text-foreground" }, tokens.map((line, i) => /* @__PURE__ */ React54.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ React54.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ React54.createElement("span", { key, ...getTokenProps({ token }) })))))
-      ),
-      /* @__PURE__ */ React54.createElement("div", { className: "hawa-flex hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-p-2" }, /* @__PURE__ */ React54.createElement(
-        Tooltip,
-        {
-          open: clipboard.copied,
-          side: "left",
-          content: /* @__PURE__ */ React54.createElement("div", null, "Copied!"),
-          triggerProps: {
-            asChild: true
-          }
-        },
-        /* @__PURE__ */ React54.createElement(
-          Button,
+        ({ tokens, getLineProps, getTokenProps }) => /* @__PURE__ */ React54.createElement(
+          "pre",
           {
-            size: "icon",
-            onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
-            variant: "outline",
-            className: "hawa-text-gray-200 hawa-opacity-50 "
+            className: cn(
+              "hawa-min-h-[37.75px] !hawa-pe-12 hawa-w-full hawa-p-4 hawa-font-mono hawa-text-foreground",
+              classNames == null ? void 0 : classNames.code,
+              wrapText && "hawa-text-wrap"
+            )
           },
-          /* @__PURE__ */ React54.createElement(
-            "svg",
-            {
-              "aria-label": "Copy",
-              stroke: "currentColor",
-              fill: "none",
-              strokeWidth: "2",
-              viewBox: "0 0 24 24",
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              height: "1em",
-              width: "1em"
-            },
-            /* @__PURE__ */ React54.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-            /* @__PURE__ */ React54.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
-          )
+          tokens.map((line, i) => /* @__PURE__ */ React54.createElement("div", { key: i, ...getLineProps({ line }) }, props.lineNumbers && /* @__PURE__ */ React54.createElement("span", { className: "hawa-mr-4" }, i + 1), line.map((token, key) => /* @__PURE__ */ React54.createElement("span", { key, ...getTokenProps({ token }) }))))
         )
-      ))
+      )
     )
   );
 };
 
 // elements/carousel/Carousel.tsx
-import React55, { useEffect as useEffect14, useState as useState17 } from "react";
+import React55, { useEffect as useEffect13, useState as useState17 } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 var Carousel = ({
   items,
@@ -7056,7 +7083,7 @@ var Carousel = ({
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = useState17(0);
-  useEffect14(() => {
+  useEffect13(() => {
     function selectHandler() {
       const index = emblaApi == null ? void 0 : emblaApi.selectedScrollSnap();
       setSelectedIndex(index || 0);
@@ -7066,7 +7093,7 @@ var Carousel = ({
       emblaApi == null ? void 0 : emblaApi.off("select", selectHandler);
     };
   }, [emblaApi]);
-  useEffect14(() => {
+  useEffect13(() => {
     let autoplayTimer;
     if (autoplay && emblaApi) {
       autoplayTimer = setInterval(() => {
@@ -7898,7 +7925,7 @@ var Navbar = ({
 };
 
 // layout/appLayout/AppLayout.tsx
-import React65, { useEffect as useEffect15, useRef as useRef9, useState as useState21 } from "react";
+import React65, { useEffect as useEffect14, useRef as useRef9, useState as useState21 } from "react";
 var AppLayout = ({
   profileMenuWidth = "default",
   DrawerFooterActions,
@@ -7932,7 +7959,7 @@ var AppLayout = ({
   const [size, setSize] = useState21(1200);
   const [openSideMenu, setOpenSideMenu] = useState21(true);
   const drawerSizeCondition = size > 600 ? drawerSizeStyle[keepOpen ? "opened" : "closed"][drawerSize] : 0;
-  useEffect15(() => {
+  useEffect14(() => {
     if (typeof window !== "undefined") {
       const resize = () => {
         setSize(window.innerWidth);
@@ -7944,14 +7971,14 @@ var AppLayout = ({
       };
     }
   }, []);
-  useEffect15(() => {
+  useEffect14(() => {
     if (size > 600) {
       setOpenSideMenu(keepOpen);
     } else {
       setOpenSideMenu(false);
     }
   }, [size]);
-  useEffect15(() => {
+  useEffect14(() => {
     const handleClickOutside = (event) => {
       if (ref.current && !ref.current.contains(event.target) && !keepOpen) {
         setOpenSideMenu(false);
@@ -8605,13 +8632,13 @@ var AppTabs = ({ tabs, className }) => {
 };
 
 // layout/docsLayout/DocsLayout.tsx
-import React71, { useEffect as useEffect17, useRef as useRef10, useState as useState24 } from "react";
+import React71, { useEffect as useEffect16, useRef as useRef10, useState as useState24 } from "react";
 
 // hooks/useBreakpoint.ts
-import { useState as useState23, useEffect as useEffect16 } from "react";
+import { useState as useState23, useEffect as useEffect15 } from "react";
 var useBreakpoint = () => {
   const [breakpoint, setBreakpoint] = useState23(null);
-  useEffect16(() => {
+  useEffect15(() => {
     if (typeof window !== "undefined") {
       const resize = () => {
         setBreakpoint(window.innerWidth);
@@ -8722,7 +8749,7 @@ var DocsLayout = ({
   }
   const [currentPage, setCurrentPage] = useState24("Introduction");
   const [openSideMenu, setOpenSideMenu] = useState24(true);
-  useEffect17(() => {
+  useEffect16(() => {
     const handleClickOutside = (event) => {
       if (ref.current && !ref.current.contains(event.target) && !openSideMenu) {
         setOpenSideMenu(false);
@@ -8733,7 +8760,7 @@ var DocsLayout = ({
       document.removeEventListener("click", handleClickOutside, true);
     };
   }, [openSideMenu]);
-  useEffect17(() => {
+  useEffect16(() => {
     const handleResize = () => {
       setOpenSideMenu(window.innerWidth > 600 ? true : false);
     };
@@ -8750,7 +8777,7 @@ var DocsLayout = ({
       setCurrentPage(entry.target.id);
     }
   };
-  useEffect17(() => {
+  useEffect16(() => {
     observerRef.current = new IntersectionObserver(handleIntersection, {
       threshold: 0.5
       // Adjust threshold as needed to determine when a section is in view
@@ -9410,15 +9437,18 @@ var RegisterForm = ({
             control,
             name: "username",
             render: ({ field }) => {
-              var _a2, _b2, _c2;
+              var _a2, _b2, _c2, _d2;
               return /* @__PURE__ */ React74.createElement(
                 Input,
                 {
                   width: "full",
                   autoComplete: "username",
                   label: (_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label,
-                  helperText: (_b2 = formState.errors.username) == null ? void 0 : _b2.message,
-                  placeholder: (_c2 = texts == null ? void 0 : texts.username) == null ? void 0 : _c2.placeholder,
+                  labelProps: {
+                    ...(_b2 = props.usernameOptions) == null ? void 0 : _b2.label
+                  },
+                  helperText: (_c2 = formState.errors.username) == null ? void 0 : _c2.message,
+                  placeholder: (_d2 = texts == null ? void 0 : texts.username) == null ? void 0 : _d2.placeholder,
                   ...field
                 }
               );
@@ -9818,7 +9848,7 @@ var ResetPasswordForm = (props) => {
 };
 
 // blocks/auth/CodeConfirmation.tsx
-import React79, { useEffect as useEffect18, useState as useState28 } from "react";
+import React79, { useEffect as useEffect17, useState as useState28 } from "react";
 import { Controller as Controller5, useForm as useForm5 } from "react-hook-form";
 import { zodResolver as zodResolver5 } from "@hookform/resolvers/zod";
 import * as z5 from "zod";
@@ -9854,7 +9884,7 @@ var CodeConfirmation = (props) => {
     }, 1e3);
     setResendTimer(newTimer);
   };
-  useEffect18(() => {
+  useEffect17(() => {
     return () => {
       if (resendTimer !== null) {
         clearInterval(resendTimer);
@@ -10074,7 +10104,7 @@ var UserReferralSource = ({
 };
 
 // blocks/feedback/FeedbackRating.tsx
-import React81, { useEffect as useEffect19, useRef as useRef12, useState as useState30 } from "react";
+import React81, { useEffect as useEffect18, useRef as useRef12, useState as useState30 } from "react";
 var FeedbackRating = ({
   position = "bottom-right",
   ...props
@@ -10088,7 +10118,7 @@ var FeedbackRating = ({
     "bottom-right": "hawa-right-4",
     "bottom-left": "hawa-left-4"
   };
-  useEffect19(() => {
+  useEffect18(() => {
     const timeoutHide = setTimeout(() => {
       if (closingTimer >= 0) {
         setClosingTimer(closingTimer - 1);
@@ -10727,6 +10757,7 @@ var ContactForm = ({
                   placeholder: texts == null ? void 0 : texts.message.placeholder,
                   ...field
                 },
+                classNames: { textarea: "hawa-min-h-20" },
                 helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
               }
             );
@@ -10781,7 +10812,7 @@ var ActionCard = (props) => {
 };
 
 // blocks/cards/AdCard.tsx
-import React93, { useState as useState33, useEffect as useEffect20, useRef as useRef13 } from "react";
+import React93, { useState as useState33, useEffect as useEffect19, useRef as useRef13 } from "react";
 var AdCard = ({
   orientation = "vertical",
   ...props
@@ -10789,7 +10820,7 @@ var AdCard = ({
   const adRef = useRef13(null);
   const [closed, setClosed] = useState33(false);
   let duration = 0;
-  useEffect20(() => {
+  useEffect19(() => {
     if (duration) {
       const timeoutHide = setTimeout(() => {
         setClosed(true);
@@ -10964,7 +10995,7 @@ var PricingCard = ({
 };
 
 // blocks/cards/ItemCard.tsx
-import React95, { useEffect as useEffect21, useState as useState34 } from "react";
+import React95, { useEffect as useEffect20, useState as useState34 } from "react";
 var ItemCard = ({
   actions,
   counts,
@@ -10998,7 +11029,7 @@ var ItemCard = ({
     e.stopPropagation();
     setOpenActionHeader(!openActionHeader);
   }
-  useEffect21(() => {
+  useEffect20(() => {
     window.onclick = () => {
       if (openActionHeader) {
         setOpenActionHeader(false);
@@ -11434,14 +11465,14 @@ var Usage = (props) => {
 };
 
 // hooks/useIsomorphicEffect.ts
-import { useEffect as useEffect22, useLayoutEffect } from "react";
-var useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect22;
+import { useEffect as useEffect21, useLayoutEffect } from "react";
+var useIsomorphicEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect21;
 
 // hooks/useDiscloser.ts
 import { useState as useState36 } from "react";
 
 // hooks/useHover.ts
-import { useEffect as useEffect23, useRef as useRef14, useState as useState37 } from "react";
+import { useEffect as useEffect22, useRef as useRef14, useState as useState37 } from "react";
 
 // hooks/useToast.ts
 import * as React103 from "react";
@@ -11551,7 +11582,7 @@ function useToast() {
 import { useState as useState39, useRef as useRef15 } from "react";
 
 // hooks/useDialogCarousel.ts
-import { useEffect as useEffect25, useState as useState40 } from "react";
+import { useEffect as useEffect24, useState as useState40 } from "react";
 import AutoHeight from "embla-carousel-auto-height";
 import useEmblaCarousel2 from "embla-carousel-react";
 var useDialogCarousel = (options) => {
@@ -11577,7 +11608,7 @@ var useDialogCarousel = (options) => {
       emblaApi.scrollPrev();
     }
   };
-  useEffect25(() => {
+  useEffect24(() => {
     checkCanScrollPrev();
     emblaApi && emblaApi.on("select", checkCanScrollPrev);
     return () => {
@@ -11594,12 +11625,12 @@ var useDialogCarousel = (options) => {
 };
 
 // hooks/useDialogSteps.ts
-import { useState as useState41, useEffect as useEffect26, useRef as useRef16 } from "react";
+import { useState as useState41, useEffect as useEffect25, useRef as useRef16 } from "react";
 var useMultiStepDialog = (initialStep, stepIds, setOpenDialog) => {
   const [currentStep, setCurrentStep] = useState41(initialStep);
   const [dialogHeight, setDialogHeight] = useState41(null);
   const visibleStepRef = useRef16(null);
-  useEffect26(() => {
+  useEffect25(() => {
     if (visibleStepRef.current) {
       setDialogHeight(visibleStepRef.current.offsetHeight);
     }
@@ -11630,13 +11661,13 @@ var useMultiStepDialog = (initialStep, stepIds, setOpenDialog) => {
 };
 
 // hooks/useWindowSize.ts
-import { useEffect as useEffect27, useState as useState42 } from "react";
+import { useEffect as useEffect26, useState as useState42 } from "react";
 var useWindowSize = () => {
   const [windowSize, setWindowSize] = useState42({
     width: void 0,
     height: void 0
   });
-  useEffect27(() => {
+  useEffect26(() => {
     function handleResize() {
       setWindowSize({
         width: window.innerWidth,
@@ -11651,7 +11682,7 @@ var useWindowSize = () => {
 };
 
 // hooks/useFocusWithin.ts
-import { useRef as useRef17, useState as useState43, useEffect as useEffect28 } from "react";
+import { useRef as useRef17, useState as useState43, useEffect as useEffect27 } from "react";
 function containsRelatedTarget(event) {
   if (event.currentTarget instanceof HTMLElement && event.relatedTarget instanceof HTMLElement) {
     return event.currentTarget.contains(event.relatedTarget);
@@ -11681,7 +11712,7 @@ function useFocusWithin({
       onBlur == null ? void 0 : onBlur(event);
     }
   };
-  useEffect28(() => {
+  useEffect27(() => {
     if (ref.current) {
       ref.current.addEventListener("focusin", handleFocusIn);
       ref.current.addEventListener("focusout", handleFocusOut);
@@ -11697,7 +11728,7 @@ function useFocusWithin({
 }
 
 // hooks/useMediaQuery.ts
-import { useState as useState44, useEffect as useEffect29, useRef as useRef18 } from "react";
+import { useState as useState44, useEffect as useEffect28, useRef as useRef18 } from "react";
 function attachMediaListener(query, callback) {
   try {
     query.addEventListener("change", callback);
@@ -11723,7 +11754,7 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
     getInitialValueInEffect ? initialValue : getInitialValue(query, initialValue)
   );
   const queryRef = useRef18();
-  useEffect29(() => {
+  useEffect28(() => {
     if ("matchMedia" in window) {
       queryRef.current = window.matchMedia(query);
       setMatches(queryRef.current.matches);
@@ -11738,16 +11769,16 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
 }
 
 // hooks/useScrollPosition.ts
-import { useState as useState45, useEffect as useEffect30 } from "react";
+import { useState as useState45, useEffect as useEffect29 } from "react";
 
 // hooks/useTable.ts
-import { useState as useState46, useEffect as useEffect31 } from "react";
+import { useState as useState46, useEffect as useEffect30 } from "react";
 
 // hooks/useTabs.ts
-import { useEffect as useEffect32, useState as useState47 } from "react";
+import { useEffect as useEffect31, useState as useState47 } from "react";
 function useTabs(initialTab = "") {
   const [activeTab, setActiveTab] = useState47(initialTab);
-  useEffect32(() => {
+  useEffect31(() => {
     const handleHashChange = () => {
       const hash = window.location.hash.substring(1);
       setActiveTab(hash || initialTab);

package/dist/layout/index.js

@@ -1135,8 +1135,11 @@ var DropdownMenu = ({
         className: cn(
           className,
           widthStyles[width],
-          "hawa-flex hawa-flex-col hawa-gap-1"
+          "hawa-flex hawa-flex-col hawa-gap-1 hawa-overflow-y-auto"
         ),
+        style: {
+          maxHeight: "var(--radix-dropdown-menu-content-available-height)"
+        },
         align,
         alignOffset
       },

package/dist/layout/index.mjs

@@ -5,7 +5,7 @@ import {
   Sheet,
   SheetContent,
   SheetTrigger
-} from "../chunk-AXTPTA3S.mjs";
+} from "../chunk-BOVZAUWD.mjs";
 import {
   Button,
   Card,
@@ -17,7 +17,7 @@ import {
   Skeleton,
   Tooltip,
   cn
-} from "../chunk-D3KUSRHL.mjs";
+} from "../chunk-3MC4JLSW.mjs";
 import "../chunk-ZFXKCRJC.mjs";
 
 // layout/stats/Stats.tsx

package/dist/splitButton/index.js

@@ -271,8 +271,11 @@ var DropdownMenu = ({
         className: cn(
           className,
           widthStyles[width],
-          "hawa-flex hawa-flex-col hawa-gap-1"
+          "hawa-flex hawa-flex-col hawa-gap-1 hawa-overflow-y-auto"
         ),
+        style: {
+          maxHeight: "var(--radix-dropdown-menu-content-available-height)"
+        },
         align,
         alignOffset
       },