@dimasbaguspm/versaur 0.0.57 → 0.0.59

package/dist/js/{use-snackbars-Cou8L41F.js → use-snackbars-B6lnVjrX.js}

@@ -1,7 +1,8 @@
-import { c as d, j as c } from "./index-DOdDlCoL.js";
-import { createContext as x, useState as p, useRef as k, useCallback as m, useEffect as S, useMemo as v, useContext as w } from "react";
-import { S as h } from "./snackbar-DH8jCh2V.js";
-const f = x(
+import { j as c } from "./jsx-runtime-C5mzlN2N.js";
+import { createContext as p, useState as x, useRef as k, useCallback as l, useEffect as S, useMemo as v, useContext as w } from "react";
+import { S as h } from "./snackbar-CTq4MLir.js";
+import { c as d } from "./index-BDtz_hQY.js";
+const f = p(
   null
 ), j = d(
   [
@@ -20,11 +21,11 @@ const f = x(
   }
 }), C = 4e3;
 function E() {
-  const [a, o] = p([]), t = k({}), n = m((e) => {
+  const [a, o] = x([]), t = k({}), n = l((e) => {
     o((r) => r.filter((s) => s.id !== e)), t.current[e] && (clearTimeout(t.current[e]), delete t.current[e]);
-  }, []), i = m(
+  }, []), i = l(
     (e, r, s) => {
-      const u = `${Date.now()}-${Math.random()}`, l = s?.duration ?? C;
+      const u = `${Date.now()}-${Math.random()}`, m = s?.duration ?? C;
       o((b) => [
         ...b,
         {
@@ -32,11 +33,11 @@ function E() {
           color: e,
           message: r,
           ...s,
-          duration: l
+          duration: m
         }
       ]), t.current[u] = setTimeout(() => {
         n(u);
-      }, l);
+      }, m);
     },
     [n]
   );
@@ -44,7 +45,7 @@ function E() {
     Object.values(t.current).forEach(clearTimeout), t.current = {};
   }, []), { queue: a, showSnack: i, removeSnack: n };
 }
