@askrjs/ui/menu

Menutype

Menu: (props: MenuProps) => JSX.Element

Renders a part of `menu`.

MENU_A11Y_CONTRACTtype

MENU_A11Y_CONTRACT: { readonly CONTENT_ROLE: "menu"; readonly ITEM_ROLE: "menuitem"; readonly ORIENTATION_ATTRIBUTE: "aria-orientation"; readonly DATA_ATTRIBUTES: { readonly slot: "data-slot"; readonly disabled: "data-disabled"; readonly orientation: "data-orientation"; }; }

Menu accessibility contract.

MenuA11yContracttype

MenuA11yContract: typeof MENU_A11Y_CONTRACT

Type of the Menu A11y Contract object.

MenuContenttype

MenuContent: { (props: MenuContentProps): JSX.Element; (props: MenuContentAsChildProps): JSX.Element; }

Renders the `menu-content` part of `menu` with `role="menu"`. Supports polymorphic rendering via `asChild`.

MenuContentAsChildPropstype

MenuContentAsChildProps: BoxAsChildProps

Props for the `asChild` (polymorphic) rendering of Menu Content.

asChild

asChild: true;

children

children: JSXElement;

ref

ref?: Ref<Element>;

MenuContentPropstype

MenuContentProps: BoxProps<'div', HTMLDivElement>

Props for Menu Content.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLDivElement>;

MenuGrouptype

MenuGroup: { (props: MenuGroupProps): JSX.Element; (props: MenuGroupAsChildProps): JSX.Element; }

Renders the `menu-group` part of `menu` with `role="group"`. Supports polymorphic rendering via `asChild`.

MenuGroupAsChildPropstype

MenuGroupAsChildProps: BoxAsChildProps

Props for the `asChild` (polymorphic) rendering of Menu Group.

asChild

asChild: true;

children

children: JSXElement;

ref

ref?: Ref<Element>;

MenuGroupPropstype

MenuGroupProps: BoxProps<'div', HTMLDivElement>

Props for Menu Group.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLDivElement>;

MenuItemtype

MenuItem: { (props: MenuItemProps): JSX.Element | null; (props: MenuItemAsChildProps): JSX.Element | null; }

Renders the `menu-item` part of `menu` with `role="menuitem"`. Supports polymorphic rendering via `asChild`.

MenuItemAsChildPropstype

MenuItemAsChildProps: Omit<ButtonLikeAsChildProps, 'onPress'> & MenuItemOwnProps

Props for the `asChild` (polymorphic) rendering of Menu Item.

asChild

asChild: true;

children

children: JSXElement;

disabled

disabled?: boolean | undefined;

onSelect

onSelect?: ((event: PressEvent) => void) | undefined;

ref

ref?: Ref<Element>;

textValue

Text used for typeahead when rendered children are not plain text.

type

type?: undefined;

MenuItemDescriptiontype

MenuItemDescription: { (props: MenuItemPartProps): JSX.Element; (props: MenuItemPartAsChildProps): JSX.Element; }

Optional supporting description for a structured Menu Item.

MenuItemIcontype

MenuItemIcon: { (props: MenuItemPartProps): JSX.Element; (props: MenuItemPartAsChildProps): JSX.Element; }

Optional leading visual for a Menu Item.

MenuItemLabeltype

MenuItemLabel: { (props: MenuItemPartProps): JSX.Element; (props: MenuItemPartAsChildProps): JSX.Element; }

Primary visible label for a structured Menu Item.

MenuItemOwnPropstype

MenuItemOwnProps: {
  children?: unknown;
  disabled?: boolean;
  onSelect?: (event: PressEvent) => void;
  /** Text used for typeahead when rendered children are not plain text. */
  textValue?: string;
}

Own props for Menu Item, before merging with native element attributes.

children

children?: unknown;

disabled

disabled?: boolean | undefined;

onSelect

onSelect?: ((event: PressEvent) => void) | undefined;

textValue

Text used for typeahead when rendered children are not plain text.

MenuItemPartAsChildPropstype

MenuItemPartAsChildProps: BoxAsChildProps

Props for a polymorphic presentational part within a Menu Item.

asChild

asChild: true;

children

children: JSXElement;

ref

ref?: Ref<Element>;

MenuItemPartPropstype

MenuItemPartProps: BoxProps<'span', HTMLSpanElement>

Props for a presentational part within a Menu Item.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLSpanElement>;

MenuItemPropstype

MenuItemProps: Omit<ButtonLikeProps<'button', HTMLButtonElement>, 'onPress'> & MenuItemOwnProps

Props for Menu Item.

asChild

asChild?: false | undefined;

children

children?: unknown;

disabled

disabled?: boolean | undefined;

onSelect

onSelect?: ((event: PressEvent) => void) | undefined;

ref

ref?: Ref<HTMLButtonElement>;

textValue

Text used for typeahead when rendered children are not plain text.

type

type?: "button" | "submit" | "reset" | undefined;

MenuLabeltype

MenuLabel: { (props: MenuLabelProps): JSX.Element | null; (props: MenuLabelAsChildProps): JSX.Element | null; }

Renders the `menu-label` part of `menu`. Supports polymorphic rendering via `asChild`.

MenuLabelAsChildPropstype

MenuLabelAsChildProps: BoxAsChildProps

Props for the `asChild` (polymorphic) rendering of Menu Label.

asChild

asChild: true;

children

children: JSXElement;

ref

ref?: Ref<Element>;

MenuLabelPropstype

MenuLabelProps: BoxProps<'div', HTMLDivElement>

Props for Menu Label.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLDivElement>;

MenuOwnPropstype

MenuOwnProps: {
  /** Supports literal, nested, array-mapped, and `For`-rendered descendants. */
  children?: unknown;
  id?: string;
  orientation?: Orientation;
  loop?: boolean;
}

Own props for Menu, before merging with native element attributes.

children

Supports literal, nested, array-mapped, and `For`-rendered descendants.

id

id?: string | undefined;

loop

loop?: boolean | undefined;

orientation

orientation?: Orientation | undefined;

MenuPropstype

MenuProps: MenuOwnProps

Props for Menu.

children

Supports literal, nested, array-mapped, and `For`-rendered descendants.

id

id?: string | undefined;

loop

loop?: boolean | undefined;

orientation

orientation?: Orientation | undefined;

MenuSeparatortype

MenuSeparator: { (props: MenuSeparatorProps): JSX.Element | null; (props: MenuSeparatorAsChildProps): JSX.Element | null; }

Renders the `menu-separator` part of `menu` with `role="separator"`. Supports polymorphic rendering via `asChild`.

MenuSeparatorAsChildPropstype

MenuSeparatorAsChildProps: BoxAsChildProps

Props for the `asChild` (polymorphic) rendering of Menu Separator.

asChild

asChild: true;

children

children: JSXElement;

ref

ref?: Ref<Element>;

MenuSeparatorPropstype

MenuSeparatorProps: BoxProps<'div', HTMLDivElement>

Props for Menu Separator.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLDivElement>;