Initial commit
This commit is contained in:
364
node_modules/react-bootstrap/lib/Nav.js
generated
vendored
Normal file
364
node_modules/react-bootstrap/lib/Nav.js
generated
vendored
Normal file
@@ -0,0 +1,364 @@
|
||||
"use strict";
|
||||
|
||||
var _interopRequireWildcard = require("@babel/runtime-corejs2/helpers/interopRequireWildcard");
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");
|
||||
|
||||
exports.__esModule = true;
|
||||
exports.default = void 0;
|
||||
|
||||
var _extends3 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/extends"));
|
||||
|
||||
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/objectWithoutPropertiesLoose"));
|
||||
|
||||
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/inheritsLoose"));
|
||||
|
||||
var _classnames = _interopRequireDefault(require("classnames"));
|
||||
|
||||
var _keycode = _interopRequireDefault(require("keycode"));
|
||||
|
||||
var _react = _interopRequireWildcard(require("react"));
|
||||
|
||||
var _propTypes = _interopRequireDefault(require("prop-types"));
|
||||
|
||||
var _reactDom = _interopRequireDefault(require("react-dom"));
|
||||
|
||||
var _all = _interopRequireDefault(require("prop-types-extra/lib/all"));
|
||||
|
||||
var _warning = _interopRequireDefault(require("warning"));
|
||||
|
||||
var _bootstrapUtils = require("./utils/bootstrapUtils");
|
||||
|
||||
var _createChainedFunction = _interopRequireDefault(require("./utils/createChainedFunction"));
|
||||
|
||||
var _ValidComponentChildren = _interopRequireDefault(require("./utils/ValidComponentChildren"));
|
||||
|
||||
// TODO: Should we expose `<NavItem>` as `<Nav.Item>`?
|
||||
// TODO: This `bsStyle` is very unlike the others. Should we rename it?
|
||||
// TODO: `pullRight` and `pullLeft` don't render right outside of `navbar`.
|
||||
// Consider renaming or replacing them.
|
||||
var propTypes = {
|
||||
/**
|
||||
* Marks the NavItem with a matching `eventKey` as active. Has a
|
||||
* higher precedence over `activeHref`.
|
||||
*/
|
||||
activeKey: _propTypes.default.any,
|
||||
|
||||
/**
|
||||
* Marks the child NavItem with a matching `href` prop as active.
|
||||
*/
|
||||
activeHref: _propTypes.default.string,
|
||||
|
||||
/**
|
||||
* NavItems are be positioned vertically.
|
||||
*/
|
||||
stacked: _propTypes.default.bool,
|
||||
justified: (0, _all.default)(_propTypes.default.bool, function (_ref) {
|
||||
var justified = _ref.justified,
|
||||
navbar = _ref.navbar;
|
||||
return justified && navbar ? Error('justified 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 set to "tablist" NavItem 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,
|
||||
|
||||
/**
|
||||
* Float the Nav to the right. When `navbar` is `true` the appropriate
|
||||
* contextual classes are added as well.
|
||||
*/
|
||||
pullRight: _propTypes.default.bool,
|
||||
|
||||
/**
|
||||
* Float the Nav to the left. When `navbar` is `true` the appropriate
|
||||
* contextual classes are added as well.
|
||||
*/
|
||||
pullLeft: _propTypes.default.bool
|
||||
};
|
||||
var defaultProps = {
|
||||
justified: false,
|
||||
pullRight: false,
|
||||
pullLeft: false,
|
||||
stacked: false
|
||||
};
|
||||
var contextTypes = {
|
||||
$bs_navbar: _propTypes.default.shape({
|
||||
bsClass: _propTypes.default.string,
|
||||
onSelect: _propTypes.default.func
|
||||
}),
|
||||
$bs_tabContainer: _propTypes.default.shape({
|
||||
activeKey: _propTypes.default.any,
|
||||
onSelect: _propTypes.default.func.isRequired,
|
||||
getTabId: _propTypes.default.func.isRequired,
|
||||
getPaneId: _propTypes.default.func.isRequired
|
||||
})
|
||||
};
|
||||
|
||||
var Nav =
|
||||
/*#__PURE__*/
|
||||
function (_React$Component) {
|
||||
(0, _inheritsLoose2.default)(Nav, _React$Component);
|
||||
|
||||
function Nav() {
|
||||
return _React$Component.apply(this, arguments) || this;
|
||||
}
|
||||
|
||||
var _proto = Nav.prototype;
|
||||
|
||||
_proto.componentDidUpdate = function componentDidUpdate() {
|
||||
var _this = this;
|
||||
|
||||
if (!this._needsRefocus) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._needsRefocus = false;
|
||||
var children = this.props.children;
|
||||
|
||||
var _this$getActiveProps = this.getActiveProps(),
|
||||
activeKey = _this$getActiveProps.activeKey,
|
||||
activeHref = _this$getActiveProps.activeHref;
|
||||
|
||||
var activeChild = _ValidComponentChildren.default.find(children, function (child) {
|
||||
return _this.isActive(child, activeKey, activeHref);
|
||||
});
|
||||
|
||||
var childrenArray = _ValidComponentChildren.default.toArray(children);
|
||||
|
||||
var activeChildIndex = childrenArray.indexOf(activeChild);
|
||||
|
||||
var childNodes = _reactDom.default.findDOMNode(this).children;
|
||||
|
||||
var activeNode = childNodes && childNodes[activeChildIndex];
|
||||
|
||||
if (!activeNode || !activeNode.firstChild) {
|
||||
return;
|
||||
}
|
||||
|
||||
activeNode.firstChild.focus();
|
||||
};
|
||||
|
||||
_proto.getActiveProps = function getActiveProps() {
|
||||
var tabContainer = this.context.$bs_tabContainer;
|
||||
|
||||
if (tabContainer) {
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning.default)(this.props.activeKey == null && !this.props.activeHref, 'Specifying a `<Nav>` `activeKey` or `activeHref` in the context of ' + 'a `<TabContainer>` is not supported. Instead use `<TabContainer ' + ("activeKey={" + this.props.activeKey + "} />`.")) : void 0;
|
||||
return tabContainer;
|
||||
}
|
||||
|
||||
return this.props;
|
||||
};
|
||||
|
||||
_proto.getNextActiveChild = function getNextActiveChild(offset) {
|
||||
var _this2 = this;
|
||||
|
||||
var children = this.props.children;
|
||||
var validChildren = children.filter(function (child) {
|
||||
return child.props.eventKey != null && !child.props.disabled;
|
||||
});
|
||||
|
||||
var _this$getActiveProps2 = this.getActiveProps(),
|
||||
activeKey = _this$getActiveProps2.activeKey,
|
||||
activeHref = _this$getActiveProps2.activeHref;
|
||||
|
||||
var activeChild = _ValidComponentChildren.default.find(children, function (child) {
|
||||
return _this2.isActive(child, activeKey, activeHref);
|
||||
}); // This assumes the active child is not disabled.
|
||||
|
||||
|
||||
var activeChildIndex = validChildren.indexOf(activeChild);
|
||||
|
||||
if (activeChildIndex === -1) {
|
||||
// Something has gone wrong. Select the first valid child we can find.
|
||||
return validChildren[0];
|
||||
}
|
||||
|
||||
var nextIndex = activeChildIndex + offset;
|
||||
var numValidChildren = validChildren.length;
|
||||
|
||||
if (nextIndex >= numValidChildren) {
|
||||
nextIndex = 0;
|
||||
} else if (nextIndex < 0) {
|
||||
nextIndex = numValidChildren - 1;
|
||||
}
|
||||
|
||||
return validChildren[nextIndex];
|
||||
};
|
||||
|
||||
_proto.getTabProps = function getTabProps(child, tabContainer, navRole, active, onSelect) {
|
||||
var _this3 = this;
|
||||
|
||||
if (!tabContainer && navRole !== 'tablist') {
|
||||
// No tab props here.
|
||||
return null;
|
||||
}
|
||||
|
||||
var _child$props = child.props,
|
||||
id = _child$props.id,
|
||||
controls = _child$props['aria-controls'],
|
||||
eventKey = _child$props.eventKey,
|
||||
role = _child$props.role,
|
||||
onKeyDown = _child$props.onKeyDown,
|
||||
tabIndex = _child$props.tabIndex;
|
||||
|
||||
if (tabContainer) {
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning.default)(!id && !controls, 'In the context of a `<TabContainer>`, `<NavItem>`s are given ' + 'generated `id` and `aria-controls` attributes for the sake of ' + 'proper component accessibility. Any provided ones will be ignored. ' + 'To control these attributes directly, provide a `generateChildId` ' + 'prop to the parent `<TabContainer>`.') : void 0;
|
||||
id = tabContainer.getTabId(eventKey);
|
||||
controls = tabContainer.getPaneId(eventKey);
|
||||
}
|
||||
|
||||
if (navRole === 'tablist') {
|
||||
role = role || 'tab';
|
||||
onKeyDown = (0, _createChainedFunction.default)(function (event) {
|
||||
return _this3.handleTabKeyDown(onSelect, event);
|
||||
}, onKeyDown);
|
||||
tabIndex = active ? tabIndex : -1;
|
||||
}
|
||||
|
||||
return {
|
||||
id: id,
|
||||
role: role,
|
||||
onKeyDown: onKeyDown,
|
||||
'aria-controls': controls,
|
||||
tabIndex: tabIndex
|
||||
};
|
||||
};
|
||||
|
||||
_proto.handleTabKeyDown = function handleTabKeyDown(onSelect, event) {
|
||||
var nextActiveChild;
|
||||
|
||||
switch (event.keyCode) {
|
||||
case _keycode.default.codes.left:
|
||||
case _keycode.default.codes.up:
|
||||
nextActiveChild = this.getNextActiveChild(-1);
|
||||
break;
|
||||
|
||||
case _keycode.default.codes.right:
|
||||
case _keycode.default.codes.down:
|
||||
nextActiveChild = this.getNextActiveChild(1);
|
||||
break;
|
||||
|
||||
default:
|
||||
// It was a different key; don't handle this keypress.
|
||||
return;
|
||||
}
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
if (onSelect && nextActiveChild && nextActiveChild.props.eventKey != null) {
|
||||
onSelect(nextActiveChild.props.eventKey);
|
||||
}
|
||||
|
||||
this._needsRefocus = true;
|
||||
};
|
||||
|
||||
_proto.isActive = function isActive(_ref2, activeKey, activeHref) {
|
||||
var props = _ref2.props;
|
||||
|
||||
if (props.active || activeKey != null && props.eventKey === activeKey || activeHref && props.href === activeHref) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return props.active;
|
||||
};
|
||||
|
||||
_proto.render = function render() {
|
||||
var _extends2,
|
||||
_this4 = this;
|
||||
|
||||
var _this$props = this.props,
|
||||
stacked = _this$props.stacked,
|
||||
justified = _this$props.justified,
|
||||
onSelect = _this$props.onSelect,
|
||||
propsRole = _this$props.role,
|
||||
propsNavbar = _this$props.navbar,
|
||||
pullRight = _this$props.pullRight,
|
||||
pullLeft = _this$props.pullLeft,
|
||||
className = _this$props.className,
|
||||
children = _this$props.children,
|
||||
props = (0, _objectWithoutPropertiesLoose2.default)(_this$props, ["stacked", "justified", "onSelect", "role", "navbar", "pullRight", "pullLeft", "className", "children"]);
|
||||
var tabContainer = this.context.$bs_tabContainer;
|
||||
var role = propsRole || (tabContainer ? 'tablist' : null);
|
||||
|
||||
var _this$getActiveProps3 = this.getActiveProps(),
|
||||
activeKey = _this$getActiveProps3.activeKey,
|
||||
activeHref = _this$getActiveProps3.activeHref;
|
||||
|
||||
delete props.activeKey; // Accessed via this.getActiveProps().
|
||||
|
||||
delete props.activeHref; // Accessed via this.getActiveProps().
|
||||
|
||||
var _splitBsProps = (0, _bootstrapUtils.splitBsProps)(props),
|
||||
bsProps = _splitBsProps[0],
|
||||
elementProps = _splitBsProps[1];
|
||||
|
||||
var classes = (0, _extends3.default)({}, (0, _bootstrapUtils.getClassSet)(bsProps), (_extends2 = {}, _extends2[(0, _bootstrapUtils.prefix)(bsProps, 'stacked')] = stacked, _extends2[(0, _bootstrapUtils.prefix)(bsProps, 'justified')] = justified, _extends2));
|
||||
var navbar = propsNavbar != null ? propsNavbar : this.context.$bs_navbar;
|
||||
var pullLeftClassName;
|
||||
var pullRightClassName;
|
||||
|
||||
if (navbar) {
|
||||
var navbarProps = this.context.$bs_navbar || {
|
||||
bsClass: 'navbar'
|
||||
};
|
||||
classes[(0, _bootstrapUtils.prefix)(navbarProps, 'nav')] = true;
|
||||
pullRightClassName = (0, _bootstrapUtils.prefix)(navbarProps, 'right');
|
||||
pullLeftClassName = (0, _bootstrapUtils.prefix)(navbarProps, 'left');
|
||||
} else {
|
||||
pullRightClassName = 'pull-right';
|
||||
pullLeftClassName = 'pull-left';
|
||||
}
|
||||
|
||||
classes[pullRightClassName] = pullRight;
|
||||
classes[pullLeftClassName] = pullLeft;
|
||||
return _react.default.createElement("ul", (0, _extends3.default)({}, elementProps, {
|
||||
role: role,
|
||||
className: (0, _classnames.default)(className, classes)
|
||||
}), _ValidComponentChildren.default.map(children, function (child) {
|
||||
var active = _this4.isActive(child, activeKey, activeHref);
|
||||
|
||||
var childOnSelect = (0, _createChainedFunction.default)(child.props.onSelect, onSelect, navbar && navbar.onSelect, tabContainer && tabContainer.onSelect);
|
||||
return (0, _react.cloneElement)(child, (0, _extends3.default)({}, _this4.getTabProps(child, tabContainer, role, active, childOnSelect), {
|
||||
active: active,
|
||||
activeKey: activeKey,
|
||||
activeHref: activeHref,
|
||||
onSelect: childOnSelect
|
||||
}));
|
||||
}));
|
||||
};
|
||||
|
||||
return Nav;
|
||||
}(_react.default.Component);
|
||||
|
||||
Nav.propTypes = propTypes;
|
||||
Nav.defaultProps = defaultProps;
|
||||
Nav.contextTypes = contextTypes;
|
||||
|
||||
var _default = (0, _bootstrapUtils.bsClass)('nav', (0, _bootstrapUtils.bsStyles)(['tabs', 'pills'], Nav));
|
||||
|
||||
exports.default = _default;
|
||||
module.exports = exports["default"];
|
||||
Reference in New Issue
Block a user