-const V = ({ children: a }) => {
+const N = ({ children: a }) => {
   const { queue: o, showSnack: t, removeSnack: n } = E(), i = v(() => ({ showSnack: t }), [t]);
   return /* @__PURE__ */ c.jsxs(f.Provider, { value: i, children: [
     a,
@@ -79,13 +80,13 @@ const V = ({ children: a }) => {
     )
   ] });
 };
-function N() {
+function $() {
   const a = w(f);
   if (!a)
     throw new Error("useSnackbars must be used within a SnackbarsProvider");
   return a;
 }
 export {
-  V as S,
-  N as u
+  N as S,
+  $ as u
 };

package/dist/types/helpers/index.d.ts

@@ -0,0 +1 @@
+export * from './match-media';

package/dist/types/helpers/match-media/built-in/components/desktop-breakpoint.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Props for breakpoint components
+ */
+interface BreakpointComponentProps {
+    children: React.ReactNode;
+}
+/**
+ * Component that only renders children on desktop viewports
+ *
+ * @example
+ * ```tsx
+ * <DesktopBreakpoint>
+ *   <DesktopOnlyContent />
+ * </DesktopBreakpoint>
+ * ```
+ */
+export declare function DesktopBreakpoint({ children }: BreakpointComponentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/helpers/match-media/built-in/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './mobile-breakpoint';
+export * from './tablet-breakpoint';
+export * from './desktop-breakpoint';

package/dist/types/helpers/match-media/built-in/components/mobile-breakpoint.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Props for breakpoint components
+ */
+interface BreakpointComponentProps {
+    children: React.ReactNode;
+}
+/**
+ * Component that only renders children on mobile viewports
+ *
+ * @example
+ * ```tsx
+ * <MobileBreakpoint>
+ *   <MobileOnlyContent />
+ * </MobileBreakpoint>
+ * ```
+ */
+export declare function MobileBreakpoint({ children }: BreakpointComponentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/helpers/match-media/built-in/components/tablet-breakpoint.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Props for breakpoint components
+ */
+interface BreakpointComponentProps {
+    children: React.ReactNode;
+}
+/**
+ * Component that only renders children on tablet viewports
+ *
+ * @example
+ * ```tsx
+ * <TabletBreakpoint>
+ *   <TabletOnlyContent />
+ * </TabletBreakpoint>
+ * ```
+ */
+export declare function TabletBreakpoint({ children }: BreakpointComponentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/helpers/match-media/built-in/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export * from './use-mobile-breakpoint';
+export * from './use-tablet-breakpoint';
+export * from './use-desktop-breakpoint';

package/dist/types/helpers/match-media/built-in/hooks/use-desktop-breakpoint.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Hook to detect if the current viewport is desktop
+ *
+ * @returns boolean indicating if viewport is desktop (min-width: 1024px)
+ *
+ * @example
+ * ```tsx
+ * const isDesktop = useDesktopBreakpoint()
+ * ```
+ */
+export declare function useDesktopBreakpoint(): boolean;

package/dist/types/helpers/match-media/built-in/hooks/use-mobile-breakpoint.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Hook to detect if the current viewport is mobile
+ *
+ * @returns boolean indicating if viewport is mobile (max-width: 767px)
+ *
+ * @example
+ * ```tsx
+ * const isMobile = useMobileBreakpoint()
+ * ```
+ */
+export declare function useMobileBreakpoint(): boolean;

package/dist/types/helpers/match-media/built-in/hooks/use-tablet-breakpoint.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Hook to detect if the current viewport is tablet
+ *
+ * @returns boolean indicating if viewport is tablet (768px - 1023px)
+ *
+ * @example
+ * ```tsx
+ * const isTablet = useTabletBreakpoint()
+ * ```
+ */
+export declare function useTabletBreakpoint(): boolean;

package/dist/types/helpers/match-media/built-in/index.d.ts

@@ -0,0 +1,2 @@
+export * from './hooks';
+export * from './components';

package/dist/types/helpers/match-media/constants.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Standard Tailwind breakpoint definitions
+ * These align with common Tailwind CSS breakpoints
+ */
+export declare const BREAKPOINT_MOBILE = "(max-width: 767px)";
+export declare const BREAKPOINT_TABLET = "(min-width: 768px) and (max-width: 1023px)";
+export declare const BREAKPOINT_DESKTOP = "(min-width: 1024px)";

package/dist/types/helpers/match-media/index.d.ts

@@ -0,0 +1,4 @@
+export * from './constants';
+export * from './use-match-media';
+export * from './match-media';
+export * from './built-in';

package/dist/types/helpers/match-media/match-media.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Props for MatchMedia component
+ */
+interface MatchMediaProps {
+    /** CSS media query string to match against */
+    query: string;
+    /** Content to render when query matches */
+    children: React.ReactNode;
+}
+/**
+ * Component that conditionally renders children based on a media query
+ *
+ * @example
+ * ```tsx
+ * <MatchMedia query="(min-width: 1024px)">
+ *   <DesktopContent />
+ * </MatchMedia>
+ *
+ * <MatchMedia query="(prefers-color-scheme: dark)">
+ *   <DarkModeUI />
+ * </MatchMedia>
+ * ```
+ */
+export declare function MatchMedia({ query, children }: MatchMediaProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/types/helpers/match-media/test-helpers.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Creates a mock MediaQueryList for testing
+ */
+export declare const createMatchMediaMock: (matches: boolean) => {
+    matches: boolean;
+    media: string;
+    onchange: null;
+    addListener: import('vitest').Mock<(...args: any[]) => any>;
+    removeListener: import('vitest').Mock<(...args: any[]) => any>;
+    addEventListener: import('vitest').Mock<(event: string, listener: (event: MediaQueryListEvent) => void) => void>;
+    removeEventListener: import('vitest').Mock<(event: string, listener: (event: MediaQueryListEvent) => void) => void>;
+    dispatchEvent: import('vitest').Mock<(...args: any[]) => any>;
+    _triggerChange: (newMatches: boolean) => void;
+};
+/**
+ * Setup and teardown for matchMedia mocking
+ */
+export declare const setupMatchMediaMock: () => {
+    beforeEach: () => void;
+    afterEach: () => void;
+};

package/dist/types/helpers/match-media/use-match-media.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Base hook to detect if a media query matches
+ * Uses the native matchMedia API for optimal performance
+ *
+ * @param query - CSS media query string
+ * @returns boolean indicating if the query matches
+ *
+ * @example
+ * ```tsx
+ * const isMobile = useMatchMedia(BREAKPOINT_MOBILE)
+ * const isDesktop = useMatchMedia(BREAKPOINT_DESKTOP)
+ * const prefersDark = useMatchMedia('(prefers-color-scheme: dark)')
+ * ```
+ */
+export declare function useMatchMedia(query: string): boolean;

package/dist/types/index.d.ts

@@ -5,3 +5,4 @@ export * from './overlays';
 export * from './primitive';
 export * from './navigation';
 export * from './providers';
+export * from './helpers';

package/dist/types/layouts/app-layout/app-layout.atoms.d.ts

@@ -0,0 +1,6 @@
+import { AppLayoutTopRegionProps, AppLayoutSideLeftRegionProps, AppLayoutSideRightRegionProps, AppLayoutBottomRegionProps, AppLayoutMainRegionProps } from './types';
+export declare const AppLayoutTopRegion: import('react').ForwardRefExoticComponent<AppLayoutTopRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const AppLayoutSideLeftRegion: import('react').ForwardRefExoticComponent<AppLayoutSideLeftRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const AppLayoutSideRightRegion: import('react').ForwardRefExoticComponent<AppLayoutSideRightRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const AppLayoutBottomRegion: import('react').ForwardRefExoticComponent<AppLayoutBottomRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const AppLayoutMainRegion: import('react').ForwardRefExoticComponent<AppLayoutMainRegionProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/types/layouts/app-layout/app-layout.d.ts

@@ -0,0 +1,8 @@
+import { AppLayoutProps } from './types';
+export declare const AppLayout: import('react').ForwardRefExoticComponent<AppLayoutProps & import('react').RefAttributes<HTMLDivElement>> & {
+    TopRegion: import('react').ForwardRefExoticComponent<import('./types').AppLayoutTopRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+    SideLeftRegion: import('react').ForwardRefExoticComponent<import('./types').AppLayoutSideLeftRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+    SideRightRegion: import('react').ForwardRefExoticComponent<import('./types').AppLayoutSideRightRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+    BottomRegion: import('react').ForwardRefExoticComponent<import('./types').AppLayoutBottomRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+    MainRegion: import('react').ForwardRefExoticComponent<import('./types').AppLayoutMainRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+};

package/dist/types/layouts/app-layout/index.d.ts

@@ -0,0 +1,2 @@
+export { AppLayout } from './app-layout';
+export type { AppLayoutProps, AppLayoutTopRegionProps, AppLayoutSideLeftRegionProps, AppLayoutSideRightRegionProps, AppLayoutBottomRegionProps, AppLayoutMainRegionProps, } from './types';

package/dist/types/layouts/app-layout/types.d.ts

@@ -0,0 +1,52 @@
+import { HTMLAttributes } from 'react';
+/**
+ * AppLayoutRoot - main container for application layout
+ * Provides high-level layout structure with named regions for app shell
+ * Compound pattern: TopRegion, SideLeftRegion, SideRightRegion, BottomRegion, MainRegion
+ */
+export type AppLayoutProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * AppLayoutTopRegion - top region of the app (header, navigation bar)
+ */
+export interface AppLayoutTopRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Custom class for top region
+     */
+    className?: string;
+}
+/**
+ * AppLayoutSideLeftRegion - left sidebar region
+ */
+export interface AppLayoutSideLeftRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Custom class for left sidebar region
+     */
+    className?: string;
+}
+/**
+ * AppLayoutSideRightRegion - right sidebar region
+ */
+export interface AppLayoutSideRightRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Custom class for right sidebar region
+     */
+    className?: string;
+}
+/**
+ * AppLayoutBottomRegion - bottom region of the app (footer, bottom nav)
+ */
+export interface AppLayoutBottomRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Custom class for bottom region
+     */
+    className?: string;
+}
+/**
+ * AppLayoutMainRegion - main content region
+ */
+export interface AppLayoutMainRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Custom class for main region
+     */
+    className?: string;
+}

package/dist/types/layouts/index.d.ts

@@ -1,10 +1,11 @@
-export * from './app-bar';
+export * from './app-layout';
 export * from './bottom-bar';
 export * from './badge-group';
 export * from './button-group';
 export * from './filter-chip-group';
 export * from './page-header';
 export * from './page-content';
+export * from './page-layout';
 export * from './page-loader';
 export * from './form-layout';
 export * from './side-bar';

package/dist/types/layouts/page-content/types.d.ts

@@ -17,12 +17,6 @@ export interface PageContentProps extends React.HTMLAttributes<HTMLDivElement> {
      * - 'two-column-asymmetric-right': Two columns with right column wider
      */
     template?: 'single-column' | 'two-column' | 'two-column-asymmetric-left' | 'two-column-asymmetric-right';
-    /**
-     * Background color of the layout
-     * - 'white': White background
-     * - 'gray': Gray background
-     */
-    backgroundColor?: 'white' | 'gray';
     /**
      * Content to render inside the layout
      */

package/dist/types/layouts/page-header/types.d.ts

@@ -11,12 +11,6 @@ export interface PageHeaderProps extends HTMLAttributes<HTMLElement> {
      * - 'narrow': Container for mobile screens (centered)
      */
     size?: 'fluid' | 'wide' | 'narrow';
-    /**
-     * Background color of the header
-     * - 'white': White background
-     * - 'gray': Gray background
-     */
-    backgroundColor?: 'white' | 'gray';
     children?: ReactNode;
 }
 /**
@@ -24,12 +18,26 @@ export interface PageHeaderProps extends HTMLAttributes<HTMLElement> {
  */
 export interface PageHeaderTopProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
+    /**
+     * Size determines the horizontal padding
+     * - 'fluid': No padding
+     * - 'wide': px-6
+     * - 'narrow': px-4
+     */
+    size?: 'fluid' | 'wide' | 'narrow';
 }
 /**
  * Props for PageHeaderBreadcrumbs - breadcrumbs section
  */
 export interface PageHeaderBreadcrumbsProps extends HTMLAttributes<HTMLDivElement> {
     children: ReactNode;
+    /**
+     * Size determines the horizontal padding
+     * - 'fluid': No padding
+     * - 'wide': px-6
+     * - 'narrow': px-4
+     */
+    size?: 'fluid' | 'wide' | 'narrow';
 }
 /**
  * Props for PageHeaderContent - title and subtitle area

package/dist/types/layouts/page-layout/index.d.ts

@@ -0,0 +1,2 @@
+export { PageLayout } from './page-layout';
+export type { PageLayoutProps, PageLayoutHeaderRegionProps, PageLayoutContentRegionProps, } from './types';

package/dist/types/layouts/page-layout/page-layout.atoms.d.ts

@@ -0,0 +1,3 @@
+import { PageLayoutHeaderRegionProps, PageLayoutContentRegionProps } from './types';
+export declare const PageLayoutHeaderRegion: import('react').ForwardRefExoticComponent<PageLayoutHeaderRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+export declare const PageLayoutContentRegion: import('react').ForwardRefExoticComponent<PageLayoutContentRegionProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/types/layouts/page-layout/page-layout.d.ts

@@ -0,0 +1,5 @@
+import { PageLayoutProps } from './types';
+export declare const PageLayout: import('react').ForwardRefExoticComponent<PageLayoutProps & import('react').RefAttributes<HTMLDivElement>> & {
+    HeaderRegion: import('react').ForwardRefExoticComponent<import('./types').PageLayoutHeaderRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+    ContentRegion: import('react').ForwardRefExoticComponent<import('./types').PageLayoutContentRegionProps & import('react').RefAttributes<HTMLDivElement>>;
+};

package/dist/types/layouts/page-layout/types.d.ts

@@ -0,0 +1,37 @@
+import { HTMLAttributes } from 'react';
+/**
+ * PageLayoutRoot - main container for page layout
+ * Manages layout between header and content regions
+ * Compound pattern: HeaderRegion, ContentRegion
+ */
+export interface PageLayoutProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Add horizontal margin (left and right) to the page layout
+     * @default false
+     */
+    hasMargin?: boolean;
+}
+/**
+ * PageLayoutHeaderRegion - header region of the page
+ */
+export interface PageLayoutHeaderRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Background color of the header region
+     * - 'white': White background
+     * - 'gray': Gray background
+     * @default 'white'
+     */
+    backgroundColor?: 'white' | 'gray';
+}
+/**
+ * PageLayoutContentRegion - content region of the page
+ */
+export interface PageLayoutContentRegionProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * Background color of the content region
+     * - 'white': White background
+     * - 'gray': Gray background
+     * @default 'white'
+     */
+    backgroundColor?: 'white' | 'gray';
+}

