UNPKG

4.14 kBJavaScriptView Raw
1"use strict";
2
3var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
5var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
7exports.__esModule = true;
8exports.default = void 0;
9
10var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
12var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
13
14var _classnames = _interopRequireDefault(require("classnames"));
15
16var _react = _interopRequireWildcard(require("react"));
17
18var _uncontrollable = require("uncontrollable");
19
20var _createWithBsPrefix = _interopRequireDefault(require("./createWithBsPrefix"));
21
22var _NavbarBrand = _interopRequireDefault(require("./NavbarBrand"));
23
24var _NavbarCollapse = _interopRequireDefault(require("./NavbarCollapse"));
25
26var _NavbarToggle = _interopRequireDefault(require("./NavbarToggle"));
27
28var _ThemeProvider = require("./ThemeProvider");
29
30var _NavbarContext = _interopRequireDefault(require("./NavbarContext"));
31
32var _SelectableContext = _interopRequireDefault(require("./SelectableContext"));
33
34var defaultProps = {
35 expand: true,
36 variant: 'light',
37 collapseOnSelect: false
38};
39
40var Navbar = _react.default.forwardRef(function (props, ref) {
41 var _useUncontrolled = (0, _uncontrollable.useUncontrolled)(props, {
42 expanded: 'onToggle'
43 }),
44 bsPrefix = _useUncontrolled.bsPrefix,
45 expand = _useUncontrolled.expand,
46 variant = _useUncontrolled.variant,
47 bg = _useUncontrolled.bg,
48 fixed = _useUncontrolled.fixed,
49 sticky = _useUncontrolled.sticky,
50 className = _useUncontrolled.className,
51 children = _useUncontrolled.children,
52 _useUncontrolled$as = _useUncontrolled.as,
53 Component = _useUncontrolled$as === void 0 ? 'nav' : _useUncontrolled$as,
54 expanded = _useUncontrolled.expanded,
55 _onToggle = _useUncontrolled.onToggle,
56 onSelect = _useUncontrolled.onSelect,
57 collapseOnSelect = _useUncontrolled.collapseOnSelect,
58 controlledProps = (0, _objectWithoutPropertiesLoose2.default)(_useUncontrolled, ["bsPrefix", "expand", "variant", "bg", "fixed", "sticky", "className", "children", "as", "expanded", "onToggle", "onSelect", "collapseOnSelect"]);
59
60 bsPrefix = (0, _ThemeProvider.useBootstrapPrefix)(bsPrefix, 'navbar');
61 var handleCollapse = (0, _react.useCallback)(function () {
62 if (onSelect) onSelect.apply(void 0, arguments);
63
64 if (collapseOnSelect && expanded) {
65 _onToggle(false);
66 }
67 }, [onSelect, collapseOnSelect, expanded, _onToggle]); // will result in some false positives but that seems better
68 // than false negatives. strict `undefined` check allows explicit
69 // "nulling" of the role if the user really doesn't want one
70
71 if (controlledProps.role === undefined && Component !== 'nav') {
72 controlledProps.role = 'navigation';
73 }
74
75 var expandClass = bsPrefix + "-expand";
76 if (typeof expand === 'string') expandClass = expandClass + "-" + expand;
77 var navbarContext = (0, _react.useMemo)(function () {
78 return {
79 onToggle: function onToggle() {
80 return _onToggle(!expanded);
81 },
82 bsPrefix: bsPrefix,
83 expanded: expanded
84 };
85 }, [bsPrefix, expanded, _onToggle]);
86 return _react.default.createElement(_NavbarContext.default.Provider, {
87 value: navbarContext
88 }, _react.default.createElement(_SelectableContext.default.Provider, {
89 value: handleCollapse
90 }, _react.default.createElement(Component, (0, _extends2.default)({
91 ref: ref
92 }, controlledProps, {
93 className: (0, _classnames.default)(className, bsPrefix, expand && expandClass, variant && bsPrefix + "-" + variant, bg && "bg-" + bg, sticky && "sticky-" + sticky, fixed && "fixed-" + fixed)
94 }), children)));
95});
96
97Navbar.defaultProps = defaultProps;
98Navbar.displayName = 'Navbar';
99Navbar.Brand = _NavbarBrand.default;
100Navbar.Toggle = _NavbarToggle.default;
101Navbar.Collapse = _NavbarCollapse.default;
102Navbar.Text = (0, _createWithBsPrefix.default)('navbar-text', {
103 Component: 'span'
104});
105var _default = Navbar;
106exports.default = _default;
107module.exports = exports["default"];
\No newline at end of file