Dashboard sipadu mbip
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

Navbar.js 3.3KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
  3. import classNames from 'classnames';
  4. import React, { useMemo, useCallback } from 'react';
  5. import { useUncontrolled } from 'uncontrollable';
  6. import createWithBsPrefix from './utils/createWithBsPrefix';
  7. import NavbarBrand from './NavbarBrand';
  8. import NavbarCollapse from './NavbarCollapse';
  9. import NavbarToggle from './NavbarToggle';
  10. import { useBootstrapPrefix } from './ThemeProvider';
  11. import NavbarContext from './NavbarContext';
  12. import SelectableContext from './SelectableContext';
  13. var defaultProps = {
  14. expand: true,
  15. variant: 'light',
  16. collapseOnSelect: false
  17. };
  18. var Navbar = React.forwardRef(function (props, ref) {
  19. var _useUncontrolled = useUncontrolled(props, {
  20. expanded: 'onToggle'
  21. }),
  22. bsPrefix = _useUncontrolled.bsPrefix,
  23. expand = _useUncontrolled.expand,
  24. variant = _useUncontrolled.variant,
  25. bg = _useUncontrolled.bg,
  26. fixed = _useUncontrolled.fixed,
  27. sticky = _useUncontrolled.sticky,
  28. className = _useUncontrolled.className,
  29. children = _useUncontrolled.children,
  30. _useUncontrolled$as = _useUncontrolled.as,
  31. Component = _useUncontrolled$as === void 0 ? 'nav' : _useUncontrolled$as,
  32. expanded = _useUncontrolled.expanded,
  33. _onToggle = _useUncontrolled.onToggle,
  34. onSelect = _useUncontrolled.onSelect,
  35. collapseOnSelect = _useUncontrolled.collapseOnSelect,
  36. controlledProps = _objectWithoutPropertiesLoose(_useUncontrolled, ["bsPrefix", "expand", "variant", "bg", "fixed", "sticky", "className", "children", "as", "expanded", "onToggle", "onSelect", "collapseOnSelect"]);
  37. bsPrefix = useBootstrapPrefix(bsPrefix, 'navbar');
  38. var handleCollapse = useCallback(function () {
  39. if (onSelect) onSelect.apply(void 0, arguments);
  40. if (collapseOnSelect && expanded) {
  41. _onToggle(false);
  42. }
  43. }, [onSelect, collapseOnSelect, expanded, _onToggle]); // will result in some false positives but that seems better
  44. // than false negatives. strict `undefined` check allows explicit
  45. // "nulling" of the role if the user really doesn't want one
  46. if (controlledProps.role === undefined && Component !== 'nav') {
  47. controlledProps.role = 'navigation';
  48. }
  49. var expandClass = bsPrefix + "-expand";
  50. if (typeof expand === 'string') expandClass = expandClass + "-" + expand;
  51. var navbarContext = useMemo(function () {
  52. return {
  53. onToggle: function onToggle() {
  54. return _onToggle(!expanded);
  55. },
  56. bsPrefix: bsPrefix,
  57. expanded: expanded
  58. };
  59. }, [bsPrefix, expanded, _onToggle]);
  60. return React.createElement(NavbarContext.Provider, {
  61. value: navbarContext
  62. }, React.createElement(SelectableContext.Provider, {
  63. value: handleCollapse
  64. }, React.createElement(Component, _extends({
  65. ref: ref
  66. }, controlledProps, {
  67. className: classNames(className, bsPrefix, expand && expandClass, variant && bsPrefix + "-" + variant, bg && "bg-" + bg, sticky && "sticky-" + sticky, fixed && "fixed-" + fixed)
  68. }), children)));
  69. });
  70. Navbar.defaultProps = defaultProps;
  71. Navbar.displayName = 'Navbar';
  72. Navbar.Brand = NavbarBrand;
  73. Navbar.Toggle = NavbarToggle;
  74. Navbar.Collapse = NavbarCollapse;
  75. Navbar.Text = createWithBsPrefix('navbar-text', {
  76. Component: 'span'
  77. });
  78. export default Navbar;