package/dist/types/layouts/side-bar/side-bar.atoms.d.ts

@@ -1,3 +1,3 @@
 import { SideBarItemProps, SideBarGroupProps } from './types';
-export declare const SideBarItem: import('react').ForwardRefExoticComponent<SideBarItemProps & import('react').RefAttributes<HTMLElement>>;
+export declare const SideBarItem: import('react').ForwardRefExoticComponent<SideBarItemProps & import('react').RefAttributes<HTMLAnchorElement>>;
 export declare const SideBarGroup: import('react').ForwardRefExoticComponent<SideBarGroupProps & import('react').RefAttributes<HTMLLIElement>>;

package/dist/types/layouts/side-bar/side-bar.d.ts

@@ -1,5 +1,5 @@
 import { SideBarProps } from './types';
 export declare const SideBar: import('react').ForwardRefExoticComponent<SideBarProps & import('react').RefAttributes<HTMLElement>> & {
-    Item: import('react').ForwardRefExoticComponent<import('./types').SideBarItemProps & import('react').RefAttributes<HTMLElement>>;
+    Item: import('react').ForwardRefExoticComponent<import('./types').SideBarItemProps & import('react').RefAttributes<HTMLAnchorElement>>;
     Group: import('react').ForwardRefExoticComponent<import('./types').SideBarGroupProps & import('react').RefAttributes<HTMLLIElement>>;
 };

