/
Navbar.tsx
39 lines (34 loc) · 1.17 KB
/
Navbar.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import React, { forwardRef } from 'react';
import { getDefaultZIndex, useComponentDefaultProps } from '@mantine/styles';
import { ForwardRefWithStaticComponents } from '@mantine/utils';
import {
HorizontalSection,
HorizontalSectionSharedProps,
} from '../HorizontalSection/HorizontalSection';
import { Section } from '../HorizontalSection/Section/Section';
export interface NavbarProps
extends HorizontalSectionSharedProps,
React.ComponentPropsWithoutRef<'nav'> {
/** Navbar content */
children: React.ReactNode;
}
type NavbarComponent = ForwardRefWithStaticComponents<
HTMLElement,
NavbarProps,
{ Section: typeof Section }
>;
const defaultProps: Partial<NavbarProps> = {
fixed: false,
position: { top: 0, left: 0 },
zIndex: getDefaultZIndex('app'),
hiddenBreakpoint: 'md',
hidden: false,
};
export const Navbar: NavbarComponent = forwardRef<HTMLElement, NavbarProps>(
(props: NavbarProps, ref) => {
const _props = useComponentDefaultProps('Navbar', defaultProps, props);
return <HorizontalSection section="navbar" __staticSelector="Navbar" ref={ref} {..._props} />;
}
) as any;
Navbar.Section = Section;
Navbar.displayName = '@mantine/core/Navbar';