@intility/bifrost-react/dist/components/Nav/Nav.Side.js

React library for Intility's design system, Bifrost.

"use client";

import { c as _c } from "react-compiler-runtime";
import classNames from "classnames";
import { forwardRef } from "react";
import { bfCollapse } from "../../assets/bfCollapse.js";
import useLocale from "../../hooks/useLocale.js";
import NavItem from "./Nav.Item.js";
import NavLogo from "./Nav.Logo.js";
import NavLocationProvider from "./NavLocationContext.internal.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const NavSide = /*#__PURE__*/forwardRef((t0, ref) => {
  const $ = _c(32);
  let children;
  let className;
  let collapsed;
  let logo;
  let onCollapsedChange;
  let props;
  if ($[0] !== t0) {
    let {
      children: t1,
      className: t2,
      collapsed: t3,
      onCollapsedChange: t4,
      logo: t5,
      hideBranding,
      ...t6
    } = t0;
    children = t1;
    className = t2;
    collapsed = t3;
    onCollapsedChange = t4;
    logo = t5;
    props = t6;
    $[0] = t0;
    $[1] = children;
    $[2] = className;
    $[3] = collapsed;
    $[4] = logo;
    $[5] = onCollapsedChange;
    $[6] = props;
  } else {
    children = $[1];
    className = $[2];
    collapsed = $[3];
    logo = $[4];
    onCollapsedChange = $[5];
    props = $[6];
  }
  const locale = useLocale();
  const collapseButtonLabel = collapsed ? locale.expand : locale.collapse;
  let t1;
  if ($[7] !== logo) {
    t1 = typeof logo === "string" ? /*#__PURE__*/_jsx(NavLogo, {
      children: logo
    }) : logo;
    $[7] = logo;
    $[8] = t1;
  } else {
    t1 = $[8];
  }
  logo = t1;
  const t2 = !collapsed;
  const t3 = props;
  let t4;
  if ($[9] !== className || $[10] !== collapsed) {
    t4 = classNames("bf-nav bf-nav-side", className, {
      "bf-nav-side-collapsed": collapsed
    });
    $[9] = className;
    $[10] = collapsed;
    $[11] = t4;
  } else {
    t4 = $[11];
  }
  let t5;
  if ($[12] !== logo) {
    t5 = /*#__PURE__*/_jsx("div", {
      className: "bf-nav-side-logo",
      children: logo
    });
    $[12] = logo;
    $[13] = t5;
  } else {
    t5 = $[13];
  }
  let t6;
  if ($[14] !== children) {
    t6 = /*#__PURE__*/_jsx("div", {
      className: "bf-nav-side-content-wrapper bf-scrollbar-small",
      children: /*#__PURE__*/_jsx("div", {
        className: "bf-nav-side-content",
        children: children
      })
    });
    $[14] = children;
    $[15] = t6;
  } else {
    t6 = $[15];
  }
  let t7;
  if ($[16] !== collapseButtonLabel || $[17] !== collapsed || $[18] !== onCollapsedChange) {
    t7 = onCollapsedChange && /*#__PURE__*/_jsx("button", {
      type: "button",
      onClick: () => onCollapsedChange(!collapsed),
      className: "bf-nav-side-collapse-button",
      children: /*#__PURE__*/_jsx(NavItem, {
        icon: bfCollapse,
        children: collapseButtonLabel
      })
    });
    $[16] = collapseButtonLabel;
    $[17] = collapsed;
    $[18] = onCollapsedChange;
    $[19] = t7;
  } else {
    t7 = $[19];
  }
  let t8;
  if ($[20] !== t7) {
    t8 = /*#__PURE__*/_jsx("div", {
      className: "bf-nav bf-nav-side-bottom",
      children: t7
    });
    $[20] = t7;
    $[21] = t8;
  } else {
    t8 = $[21];
  }
  let t9;
  if ($[22] !== props || $[23] !== ref || $[24] !== t4 || $[25] !== t5 || $[26] !== t6 || $[27] !== t8) {
    t9 = /*#__PURE__*/_jsxs("nav", {
      ...t3,
      className: t4,
      ref: ref,
      children: [t5, t6, t8]
    });
    $[22] = props;
    $[23] = ref;
    $[24] = t4;
    $[25] = t5;
    $[26] = t6;
    $[27] = t8;
    $[28] = t9;
  } else {
    t9 = $[28];
  }
  let t10;
  if ($[29] !== t2 || $[30] !== t9) {
    t10 = /*#__PURE__*/_jsx(NavLocationProvider, {
      where: "side",
      sideExpandedOrMobile: t2,
      children: t9
    });
    $[29] = t2;
    $[30] = t9;
    $[31] = t10;
  } else {
    t10 = $[31];
  }
  return t10;
});
NavSide.displayName = "Nav.Side";
export default NavSide;