package/dist/types/layouts/side-bar/types.d.ts

@@ -1,31 +1,43 @@
-import { HTMLAttributes, AnchorHTMLAttributes, ReactNode, ButtonHTMLAttributes } from 'react';
+import { HTMLAttributes, AnchorHTMLAttributes, ReactNode } from 'react';
 /**
  * Props for the SideBar root component
  */
 export interface SideBarProps extends HTMLAttributes<HTMLElement> {
     /**
-     * Children nodes (MenuList, etc)
+     * Children nodes (SideBar.Item, SideBar.Group)
      */
     children: ReactNode;
+    /**
+     * Whether the sidebar starts in collapsed state
+     * @default false (expanded)
+     */
+    defaultCollapsed?: boolean;
+    /**
+     * Callback when collapse state changes
+     */
+    onCollapseChange?: (collapsed: boolean) => void;
 }
-interface SideBarItemBaseAsAnchor extends AnchorHTMLAttributes<HTMLAnchorElement> {
-    active?: boolean;
-    icon: ReactNode;
-    children: ReactNode;
-    onClick?: never;
-    href: AnchorHTMLAttributes<HTMLAnchorElement>['href'];
-}
-interface SideBarItemBaseAsButton extends ButtonHTMLAttributes<HTMLButtonElement> {
+/**
+ * Props for the SideBar.Item component (anchor only)
+ */
+export interface SideBarItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    /**
+     * Whether this item is currently active/selected
+     */
     active?: boolean;
+    /**
+     * Icon element to display
+     */
     icon?: ReactNode;
+    /**
+     * Text label for the item
+     */
     children: ReactNode;
-    onClick?: ButtonHTMLAttributes<HTMLButtonElement>['onClick'];
-    href?: never;
+    /**
+     * URL for the anchor
+     */
+    href: AnchorHTMLAttributes<HTMLAnchorElement>['href'];
 }
