@arobo/react 1.0.1 → 1.1.1

package/dist/components/chip/index.js

@@ -0,0 +1,10 @@
+import { ChipRoot } from './chip.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Chip = Object.assign(ChipRoot, {
+  Root: ChipRoot
+});
+
+export { Chip, ChipRoot };

package/dist/components/close-button/close-button.d.ts

@@ -1,6 +1,6 @@
-import type { CloseButtonVariants } from "@arobo/styles";
 import type { ComponentPropsWithRef } from "react";
 import { Button as ButtonPrimitive } from "react-aria-components";
+import type { CloseButtonVariants } from "@arobo/styles";
 interface CloseButtonRootProps extends ComponentPropsWithRef<typeof ButtonPrimitive>, CloseButtonVariants {
 }
 declare const CloseButtonRoot: ({ children, className, slot, style, variant, ...rest }: CloseButtonRootProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/close-button/close-button.js

@@ -2,7 +2,7 @@ import { useMemo } from 'react';
 import { Button } from 'react-aria-components';
 import { CloseIcon } from '../icons.js';
 import { jsx } from 'react/jsx-runtime';
-import { closeButtonVariants } from '../../styles/src/components/close-button/close-button.styles.js';
+import { closeButtonVariants } from '../../packages/styles/src/components/close-button/close-button.styles.js';
 import { composeTwRenderProps } from '../../utils/compose.js';
 
 const CloseButtonRoot = ({

package/dist/components/close-button/index.d.ts

@@ -8,6 +8,4 @@ export type CloseButton = {
     RootProps: ComponentProps<typeof CloseButtonRoot>;
 };
 export { CloseButtonRoot };
-export type { CloseButtonRootProps, CloseButtonRootProps as CloseButtonProps, } from "./close-button";
-export { closeButtonVariants } from "@arobo/styles";
-export type { CloseButtonVariants } from "@arobo/styles";
+export type { CloseButtonRootProps, CloseButtonRootProps as CloseButtonProps } from "./close-button";

package/dist/components/close-button/index.js

@@ -1,5 +1,4 @@
 import { CloseButtonRoot } from './close-button.js';
-export { closeButtonVariants } from '../../styles/src/components/close-button/close-button.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/combobox/combobox.js

@@ -1,10 +1,10 @@
-import React, { createContext, useContext } from 'react';
+import React__default, { createContext, useContext } from 'react';
 import { ComboBox, Popover, ComboBoxStateContext, Button } from 'react-aria-components';
 import { dataAttr } from '../../utils/assertion.js';
 import { composeTwRenderProps, composeSlotClassName } from '../../utils/compose.js';
 import { IconChevronDown } from '../icons.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { comboboxVariants } from '../../styles/src/components/combobox/combobox.styles.js';
+import { comboboxVariants } from '../../packages/styles/src/components/combobox/combobox.styles.js';
 import { SurfaceContext } from '../surface/surface.js';
 
 const ComboBoxContext = /*#__PURE__*/createContext({});
@@ -20,7 +20,7 @@ const ComboBoxRoot = ({
   menuTrigger = "focus",
   ...props
 }) => {
-  const slots = React.useMemo(() => comboboxVariants({
+  const slots = React__default.useMemo(() => comboboxVariants({
     fullWidth
   }), [fullWidth]);
   return /*#__PURE__*/jsx(ComboBoxContext, {

package/dist/components/combobox/index.js

@@ -1,5 +1,5 @@
 import { ComboBoxRoot, ComboBoxPopover, ComboBoxTrigger, ComboBoxInputGroup } from './combobox.js';
-export { comboboxVariants } from '../../styles/src/components/combobox/combobox.styles.js';
+export { comboboxVariants } from '../../packages/styles/src/components/combobox/combobox.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/container/container.d.ts

@@ -0,0 +1,9 @@
+import React, { type ComponentPropsWithRef } from "react";
+import { type ContainerVariants } from "@arobo/styles";
+interface ContainerRootProps extends ContainerVariants, ComponentPropsWithRef<"div"> {
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const ContainerRoot: React.ForwardRefExoticComponent<Omit<ContainerRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { ContainerRoot };
+export type { ContainerRootProps };

package/dist/components/container/container.js

@@ -0,0 +1,23 @@
+import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { containerVariants } from '../../packages/styles/src/components/container/container.styles.js';
+
+const ContainerRoot = /*#__PURE__*/React__default.forwardRef(({
+  children,
+  className,
+  size,
+  ...props
+}, ref) => {
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    className: containerVariants({
+      className,
+      size
+    }),
+    ...props,
+    children: children
+  });
+});
+ContainerRoot.displayName = "Container";
+
+export { ContainerRoot };

package/dist/components/container/index.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentProps } from "react";
+import { ContainerRoot } from "./container";
+export declare const Container: import("react").ForwardRefExoticComponent<Omit<import("./container").ContainerRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<import("./container").ContainerRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+};
+export type Container = {
+    Props: ComponentProps<typeof ContainerRoot>;
+    RootProps: ComponentProps<typeof ContainerRoot>;
+};
+export { ContainerRoot } from "./container";
+export type { ContainerRootProps, ContainerRootProps as ContainerProps, } from "./container";
+export { containerVariants } from "@arobo/styles";
+export type { ContainerVariants } from "@arobo/styles";

package/dist/components/container/index.js

@@ -0,0 +1,11 @@
+import { ContainerRoot } from './container.js';
+export { containerVariants } from '../../packages/styles/src/components/container/container.styles.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Container = Object.assign(ContainerRoot, {
+  Root: ContainerRoot
+});
+
+export { Container, ContainerRoot };

package/dist/components/date-field/date-field.js

@@ -1,9 +1,9 @@
-import React from 'react';
+import React__default from 'react';
 import { DateField } from 'react-aria-components';
 import { dataAttr } from '../../utils/assertion.js';
 import { composeTwRenderProps } from '../../utils/compose.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { dateFieldVariants } from '../../styles/src/components/date-field/date-field.styles.js';
+import { dateFieldVariants } from '../../packages/styles/src/components/date-field/date-field.styles.js';
 
 function DateFieldRoot({
   children,
@@ -11,7 +11,7 @@ function DateFieldRoot({
   fullWidth,
   ...props
 }) {
-  const styles = React.useMemo(() => dateFieldVariants({
+  const styles = React__default.useMemo(() => dateFieldVariants({
     fullWidth
   }), [fullWidth]);
   return /*#__PURE__*/jsx(DateField, {

package/dist/components/date-field/index.js

@@ -1,5 +1,5 @@
 import { DateFieldRoot } from './date-field.js';
-export { dateFieldVariants } from '../../styles/src/components/date-field/date-field.styles.js';
+export { dateFieldVariants } from '../../packages/styles/src/components/date-field/date-field.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/date-input-group/date-input-group.js

@@ -1,8 +1,8 @@
-import React, { createContext, useContext } from 'react';
+import React__default, { createContext, useContext } from 'react';
 import { Group, DateSegment, DateInput } from 'react-aria-components';
 import { composeTwRenderProps, composeSlotClassName } from '../../utils/compose.js';
 import { jsx, Fragment } from 'react/jsx-runtime';
-import { dateInputGroupVariants } from '../../styles/src/components/date-input-group/date-input-group.styles.js';
+import { dateInputGroupVariants } from '../../packages/styles/src/components/date-input-group/date-input-group.styles.js';
 
 const DateInputGroupContext = /*#__PURE__*/createContext({});
 
@@ -16,7 +16,7 @@ const DateInputGroupRoot = ({
   fullWidth,
   ...props
 }) => {
-  const slots = React.useMemo(() => dateInputGroupVariants({
+  const slots = React__default.useMemo(() => dateInputGroupVariants({
     fullWidth
   }), [fullWidth]);
   return /*#__PURE__*/jsx(DateInputGroupContext, {

package/dist/components/date-input-group/index.js

@@ -1,5 +1,5 @@
 import { DateInputGroupRoot, DateInputGroupInputCompound, DateInputGroupSuffix, DateInputGroupPrefix, DateInputGroupSegment, DateInputGroupInput } from './date-input-group.js';
-export { dateInputGroupVariants } from '../../styles/src/components/date-input-group/date-input-group.styles.js';
+export { dateInputGroupVariants } from '../../packages/styles/src/components/date-input-group/date-input-group.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/date-picker/date-picker.js

@@ -1,5 +1,5 @@
 import { CalendarIcon } from 'lucide-react';
-import React from 'react';
+import React__default from 'react';
 import { DatePicker } from 'react-aria-components';
 import { Button } from '../button/index.js';
 import { Calendar } from '../calendar/index.js';
@@ -9,7 +9,7 @@ import { FieldError } from '../field-error/index.js';
 import { Label } from '../label/index.js';
 import { Popover } from '../popover/index.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { datePickerVariants } from '../../styles/src/components/date-picker/date-picker.styles.js';
+import { datePickerVariants } from '../../packages/styles/src/components/date-picker/date-picker.styles.js';
 import { composeTwRenderProps } from '../../utils/compose.js';
 
 function DatePickerRoot({
@@ -19,11 +19,11 @@ function DatePickerRoot({
   icon,
   ...props
 }) {
-  const slots = React.useMemo(() => datePickerVariants({}), []);
+  const slots = React__default.useMemo(() => datePickerVariants({}), []);
   const finalIcon = icon ?? /*#__PURE__*/jsx(CalendarIcon, {
     "aria-hidden": true
   });
-  const iconSegment = /*#__PURE__*/React.isValidElement(finalIcon) ? /*#__PURE__*/React.cloneElement(finalIcon, {
+  const iconSegment = /*#__PURE__*/React__default.isValidElement(finalIcon) ? /*#__PURE__*/React__default.cloneElement(finalIcon, {
     "data-slot": "icon",
     "aria-hidden": true
   }) : finalIcon;

package/dist/components/date-picker/index.d.ts

@@ -9,5 +9,3 @@ export type DatePicker = {
 };
 export { DatePickerRoot } from "./date-picker";
 export type { DatePickerRootProps, DatePickerRootProps as DatePickerProps, } from "./date-picker";
-export { datePickerVariants } from "@arobo/styles";
-export type { DatePickerVariants } from "@arobo/styles";

package/dist/components/date-picker/index.js

@@ -1,5 +1,4 @@
 import { DatePickerRoot } from './date-picker.js';
-export { datePickerVariants } from '../../styles/src/components/date-picker/date-picker.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/date-range-picker/date-range-picker.d.ts

@@ -1,5 +1,4 @@
 import type { DateRangePickerProps as DateRangePickerPrimitiveProps, DateValue, ValidationResult } from "react-aria-components";
-import React from "react";
 interface DateRangePickerRootProps<T extends DateValue> extends DateRangePickerPrimitiveProps<T> {
     label?: string;
     description?: string;

package/dist/components/date-range-picker/date-range-picker.js

@@ -7,9 +7,9 @@ import { FieldError } from '../field-error/index.js';
 import { Label } from '../label/index.js';
 import { Popover } from '../popover/index.js';
 import { RangeCalendar } from '../range-calendar/index.js';
-import React from 'react';
+import { useMemo, cloneElement, isValidElement } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { dateRangePickerVariants } from '../../styles/src/components/date-range-picker/date-range-picker.styles.js';
+import { dateRangePickerVariants } from '../../packages/styles/src/components/date-range-picker/date-range-picker.styles.js';
 import { composeTwRenderProps } from '../../utils/compose.js';
 
 const DateRangePickerRoot = ({
@@ -19,11 +19,11 @@ const DateRangePickerRoot = ({
   icon,
   ...props
 }) => {
-  const slots = React.useMemo(() => dateRangePickerVariants({}), []);
+  const slots = useMemo(() => dateRangePickerVariants({}), []);
   const finalIcon = icon ?? /*#__PURE__*/jsx(CalendarIcon, {
     "aria-hidden": true
   });
-  const iconSegment = /*#__PURE__*/React.isValidElement(finalIcon) ? /*#__PURE__*/React.cloneElement(finalIcon, {
+  const iconSegment = /*#__PURE__*/isValidElement(finalIcon) ? /*#__PURE__*/cloneElement(finalIcon, {
     "data-slot": "icon",
     "aria-hidden": true
   }) : finalIcon;

package/dist/components/date-range-picker/index.js

@@ -1,5 +1,5 @@
 import { DateRangePickerRoot } from './date-range-picker.js';
-export { dateRangePickerVariants } from '../../styles/src/components/date-range-picker/date-range-picker.styles.js';
+export { dateRangePickerVariants } from '../../packages/styles/src/components/date-range-picker/date-range-picker.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/description/description.js

@@ -1,6 +1,6 @@
 import { Text } from 'react-aria-components';
 import { jsx } from 'react/jsx-runtime';
-import { descriptionVariants } from '../../styles/src/components/description/description.styles.js';
+import { descriptionVariants } from '../../packages/styles/src/components/description/description.styles.js';
 
 const DescriptionRoot = ({
   children,

package/dist/components/description/index.d.ts

@@ -8,6 +8,4 @@ export type Description = {
     RootProps: ComponentProps<typeof DescriptionRoot>;
 };
 export { DescriptionRoot };
-export type { DescriptionRootProps, DescriptionRootProps as DescriptionProps, } from "./description";
-export { descriptionVariants } from "@arobo/styles";
-export type { DescriptionVariants } from "@arobo/styles";
+export type { DescriptionRootProps, DescriptionRootProps as DescriptionProps } from "./description";

package/dist/components/description/index.js

@@ -1,5 +1,4 @@
 import { DescriptionRoot } from './description.js';
-export { descriptionVariants } from '../../styles/src/components/description/description.styles.js';
 
 /* -------------------------------------------------------------------------------------------------
  * Compound Component

package/dist/components/drawer/drawer.d.ts

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { Drawer as DrawerPrimitive } from "vaul";
+export type DrawerProps = React.ComponentProps<typeof DrawerPrimitive.Root>;
+declare function Drawer({ ...props }: DrawerProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerTriggerProps = React.ComponentProps<typeof DrawerPrimitive.Trigger>;
+declare function DrawerTrigger({ ...props }: DrawerTriggerProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerPortalProps = React.ComponentProps<typeof DrawerPrimitive.Portal>;
+declare function DrawerPortal({ ...props }: DrawerPortalProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerCloseProps = React.ComponentProps<typeof DrawerPrimitive.Close>;
+declare function DrawerClose({ ...props }: DrawerCloseProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerOverlayProps = React.ComponentProps<typeof DrawerPrimitive.Overlay>;
+declare function DrawerOverlay({ className, ...props }: DrawerOverlayProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerContentProps = React.ComponentProps<typeof DrawerPrimitive.Content>;
+declare function DrawerContent({ className, children, ...props }: DrawerContentProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerHeaderProps = React.ComponentProps<"div">;
+declare function DrawerHeader({ className, ...props }: DrawerHeaderProps): import("react/jsx-runtime").JSX.Element;
+export type DrawerFooterProps = React.ComponentProps<"div">;
+declare function DrawerFooter({ className, ...props }: DrawerFooterProps): import("react/jsx-runtime").JSX.Element;
+declare function DrawerTitle({ className, ...props }: React.ComponentProps<typeof DrawerPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
+export type DrawerDescriptionProps = React.ComponentProps<typeof DrawerPrimitive.Description>;
+declare function DrawerDescription({ className, ...props }: DrawerDescriptionProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: typeof Drawer & {
+    Trigger: typeof DrawerTrigger;
+    Portal: typeof DrawerPortal;
+    Close: typeof DrawerClose;
+    Overlay: typeof DrawerOverlay;
+    Content: typeof DrawerContent;
+    Header: typeof DrawerHeader;
+    Footer: typeof DrawerFooter;
+    Title: typeof DrawerTitle;
+    Description: typeof DrawerDescription;
+};
+export default _default;

package/dist/components/drawer/index.d.ts

@@ -0,0 +1 @@
+export * from "./drawer";

package/dist/components/drawer/index.js

@@ -0,0 +1 @@
+

package/dist/components/dropdown/dropdown.d.ts

@@ -0,0 +1,38 @@
+import type { ComponentPropsWithRef } from "react";
+import React from "react";
+import { Button, Menu as MenuPrimitive, MenuTrigger as MenuTriggerPrimitive, Popover as PopoverPrimitive, SubmenuTrigger as SubmenuTriggerPrimitive } from "react-aria-components";
+import { MenuItemIndicator, MenuItemRoot, MenuItemSubmenuIndicator } from "../menu-item";
+import { MenuSectionRoot } from "../menu-section";
+import type { DropdownVariants } from "@arobo/styles";
+interface DropdownRootProps extends ComponentPropsWithRef<typeof MenuTriggerPrimitive>, DropdownVariants {
+    className?: string;
+}
+declare const DropdownRoot: ({ children, ...props }: DropdownRootProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownTriggerProps extends ComponentPropsWithRef<typeof Button> {
+}
+declare const DropdownTrigger: ({ children, className, ...props }: DropdownTriggerProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownPopoverProps extends Omit<ComponentPropsWithRef<typeof PopoverPrimitive>, "children">, DropdownVariants {
+    children: React.ReactNode;
+}
+declare const DropdownPopover: ({ children, className, placement, ...props }: DropdownPopoverProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownMenuProps<T extends object> extends ComponentPropsWithRef<typeof MenuPrimitive<T>>, DropdownVariants {
+    className?: string;
+}
+declare function DropdownMenu<T extends object>({ className, ...props }: DropdownMenuProps<T>): import("react/jsx-runtime").JSX.Element;
+interface DropdownItemProps extends ComponentPropsWithRef<typeof MenuItemRoot> {
+}
+declare const DropdownItem: (props: DropdownItemProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownSubmenuIndicatorProps extends ComponentPropsWithRef<typeof MenuItemSubmenuIndicator> {
+}
+declare const DropdownSubmenuIndicator: (props: DropdownSubmenuIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownSubmenuTriggerProps extends ComponentPropsWithRef<typeof SubmenuTriggerPrimitive> {
+}
+declare const DropdownSubmenuTrigger: ({ children, ...props }: DropdownSubmenuTriggerProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownItemIndicatorProps extends ComponentPropsWithRef<typeof MenuItemIndicator> {
+}
+declare const DropdownItemIndicator: (props: DropdownItemIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+interface DropdownSectionProps extends ComponentPropsWithRef<typeof MenuSectionRoot> {
+}
+declare const DropdownSection: (props: DropdownSectionProps) => import("react/jsx-runtime").JSX.Element;
+export { DropdownItem, DropdownItemIndicator, DropdownMenu, DropdownPopover, DropdownRoot, DropdownSection, DropdownSubmenuIndicator, DropdownSubmenuTrigger, DropdownTrigger, };
+export type { DropdownItemIndicatorProps, DropdownItemProps, DropdownMenuProps, DropdownPopoverProps, DropdownRootProps, DropdownSectionProps, DropdownSubmenuIndicatorProps, DropdownSubmenuTriggerProps, DropdownTriggerProps, };

package/dist/components/dropdown/dropdown.js

@@ -0,0 +1,155 @@
+import React__default, { createContext, useContext } from 'react';
+import { MenuTrigger, SubmenuTrigger, Menu, Popover, Button } from 'react-aria-components';
+import { composeTwRenderProps } from '../../utils/compose.js';
+import '../menu-item/index.js';
+import { MenuSectionRoot } from '../menu-section/menu-section.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { dropdownVariants } from '../../packages/styles/src/components/dropdown/dropdown.styles.js';
+import { MenuItemSubmenuIndicator, MenuItemIndicator, MenuItemRoot } from '../menu-item/menu-item.js';
+import { SurfaceContext } from '../surface/surface.js';
+
+const DropdownContext = /*#__PURE__*/createContext({});
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Root (MenuTrigger wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownRoot = ({
+  children,
+  ...props
+}) => {
+  const slots = React__default.useMemo(() => dropdownVariants(), []);
+  return /*#__PURE__*/jsx(DropdownContext, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx(MenuTrigger, {
+      ...props,
+      children: children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Trigger (Button wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownTrigger = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(DropdownContext);
+  return /*#__PURE__*/jsx(Button, {
+    className: composeTwRenderProps(className, slots?.trigger()),
+    "data-slot": "dropdown-trigger",
+    ...props,
+    children: values => /*#__PURE__*/jsx(Fragment, {
+      children: typeof children === "function" ? children(values) : children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Popover (Popover wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownPopover = ({
+  children,
+  className,
+  placement,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(DropdownContext);
+  return /*#__PURE__*/jsx(SurfaceContext, {
+    value: {
+      variant: "default"
+    },
+    children: /*#__PURE__*/jsx(Popover, {
+      ...props,
+      className: composeTwRenderProps(className, slots?.popover()),
+      placement: placement,
+      children: children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Menu (Menu wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+function DropdownMenu({
+  className,
+  ...props
+}) {
+  const {
+    slots
+  } = useContext(DropdownContext);
+  return /*#__PURE__*/jsx(Menu, {
+    className: composeTwRenderProps(className, slots?.menu()),
+    "data-selection-mode": props.selectionMode,
+    "data-slot": "dropdown-menu",
+    ...props
+  });
+}
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Item (MenuItem wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownItem = props => {
+  return /*#__PURE__*/jsx(MenuItemRoot, {
+    ...props
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Submenu Indicator (MenuItemSubmenuIndicator wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownSubmenuIndicator = props => {
+  return /*#__PURE__*/jsx(MenuItemSubmenuIndicator, {
+    ...props
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Submenu Trigger
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownSubmenuTrigger = ({
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/jsx(SubmenuTrigger, {
+    "data-slot": "dropdown-submenu-trigger",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Item Indicator (MenuItemIndicator wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownItemIndicator = props => {
+  return /*#__PURE__*/jsx(MenuItemIndicator, {
+    ...props
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Dropdown Section (MenuSection wrapper)
+ * -----------------------------------------------------------------------------------------------*/
+
+const DropdownSection = props => {
+  return /*#__PURE__*/jsx(MenuSectionRoot, {
+    ...props
+  });
+};
+
+export { DropdownItem, DropdownItemIndicator, DropdownMenu, DropdownPopover, DropdownRoot, DropdownSection, DropdownSubmenuIndicator, DropdownSubmenuTrigger, DropdownTrigger };

package/dist/components/dropdown/index.d.ts

@@ -0,0 +1,41 @@
+import type { ComponentProps, Key } from "react";
+import { DropdownItem, DropdownItemIndicator, DropdownMenu, DropdownPopover, DropdownRoot, DropdownSection, DropdownSubmenuIndicator, DropdownSubmenuTrigger, DropdownTrigger } from "./dropdown";
+export declare const Dropdown: (({ children, ...props }: import("./dropdown").DropdownRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Root: ({ children, ...props }: import("./dropdown").DropdownRootProps) => import("react/jsx-runtime").JSX.Element;
+    Trigger: ({ children, className, ...props }: import("./dropdown").DropdownTriggerProps) => import("react/jsx-runtime").JSX.Element;
+    Popover: ({ children, className, placement, ...props }: import("./dropdown").DropdownPopoverProps) => import("react/jsx-runtime").JSX.Element;
+    Menu: typeof DropdownMenu;
+    Section: (props: import("./dropdown").DropdownSectionProps) => import("react/jsx-runtime").JSX.Element;
+    Item: (props: import("./dropdown").DropdownItemProps) => import("react/jsx-runtime").JSX.Element;
+    ItemIndicator: (props: import("./dropdown").DropdownItemIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+    SubmenuIndicator: (props: import("./dropdown").DropdownSubmenuIndicatorProps) => import("react/jsx-runtime").JSX.Element;
+    SubmenuTrigger: ({ children, ...props }: import("./dropdown").DropdownSubmenuTriggerProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type Dropdown<T extends object = object> = {
+    Props: ComponentProps<typeof DropdownRoot>;
+    RootProps: ComponentProps<typeof DropdownRoot>;
+    TriggerProps: ComponentProps<typeof DropdownTrigger>;
+    PopoverProps: ComponentProps<typeof DropdownPopover>;
+    MenuProps: ComponentProps<typeof DropdownMenu<T>>;
+    SectionProps: ComponentProps<typeof DropdownSection>;
+    ItemProps: ComponentProps<typeof DropdownItem>;
+    ItemIndicatorProps: ComponentProps<typeof DropdownItemIndicator>;
+    SubmenuIndicatorProps: ComponentProps<typeof DropdownSubmenuIndicator>;
+    SubmenuTriggerProps: ComponentProps<typeof DropdownSubmenuTrigger>;
+};
+export interface MultipleSelection {
+    /** The type of selection that is allowed in the collection. */
+    selectionMode?: SelectionMode;
+    /** Whether the collection allows empty selection. */
+    disallowEmptySelection?: boolean;
+    /** The currently selected keys in the collection (controlled). */
+    selectedKeys?: 'all' | Iterable<Key>;
+    /** The initial selected keys in the collection (uncontrolled). */
+    defaultSelectedKeys?: 'all' | Iterable<Key>;
+    /** Handler that is called when the selection changes. */
+    onSelectionChange?: (keys: Selection) => void;
+    /** The currently disabled keys in the collection (controlled). */
+    disabledKeys?: Iterable<Key>;
+}
+export { DropdownItem, DropdownItemIndicator, DropdownMenu, DropdownPopover, DropdownRoot, DropdownSection, DropdownSubmenuIndicator, DropdownSubmenuTrigger, DropdownTrigger, };
+export type { DropdownItemIndicatorProps, DropdownItemProps, DropdownMenuProps, DropdownPopoverProps, DropdownRootProps, DropdownRootProps as DropdownProps, DropdownSectionProps, DropdownSubmenuIndicatorProps, DropdownSubmenuTriggerProps, DropdownTriggerProps, } from "./dropdown";

package/dist/components/dropdown/index.js

@@ -0,0 +1,18 @@
+import { DropdownRoot, DropdownSubmenuTrigger, DropdownSubmenuIndicator, DropdownItemIndicator, DropdownItem, DropdownSection, DropdownMenu, DropdownPopover, DropdownTrigger } from './dropdown.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Dropdown = Object.assign(DropdownRoot, {
+  Root: DropdownRoot,
+  Trigger: DropdownTrigger,
+  Popover: DropdownPopover,
+  Menu: DropdownMenu,
+  Section: DropdownSection,
+  Item: DropdownItem,
+  ItemIndicator: DropdownItemIndicator,
+  SubmenuIndicator: DropdownSubmenuIndicator,
+  SubmenuTrigger: DropdownSubmenuTrigger
+});
+
+export { Dropdown, DropdownItem, DropdownItemIndicator, DropdownMenu, DropdownPopover, DropdownRoot, DropdownSection, DropdownSubmenuIndicator, DropdownSubmenuTrigger, DropdownTrigger };