UNPKG

@wordpress/components

Version:
8 lines (7 loc) 8.48 kB
{ "version": 3, "sources": ["../../src/menu/index.tsx"], "sourcesContent": ["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, useMemo } from '@wordpress/element';\nimport { isRTL as isRTLFn } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnectWithoutRef } from '../context';\nimport { Context } from './context';\nimport { Item } from './item';\nimport { CheckboxItem } from './checkbox-item';\nimport { RadioItem } from './radio-item';\nimport { Group } from './group';\nimport { GroupLabel } from './group-label';\nimport { Separator } from './separator';\nimport { ItemLabel } from './item-label';\nimport { ItemHelpText } from './item-help-text';\nimport { TriggerButton } from './trigger-button';\nimport { SubmenuTriggerItem } from './submenu-trigger-item';\nimport { Popover } from './popover';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnconnectedMenu = props => {\n const {\n children,\n defaultOpen = false,\n open,\n onOpenChange,\n placement,\n // From internal components context\n variant\n } = useContextSystem(props, 'Menu');\n const parentContext = useContext(Context);\n const rtl = isRTLFn();\n\n // If an explicit value for the `placement` prop is not passed,\n // apply a default placement of `bottom-start` for the root menu popover,\n // and of `right-start` for nested menu popovers.\n let computedPlacement = placement ?? (parentContext?.store ? 'right-start' : 'bottom-start');\n // Swap left/right in case of RTL direction\n if (rtl) {\n if (/right/.test(computedPlacement)) {\n computedPlacement = computedPlacement.replace('right', 'left');\n } else if (/left/.test(computedPlacement)) {\n computedPlacement = computedPlacement.replace('left', 'right');\n }\n }\n const menuStore = Ariakit.useMenuStore({\n parent: parentContext?.store,\n open,\n defaultOpen,\n placement: computedPlacement,\n focusLoop: true,\n setOpen(willBeOpen) {\n onOpenChange?.(willBeOpen);\n },\n rtl\n });\n const contextValue = useMemo(() => ({\n store: menuStore,\n variant\n }), [menuStore, variant]);\n return /*#__PURE__*/_jsx(Context.Provider, {\n value: contextValue,\n children: children\n });\n};\n\n/**\n * Menu is a collection of React components that combine to render\n * ARIA-compliant [menu](https://www.w3.org/WAI/ARIA/apg/patterns/menu/) and\n * [menu button](https://www.w3.org/WAI/ARIA/apg/patterns/menubutton/) patterns.\n *\n * `Menu` itself is a wrapper component and context provider.\n * It is responsible for managing the state of the menu and its items, and for\n * rendering the `Menu.TriggerButton` (or the `Menu.SubmenuTriggerItem`)\n * component, and the `Menu.Popover` component.\n */\nexport const Menu = Object.assign(contextConnectWithoutRef(UnconnectedMenu, 'Menu'), {\n Context: Object.assign(Context, {\n displayName: 'Menu.Context'\n }),\n /**\n * Renders a menu item inside the `Menu.Popover` or `Menu.Group` components.\n *\n * It can optionally contain one instance of the `Menu.ItemLabel` component\n * and one instance of the `Menu.ItemHelpText` component.\n */\n Item: Object.assign(Item, {\n displayName: 'Menu.Item'\n }),\n /**\n * Renders a radio menu item inside the `Menu.Popover` or `Menu.Group`\n * components.\n *\n * It can optionally contain one instance of the `Menu.ItemLabel` component\n * and one instance of the `Menu.ItemHelpText` component.\n */\n RadioItem: Object.assign(RadioItem, {\n displayName: 'Menu.RadioItem'\n }),\n /**\n * Renders a checkbox menu item inside the `Menu.Popover` or `Menu.Group`\n * components.\n *\n * It can optionally contain one instance of the `Menu.ItemLabel` component\n * and one instance of the `Menu.ItemHelpText` component.\n */\n CheckboxItem: Object.assign(CheckboxItem, {\n displayName: 'Menu.CheckboxItem'\n }),\n /**\n * Renders a group for menu items.\n *\n * It should contain one instance of `Menu.GroupLabel` and one or more\n * instances of `Menu.Item`, `Menu.RadioItem`, or `Menu.CheckboxItem`.\n */\n Group: Object.assign(Group, {\n displayName: 'Menu.Group'\n }),\n /**\n * Renders a label in a menu group.\n *\n * This component should be wrapped with `Menu.Group` so the\n * `aria-labelledby` is correctly set on the group element.\n */\n GroupLabel: Object.assign(GroupLabel, {\n displayName: 'Menu.GroupLabel'\n }),\n /**\n * Renders a divider between menu items or menu groups.\n */\n Separator: Object.assign(Separator, {\n displayName: 'Menu.Separator'\n }),\n /**\n * Renders a menu item's label text. It should be wrapped with `Menu.Item`,\n * `Menu.RadioItem`, or `Menu.CheckboxItem`.\n */\n ItemLabel: Object.assign(ItemLabel, {\n displayName: 'Menu.ItemLabel'\n }),\n /**\n * Renders a menu item's help text. It should be wrapped with `Menu.Item`,\n * `Menu.RadioItem`, or `Menu.CheckboxItem`.\n */\n ItemHelpText: Object.assign(ItemHelpText, {\n displayName: 'Menu.ItemHelpText'\n }),\n /**\n * Renders a dropdown menu element that's controlled by a sibling\n * `Menu.TriggerButton` component. It renders a popover and automatically\n * focuses on items when the menu is shown.\n *\n * The only valid children of `Menu.Popover` are `Menu.Item`,\n * `Menu.RadioItem`, `Menu.CheckboxItem`, `Menu.Group`, `Menu.Separator`,\n * and `Menu` (for nested dropdown menus).\n */\n Popover: Object.assign(Popover, {\n displayName: 'Menu.Popover'\n }),\n /**\n * Renders a menu button that toggles the visibility of a sibling\n * `Menu.Popover` component when clicked or when using arrow keys.\n */\n TriggerButton: Object.assign(TriggerButton, {\n displayName: 'Menu.TriggerButton'\n }),\n /**\n * Renders a menu item that toggles the visibility of a sibling\n * `Menu.Popover` component when clicked or when using arrow keys.\n *\n * This component is used to create a nested dropdown menu.\n */\n SubmenuTriggerItem: Object.assign(SubmenuTriggerItem, {\n displayName: 'Menu.SubmenuTriggerItem'\n })\n});\nexport default Menu;"], "mappings": "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", "names": [] }