-/**
- * Props for the SideBar.Item component (polymorphic: anchor or button)
- */
-export type SideBarItemProps = SideBarItemBaseAsAnchor | SideBarItemBaseAsButton;
 /**
  * Props for the SideBar.Group component
  */
@@ -35,8 +47,33 @@ export interface SideBarGroupProps extends HTMLAttributes<HTMLLIElement> {
      */
     label: ReactNode;
     /**
-     * Children (SideBar.Item)
+     * Children (SideBar.Item elements)
      */
     children: ReactNode;
+    /**
+     * Icon element to display
+     */
+    icon?: ReactNode;
+    /**
+     * Whether the group's children are expanded by default
+     * @default true
+     */
+    defaultExpanded?: boolean;
+}
+/**
+ * Context value for sidebar state
+ */
+export interface SideBarContextValue {
+    /**
+     * Whether the sidebar is currently collapsed
+     */
+    isCollapsed: boolean;
+    /**
+     * Toggle the collapsed state
+     */
+    toggleCollapsed: () => void;
+    /**
+     * Expand the sidebar (set to expanded state)
+     */
+    expandSidebar: () => void;
 }
-export {};

package/dist/types/overlays/menu/types.d.ts

@@ -1,14 +1,14 @@
-import { HTMLAttributes, MouseEvent, ReactNode, RefObject } from 'react';
+import { HTMLAttributes, MouseEvent, ReactNode } from 'react';
+import { PopoverPlacement } from '../../utils/popover';
 export type MenuSize = 'sm' | 'md';
