@react-md/menu/lib/MenuBar.js

Create menus that auto-position themselves within the viewport and adhere to the accessibility guidelines

"use strict";
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.MenuBar = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
var utils_1 = require("@react-md/utils");
var MenuBarProvider_1 = require("./MenuBarProvider");
var MenuBarWidget_1 = require("./MenuBarWidget");
/**
 * The `MenuBar` component is used to link child `DropdownGroup`s' visibility
 * together and following the specs for a
 * [menubar](https://www.w3.org/TR/wai-aria-practices/#menu).
 *
 * @example
 * Simple Example
 * ```tsx
 * import type { ReactElement } from "react";
 * import { MenuBar, DropdownMenu, MenuItem } from "@react-md/menu";
 *
 * function Example(): ReactElement {
 *   return (
 *     <MenuBar aria-label="Example">
 *       <DropdownMenu id="menubar-item-1" buttonChildren="Item 1">
 *         <MenuItem>Sub-item 1</MenuItem>
 *         <MenuItem>Sub-item 2</MenuItem>
 *       </DropdownMenu>
 *       <DropdownMenu id="menubar-item-2" buttonChildren="Item 2">
 *         <MenuItem>Sub-item 1</MenuItem>
 *         <MenuItem>Sub-item 2</MenuItem>
 *       </DropdownMenu>
 *     </MenuBar>
 *   );
 * }
 * ```
 *
 * @remarks \@since 5.0.0
 */
function MenuBar(_a) {
    var hoverTimeout = _a.hoverTimeout, props = __rest(_a, ["hoverTimeout"]);
    return ((0, jsx_runtime_1.jsx)(MenuBarProvider_1.MenuBarProvider, __assign({ hoverTimeout: hoverTimeout }, { children: (0, jsx_runtime_1.jsx)(utils_1.KeyboardMovementProvider, __assign({ loopable: true, searchable: true, incrementKeys: ["ArrowRight"], decrementKeys: ["ArrowLeft"] }, { children: (0, jsx_runtime_1.jsx)(MenuBarWidget_1.MenuBarWidget, __assign({}, props)) })) })));
}
exports.MenuBar = MenuBar;
//# sourceMappingURL=MenuBar.js.map