{"version":3,"file":"NavItem.cjs","names":[],"sources":["../../../src/components/Nav/NavItem.tsx"],"sourcesContent":["/*\nCopyright 2023 New Vector Ltd.\nCopyright 2022 The Matrix.org Foundation C.I.C.\n\nSPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial\nPlease see LICENSE files in the repository root for full details.\n*/\n\nimport React, {\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type ForwardedRef,\n  type MouseEventHandler,\n  forwardRef,\n} from \"react\";\n\nimport styles from \"./Nav.module.css\";\n\ntype NavItemProps = {\n  active?: boolean;\n  \"aria-controls\"?: string;\n};\n\ntype NavItemLinkProps = Omit<\n  AnchorHTMLAttributes<HTMLAnchorElement>,\n  \"style\" | \"className\"\n> & {\n  href: string;\n} & NavItemProps;\n\ntype NavItemButtonProps = Omit<\n  ButtonHTMLAttributes<HTMLButtonElement>,\n  \"style\" | \"className\"\n> & {\n  onClick: MouseEventHandler<HTMLButtonElement>;\n} & NavItemProps;\n\nconst NavItemLink = forwardRef(function NavItemLink(\n  {\n    children,\n    href,\n    onClick,\n    ...rest\n  }: React.PropsWithChildren<NavItemLinkProps>,\n  ref: ForwardedRef<HTMLAnchorElement>,\n) {\n  return (\n    <a\n      href={href}\n      onClick={onClick}\n      className={styles[\"nav-item\"]}\n      {...rest}\n      ref={ref}\n    >\n      {children}\n    </a>\n  );\n});\n\nconst NavItemButton = forwardRef(function NavItemButton(\n  {\n    children,\n    disabled,\n    onClick,\n    ...rest\n  }: React.PropsWithChildren<NavItemButtonProps>,\n  ref: ForwardedRef<HTMLButtonElement>,\n) {\n  return (\n    <button\n      onClick={onClick}\n      className={styles[\"nav-item\"]}\n      disabled={disabled}\n      ref={ref}\n      {...rest}\n    >\n      {children}\n    </button>\n  );\n});\n\nconst renderAsLink = (\n  props: React.PropsWithChildren<NavItemLinkProps | NavItemButtonProps>,\n): props is React.PropsWithChildren<NavItemLinkProps> =>\n  \"href\" in props && !!props.href;\n\n/**\n * A navigation item component to be used with a navigation bar.\n * Will render an anchor when href is provided, otherwise a button element.\n */\nexport const NavItem = forwardRef(function NavItem(\n  props: React.PropsWithChildren<NavItemLinkProps | NavItemButtonProps>,\n  ref:\n    | ForwardedRef<HTMLButtonElement | null>\n    | ForwardedRef<HTMLAnchorElement | null>,\n) {\n  /**\n   * For accessibility rules related to tabs,\n   * see https://www.w3.org/WAI/ARIA/apg/patterns/tabs/#wai-ariaroles,states,andproperties\n   *\n   * For accessibility rules related to navigation,\n   * see https://www.digitala11y.com/navigation-role/\n   */\n  const ariaControls = props[\"aria-controls\"];\n  const isUsedAsTabs = !!ariaControls;\n  const a11yAttributes = isUsedAsTabs\n    ? {\n        // when used as tabs\n        \"aria-controls\": ariaControls,\n        role: \"tab\",\n        \"aria-selected\": props.active,\n      }\n    : {\n        // when used as navigation elements\n        \"aria-current\": props.active ? true : undefined,\n      };\n\n  // All the attributes except `active` can be passed to the button/a element.\n  const propsForChild = { ...props };\n  delete propsForChild[\"active\"];\n\n  // Depending on whether `href` is in props, we render link/button\n  let navItem: React.ReactNode;\n  if (renderAsLink(propsForChild)) {\n    const buttonRef = ref as ForwardedRef<HTMLAnchorElement | null>;\n    navItem = (\n      <NavItemLink {...propsForChild} {...a11yAttributes} ref={buttonRef} />\n    );\n  } else {\n    const buttonRef = ref as ForwardedRef<HTMLButtonElement | null>;\n    navItem = (\n      <NavItemButton {...propsForChild} {...a11yAttributes} ref={buttonRef} />\n    );\n  }\n\n  return (\n    <li\n      className={styles[\"nav-tab\"]}\n      data-current={props.active ? true : undefined}\n      role=\"presentation\"\n    >\n      {navItem}\n    </li>\n  );\n});\n"],"mappings":";;;;;;AAqCA,IAAM,eAAA,GAAA,MAAA,YAAyB,SAAS,YACtC,EACE,UACA,MACA,SACA,GAAG,QAEL,KACA;AACA,QACE,iBAAA,GAAA,kBAAA,KAAC,KAAD;EACQ;EACG;EACT,WAAW,mBAAA,QAAO;EAClB,GAAI;EACC;EAEJ;EACC,CAAA;EAEN;AAEF,IAAM,iBAAA,GAAA,MAAA,YAA2B,SAAS,cACxC,EACE,UACA,UACA,SACA,GAAG,QAEL,KACA;AACA,QACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACW;EACT,WAAW,mBAAA,QAAO;EACR;EACL;EACL,GAAI;EAEH;EACM,CAAA;EAEX;AAEF,IAAM,gBACJ,UAEA,UAAU,SAAS,CAAC,CAAC,MAAM;;;;;AAM7B,IAAa,WAAA,GAAA,MAAA,YAAqB,SAAS,QACzC,OACA,KAGA;;;;;;;;CAQA,MAAM,eAAe,MAAM;CAE3B,MAAM,iBADe,CAAC,CAAC,eAEnB;EAEE,iBAAiB;EACjB,MAAM;EACN,iBAAiB,MAAM;EACxB,GACD,EAEE,gBAAgB,MAAM,SAAS,OAAO,KAAA,GACvC;CAGL,MAAM,gBAAgB,EAAE,GAAG,OAAO;AAClC,QAAO,cAAc;CAGrB,IAAI;AACJ,KAAI,aAAa,cAAc,EAAE;EAC/B,MAAM,YAAY;AAClB,YACE,iBAAA,GAAA,kBAAA,KAAC,aAAD;GAAa,GAAI;GAAe,GAAI;GAAgB,KAAK;GAAa,CAAA;QAEnE;EACL,MAAM,YAAY;AAClB,YACE,iBAAA,GAAA,kBAAA,KAAC,eAAD;GAAe,GAAI;GAAe,GAAI;GAAgB,KAAK;GAAa,CAAA;;AAI5E,QACE,iBAAA,GAAA,kBAAA,KAAC,MAAD;EACE,WAAW,mBAAA,QAAO;EAClB,gBAAc,MAAM,SAAS,OAAO,KAAA;EACpC,MAAK;YAEJ;EACE,CAAA;EAEP"}