@react-md/menu
Version:
Create menus that auto-position themselves within the viewport and adhere to the accessibility guidelines
93 lines • 3.99 kB
JavaScript
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;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { createContext, useContext, useMemo } from "react";
/** @remarks \@since 5.0.0 */
export var DEFAULT_MENU_CONFIGURATION = {
horizontal: false,
renderAsSheet: false,
sheetHeader: null,
sheetFooter: null,
sheetPosition: "bottom",
sheetVerticalSize: "touch",
};
/**
* @internal
* @remarks \@since 5.0.0
*/
var context = createContext(DEFAULT_MENU_CONFIGURATION);
context.displayName = "MenuConfiguration";
/**
* @internal
* @remarks \@since 5.0.0
*/
var Provider = context.Provider;
/**
* This is probably just an internal only hook that allows you to get the
* {@link MenuConfigurationContext} with optional overrides.
*
* @param overrides - An object of {@link MenuConfiguration} that would override
* the inherited context values if they are not `undefined`.
* @returns the {@link MenuConfigurationContext} with any overrides that were
* provided.
* @remarks \@since 5.0.0
*/
export function useMenuConfiguration(_a) {
var _b = _a === void 0 ? {} : _a, horizontal = _b.horizontal, renderAsSheet = _b.renderAsSheet, sheetHeader = _b.sheetHeader, sheetFooter = _b.sheetFooter, sheetPosition = _b.sheetPosition, sheetVerticalSize = _b.sheetVerticalSize;
var inherited = useContext(context);
return {
horizontal: horizontal !== null && horizontal !== void 0 ? horizontal : inherited.horizontal,
renderAsSheet: renderAsSheet !== null && renderAsSheet !== void 0 ? renderAsSheet : inherited.renderAsSheet,
sheetHeader: sheetHeader === null ? null : sheetHeader !== null && sheetHeader !== void 0 ? sheetHeader : inherited.sheetHeader,
sheetFooter: sheetFooter === null ? null : sheetFooter !== null && sheetFooter !== void 0 ? sheetFooter : inherited.sheetFooter,
sheetPosition: sheetPosition !== null && sheetPosition !== void 0 ? sheetPosition : inherited.sheetPosition,
sheetVerticalSize: sheetVerticalSize !== null && sheetVerticalSize !== void 0 ? sheetVerticalSize : inherited.sheetVerticalSize,
};
}
/**
* Note: This will always merge values with any parent
* `MenuConfigurationProvider`s.
*
* @remarks \@since 5.0.0
*/
export function MenuConfigurationProvider(_a) {
var children = _a.children, configuration = __rest(_a, ["children"]);
var _b = useMenuConfiguration(configuration), horizontal = _b.horizontal, renderAsSheet = _b.renderAsSheet, sheetHeader = _b.sheetHeader, sheetFooter = _b.sheetFooter, sheetPosition = _b.sheetPosition, sheetVerticalSize = _b.sheetVerticalSize;
var value = useMemo(function () { return ({
horizontal: horizontal,
renderAsSheet: renderAsSheet,
sheetHeader: sheetHeader,
sheetFooter: sheetFooter,
sheetPosition: sheetPosition,
sheetVerticalSize: sheetVerticalSize,
}); }, [
horizontal,
renderAsSheet,
sheetFooter,
sheetHeader,
sheetPosition,
sheetVerticalSize,
]);
return _jsx(Provider, __assign({ value: value }, { children: children }));
}
//# sourceMappingURL=MenuConfigurationProvider.js.map