UNPKG

@react-md/menu

Version:

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

75 lines 2.52 kB
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 __read = (this && this.__read) || function (o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; }; import { jsx as _jsx } from "react/jsx-runtime"; import { createContext, useContext, useEffect, useMemo, useState } from "react"; import { noop } from "./utils"; var context = createContext({ root: false, menubar: false, menuitem: false, activeId: "", setActiveId: noop, animatedOnce: false, setAnimatedOnce: noop, }); context.displayName = "MenuBar"; var Provider = context.Provider; /** * @internal * @remarks \@since 5.0.0 */ export function useMenuBarContext() { return useContext(context); } /** * @internal * @remarks \@since 5.0.0 */ export function MenuBarProvider(_a) { var children = _a.children, _b = _a.root, root = _b === void 0 ? true : _b, _c = _a.defaultActiveId, defaultActiveId = _c === void 0 ? "" : _c, hoverTimeout = _a.hoverTimeout; var menubar = useMenuBarContext().menubar; var _d = __read(useState(defaultActiveId), 2), activeId = _d[0], setActiveId = _d[1]; var _e = __read(useState(!!defaultActiveId), 2), animatedOnce = _e[0], setAnimatedOnce = _e[1]; var value = useMemo(function () { return ({ root: root, menubar: root || menubar, menuitem: true, activeId: activeId, setActiveId: setActiveId, hoverTimeout: hoverTimeout, animatedOnce: animatedOnce, setAnimatedOnce: setAnimatedOnce, }); }, [activeId, animatedOnce, hoverTimeout, menubar, root]); useEffect(function () { if (!activeId) { setAnimatedOnce(false); } }, [activeId]); return _jsx(Provider, __assign({ value: value }, { children: children })); } //# sourceMappingURL=MenuBarProvider.js.map