@heroui/navbar
Version:
A responsive navigation header positioned on top side of your page that includes support for branding, links, navigation, collapse and more.
48 lines (45 loc) • 1.66 kB
JavaScript
"use client";
import {
navbar_menu_default
} from "./chunk-SOOT4SRX.mjs";
import {
hideOnScrollVariants
} from "./chunk-RRUQIZLR.mjs";
import {
useNavbar
} from "./chunk-Q3XKXXMH.mjs";
import {
NavbarProvider
} from "./chunk-IGERPFKH.mjs";
// src/navbar.tsx
import { forwardRef } from "@heroui/system";
import { pickChildren } from "@heroui/react-utils";
import { LazyMotion, m } from "framer-motion";
import { mergeProps } from "@heroui/shared-utils";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
var domAnimation = () => import("@heroui/dom-animation").then((res) => res.default);
var Navbar = forwardRef((props, ref) => {
const { children, ...otherProps } = props;
const context = useNavbar({ ...otherProps, ref });
const Component = context.Component;
const [childrenWithoutMenu, menu] = pickChildren(children, navbar_menu_default);
const content = /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx("header", { ...context.getWrapperProps(), children: childrenWithoutMenu }),
menu
] });
return /* @__PURE__ */ jsx(NavbarProvider, { value: context, children: context.shouldHideOnScroll ? /* @__PURE__ */ jsx(LazyMotion, { features: domAnimation, children: /* @__PURE__ */ jsx(
m.nav,
{
animate: context.isHidden ? "hidden" : "visible",
initial: false,
variants: hideOnScrollVariants,
...mergeProps(context.getBaseProps(), context.motionProps),
children: content
}
) }) : /* @__PURE__ */ jsx(Component, { ...context.getBaseProps(), children: content }) });
});
Navbar.displayName = "HeroUI.Navbar";
var navbar_default = Navbar;
export {
navbar_default
};