boreal-ui 0.0.30 → 0.0.32

package/dist/core/{Modal-CYw6ZB5A.js → Modal-Bi8OdWKS.js}

@@ -5,7 +5,7 @@ import { C as CloseIcon } from "./CloseIcon-C3eQm4EK.js";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
-import { I as IconButton } from "./IconButton-Dsw2M1s8.js";
+import { I as IconButton } from "./IconButton-B9WWbeSM.js";
 const BaseModal = ({
   className = "",
   children,
@@ -20,13 +20,16 @@ const BaseModal = ({
   const [isMounted, setIsMounted] = useState(false);
   const [isVisible, setIsVisible] = useState(false);
   const [portalElement, setPortalElement] = useState(null);
-  const modalRef = useRef(null);
-  const firstFocusable = useRef(null);
-  const id = useId();
-  const labelId = `${id}-label`;
-  const descId = `${id}-desc`;
+  const overlayRef = useRef(null);
+  const dialogRef = useRef(null);
+  const closeBtnRef = useRef(null);
+  const openerRef = useRef(null);
+  const focusablesRef = useRef([]);
+  const uid = useId();
+  const labelId = `${uid}-label`;
   useEffect(() => {
     setIsMounted(true);
+    openerRef.current = document.activeElement ?? null;
     let portal = document.getElementById(portalId);
     if (!portal) {
       portal = document.createElement("div");
@@ -35,43 +38,53 @@ const BaseModal = ({
     }
     setPortalElement(portal);
     document.body.classList.add("noScroll");
+    const siblings = Array.from(document.body.children);
+    const hidden = [];
+    siblings.forEach((el) => {
+      if (el !== portal && !el.hasAttribute("aria-hidden")) {
+        el.setAttribute("aria-hidden", "true");
+        hidden.push(el);
+      }
+    });
+    const handleEsc = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", handleEsc);
     return () => {
+      var _a, _b;
       document.body.classList.remove("noScroll");
+      document.removeEventListener("keydown", handleEsc);
+      hidden.forEach((el) => el.removeAttribute("aria-hidden"));
+      (_b = (_a = openerRef.current) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
     };
-  }, [portalId]);
+  }, [portalId, onClose]);
   useEffect(() => {
-    if (isMounted) {
-      requestAnimationFrame(() => {
-        setIsVisible(true);
-        setTimeout(() => {
-          var _a;
-          (_a = modalRef.current) == null ? void 0 : _a.focus();
-        }, 10);
-      });
-    }
+    if (!isMounted) return;
+    requestAnimationFrame(() => {
+      var _a, _b;
+      setIsVisible(true);
+      if (dialogRef.current) {
+        focusablesRef.current = Array.from(
+          dialogRef.current.querySelectorAll(
+            'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+          )
+        ).filter((el) => !el.hasAttribute("disabled") && el.tabIndex !== -1);
+      }
+      (_b = (_a = focusablesRef.current[0] ?? closeBtnRef.current ?? dialogRef.current) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+    });
   }, [isMounted]);
   const handleKeyDown = (e) => {
-    if (e.key === "Escape") onClose();
-    if (e.key === "Tab") trapFocus(e);
-  };
-  const trapFocus = (e) => {
-    var _a;
-    const focusableEls = (_a = modalRef.current) == null ? void 0 : _a.querySelectorAll(
-      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-    );
-    if (!focusableEls || focusableEls.length === 0) return;
-    const first = focusableEls[0];
-    const last = focusableEls[focusableEls.length - 1];
-    if (e.shiftKey) {
-      if (document.activeElement === first) {
-        e.preventDefault();
-        last.focus();
-      }
-    } else {
-      if (document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
+    if (e.key !== "Tab") return;
+    const list = focusablesRef.current;
+    if (!list.length) return;
+    const first = list[0];
+    const last = list[list.length - 1];
+    if (e.shiftKey && document.activeElement === first) {
+      e.preventDefault();
+      last.focus();
+    } else if (!e.shiftKey && document.activeElement === last) {
+      e.preventDefault();
+      first.focus();
     }
   };
   const handleClose = () => {
@@ -89,43 +102,44 @@ const BaseModal = ({
     /* @__PURE__ */ jsx(
       "div",
       {
+        ref: overlayRef,
         className: combineClassNames(
           classMap.overlay,
           isVisible ? classMap.visible : classMap.hidden
         ),
         onClick: handleClose,
-        onKeyDown: handleKeyDown,
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-labelledby": labelId,
-        "aria-describedby": descId,
-        tabIndex: -1,
-        ref: modalRef,
+        role: "presentation",
         "data-testid": testId,
         children: /* @__PURE__ */ jsxs(
           "div",
           {
+            ref: dialogRef,
             className: contentClassName,
             onClick: (e) => e.stopPropagation(),
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-labelledby": labelId,
+            tabIndex: -1,
+            onKeyDown: handleKeyDown,
             "data-testid": `${testId}-content`,
-            id: descId,
             children: [
-              /* @__PURE__ */ jsx("h2", { id: labelId, className: "sr-only", children: "Modal Dialog" }),
+              /* @__PURE__ */ jsx("h2", { id: labelId, className: classMap.srOnly ?? "sr_only", children: "Modal Dialog" }),
               /* @__PURE__ */ jsx(
                 IconButton2,
                 {
-                  ref: firstFocusable,
+                  ref: closeBtnRef,
                   className: classMap.closeButton,
                   state: "error",
                   size: "small",
                   icon: CloseIcon,
-                  "aria-label": "Close modal",
+                  ariaLabel: "Close modal",
                   onClick: (e) => {
                     e.stopPropagation();
                     handleClose();
                   },
                   title: "Close",
-                  "data-testid": `${testId}-close`
+                  "data-testid": `${testId}-close`,
+                  type: "button"
                 }
               ),
               children
@@ -137,6 +151,7 @@ const BaseModal = ({
     portalElement
   );
 };
+BaseModal.displayName = "BaseModal";
 const classes = {
   overlay: "modal_overlay",
   visible: "modal_visible",
@@ -159,4 +174,4 @@ const Modal = (props) => {
 export {
   Modal as M
 };
-//# sourceMappingURL=Modal-CYw6ZB5A.js.map
+//# sourceMappingURL=Modal-Bi8OdWKS.js.map

package/dist/core/Modal-Bi8OdWKS.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal-Bi8OdWKS.js","sources":["../../src/components/Modal/ModalBase.tsx","../../src/components/Modal/core/Modal.tsx"],"sourcesContent":["import React, {\r\n  useEffect,\r\n  useRef,\r\n  useState,\r\n  useId,\r\n  KeyboardEvent,\r\n} from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport { CloseIcon } from \"../../Icons\";\r\nimport { BaseModalProps } from \"./Modal.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst BaseModal: React.FC<BaseModalProps> = ({\r\n  className = \"\",\r\n  children,\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  onClose,\r\n  \"data-testid\": testId = \"modal\",\r\n  IconButton,\r\n  classMap,\r\n  portalId = \"widget-portal\",\r\n}) => {\r\n  const [isMounted, setIsMounted] = useState(false);\r\n  const [isVisible, setIsVisible] = useState(false);\r\n  const [portalElement, setPortalElement] = useState<HTMLElement | null>(null);\r\n\r\n  const overlayRef = useRef<HTMLDivElement>(null);\r\n  const dialogRef = useRef<HTMLDivElement>(null);\r\n  const closeBtnRef = useRef<HTMLButtonElement>(null);\r\n  const openerRef = useRef<HTMLElement | null>(null);\r\n  const focusablesRef = useRef<HTMLElement[]>([]);\r\n\r\n  const uid = useId();\r\n  const labelId = `${uid}-label`;\r\n\r\n  useEffect(() => {\r\n    setIsMounted(true);\r\n    openerRef.current = (document.activeElement as HTMLElement) ?? null;\r\n\r\n    let portal = document.getElementById(portalId);\r\n    if (!portal) {\r\n      portal = document.createElement(\"div\");\r\n      portal.id = portalId;\r\n      document.body.appendChild(portal);\r\n    }\r\n    setPortalElement(portal);\r\n    document.body.classList.add(\"noScroll\");\r\n\r\n    const siblings = Array.from(document.body.children) as HTMLElement[];\r\n    const hidden: HTMLElement[] = [];\r\n    siblings.forEach((el) => {\r\n      if (el !== portal && !el.hasAttribute(\"aria-hidden\")) {\r\n        el.setAttribute(\"aria-hidden\", \"true\");\r\n        hidden.push(el);\r\n      }\r\n    });\r\n\r\n    const handleEsc = (e: KeyboardEvent) => {\r\n      if (e.key === \"Escape\") onClose();\r\n    };\r\n    document.addEventListener(\"keydown\", handleEsc as any);\r\n\r\n    return () => {\r\n      document.body.classList.remove(\"noScroll\");\r\n      document.removeEventListener(\"keydown\", handleEsc as any);\r\n      hidden.forEach((el) => el.removeAttribute(\"aria-hidden\"));\r\n      openerRef.current?.focus?.();\r\n    };\r\n  }, [portalId, onClose]);\r\n\r\n  useEffect(() => {\r\n    if (!isMounted) return;\r\n    requestAnimationFrame(() => {\r\n      setIsVisible(true);\r\n\r\n      if (dialogRef.current) {\r\n        focusablesRef.current = Array.from(\r\n          dialogRef.current.querySelectorAll<HTMLElement>(\r\n            'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\r\n          )\r\n        ).filter((el) => !el.hasAttribute(\"disabled\") && el.tabIndex !== -1);\r\n      }\r\n\r\n      (\r\n        focusablesRef.current[0] ??\r\n        closeBtnRef.current ??\r\n        dialogRef.current\r\n      )?.focus?.();\r\n    });\r\n  }, [isMounted]);\r\n\r\n  const handleKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\r\n    if (e.key !== \"Tab\") return;\r\n    const list = focusablesRef.current;\r\n    if (!list.length) return;\r\n\r\n    const first = list[0];\r\n    const last = list[list.length - 1];\r\n\r\n    if (e.shiftKey && document.activeElement === first) {\r\n      e.preventDefault();\r\n      last.focus();\r\n    } else if (!e.shiftKey && document.activeElement === last) {\r\n      e.preventDefault();\r\n      first.focus();\r\n    }\r\n  };\r\n\r\n  const handleClose = () => {\r\n    setIsVisible(false);\r\n    setTimeout(() => onClose(), 200);\r\n  };\r\n\r\n  if (!isMounted || !portalElement) return null;\r\n\r\n  const contentClassName = combineClassNames(\r\n    classMap.content,\r\n    className,\r\n    shadow && classMap[`shadow${capitalize(shadow)}`],\r\n    rounding && classMap[`round${capitalize(rounding)}`]\r\n  );\r\n\r\n  return ReactDOM.createPortal(\r\n    <div\r\n      ref={overlayRef}\r\n      className={combineClassNames(\r\n        classMap.overlay,\r\n        isVisible ? classMap.visible : classMap.hidden\r\n      )}\r\n      onClick={handleClose}\r\n      role=\"presentation\"\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        ref={dialogRef}\r\n        className={contentClassName}\r\n        onClick={(e) => e.stopPropagation()}\r\n        role=\"dialog\"\r\n        aria-modal=\"true\"\r\n        aria-labelledby={labelId}\r\n        tabIndex={-1}\r\n        onKeyDown={handleKeyDown}\r\n        data-testid={`${testId}-content`}\r\n      >\r\n        <h2 id={labelId} className={classMap.srOnly ?? \"sr_only\"}>\r\n          Modal Dialog\r\n        </h2>\r\n\r\n        <IconButton\r\n          ref={closeBtnRef as any}\r\n          className={classMap.closeButton}\r\n          state=\"error\"\r\n          size=\"small\"\r\n          icon={CloseIcon}\r\n          ariaLabel=\"Close modal\"\r\n          onClick={(e: React.MouseEvent) => {\r\n            e.stopPropagation();\r\n            handleClose();\r\n          }}\r\n          title=\"Close\"\r\n          data-testid={`${testId}-close`}\r\n          type=\"button\"\r\n        />\r\n\r\n        {children}\r\n      </div>\r\n    </div>,\r\n    portalElement\r\n  );\r\n};\r\n\r\nBaseModal.displayName = \"BaseModal\";\r\nexport default BaseModal;\r\n","import React from \"react\";\r\nimport BaseModal from \"../ModalBase\";\r\nimport \"./Modal.scss\";\r\nimport IconButton from \"../../IconButton/core/IconButton\";\r\nimport { ModalProps } from \"../Modal.types\";\r\n\r\nconst classes = {\r\n  overlay: \"modal_overlay\",\r\n  visible: \"modal_visible\",\r\n  hidden: \"modal_hidden\",\r\n  content: \"modal_content\",\r\n  closeButton: \"modal_close_button\",\r\n\r\n  shadowNone: \"modal_shadow-None\",\r\n  shadowLight: \"modal_shadow-Light\",\r\n  shadowMedium: \"modal_shadow-Medium\",\r\n  shadowStrong: \"modal_shadow-Strong\",\r\n  shadowIntense: \"modal_shadow-Intense\",\r\n\r\n  roundNone: \"modal_round-None\",\r\n  roundSmall: \"modal_round-Small\",\r\n  roundMedium: \"modal_round-Medium\",\r\n  roundLarge: \"modal_round-Large\",\r\n};\r\n\r\nconst Modal: React.FC<ModalProps> = (props) => {\r\n  return <BaseModal {...props} IconButton={IconButton} classMap={classes} />;\r\n};\r\n\r\nexport default Modal;\r\n"],"names":["IconButton"],"mappings":"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"}

package/dist/core/Modal.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Modal = require("./Modal--5xg1kDj.cjs");
+const Modal = require("./Modal-BdxvP-Ei.cjs");
 module.exports = Modal.Modal;
 //# sourceMappingURL=Modal.cjs.js.map

package/dist/core/Modal.js

@@ -1,4 +1,4 @@
-import { M } from "./Modal-CYw6ZB5A.js";
+import { M } from "./Modal-Bi8OdWKS.js";
 export {
   M as default
 };

package/dist/core/{NavBar-UpeebUNC.js → NavBar-CBC9YPkH.js}

@@ -3,6 +3,8 @@ import { useMemo, useState, useEffect } from "react";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
+const normalizePath = (p) => p.endsWith("/") && p.length > 1 ? p.slice(0, -1) : p;
+const slugify = (s) => s.toLowerCase().trim().replace(/\s+/g, "-").replace(/[^a-z0-9\-]/g, "");
 const BaseNavBar = ({
   items,
   currentPath,
@@ -11,12 +13,12 @@ const BaseNavBar = ({
   theme = getDefaultTheme(),
   rounding = getDefaultRounding(),
   shadow = getDefaultShadow(),
-  className,
+  className = "",
   "data-testid": testId = "nav-bar"
 }) => {
   const wrapperClass = useMemo(
     () => combineClassNames(classMap.container, classMap[theme], className),
-    [classMap, theme]
+    [classMap, theme, className]
   );
   const itemClass = useMemo(
     () => combineClassNames(
@@ -26,59 +28,50 @@ const BaseNavBar = ({
     ),
     [classMap, shadow, rounding]
   );
+  const current = normalizePath(currentPath ?? "/");
   return /* @__PURE__ */ jsx(
     "nav",
     {
-      role: "navigation",
       "aria-label": "Main navigation",
       className: wrapperClass,
       "data-testid": `${testId}-nav-bar`,
-      children: items.map((item, index) => {
-        const isActive = currentPath === item.path;
-        console.log(
-          "Nav item className:",
-          combineClassNames(classMap.item, isActive && classMap.active)
-        );
-        return /* @__PURE__ */ jsx(
+      children: /* @__PURE__ */ jsx("ul", { className: classMap.list, children: items.map((item) => {
+        const isActive = normalizePath(item.path) === current;
+        const slug = slugify(item.label || item.path);
+        return /* @__PURE__ */ jsx("li", { className: classMap.listItem, children: /* @__PURE__ */ jsx(
           LinkWrapper,
           {
             href: item.path,
             isActive,
             className: combineClassNames(
               itemClass,
-              isActive && classMap["item--active"]
+              isActive && classMap.active
             ),
-            testId: `${testId}-nav-item-${item.label.toLowerCase()}`,
+            "data-testid": `${testId}-nav-item-${slug}`,
             "aria-current": isActive ? "page" : void 0,
-            children: /* @__PURE__ */ jsxs(
-              "span",
-              {
-                className: classMap.linkContent,
-                style: { display: "flex", alignItems: "center" },
-                children: [
-                  /* @__PURE__ */ jsx(
-                    "span",
-                    {
-                      className: classMap.icon,
-                      "aria-hidden": "true",
-                      "data-testid": `${testId}-nav-icon-${item.label.toLowerCase()}`,
-                      children: item.icon
-                    }
-                  ),
-                  /* @__PURE__ */ jsx("span", { className: classMap.label, children: item.label })
-                ]
-              }
-            )
-          },
-          `${item.label}-${index}`
-        );
-      })
+            children: /* @__PURE__ */ jsxs("span", { className: classMap.linkContent, children: [
+              item.icon && /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: classMap.icon,
+                  "aria-hidden": "true",
+                  "data-testid": `${testId}-nav-icon-${slug}`,
+                  children: item.icon
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: classMap.label, children: item.label })
+            ] })
+          }
+        ) }, `${item.path}-${slug}`);
+      }) })
     }
   );
 };
+BaseNavBar.displayName = "BaseNavBar";
 const classes = {
   container: "nav",
   item: "nav_item",
+  list: "nav_list",
   "item--active": "nav_active",
   icon: "nav_icon_container",
   label: "nav_label",
@@ -109,7 +102,13 @@ const NavBar = (props) => {
     {
       ...props,
       currentPath: pathname,
-      LinkWrapper: ({ href, children, className, isActive, testId }) => /* @__PURE__ */ jsx(
+      LinkWrapper: ({
+        href,
+        children,
+        className,
+        isActive,
+        "data-testid": testId
+      }) => /* @__PURE__ */ jsx(
         "a",
         {
           href,
@@ -126,4 +125,4 @@ const NavBar = (props) => {
 export {
   NavBar as N
 };
-//# sourceMappingURL=NavBar-UpeebUNC.js.map
+//# sourceMappingURL=NavBar-CBC9YPkH.js.map

package/dist/core/NavBar-CBC9YPkH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBar-CBC9YPkH.js","sources":["../../src/components/NavBar/NavBarBase.tsx","../../src/components/NavBar/core/NavBar.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\nimport { BaseNavBarProps } from \"./NavBar.types\";\r\n\r\nconst normalizePath = (p: string) =>\r\n  p.endsWith(\"/\") && p.length > 1 ? p.slice(0, -1) : p;\r\nconst slugify = (s: string) =>\r\n  s\r\n    .toLowerCase()\r\n    .trim()\r\n    .replace(/\\s+/g, \"-\")\r\n    .replace(/[^a-z0-9\\-]/g, \"\");\r\n\r\nconst BaseNavBar: React.FC<BaseNavBarProps> = ({\r\n  items,\r\n  currentPath,\r\n  LinkWrapper,\r\n  classMap,\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  \"data-testid\": testId = \"nav-bar\",\r\n}) => {\r\n  const wrapperClass = useMemo(\r\n    () => combineClassNames(classMap.container, classMap[theme], className),\r\n    [classMap, theme, className]\r\n  );\r\n\r\n  const itemClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.item,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`]\r\n      ),\r\n    [classMap, shadow, rounding]\r\n  );\r\n\r\n  const current = normalizePath(currentPath ?? \"/\");\r\n\r\n  return (\r\n    <nav\r\n      aria-label=\"Main navigation\"\r\n      className={wrapperClass}\r\n      data-testid={`${testId}-nav-bar`}\r\n    >\r\n      <ul className={classMap.list}>\r\n        {items.map((item) => {\r\n          const isActive = normalizePath(item.path) === current;\r\n          const slug = slugify(item.label || item.path);\r\n\r\n          return (\r\n            <li key={`${item.path}-${slug}`} className={classMap.listItem}>\r\n              <LinkWrapper\r\n                href={item.path}\r\n                isActive={isActive}\r\n                className={combineClassNames(\r\n                  itemClass,\r\n                  isActive && classMap.active\r\n                )}\r\n                data-testid={`${testId}-nav-item-${slug}`}\r\n                aria-current={isActive ? \"page\" : undefined}\r\n              >\r\n                <span className={classMap.linkContent}>\r\n                  {item.icon && (\r\n                    <span\r\n                      className={classMap.icon}\r\n                      aria-hidden=\"true\"\r\n                      data-testid={`${testId}-nav-icon-${slug}`}\r\n                    >\r\n                      {item.icon}\r\n                    </span>\r\n                  )}\r\n                  <span className={classMap.label}>{item.label}</span>\r\n                </span>\r\n              </LinkWrapper>\r\n            </li>\r\n          );\r\n        })}\r\n      </ul>\r\n    </nav>\r\n  );\r\n};\r\n\r\nBaseNavBar.displayName = \"BaseNavBar\";\r\nexport default BaseNavBar;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport BaseNavBar from \"../NavBarBase\";\r\nimport \"./NavBar.scss\";\r\nimport { NavBarProps } from \"../NavBar.types\";\r\n\r\nconst classes = {\r\n  container: \"nav\",\r\n  item: \"nav_item\",\r\n  list: \"nav_list\",\r\n  \"item--active\": \"nav_active\",\r\n  icon: \"nav_icon_container\",\r\n  label: \"nav_label\",\r\n  linkContent: \"nav_link_container\",\r\n\r\n  primary: \"nav_primary\",\r\n  secondary: \"nav_secondary\",\r\n  tertiary: \"nav_tertiary\",\r\n  quaternary: \"nav_quaternary\",\r\n  clear: \"nav_clear\",\r\n\r\n  shadowNone: \"nav_shadow-None\",\r\n  shadowLight: \"nav_shadow-Light\",\r\n  shadowMedium: \"nav_shadow-Medium\",\r\n  shadowStrong: \"nav_shadow-Strong\",\r\n  shadowIntense: \"nav_shadow-Intense\",\r\n\r\n  roundNone: \"nav_round-None\",\r\n  roundSmall: \"nav_round-Small\",\r\n  roundMedium: \"nav_round-Medium\",\r\n  roundLarge: \"nav_round-Large\",\r\n  roundFull: \"nav_round-Full\",\r\n};\r\n\r\nconst NavBar: React.FC<NavBarProps> = (props) => {\r\n  const [pathname, setPathname] = useState(\"\");\r\n\r\n  useEffect(() => {\r\n    setPathname(window.location.pathname);\r\n  }, []);\r\n\r\n  return (\r\n    <BaseNavBar\r\n      {...props}\r\n      currentPath={pathname}\r\n      LinkWrapper={({\r\n        href,\r\n        children,\r\n        className,\r\n        isActive,\r\n        \"data-testid\": testId,\r\n      }) => (\r\n        <a\r\n          href={href}\r\n          className={className}\r\n          aria-current={isActive ? \"page\" : undefined}\r\n          data-testid={testId}\r\n        >\r\n          {children}\r\n        </a>\r\n      )}\r\n      classMap={classes}\r\n    />\r\n  );\r\n};\r\n\r\nexport default NavBar;\r\n"],"names":[],"mappings":"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"}

package/dist/core/{NavBar-Dier3-3b.cjs → NavBar-DUNxiip6.cjs}

@@ -4,6 +4,8 @@ const React = require("react");
 const classNames = require("./classNames-BcWMx052.cjs");
 const capitalize = require("./capitalize-DoV-nOmN.cjs");
 const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
+const normalizePath = (p) => p.endsWith("/") && p.length > 1 ? p.slice(0, -1) : p;
+const slugify = (s) => s.toLowerCase().trim().replace(/\s+/g, "-").replace(/[^a-z0-9\-]/g, "");
 const BaseNavBar = ({
   items,
   currentPath,
@@ -12,12 +14,12 @@ const BaseNavBar = ({
   theme = borealStyleConfig.getDefaultTheme(),
   rounding = borealStyleConfig.getDefaultRounding(),
   shadow = borealStyleConfig.getDefaultShadow(),
-  className,
+  className = "",
   "data-testid": testId = "nav-bar"
 }) => {
   const wrapperClass = React.useMemo(
     () => classNames.combineClassNames(classMap.container, classMap[theme], className),
-    [classMap, theme]
+    [classMap, theme, className]
   );
   const itemClass = React.useMemo(
     () => classNames.combineClassNames(
@@ -27,59 +29,50 @@ const BaseNavBar = ({
     ),
     [classMap, shadow, rounding]
   );
+  const current = normalizePath(currentPath ?? "/");
   return /* @__PURE__ */ jsxRuntime.jsx(
     "nav",
     {
-      role: "navigation",
       "aria-label": "Main navigation",
       className: wrapperClass,
       "data-testid": `${testId}-nav-bar`,
-      children: items.map((item, index) => {
-        const isActive = currentPath === item.path;
-        console.log(
-          "Nav item className:",
-          classNames.combineClassNames(classMap.item, isActive && classMap.active)
-        );
-        return /* @__PURE__ */ jsxRuntime.jsx(
+      children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: classMap.list, children: items.map((item) => {
+        const isActive = normalizePath(item.path) === current;
+        const slug = slugify(item.label || item.path);
+        return /* @__PURE__ */ jsxRuntime.jsx("li", { className: classMap.listItem, children: /* @__PURE__ */ jsxRuntime.jsx(
           LinkWrapper,
           {
             href: item.path,
             isActive,
             className: classNames.combineClassNames(
               itemClass,
-              isActive && classMap["item--active"]
+              isActive && classMap.active
             ),
-            testId: `${testId}-nav-item-${item.label.toLowerCase()}`,
+            "data-testid": `${testId}-nav-item-${slug}`,
             "aria-current": isActive ? "page" : void 0,
-            children: /* @__PURE__ */ jsxRuntime.jsxs(
-              "span",
-              {
-                className: classMap.linkContent,
-                style: { display: "flex", alignItems: "center" },
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "span",
-                    {
-                      className: classMap.icon,
-                      "aria-hidden": "true",
-                      "data-testid": `${testId}-nav-icon-${item.label.toLowerCase()}`,
-                      children: item.icon
-                    }
-                  ),
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.label, children: item.label })
-                ]
-              }
-            )
-          },
-          `${item.label}-${index}`
-        );
-      })
+            children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: classMap.linkContent, children: [
+              item.icon && /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: classMap.icon,
+                  "aria-hidden": "true",
+                  "data-testid": `${testId}-nav-icon-${slug}`,
+                  children: item.icon
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.label, children: item.label })
+            ] })
+          }
+        ) }, `${item.path}-${slug}`);
+      }) })
     }
   );
 };
+BaseNavBar.displayName = "BaseNavBar";
 const classes = {
   container: "nav",
   item: "nav_item",
+  list: "nav_list",
   "item--active": "nav_active",
   icon: "nav_icon_container",
   label: "nav_label",
@@ -110,7 +103,13 @@ const NavBar = (props) => {
     {
       ...props,
       currentPath: pathname,
-      LinkWrapper: ({ href, children, className, isActive, testId }) => /* @__PURE__ */ jsxRuntime.jsx(
+      LinkWrapper: ({
+        href,
+        children,
+        className,
+        isActive,
+        "data-testid": testId
+      }) => /* @__PURE__ */ jsxRuntime.jsx(
         "a",
         {
           href,
@@ -125,4 +124,4 @@ const NavBar = (props) => {
   );
 };
 exports.NavBar = NavBar;
-//# sourceMappingURL=NavBar-Dier3-3b.cjs.map
+//# sourceMappingURL=NavBar-DUNxiip6.cjs.map

package/dist/core/NavBar-DUNxiip6.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavBar-DUNxiip6.cjs","sources":["../../src/components/NavBar/NavBarBase.tsx","../../src/components/NavBar/core/NavBar.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\nimport { BaseNavBarProps } from \"./NavBar.types\";\r\n\r\nconst normalizePath = (p: string) =>\r\n  p.endsWith(\"/\") && p.length > 1 ? p.slice(0, -1) : p;\r\nconst slugify = (s: string) =>\r\n  s\r\n    .toLowerCase()\r\n    .trim()\r\n    .replace(/\\s+/g, \"-\")\r\n    .replace(/[^a-z0-9\\-]/g, \"\");\r\n\r\nconst BaseNavBar: React.FC<BaseNavBarProps> = ({\r\n  items,\r\n  currentPath,\r\n  LinkWrapper,\r\n  classMap,\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  \"data-testid\": testId = \"nav-bar\",\r\n}) => {\r\n  const wrapperClass = useMemo(\r\n    () => combineClassNames(classMap.container, classMap[theme], className),\r\n    [classMap, theme, className]\r\n  );\r\n\r\n  const itemClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.item,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`]\r\n      ),\r\n    [classMap, shadow, rounding]\r\n  );\r\n\r\n  const current = normalizePath(currentPath ?? \"/\");\r\n\r\n  return (\r\n    <nav\r\n      aria-label=\"Main navigation\"\r\n      className={wrapperClass}\r\n      data-testid={`${testId}-nav-bar`}\r\n    >\r\n      <ul className={classMap.list}>\r\n        {items.map((item) => {\r\n          const isActive = normalizePath(item.path) === current;\r\n          const slug = slugify(item.label || item.path);\r\n\r\n          return (\r\n            <li key={`${item.path}-${slug}`} className={classMap.listItem}>\r\n              <LinkWrapper\r\n                href={item.path}\r\n                isActive={isActive}\r\n                className={combineClassNames(\r\n                  itemClass,\r\n                  isActive && classMap.active\r\n                )}\r\n                data-testid={`${testId}-nav-item-${slug}`}\r\n                aria-current={isActive ? \"page\" : undefined}\r\n              >\r\n                <span className={classMap.linkContent}>\r\n                  {item.icon && (\r\n                    <span\r\n                      className={classMap.icon}\r\n                      aria-hidden=\"true\"\r\n                      data-testid={`${testId}-nav-icon-${slug}`}\r\n                    >\r\n                      {item.icon}\r\n                    </span>\r\n                  )}\r\n                  <span className={classMap.label}>{item.label}</span>\r\n                </span>\r\n              </LinkWrapper>\r\n            </li>\r\n          );\r\n        })}\r\n      </ul>\r\n    </nav>\r\n  );\r\n};\r\n\r\nBaseNavBar.displayName = \"BaseNavBar\";\r\nexport default BaseNavBar;\r\n","import React, { useEffect, useState } from \"react\";\r\nimport BaseNavBar from \"../NavBarBase\";\r\nimport \"./NavBar.scss\";\r\nimport { NavBarProps } from \"../NavBar.types\";\r\n\r\nconst classes = {\r\n  container: \"nav\",\r\n  item: \"nav_item\",\r\n  list: \"nav_list\",\r\n  \"item--active\": \"nav_active\",\r\n  icon: \"nav_icon_container\",\r\n  label: \"nav_label\",\r\n  linkContent: \"nav_link_container\",\r\n\r\n  primary: \"nav_primary\",\r\n  secondary: \"nav_secondary\",\r\n  tertiary: \"nav_tertiary\",\r\n  quaternary: \"nav_quaternary\",\r\n  clear: \"nav_clear\",\r\n\r\n  shadowNone: \"nav_shadow-None\",\r\n  shadowLight: \"nav_shadow-Light\",\r\n  shadowMedium: \"nav_shadow-Medium\",\r\n  shadowStrong: \"nav_shadow-Strong\",\r\n  shadowIntense: \"nav_shadow-Intense\",\r\n\r\n  roundNone: \"nav_round-None\",\r\n  roundSmall: \"nav_round-Small\",\r\n  roundMedium: \"nav_round-Medium\",\r\n  roundLarge: \"nav_round-Large\",\r\n  roundFull: \"nav_round-Full\",\r\n};\r\n\r\nconst NavBar: React.FC<NavBarProps> = (props) => {\r\n  const [pathname, setPathname] = useState(\"\");\r\n\r\n  useEffect(() => {\r\n    setPathname(window.location.pathname);\r\n  }, []);\r\n\r\n  return (\r\n    <BaseNavBar\r\n      {...props}\r\n      currentPath={pathname}\r\n      LinkWrapper={({\r\n        href,\r\n        children,\r\n        className,\r\n        isActive,\r\n        \"data-testid\": testId,\r\n      }) => (\r\n        <a\r\n          href={href}\r\n          className={className}\r\n          aria-current={isActive ? \"page\" : undefined}\r\n          data-testid={testId}\r\n        >\r\n          {children}\r\n        </a>\r\n      )}\r\n      classMap={classes}\r\n    />\r\n  );\r\n};\r\n\r\nexport default NavBar;\r\n"],"names":["getDefaultTheme","getDefaultRounding","getDefaultShadow","useMemo","combineClassNames","capitalize","jsx","jsxs","useState","useEffect"],"mappings":"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"}

package/dist/core/NavBar.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const NavBar = require("./NavBar-Dier3-3b.cjs");
+const NavBar = require("./NavBar-DUNxiip6.cjs");
 module.exports = NavBar.NavBar;
 //# sourceMappingURL=NavBar.cjs.js.map

package/dist/core/NavBar.js

@@ -1,4 +1,4 @@
-import { N } from "./NavBar-UpeebUNC.js";
+import { N } from "./NavBar-CBC9YPkH.js";
 export {
   N as default
 };