@lskjs/navbar
Version:
LSK ux subrepo: navbar
168 lines (132 loc) • 6.69 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classnames = _interopRequireDefault(require("classnames"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _all = _interopRequireDefault(require("prop-types-extra/lib/all"));
var _react = _interopRequireWildcard(require("react"));
var _uncontrollable = require("uncontrollable");
var _ThemeProvider = require("./ThemeProvider");
var _NavbarContext = _interopRequireDefault(require("./NavbarContext"));
var _CardContext = _interopRequireDefault(require("./CardContext"));
var _AbstractNav = _interopRequireDefault(require("./AbstractNav"));
var _NavItem = _interopRequireDefault(require("./NavItem"));
var _NavLink = _interopRequireDefault(require("./NavLink"));
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var propTypes = {
/**
* @default 'nav'
*/
bsPrefix: _propTypes["default"].string,
/** @private */
navbarBsPrefix: _propTypes["default"].string,
/** @private */
cardHeaderBsPrefix: _propTypes["default"].string,
/**
* The visual variant of the nav items.
*
* @type {('tabs'|'pills')}
*/
variant: _propTypes["default"].string,
/**
* Marks the NavItem with a matching `eventKey` (or `href` if present) as active.
*
* @type {string}
*/
activeKey: _propTypes["default"].any,
/**
* Have all `NavItem`s proportionately fill all available width.
*/
fill: _propTypes["default"].bool,
/**
* Have all `NavItem`s evenly fill all available width.
*
* @type {boolean}
*/
justify: (0, _all["default"])(_propTypes["default"].bool, function (_ref) {
var justify = _ref.justify,
navbar = _ref.navbar;
return justify && navbar ? Error('justify navbar `Nav`s are not supported') : null;
}),
/**
* A callback fired when a NavItem is selected.
*
* ```js
* function (
* Any eventKey,
* SyntheticEvent event?
* )
* ```
*/
onSelect: _propTypes["default"].func,
/**
* ARIA role for the Nav, in the context of a TabContainer, the default will
* be set to "tablist", but can be overridden by the Nav when set explicitly.
*
* When the role is "tablist", NavLink focus is managed according to
* the ARIA authoring practices for tabs:
* https://www.w3.org/TR/2013/WD-wai-aria-practices-20130307/#tabpanel
*/
role: _propTypes["default"].string,
/**
* Apply styling an alignment for use in a Navbar. This prop will be set
* automatically when the Nav is used inside a Navbar.
*/
navbar: _propTypes["default"].bool,
as: _propTypes["default"].elementType,
/** @private */
onKeyDown: _propTypes["default"].func
};
var defaultProps = {
justify: false,
fill: false
};
var Nav = /*#__PURE__*/_react["default"].forwardRef(function (uncontrolledProps, ref) {
var _classNames;
var _useUncontrolled = (0, _uncontrollable.useUncontrolled)(uncontrolledProps, {
activeKey: 'onSelect'
}),
_useUncontrolled$as = _useUncontrolled.as,
as = _useUncontrolled$as === void 0 ? 'div' : _useUncontrolled$as,
bsPrefix = _useUncontrolled.bsPrefix,
variant = _useUncontrolled.variant,
fill = _useUncontrolled.fill,
justify = _useUncontrolled.justify,
navbar = _useUncontrolled.navbar,
className = _useUncontrolled.className,
children = _useUncontrolled.children,
activeKey = _useUncontrolled.activeKey,
props = (0, _objectWithoutProperties2["default"])(_useUncontrolled, ["as", "bsPrefix", "variant", "fill", "justify", "navbar", "className", "children", "activeKey"]);
bsPrefix = (0, _ThemeProvider.useBootstrapPrefix)(bsPrefix, 'nav');
var navbarBsPrefix, cardHeaderBsPrefix;
var navbarContext = (0, _react.useContext)(_NavbarContext["default"]);
var cardContext = (0, _react.useContext)(_CardContext["default"]);
if (navbarContext) {
navbarBsPrefix = navbarContext.bsPrefix;
navbar = navbar == null ? true : navbar;
} else if (cardContext) {
cardHeaderBsPrefix = cardContext.cardHeaderBsPrefix;
}
return /*#__PURE__*/_react["default"].createElement(_AbstractNav["default"], (0, _extends2["default"])({
as: as,
ref: ref,
activeKey: activeKey,
className: (0, _classnames["default"])(className, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, bsPrefix, !navbar), (0, _defineProperty2["default"])(_classNames, "".concat(navbarBsPrefix, "-nav"), navbar), (0, _defineProperty2["default"])(_classNames, "".concat(cardHeaderBsPrefix, "-").concat(variant), !!cardHeaderBsPrefix), (0, _defineProperty2["default"])(_classNames, "".concat(bsPrefix, "-").concat(variant), !!variant), (0, _defineProperty2["default"])(_classNames, "".concat(bsPrefix, "-fill"), fill), (0, _defineProperty2["default"])(_classNames, "".concat(bsPrefix, "-justified"), justify), _classNames))
}, props), children);
});
Nav.displayName = 'Nav';
Nav.propTypes = propTypes;
Nav.defaultProps = defaultProps;
Nav.Item = _NavItem["default"];
Nav.Link = _NavLink["default"];
var _default = Nav;
exports["default"] = _default;
//# sourceMappingURL=Nav.js.map