UNPKG

@primer/react-brand

Version:

Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.

73 lines (72 loc) 2.83 kB
import e from "../node_modules/clsx/dist/clsx.js"; import { useProvidedRefOrCreate as t } from "../hooks/useRef.js"; import { ChevronDownIcon as n } from "../node_modules/@primer/octicons-react/dist/index.esm.js"; import { useWindowSize as r } from "../hooks/useWindowSize.js"; import { useVisibilityObserver as i } from "./useVisibilityObserver.js"; import { useOnClickOutside as a } from "../hooks/useOnClickOutside.js"; import o from "./SubdomainNavBar.module.js"; import { useKeyboardEscape as s } from "../hooks/useKeyboardEscape.js"; import c, { forwardRef as l, useCallback as u, useRef as d, useState as f } from "react"; import { jsx as p, jsxs as m } from "react/jsx-runtime"; //#region src/SubdomainNavBar/NavigationVisbilityObserver.tsx var h = l(({ children: n, className: a, ...s }, l) => { let u = t(l), [d] = i(u, n), { isMedium: f } = r(), h = Object.values(d).includes(!1); return /* @__PURE__ */ m("ul", { className: e(o["SubdomainNavBar-primary-nav-list"], a), ref: u, ...s, children: [c.Children.map(n, (t) => { if (c.isValidElement(t)) { let n = t.props["data-navitemid"]; if (!n) return t; let r = d[n]; return c.cloneElement(t, { className: e(t.props.className, f && r && o["SubdomainNavBar-primary-nav-list-item--visible"], f && r === !1 && o["SubdomainNavBar-primary-nav-list-item--invisible"]) }); } return t; }), h && /* @__PURE__ */ p(g, { visibilityMap: d, children: n })] }); }); function g({ children: t, className: r, visibilityMap: i }) { let [l, h] = f(null), g = d(null); a(g, () => y()); let _ = !!l, v = (e) => { l ? y() : h(e.currentTarget); }, y = u(() => { h(null); }, []); return s(y), /* @__PURE__ */ m("li", { className: e(o["SubdomainNavBar-primary-nav-list-item--overflow"], r), ref: g, children: [/* @__PURE__ */ m("button", { "aria-expanded": _ ? "true" : "false", "aria-controls": "more-navigation", "aria-haspopup": "true", onClick: v, className: e(o["SubdomainNavBar-link"], o["SubdomainNavBar-more-link"]), children: ["More", /* @__PURE__ */ p(n, {})] }), /* @__PURE__ */ p("div", { id: "more-navigation", style: { display: _ ? "block" : "none" }, className: e(o["SubdomainNavBar-overflow-menu"]), children: /* @__PURE__ */ p("ul", { className: e(o["SubdomainNavBar-overflow-menu-list"]), children: c.Children.map(t, (t) => { if (c.isValidElement(t)) { let n = t.props["data-navitemid"]; return !n || i[n] ? null : /* @__PURE__ */ p(c.Fragment, { children: c.cloneElement(t, { onClick: y, className: e(o["SubdomainNavBar-overflow-menu-item"], t.props.className) }) }); } return null; }) }) })] }); } //#endregion export { h as NavigationVisbilityObserver }; //# sourceMappingURL=NavigationVisbilityObserver.js.map