-export type MenuPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end' | 'auto';
 /**
  * Props for Menu
  */
 export interface MenuProps {
-    /** Whether the menu is open (controlled externally) */
+    /** Whether the menu is open (controlled) */
     isOpen: boolean;
-    /** Callback when clicking outside menu */
-    onOutsideClick: () => void;
+    /** Callback when the menu closes */
+    onClose: () => void;
     /** Menu size variant */
     size?: MenuSize;
     /** Menu content (MenuContent/MenuItem) */
@@ -16,9 +16,9 @@ export interface MenuProps {
     /** Trigger element */
     children: ReactNode;
     /** Preferred placement of the menu relative to trigger */
-    placement?: MenuPlacement;
-    /** Container element to respect boundaries (defaults to viewport) */
-    container?: HTMLElement | RefObject<HTMLElement | null> | null;
+    placement?: PopoverPlacement;
+    /** Gap between trigger and menu in pixels */
+    gap?: number;
     /** Whether to keep the menu after list item clicked */
     preserve?: boolean;
 }

package/dist/types/primitive/button-menu/types.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { MenuProps } from '../../overlays/menu/types';
 import { ButtonProps } from '../button/types';
-export interface ButtonMenuProps extends Omit<ButtonProps, 'content'>, Pick<MenuProps, 'placement' | 'container' | 'preserve'> {
+export interface ButtonMenuProps extends Omit<ButtonProps, 'content'>, Pick<MenuProps, 'placement' | 'preserve'> {
     /**
      * Callback function triggered when the menu open state changes.
      */

package/dist/types/primitive/button-menu-icon/types.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 import { IconProps } from '../icon';
 import { ButtonIconProps } from '../button-icon';
 import { MenuProps } from '../../overlays/menu/types';
-export interface ButtonMenuIconProps extends Omit<ButtonIconProps, 'content'>, Pick<IconProps, 'as'>, Pick<MenuProps, 'placement' | 'container' | 'preserve'> {
+export interface ButtonMenuIconProps extends Omit<ButtonIconProps, 'content'>, Pick<IconProps, 'as'>, Pick<MenuProps, 'placement' | 'preserve'> {
     /**
      * Callback function triggered when the menu open state changes.
      */