@neo4j-ndl/react 4.7.4 → 4.7.6

package/lib/cjs/breadcrumbs/Breadcrumbs.js

@@ -39,6 +39,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = require("react");
+const tooltip_1 = require("../tooltip");
 const BreadcrumbsComponent = (_a) => {
     var { children, className, htmlAttributes, style, ref, shouldWrap = true } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes", "style", "ref", "shouldWrap"]);
     const classes = (0, classnames_1.default)('ndl-breadcrumbs', className);
@@ -64,15 +65,34 @@ const BreadcrumbsItem = (_a) => {
 const BreadcrumbsButton = (_a) => {
     var { children, as, className, style, htmlAttributes, ref, leadingElement, trailingElement } = _a, restProps = __rest(_a, ["children", "as", "className", "style", "htmlAttributes", "ref", "leadingElement", "trailingElement"]);
     (0, exports.useBreadcrumbsItemContext)();
+    const [isTooltipOpen, setIsTooltipOpen] = (0, react_1.useState)(false);
+    const contentRef = (0, react_1.useRef)(null);
     const Component = as !== null && as !== void 0 ? as : 'button';
     const classes = (0, classnames_1.default)('ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover', className);
-    return ((0, jsx_runtime_1.jsxs)(Component, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, restProps, { children: [Boolean(leadingElement) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-leading-element", children: leadingElement })), (0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-content", children: children }), Boolean(trailingElement) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-trailing-element", children: trailingElement }))] })));
+    return ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, { type: "simple", isOpen: isTooltipOpen, onOpenChange: (isOpen) => {
+            var _a, _b, _c, _d;
+            if (isOpen) {
+                const isTruncated = ((_a = contentRef.current) === null || _a === void 0 ? void 0 : _a.scrollWidth) &&
+                    ((_b = contentRef.current) === null || _b === void 0 ? void 0 : _b.clientWidth) &&
+                    contentRef.current.scrollWidth > contentRef.current.clientWidth;
+                const isVisible = ((_c = contentRef.current) === null || _c === void 0 ? void 0 : _c.offsetWidth) &&
+                    ((_d = contentRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) &&
+                    contentRef.current.offsetWidth > 0 &&
+                    contentRef.current.offsetHeight > 0;
+                setIsTooltipOpen(isTruncated || !isVisible);
+            }
+            else {
+                setIsTooltipOpen(false);
+            }
+        }, children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Trigger, { hasButtonWrapper: true, children: (0, jsx_runtime_1.jsxs)(Component, Object.assign({ ref: ref, className: classes, style: style }, htmlAttributes, restProps, { children: [Boolean(leadingElement) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-leading-element", children: leadingElement })), (0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-content", ref: contentRef, children: children }), Boolean(trailingElement) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-trailing-element", children: trailingElement }))] })) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Content, { children: children })] }));
 };
 const BreadcrumbsSelectButton = (_a) => {
-    var { onClick, children, className, style, htmlAttributes, ariaLabel, ref } = _a, restProps = __rest(_a, ["onClick", "children", "className", "style", "htmlAttributes", "ariaLabel", "ref"]);
+    var { onClick, children, isActive, className, style, htmlAttributes, ariaLabel, ref } = _a, restProps = __rest(_a, ["onClick", "children", "isActive", "className", "style", "htmlAttributes", "ariaLabel", "ref"]);
     (0, exports.useBreadcrumbsItemContext)();
-    const classes = (0, classnames_1.default)('ndl-breadcrumbs-select', className);
-    return ((0, jsx_runtime_1.jsx)(BreadcrumbsButton, Object.assign({ ref: ref, as: "button", className: classes, style: style, onClick: onClick, htmlAttributes: Object.assign(Object.assign({}, htmlAttributes), { 'aria-label': ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : htmlAttributes === null || htmlAttributes === void 0 ? void 0 : htmlAttributes['aria-label'] }), leadingElement: (0, jsx_runtime_1.jsx)(icons_1.ChevronDownIconOutline, {}) }, restProps, { children: children })));
+    const classes = (0, classnames_1.default)('ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover ndl-breadcrumbs-select', className, {
+        'ndl-active': Boolean(isActive),
+    });
+    return ((0, jsx_runtime_1.jsxs)("button", Object.assign({ ref: ref, className: classes, style: style, onClick: onClick, "aria-label": ariaLabel, "aria-pressed": isActive }, htmlAttributes, restProps, { children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-leading-element", children: (0, jsx_runtime_1.jsx)(icons_1.ChevronDownIconOutline, {}) }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-breadcrumbs-button-content", children: children })] })));
 };
 const BreadcrumbsLink = (_a) => {
     var { children, as, className, style, htmlAttributes, ariaCurrent = false, ref } = _a, restProps = __rest(_a, ["children", "as", "className", "style", "htmlAttributes", "ariaCurrent", "ref"]);

package/lib/cjs/breadcrumbs/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../src/breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { createContext, useContext } from 'react';\n\nimport {\n  type CommonProps,\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\n\ntype BreadcrumbsProps = {\n  /** Content to be rendered. Should only be `Breadcrumbs.Item`. */\n  children?: React.ReactNode;\n  /** Additional classnames. */\n  shouldWrap?: boolean;\n};\n\nconst BreadcrumbsComponent = ({\n  children,\n  className,\n  htmlAttributes,\n  style,\n  ref,\n  shouldWrap = true,\n  ...restProps\n}: CommonProps<'nav', BreadcrumbsProps>) => {\n  const classes = classNames('ndl-breadcrumbs', className);\n  const listClasses = classNames('ndl-breadcrumbs-list', {\n    'ndl-breadcrumbs-wrap': shouldWrap,\n  });\n  return (\n    <nav\n      aria-label=\"Breadcrumb\"\n      ref={ref}\n      className={classes}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <ol className={listClasses}>{children}</ol>\n    </nav>\n  );\n};\n\ntype BreadcrumbsItemContextType = {\n  isInBreadcrumbsItem: boolean;\n};\n\nconst BreadcrumbsItemContext = createContext<BreadcrumbsItemContextType | null>(\n  null,\n);\n\nexport const useBreadcrumbsItemContext = (): BreadcrumbsItemContextType => {\n  const context = useContext(BreadcrumbsItemContext);\n  if (!context) {\n    throw new Error('This component must be used within a <Breadcrumbs.Item>');\n  }\n\n  return context;\n};\n\ntype BreadcrumbsItemProps = {\n  /** Content to be rendered. Should be either `Breadcrumbs.Link`, `Breadcrumbs.Button` or `Breadcrumbs.SelectButton`. */\n  children?: React.ReactNode;\n};\n\nconst BreadcrumbsItem = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'li', BreadcrumbsItemProps>) => {\n  const classes = classNames('ndl-breadcrumbs-item', className);\n\n  return (\n    <BreadcrumbsItemContext.Provider value={{ isInBreadcrumbsItem: true }}>\n      <li\n        ref={ref}\n        className={classes}\n        style={style}\n        {...htmlAttributes}\n        {...restProps}\n      >\n        <div className=\"ndl-breadcrumbs-item-inner\">{children}</div>\n      </li>\n    </BreadcrumbsItemContext.Provider>\n  );\n};\n\ntype InteractiveBreadcrumbProps = {\n  /** Content to be rendered. */\n  children?: React.ReactNode;\n} & (\n  | {\n      as: 'button';\n      /**\n       * Event handler for when the button is clicked. Only applicable if `as` is `'button'`.\n       */\n      onClick?: (\n        event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n      ) => void;\n    }\n  | {\n      as: 'a';\n      /**\n       * The href of the link. Only applicable if `as` is `'a'`.\n       */\n      href: HtmlAttributes<'a'>['href'];\n      /**\n       * The target of the link. Only applicable if `as` is `'a'`.\n       */\n      target?: HtmlAttributes<'a'>['target'];\n    }\n  | {\n      /**\n       * What HTML element to render the root element as.\n       */\n      as?: React.ElementType;\n    }\n);\n\ntype BreadcrumbsButtonProps = InteractiveBreadcrumbProps & {\n  /** Leading element to be rendered. */\n  leadingElement?: React.ReactNode;\n  /** Trailing element to be rendered. */\n  trailingElement?: React.ReactNode;\n};\n\nconst BreadcrumbsButton = <T extends React.ElementType = 'button'>({\n  children,\n  as,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  leadingElement,\n  trailingElement,\n  ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsButtonProps>) => {\n  useBreadcrumbsItemContext();\n\n  const Component: React.ElementType = as ?? 'button';\n\n  const classes = classNames(\n    'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover',\n    className,\n  );\n\n  return (\n    <Component\n      ref={ref}\n      className={classes}\n      style={style}\n      {...htmlAttributes}\n      {...restProps}\n    >\n      {Boolean(leadingElement) && (\n        <div className=\"ndl-breadcrumbs-button-leading-element\">\n          {leadingElement}\n        </div>\n      )}\n      <div className=\"ndl-breadcrumbs-button-content\">{children}</div>\n      {Boolean(trailingElement) && (\n        <div className=\"ndl-breadcrumbs-button-trailing-element\">\n          {trailingElement}\n        </div>\n      )}\n    </Component>\n  );\n};\n\ntype BreadcrumbsSelectButtonProps = {\n  /** Event handler for when the button is clicked. Should be used to open a `Menu`. */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Aria label needed for accessibility. */\n  ariaLabel: string;\n  /** Content to be rendered. */\n  children?: React.ReactNode;\n  /** Additional classnames. */\n  className?: string;\n  /** Additional css styling. */\n  style?: React.CSSProperties;\n  /** HTML attributes. */\n  htmlAttributes?: HtmlAttributes<'button'>;\n};\n\nconst BreadcrumbsSelectButton = ({\n  onClick,\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ariaLabel,\n  ref,\n  ...restProps\n}: CommonProps<'button', BreadcrumbsSelectButtonProps>) => {\n  useBreadcrumbsItemContext();\n\n  const classes = classNames('ndl-breadcrumbs-select', className);\n\n  return (\n    <BreadcrumbsButton\n      ref={ref}\n      as=\"button\"\n      className={classes}\n      style={style}\n      onClick={onClick}\n      htmlAttributes={{\n        ...htmlAttributes,\n        'aria-label': ariaLabel ?? htmlAttributes?.['aria-label'],\n      }}\n      leadingElement={<ChevronDownIconOutline />}\n      {...restProps}\n    >\n      {children}\n    </BreadcrumbsButton>\n  );\n};\n\ntype BreadcrumbsLinkProps = InteractiveBreadcrumbProps & {\n  /**\n   * Whether the link is the current item. Use `'page'` if it indicates the current page and `'step'` for steps (in a multi-step wizard for example).\n   * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current\n   */\n  ariaCurrent?: React.AriaAttributes['aria-current'];\n};\n\nconst BreadcrumbsLink = <T extends React.ElementType = 'a'>({\n  children,\n  as,\n  className,\n  style,\n  htmlAttributes,\n  ariaCurrent = false,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsLinkProps>) => {\n  useBreadcrumbsItemContext();\n\n  const Component: React.ElementType = as ?? 'a';\n\n  const classes = classNames(\n    'ndl-breadcrumbs-link',\n    {\n      'ndl-breadcrumbs-link-current': Boolean(ariaCurrent),\n    },\n    className,\n  );\n\n  return (\n    <Component\n      ref={ref}\n      className={classes}\n      style={style}\n      aria-current={ariaCurrent}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </Component>\n  );\n};\n\nconst Breadcrumbs = Object.assign(BreadcrumbsComponent, {\n  Button: BreadcrumbsButton,\n  Item: BreadcrumbsItem,\n  Link: BreadcrumbsLink,\n  SelectButton: BreadcrumbsSelectButton,\n});\n\nexport { Breadcrumbs };\n"]}
+{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../src/breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { createContext, useContext, useRef, useState } from 'react';\n\nimport {\n  type CommonProps,\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport { Tooltip } from '../tooltip';\n\ntype BreadcrumbsProps = {\n  /** Content to be rendered. Should only be `Breadcrumbs.Item`. */\n  children?: React.ReactNode;\n  /** Additional classnames. */\n  shouldWrap?: boolean;\n};\n\nconst BreadcrumbsComponent = ({\n  children,\n  className,\n  htmlAttributes,\n  style,\n  ref,\n  shouldWrap = true,\n  ...restProps\n}: CommonProps<'nav', BreadcrumbsProps>) => {\n  const classes = classNames('ndl-breadcrumbs', className);\n  const listClasses = classNames('ndl-breadcrumbs-list', {\n    'ndl-breadcrumbs-wrap': shouldWrap,\n  });\n  return (\n    <nav\n      aria-label=\"Breadcrumb\"\n      ref={ref}\n      className={classes}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <ol className={listClasses}>{children}</ol>\n    </nav>\n  );\n};\n\ntype BreadcrumbsItemContextType = {\n  isInBreadcrumbsItem: boolean;\n};\n\nconst BreadcrumbsItemContext = createContext<BreadcrumbsItemContextType | null>(\n  null,\n);\n\nexport const useBreadcrumbsItemContext = (): BreadcrumbsItemContextType => {\n  const context = useContext(BreadcrumbsItemContext);\n  if (!context) {\n    throw new Error('This component must be used within a <Breadcrumbs.Item>');\n  }\n\n  return context;\n};\n\ntype BreadcrumbsItemProps = {\n  /** Content to be rendered. Should be either `Breadcrumbs.Link`, `Breadcrumbs.Button` or `Breadcrumbs.SelectButton`. */\n  children?: React.ReactNode;\n};\n\nconst BreadcrumbsItem = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'li', BreadcrumbsItemProps>) => {\n  const classes = classNames('ndl-breadcrumbs-item', className);\n\n  return (\n    <BreadcrumbsItemContext.Provider value={{ isInBreadcrumbsItem: true }}>\n      <li\n        ref={ref}\n        className={classes}\n        style={style}\n        {...htmlAttributes}\n        {...restProps}\n      >\n        <div className=\"ndl-breadcrumbs-item-inner\">{children}</div>\n      </li>\n    </BreadcrumbsItemContext.Provider>\n  );\n};\n\ntype InteractiveBreadcrumbProps = {\n  /** Content to be rendered. */\n  children?: React.ReactNode;\n} & (\n  | {\n      as: 'button';\n      /**\n       * Event handler for when the button is clicked. Only applicable if `as` is `'button'`.\n       */\n      onClick?: (\n        event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n      ) => void;\n    }\n  | {\n      as: 'a';\n      /**\n       * The href of the link. Only applicable if `as` is `'a'`.\n       */\n      href: HtmlAttributes<'a'>['href'];\n      /**\n       * The target of the link. Only applicable if `as` is `'a'`.\n       */\n      target?: HtmlAttributes<'a'>['target'];\n    }\n  | {\n      /**\n       * What HTML element to render the root element as.\n       */\n      as?: React.ElementType;\n    }\n);\n\ntype BreadcrumbsButtonProps = InteractiveBreadcrumbProps & {\n  /** Leading element to be rendered. */\n  leadingElement?: React.ReactNode;\n  /** Trailing element to be rendered. */\n  trailingElement?: React.ReactNode;\n};\n\nconst BreadcrumbsButton = <T extends React.ElementType = 'button'>({\n  children,\n  as,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  leadingElement,\n  trailingElement,\n  ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsButtonProps>) => {\n  useBreadcrumbsItemContext();\n\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const Component: React.ElementType = as ?? 'button';\n\n  const classes = classNames(\n    'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover',\n    className,\n  );\n\n  return (\n    <Tooltip\n      type=\"simple\"\n      isOpen={isTooltipOpen}\n      onOpenChange={(isOpen) => {\n        if (isOpen) {\n          const isTruncated =\n            contentRef.current?.scrollWidth &&\n            contentRef.current?.clientWidth &&\n            contentRef.current.scrollWidth > contentRef.current.clientWidth;\n          const isVisible =\n            contentRef.current?.offsetWidth &&\n            contentRef.current?.offsetHeight &&\n            contentRef.current.offsetWidth > 0 &&\n            contentRef.current.offsetHeight > 0;\n          setIsTooltipOpen(isTruncated || !isVisible);\n        } else {\n          setIsTooltipOpen(false);\n        }\n      }}\n    >\n      <Tooltip.Trigger hasButtonWrapper>\n        <Component\n          ref={ref}\n          className={classes}\n          style={style}\n          {...htmlAttributes}\n          {...restProps}\n        >\n          {Boolean(leadingElement) && (\n            <div className=\"ndl-breadcrumbs-button-leading-element\">\n              {leadingElement}\n            </div>\n          )}\n          <div className=\"ndl-breadcrumbs-button-content\" ref={contentRef}>\n            {children}\n          </div>\n          {Boolean(trailingElement) && (\n            <div className=\"ndl-breadcrumbs-button-trailing-element\">\n              {trailingElement}\n            </div>\n          )}\n        </Component>\n      </Tooltip.Trigger>\n      <Tooltip.Content>{children}</Tooltip.Content>\n    </Tooltip>\n  );\n};\n\ntype BreadcrumbsSelectButtonProps = {\n  /** Event handler for when the button is clicked. Should be used to open a `Menu`. */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Aria label needed for accessibility. */\n  ariaLabel: string;\n  /** Content to be rendered. */\n  children?: React.ReactNode;\n  /** Active - used when a connected menu is open */\n  isActive?: boolean;\n};\n\nconst BreadcrumbsSelectButton = ({\n  onClick,\n  children,\n  isActive,\n  className,\n  style,\n  htmlAttributes,\n  ariaLabel,\n  ref,\n  ...restProps\n}: CommonProps<'button', BreadcrumbsSelectButtonProps>) => {\n  useBreadcrumbsItemContext();\n\n  const classes = classNames(\n    'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover ndl-breadcrumbs-select',\n    className,\n    {\n      'ndl-active': Boolean(isActive),\n    },\n  );\n\n  return (\n    <button\n      ref={ref}\n      className={classes}\n      style={style}\n      onClick={onClick}\n      aria-label={ariaLabel}\n      aria-pressed={isActive}\n      {...htmlAttributes}\n      {...restProps}\n    >\n      <div className=\"ndl-breadcrumbs-button-leading-element\">\n        <ChevronDownIconOutline />\n      </div>\n      <div className=\"ndl-breadcrumbs-button-content\">{children}</div>\n    </button>\n  );\n};\n\ntype BreadcrumbsLinkProps = InteractiveBreadcrumbProps & {\n  /**\n   * Whether the link is the current item. Use `'page'` if it indicates the current page and `'step'` for steps (in a multi-step wizard for example).\n   * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current\n   */\n  ariaCurrent?: React.AriaAttributes['aria-current'];\n};\n\nconst BreadcrumbsLink = <T extends React.ElementType = 'a'>({\n  children,\n  as,\n  className,\n  style,\n  htmlAttributes,\n  ariaCurrent = false,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsLinkProps>) => {\n  useBreadcrumbsItemContext();\n\n  const Component: React.ElementType = as ?? 'a';\n\n  const classes = classNames(\n    'ndl-breadcrumbs-link',\n    {\n      'ndl-breadcrumbs-link-current': Boolean(ariaCurrent),\n    },\n    className,\n  );\n\n  return (\n    <Component\n      ref={ref}\n      className={classes}\n      style={style}\n      aria-current={ariaCurrent}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </Component>\n  );\n};\n\nconst Breadcrumbs = Object.assign(BreadcrumbsComponent, {\n  Button: BreadcrumbsButton,\n  Item: BreadcrumbsItem,\n  Link: BreadcrumbsLink,\n  SelectButton: BreadcrumbsSelectButton,\n});\n\nexport { Breadcrumbs };\n"]}

package/lib/cjs/breadcrumbs/stories/breadcrumbs-header.story.js

@@ -29,8 +29,8 @@ const Component = () => {
     const [isOrganizationMenuOpen, setIsOrganizationMenuOpen] = (0, react_2.useState)(false);
     const organizationMenuRef = (0, react_2.useRef)(null);
     return ((0, jsx_runtime_1.jsxs)(react_1.Breadcrumbs, { shouldWrap: false, children: [(0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.Item, { className: "n-mr-token-8", children: (0, jsx_runtime_1.jsx)("button", { "aria-label": "Home", className: "n-rounded-sm focus-visible:n-outline-2 focus-visible:n-outline-offset-[3px] focus-visible:n-outline-primary-focus n-shrink-0", children: (0, jsx_runtime_1.jsx)(icons_1.Neo4JIconColorIcon, { className: "n-h-6 n-w-[26px]" }) }) }), (0, jsx_runtime_1.jsxs)(react_1.Breadcrumbs.Item, { children: [(0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.Button, { leadingElement: (0, jsx_runtime_1.jsx)(icons_1.BuildingOffice2IconOutline, {}), children: "Organization 1" }), (0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.SelectButton, { ref: organizationMenuRef, ariaLabel: "Open organization menu", onClick: () => {
-                            setIsOrganizationMenuOpen(!isOrganizationMenuOpen);
-                        }, children: (0, jsx_runtime_1.jsxs)(react_1.Menu, { anchorRef: organizationMenuRef, isOpen: isOrganizationMenuOpen, onClose: () => setIsOrganizationMenuOpen(false), children: [(0, jsx_runtime_1.jsxs)(react_1.Menu.Group, { children: [(0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: "Organization 1", isChecked: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: "Organization 2", isChecked: false })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.Menu.Group, { children: (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "All Organizations" }) })] }) })] }), (0, jsx_runtime_1.jsxs)(react_1.Breadcrumbs.Item, { children: [(0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.Button, { leadingElement: (0, jsx_runtime_1.jsx)(icons_1.FolderIconOutline, {}), children: "Project 1" }), (0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.SelectButton, { ariaLabel: "Open project menu" })] })] }));
+                            setIsOrganizationMenuOpen((prev) => !prev);
+                        }, isActive: isOrganizationMenuOpen, children: (0, jsx_runtime_1.jsxs)(react_1.Menu, { anchorRef: organizationMenuRef, isOpen: isOrganizationMenuOpen, onClose: () => setIsOrganizationMenuOpen(false), children: [(0, jsx_runtime_1.jsxs)(react_1.Menu.Group, { children: [(0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: "Organization 1", isChecked: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: "Organization 2", isChecked: false })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.Menu.Group, { children: (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "All Organizations" }) })] }) })] }), (0, jsx_runtime_1.jsxs)(react_1.Breadcrumbs.Item, { children: [(0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.Button, { leadingElement: (0, jsx_runtime_1.jsx)(icons_1.FolderIconOutline, {}), children: "Project 1" }), (0, jsx_runtime_1.jsx)(react_1.Breadcrumbs.SelectButton, { ariaLabel: "Open project menu" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=breadcrumbs-header.story.js.map

package/lib/cjs/breadcrumbs/stories/breadcrumbs-header.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs-header.story.js","sourceRoot":"","sources":["../../../../src/breadcrumbs/stories/breadcrumbs-header.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAqD;AACrD,kDAIgC;AAChC,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5E,MAAM,mBAAmB,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAC;IAE5D,OAAO,CACL,wBAAC,mBAAW,IAAC,UAAU,EAAE,KAAK,aAC5B,uBAAC,mBAAW,CAAC,IAAI,IAAC,SAAS,EAAC,cAAc,YACxC,iDACa,MAAM,EACjB,SAAS,EAAC,8HAA8H,YAExI,uBAAC,0BAAkB,IAAC,SAAS,EAAC,kBAAkB,GAAG,GAC5C,GACQ,EACnB,wBAAC,mBAAW,CAAC,IAAI,eACf,uBAAC,mBAAW,CAAC,MAAM,IAAC,cAAc,EAAE,uBAAC,kCAA0B,KAAG,+BAE7C,EACrB,uBAAC,mBAAW,CAAC,YAAY,IACvB,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAC,wBAAwB,EAClC,OAAO,EAAE,GAAG,EAAE;4BACZ,yBAAyB,CAAC,CAAC,sBAAsB,CAAC,CAAC;wBACrD,CAAC,YAED,wBAAC,YAAI,IACH,SAAS,EAAE,mBAAmB,EAC9B,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,KAAK,CAAC,aAE/C,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,EAAC,SAAS,EAAE,IAAI,GAAI,EAC1D,uBAAC,YAAI,CAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,EAAC,SAAS,EAAE,KAAK,GAAI,IAChD,EACb,uBAAC,YAAI,CAAC,OAAO,KAAG,EAChB,uBAAC,YAAI,CAAC,KAAK,cACT,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,mBAAmB,GAAG,GAC5B,IACR,GACkB,IACV,EACnB,wBAAC,mBAAW,CAAC,IAAI,eACf,uBAAC,mBAAW,CAAC,MAAM,IAAC,cAAc,EAAE,uBAAC,yBAAiB,KAAG,0BAEpC,EACrB,uBAAC,mBAAW,CAAC,YAAY,IAAC,SAAS,EAAC,mBAAmB,GAA4B,IAClE,IACP,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Breadcrumbs, Menu } from '@neo4j-ndl/react';\nimport {\n  BuildingOffice2IconOutline,\n  FolderIconOutline,\n  Neo4JIconColorIcon,\n} from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const [isOrganizationMenuOpen, setIsOrganizationMenuOpen] = useState(false);\n  const organizationMenuRef = useRef<HTMLButtonElement>(null);\n\n  return (\n    <Breadcrumbs shouldWrap={false}>\n      <Breadcrumbs.Item className=\"n-mr-token-8\">\n        <button\n          aria-label=\"Home\"\n          className=\"n-rounded-sm focus-visible:n-outline-2 focus-visible:n-outline-offset-[3px] focus-visible:n-outline-primary-focus n-shrink-0\"\n        >\n          <Neo4JIconColorIcon className=\"n-h-6 n-w-[26px]\" />\n        </button>\n      </Breadcrumbs.Item>\n      <Breadcrumbs.Item>\n        <Breadcrumbs.Button leadingElement={<BuildingOffice2IconOutline />}>\n          Organization 1\n        </Breadcrumbs.Button>\n        <Breadcrumbs.SelectButton\n          ref={organizationMenuRef}\n          ariaLabel=\"Open organization menu\"\n          onClick={() => {\n            setIsOrganizationMenuOpen(!isOrganizationMenuOpen);\n          }}\n        >\n          <Menu\n            anchorRef={organizationMenuRef}\n            isOpen={isOrganizationMenuOpen}\n            onClose={() => setIsOrganizationMenuOpen(false)}\n          >\n            <Menu.Group>\n              <Menu.RadioItem title=\"Organization 1\" isChecked={true} />\n              <Menu.RadioItem title=\"Organization 2\" isChecked={false} />\n            </Menu.Group>\n            <Menu.Divider />\n            <Menu.Group>\n              <Menu.Item title=\"All Organizations\" />\n            </Menu.Group>\n          </Menu>\n        </Breadcrumbs.SelectButton>\n      </Breadcrumbs.Item>\n      <Breadcrumbs.Item>\n        <Breadcrumbs.Button leadingElement={<FolderIconOutline />}>\n          Project 1\n        </Breadcrumbs.Button>\n        <Breadcrumbs.SelectButton ariaLabel=\"Open project menu\"></Breadcrumbs.SelectButton>\n      </Breadcrumbs.Item>\n    </Breadcrumbs>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"breadcrumbs-header.story.js","sourceRoot":"","sources":["../../../../src/breadcrumbs/stories/breadcrumbs-header.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAqD;AACrD,kDAIgC;AAChC,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5E,MAAM,mBAAmB,GAAG,IAAA,cAAM,EAAoB,IAAI,CAAC,CAAC;IAE5D,OAAO,CACL,wBAAC,mBAAW,IAAC,UAAU,EAAE,KAAK,aAC5B,uBAAC,mBAAW,CAAC,IAAI,IAAC,SAAS,EAAC,cAAc,YACxC,iDACa,MAAM,EACjB,SAAS,EAAC,8HAA8H,YAExI,uBAAC,0BAAkB,IAAC,SAAS,EAAC,kBAAkB,GAAG,GAC5C,GACQ,EACnB,wBAAC,mBAAW,CAAC,IAAI,eACf,uBAAC,mBAAW,CAAC,MAAM,IAAC,cAAc,EAAE,uBAAC,kCAA0B,KAAG,+BAE7C,EACrB,uBAAC,mBAAW,CAAC,YAAY,IACvB,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAC,wBAAwB,EAClC,OAAO,EAAE,GAAG,EAAE;4BACZ,yBAAyB,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;wBAC7C,CAAC,EACD,QAAQ,EAAE,sBAAsB,YAEhC,wBAAC,YAAI,IACH,SAAS,EAAE,mBAAmB,EAC9B,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,GAAG,EAAE,CAAC,yBAAyB,CAAC,KAAK,CAAC,aAE/C,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,EAAC,SAAS,EAAE,IAAI,GAAI,EAC1D,uBAAC,YAAI,CAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,EAAC,SAAS,EAAE,KAAK,GAAI,IAChD,EACb,uBAAC,YAAI,CAAC,OAAO,KAAG,EAChB,uBAAC,YAAI,CAAC,KAAK,cACT,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,mBAAmB,GAAG,GAC5B,IACR,GACkB,IACV,EACnB,wBAAC,mBAAW,CAAC,IAAI,eACf,uBAAC,mBAAW,CAAC,MAAM,IAAC,cAAc,EAAE,uBAAC,yBAAiB,KAAG,0BAEpC,EACrB,uBAAC,mBAAW,CAAC,YAAY,IAAC,SAAS,EAAC,mBAAmB,GAA4B,IAClE,IACP,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Breadcrumbs, Menu } from '@neo4j-ndl/react';\nimport {\n  BuildingOffice2IconOutline,\n  FolderIconOutline,\n  Neo4JIconColorIcon,\n} from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const [isOrganizationMenuOpen, setIsOrganizationMenuOpen] = useState(false);\n  const organizationMenuRef = useRef<HTMLButtonElement>(null);\n\n  return (\n    <Breadcrumbs shouldWrap={false}>\n      <Breadcrumbs.Item className=\"n-mr-token-8\">\n        <button\n          aria-label=\"Home\"\n          className=\"n-rounded-sm focus-visible:n-outline-2 focus-visible:n-outline-offset-[3px] focus-visible:n-outline-primary-focus n-shrink-0\"\n        >\n          <Neo4JIconColorIcon className=\"n-h-6 n-w-[26px]\" />\n        </button>\n      </Breadcrumbs.Item>\n      <Breadcrumbs.Item>\n        <Breadcrumbs.Button leadingElement={<BuildingOffice2IconOutline />}>\n          Organization 1\n        </Breadcrumbs.Button>\n        <Breadcrumbs.SelectButton\n          ref={organizationMenuRef}\n          ariaLabel=\"Open organization menu\"\n          onClick={() => {\n            setIsOrganizationMenuOpen((prev) => !prev);\n          }}\n          isActive={isOrganizationMenuOpen}\n        >\n          <Menu\n            anchorRef={organizationMenuRef}\n            isOpen={isOrganizationMenuOpen}\n            onClose={() => setIsOrganizationMenuOpen(false)}\n          >\n            <Menu.Group>\n              <Menu.RadioItem title=\"Organization 1\" isChecked={true} />\n              <Menu.RadioItem title=\"Organization 2\" isChecked={false} />\n            </Menu.Group>\n            <Menu.Divider />\n            <Menu.Group>\n              <Menu.Item title=\"All Organizations\" />\n            </Menu.Group>\n          </Menu>\n        </Breadcrumbs.SelectButton>\n      </Breadcrumbs.Item>\n      <Breadcrumbs.Item>\n        <Breadcrumbs.Button leadingElement={<FolderIconOutline />}>\n          Project 1\n        </Breadcrumbs.Button>\n        <Breadcrumbs.SelectButton ariaLabel=\"Open project menu\"></Breadcrumbs.SelectButton>\n      </Breadcrumbs.Item>\n    </Breadcrumbs>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/side-navigation/SideNavigation.js

@@ -55,6 +55,8 @@ const SideNavComponent = (_a) => {
     var { children, className, style, htmlAttributes, isExpanded = false, shouldOverlayOnInteraction = true, ariaLabel, onPinButtonClick, expandedWidth, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "htmlAttributes", "isExpanded", "shouldOverlayOnInteraction", "ariaLabel", "onPinButtonClick", "expandedWidth", "ref"]);
     const [isHovered, setIsHovered] = (0, react_2.useState)(false);
     const [hasFocusVisible, setHasFocusVisible] = (0, react_2.useState)(false);
+    const [isCollapseTransitioning, setIsCollapseTransitioning] = (0, react_2.useState)(false);
+    const collapseTransitionTimeoutRef = (0, react_2.useRef)(null);
     const rootRef = (0, react_2.useRef)(null);
     const isFloatingExpanded = shouldOverlayOnInteraction && (!isHovered ? hasFocusVisible : true);
     const classes = (0, classnames_1.default)('ndl-side-nav', 'ndl-side-nav-root', className, {
@@ -62,9 +64,8 @@ const SideNavComponent = (_a) => {
         'ndl-side-nav-expanded': isExpanded,
     });
     const innerClasses = (0, classnames_1.default)('ndl-side-nav-inner', {
-        'ndl-side-nav-hover': shouldOverlayOnInteraction === true &&
-            isFloatingExpanded === true &&
-            isExpanded !== true,
+        'ndl-side-nav-collapsing': isCollapseTransitioning,
+        'ndl-side-nav-hover': isFloatingExpanded === true && isExpanded !== true,
     });
     const customStyle = Object.assign(Object.assign({}, style), (Boolean(expandedWidth) && {
         '--side-nav-width-expanded': typeof expandedWidth === 'string'
@@ -72,15 +73,42 @@ const SideNavComponent = (_a) => {
             : `${expandedWidth}px`,
     }));
     const mergedRef = (0, react_1.useMergeRefs)([ref, rootRef]);
+    const collapseTransitionDuration = Number.parseInt(base_1.tokens.motion.duration.quick, 10);
+    (0, react_2.useEffect)(() => {
+        return () => {
+            if (collapseTransitionTimeoutRef.current !== null) {
+                clearTimeout(collapseTransitionTimeoutRef.current);
+                collapseTransitionTimeoutRef.current = null;
+            }
+        };
+    }, []);
     return ((0, jsx_runtime_1.jsx)(side_navigation_context_1.SideNavContext.Provider, { value: {
             isExpanded,
             isHovered: isFloatingExpanded, // needs refactoring
             onPinButtonClick,
             shouldOverlayOnInteraction,
         }, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes, ref: mergedRef, style: customStyle, onMouseEnter: () => {
+                if (collapseTransitionTimeoutRef.current !== null) {
+                    clearTimeout(collapseTransitionTimeoutRef.current);
+                    collapseTransitionTimeoutRef.current = null;
+                }
+                setIsCollapseTransitioning(false);
                 setIsHovered(true);
             }, onMouseLeave: () => {
+                const shouldDelayZIndexRemoval = shouldOverlayOnInteraction &&
+                    !isExpanded &&
+                    (isHovered || hasFocusVisible);
                 setIsHovered(false);
+                if (shouldDelayZIndexRemoval) {
+                    if (collapseTransitionTimeoutRef.current !== null) {
+                        clearTimeout(collapseTransitionTimeoutRef.current);
+                    }
+                    setIsCollapseTransitioning(true);
+                    collapseTransitionTimeoutRef.current = setTimeout(() => {
+                        collapseTransitionTimeoutRef.current = null;
+                        setIsCollapseTransitioning(false);
+                    }, collapseTransitionDuration);
+                }
             }, onFocusCapture: () => {
                 // Delay slightly to let Composite's focus management settle
                 requestAnimationFrame(() => {

package/lib/cjs/side-navigation/SideNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../../../src/side-navigation/SideNavigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n  autoUpdate,\n  Composite,\n  CompositeItem,\n  flip,\n  FloatingFocusManager,\n  FloatingList,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useListItem,\n  useListNavigation,\n  useMergeRefs,\n  useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useRef, useState } from 'react';\n\nimport { IconIndicatorWrapper } from '../_common/IconIndicatorWrapper';\nimport {\n  type CommonProps,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { Divider } from '../divider';\nimport { ChevronRightIconOutline, PinIcon } from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport {\n  SideNavCategoryContext,\n  SideNavContext,\n  useSideNavCategoryContext,\n  useSideNavContext,\n} from './side-navigation-context';\nimport {\n  type CategoryHeaderProps,\n  type CategoryItemProps,\n  type ItemBadgeProps,\n  type NavItemProps,\n  type SideNavListItemProps,\n  type SideNavProps,\n} from './side-navigation-types';\n\n/**\n * SideNav\n */\nconst SideNavComponent = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  isExpanded = false,\n  shouldOverlayOnInteraction = true,\n  ariaLabel,\n  onPinButtonClick,\n  expandedWidth,\n  ref,\n  ...restProps\n}: CommonProps<'div', SideNavProps>) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const [hasFocusVisible, setHasFocusVisible] = useState(false);\n\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const isFloatingExpanded =\n    shouldOverlayOnInteraction && (!isHovered ? hasFocusVisible : true);\n\n  const classes = classNames('ndl-side-nav', 'ndl-side-nav-root', className, {\n    'ndl-side-nav-collapsed':\n      isExpanded !== true && shouldOverlayOnInteraction !== true,\n    'ndl-side-nav-expanded': isExpanded,\n  });\n\n  const innerClasses = classNames('ndl-side-nav-inner', {\n    'ndl-side-nav-hover':\n      shouldOverlayOnInteraction === true &&\n      isFloatingExpanded === true &&\n      isExpanded !== true,\n  });\n\n  const customStyle = {\n    ...style,\n    ...(Boolean(expandedWidth) && {\n      '--side-nav-width-expanded':\n        typeof expandedWidth === 'string'\n          ? expandedWidth\n          : `${expandedWidth}px`,\n    }),\n  };\n\n  const mergedRef = useMergeRefs([ref, rootRef]);\n\n  return (\n    <SideNavContext.Provider\n      value={{\n        isExpanded,\n        isHovered: isFloatingExpanded, // needs refactoring\n        onPinButtonClick,\n        shouldOverlayOnInteraction,\n      }}\n    >\n      <div\n        className={classes}\n        ref={mergedRef}\n        style={customStyle}\n        onMouseEnter={() => {\n          setIsHovered(true);\n        }}\n        onMouseLeave={() => {\n          setIsHovered(false);\n        }}\n        onFocusCapture={() => {\n          // Delay slightly to let Composite's focus management settle\n          requestAnimationFrame(() => {\n            const activeElement = document.activeElement;\n            // Check if focus is inside and visible (using :focus-visible on the active element)\n            if (\n              activeElement instanceof HTMLElement &&\n              rootRef.current !== null &&\n              rootRef.current.contains(activeElement) &&\n              activeElement.matches(':focus-visible')\n            ) {\n              // Update state after another frame to let focus fully settle\n              // This updates the context for consumers without disrupting focus\n              requestAnimationFrame(() => {\n                setHasFocusVisible(true);\n              });\n            }\n          });\n        }}\n        onBlurCapture={() => {\n          // Small delay to check if focus moved to another element inside\n          requestAnimationFrame(() => {\n            const activeElement = document.activeElement;\n            const isInsideNav =\n              activeElement instanceof HTMLElement &&\n              rootRef.current !== null &&\n              rootRef.current.contains(activeElement);\n            // Check if focus is in a portaled floating menu\n            const isInsideFloatingMenu =\n              activeElement instanceof HTMLElement &&\n              activeElement.closest('.ndl-side-nav-popover') !== null;\n\n            if (\n              (isInsideNav || isInsideFloatingMenu) &&\n              activeElement instanceof HTMLElement &&\n              activeElement.matches(':focus-visible')\n            ) {\n              // Focus stayed inside with focus-visible\n              setHasFocusVisible(true);\n            } else {\n              // Focus left - collapse\n              setHasFocusVisible(false);\n            }\n          });\n        }}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        <div className={innerClasses}>\n          {/** TODO v5: should the nav be the one that gets all the stuff spread on it? */}\n          <nav className=\"ndl-side-nav-nav\" aria-label={ariaLabel}>\n            <Composite\n              as=\"ul\"\n              aria-label={ariaLabel}\n              role=\"menubar\"\n              orientation=\"vertical\"\n              aria-orientation=\"vertical\"\n              className=\"ndl-side-nav-list\"\n              loop={true}\n            >\n              {children}\n            </Composite>\n          </nav>\n          {shouldOverlayOnInteraction === true && (\n            <div className=\"ndl-side-nav-footer\">\n              <PinButton />\n            </div>\n          )}\n        </div>\n      </div>\n    </SideNavContext.Provider>\n  );\n};\n\n/**\n * SideNavListItem\n */\nconst SideNavListItem = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'li', SideNavListItemProps>) => {\n  const classes = classNames('ndl-side-nav-list-item', className, {});\n\n  return (\n    <li\n      role=\"none\"\n      className={classes}\n      style={style}\n      ref={ref}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <SelectedIndicator />\n      {children}\n    </li>\n  );\n};\n\n/**\n * NavItem\n */\nconst NavItem = <T extends React.ElementType = 'button'>({\n  icon,\n  label,\n  trailingElement,\n  isActive,\n  className,\n  style,\n  htmlAttributes,\n  as,\n  badge,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, NavItemProps>) => {\n  const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n    useSideNavContext();\n  const categoryContext = useSideNavCategoryContext();\n  const isInCategory = categoryContext !== null;\n\n  const item = useListItem();\n  const mergedRef = useMergeRefs([item.ref, ref]);\n\n  const isActiveIndex = item.index === categoryContext?.activeIndex;\n\n  const Component: React.ElementType = as ?? 'button';\n  const classes = classNames('ndl-side-nav-nav-item', className, {\n    'ndl-active': isActive === true,\n  });\n\n  const Wrapper = isInCategory ? Component : CompositeItem;\n  const componentProps = {\n    className: classes,\n    ref: mergedRef,\n    role: 'menuitem',\n    style: style,\n    ...(isInCategory && {\n      ...categoryContext?.getItemProps(),\n      tabIndex: isActiveIndex ? 0 : -1,\n    }),\n    ...restProps,\n    ...htmlAttributes,\n  };\n  const wrapperProps = isInCategory\n    ? componentProps\n    : {\n        render: <Component {...componentProps} />,\n      };\n\n  return (\n    <ConditionalWrap\n      shouldWrap={\n        isExpanded === false &&\n        !shouldOverlayOnInteraction &&\n        !isInCategory &&\n        Boolean(label)\n      }\n      wrap={(children) => (\n        <Tooltip\n          type=\"simple\"\n          placement=\"right\"\n          hoverDelay={{ close: 0, open: shouldOverlayOnInteraction ? 100 : 0 }}\n        >\n          <Tooltip.Trigger hasButtonWrapper={true}>{children}</Tooltip.Trigger>\n          <Tooltip.Content>{label}</Tooltip.Content>\n        </Tooltip>\n      )}\n    >\n      <Wrapper {...wrapperProps}>\n        <div className=\"ndl-side-nav-item-inner\">\n          {Boolean(icon) && (\n            <div className=\"ndl-side-nav-item-leading-element\">\n              <ConditionalWrap\n                shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n                wrap={(children) => (\n                  <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n                    {children}\n                  </IconIndicatorWrapper>\n                )}\n              >\n                {icon}\n              </ConditionalWrap>\n            </div>\n          )}\n          {Boolean(label) && (\n            <Typography\n              variant=\"body-medium\"\n              as=\"div\"\n              className=\"ndl-side-nav-item-label\"\n            >\n              {label}\n            </Typography>\n          )}\n          {(Boolean(trailingElement) || Boolean(badge)) && (\n            <div className=\"ndl-side-nav-item-trailing-element\">\n              {trailingElement}\n              {badge !== undefined && (\n                <ItemBadge type={badge.type} number={badge.number} />\n              )}\n            </div>\n          )}\n        </div>\n      </Wrapper>\n    </ConditionalWrap>\n  );\n};\n\n/**\n * CategoryItem\n */\nconst CategoryItem = ({\n  children,\n  icon,\n  label,\n  isActive,\n  className,\n  style,\n  htmlAttributes,\n  badge,\n  isMenuOpen = false,\n  ref,\n  ...restProps\n}: CommonProps<'button', CategoryItemProps>) => {\n  const floatingId = useId();\n  const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n    useSideNavContext();\n  const anchorRef = useRef<HTMLLIElement>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  const elementsRef = useRef<\n    Array<HTMLButtonElement | HTMLAnchorElement | null>\n  >([]);\n\n  const classes = classNames('ndl-side-nav-category-item', className, {\n    'ndl-active': isActive === true,\n  });\n\n  // Floating UI setup\n  const { refs, context } = useFloating({\n    elements: {\n      reference: anchorRef.current,\n    },\n    middleware: [\n      offset(5),\n      flip({ crossAxis: true, fallbackAxisSideDirection: 'end', padding: 5 }),\n      shift({ padding: 5 }),\n    ],\n    onOpenChange: setIsOpen,\n    open: isOpen || isMenuOpen,\n    placement: 'right-start',\n    strategy: 'fixed',\n    whileElementsMounted: autoUpdate,\n  });\n\n  const dismiss = useDismiss(context, {\n    referencePress: false,\n  });\n  const hover = useHover(context, {\n    delay: { close: 130, open: 130 },\n    handleClose: safePolygon({\n      blockPointerEvents: false,\n      requireIntent: false,\n    }),\n  });\n  const focus = useFocus(context);\n  const listNavigation = useListNavigation(context, {\n    activeIndex: activeIndex,\n    focusItemOnHover: false,\n    focusItemOnOpen: false,\n    listRef: elementsRef,\n    loop: true,\n    nested: true,\n    onNavigate: setActiveIndex,\n    openOnArrowKeyDown: false,\n  });\n\n  // Separate interactions: reference (no listNavigation), floating (with listNavigation)\n  const refInteractions = useInteractions([dismiss, hover, focus]);\n  const floatInteractions = useInteractions([dismiss, hover, listNavigation]);\n  const { styles: transitionStyles } = useTransitionStyles(context, {\n    duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n  });\n\n  // Reset activeIndex when menu closes\n  useEffect(() => {\n    if (!context.open) {\n      setActiveIndex(null);\n    }\n  }, [context.open]);\n\n  const mergedRef = useMergeRefs([refs.setReference, ref]);\n\n  return (\n    <SideNavCategoryContext.Provider\n      value={{\n        activeIndex,\n        getItemProps: floatInteractions.getItemProps,\n      }}\n    >\n      <ConditionalWrap\n        shouldWrap={\n          isExpanded === false && !shouldOverlayOnInteraction && Boolean(label)\n        }\n        wrap={(children) => (\n          <Tooltip\n            type=\"simple\"\n            placement=\"top\"\n            hoverDelay={{\n              close: 0,\n              open: shouldOverlayOnInteraction ? 100 : 0,\n            }}\n            isOpen={isTooltipOpen}\n            onOpenChange={setIsTooltipOpen}\n          >\n            <Tooltip.Trigger hasButtonWrapper={true}>\n              {children}\n            </Tooltip.Trigger>\n            <Tooltip.Content className=\"ndl-side-nav ndl-side-nav-category-menu-tooltip-content\">\n              {label}\n            </Tooltip.Content>\n          </Tooltip>\n        )}\n      >\n        <CompositeItem\n          render={\n            <button\n              {...refInteractions.getReferenceProps({\n                className: classes,\n                ref: mergedRef,\n                style,\n                ...restProps,\n                ...htmlAttributes,\n              })}\n              // {...restProps}\n              // {...htmlAttributes}\n              role=\"menuitem\"\n              aria-haspopup=\"menu\"\n              aria-expanded={context.open}\n              aria-controls={floatingId}\n              onFocus={(e) => {\n                // Only show tooltip on focus-visible (keyboard navigation)\n                if (\n                  e.target instanceof HTMLElement &&\n                  e.target.matches(':focus-visible')\n                ) {\n                  setIsTooltipOpen(true);\n                }\n                // Call original handler if exists\n                const originalOnFocus = refInteractions.getReferenceProps({})\n                  .onFocus as\n                  | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n                  | undefined;\n                originalOnFocus?.(e);\n              }}\n              onBlur={(e) => {\n                setIsTooltipOpen(false);\n                // Call original handler if exists\n                const originalOnBlur = refInteractions.getReferenceProps({})\n                  .onBlur as\n                  | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n                  | undefined;\n                originalOnBlur?.(e);\n              }}\n              onKeyDown={(e) => {\n                if (e.key === 'ArrowRight') {\n                  // open and move focus into submenu\n                  setIsOpen(true);\n                  setActiveIndex(0);\n                  // Defer focusing first item (if needed) to next tick\n                  requestAnimationFrame(() => {\n                    const el = elementsRef.current[0];\n                    el?.focus();\n                  });\n                  e.preventDefault();\n                }\n                // ArrowDown/ArrowUp: let Composite handle top-level roving focus.\n              }}\n            />\n          }\n        >\n          <div className=\"ndl-side-nav-item-inner\">\n            {Boolean(icon) && (\n              <div className=\"ndl-side-nav-item-leading-element\">\n                <ConditionalWrap\n                  shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n                  wrap={(children) => (\n                    <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n                      {children}\n                    </IconIndicatorWrapper>\n                  )}\n                >\n                  {icon}\n                </ConditionalWrap>\n              </div>\n            )}\n            {Boolean(label) && (\n              <Typography\n                variant=\"body-medium\"\n                as=\"div\"\n                className=\"ndl-side-nav-item-label\"\n              >\n                {label}\n              </Typography>\n            )}\n            <div className=\"ndl-side-nav-item-trailing-element\">\n              {badge && <ItemBadge type={badge.type} number={badge.number} />}\n              <ChevronRightIconOutline className=\"n-size-4 n-text-neutral-icon\" />\n            </div>\n          </div>\n          {context.open && (\n            <FloatingList elementsRef={elementsRef}>\n              <FloatingPortal>\n                <FloatingFocusManager\n                  context={context}\n                  modal={false}\n                  initialFocus={-1}\n                  returnFocus={true}\n                  closeOnFocusOut={true}\n                  guards={true}\n                >\n                  <ul\n                    id={floatingId}\n                    ref={refs.setFloating}\n                    className=\"ndl-side-nav ndl-side-nav-popover ndl-side-nav-popover-list\"\n                    style={{\n                      ...context.floatingStyles,\n                      ...transitionStyles,\n                    }}\n                    {...floatInteractions.getFloatingProps()}\n                    role=\"menu\"\n                  >\n                    {children}\n                  </ul>\n                </FloatingFocusManager>\n              </FloatingPortal>\n            </FloatingList>\n          )}\n        </CompositeItem>\n      </ConditionalWrap>\n    </SideNavCategoryContext.Provider>\n  );\n};\n\n/**\n * CategoryHeader\n */\nconst CategoryHeader = ({\n  children,\n  className,\n  ref,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'li', CategoryHeaderProps>) => {\n  const { isExpanded, isHovered } = useSideNavContext();\n\n  const classes = classNames('ndl-side-nav-category-header', className, {\n    'ndl-side-nav-category-header-expanded': isExpanded || isHovered,\n  });\n\n  return (\n    <Typography\n      ref={ref}\n      variant=\"label\"\n      as=\"li\"\n      className={classes}\n      htmlAttributes={{\n        ...htmlAttributes,\n        role: 'separator',\n      }}\n      style={style}\n      {...restProps}\n    >\n      {isExpanded || isHovered ? children : <Divider />}\n    </Typography>\n  );\n};\n\n/**\n * SelectedIndicator\n */\nconst SelectedIndicator = () => {\n  return <div className=\"ndl-side-nav-selected-indicator\" />;\n};\n\n/**\n * SideNavDivider\n */\nconst SideNavDivider = () => {\n  return (\n    <Divider\n      orientation=\"horizontal\"\n      className=\"ndl-side-nav-divider\"\n      as=\"li\"\n    />\n  );\n};\n\n/**\n * ItemBadge\n */\nconst ItemBadge = ({\n  number,\n  type,\n  ref,\n  htmlAttributes,\n  style,\n  className,\n  ...restProps\n}: CommonProps<'span', ItemBadgeProps>) => {\n  useSideNavContext();\n\n  const badgeClasses = classNames('ndl-side-nav-item-badge', className, {\n    'ndl-danger': type === 'danger',\n    'ndl-info': type === 'info',\n    'ndl-warning': type === 'warning',\n  });\n\n  return (\n    <Typography\n      as=\"span\"\n      className={badgeClasses}\n      variant=\"subheading-small\"\n      htmlAttributes={{\n        'aria-label': `${number} notifications of type ${type}`,\n        ...htmlAttributes,\n      }}\n      style={style}\n      ref={ref}\n      {...restProps}\n    >\n      {number}\n    </Typography>\n  );\n};\n\n/**\n * PinButton\n */\nconst PinButton = () => {\n  const { isExpanded, shouldOverlayOnInteraction, onPinButtonClick } =\n    useSideNavContext();\n\n  const classes = classNames('ndl-side-nav-pin-button');\n\n  if (!shouldOverlayOnInteraction) {\n    return null;\n  }\n\n  return (\n    <CleanIconButton\n      onClick={onPinButtonClick}\n      className={classes}\n      description=\"Pin\"\n      size=\"medium\"\n      isActive={isExpanded}\n      tooltipProps={{\n        root: {\n          autoUpdateOptions: {\n            animationFrame: true,\n          },\n          placement: 'right',\n        },\n      }}\n    >\n      <PinIcon />\n    </CleanIconButton>\n  );\n};\n\nconst SideNavigation = Object.assign(SideNavComponent, {\n  CategoryHeader: CategoryHeader,\n  CategoryItem: CategoryItem,\n  Divider: SideNavDivider,\n  ItemBadge: ItemBadge,\n  ListItem: SideNavListItem,\n  NavItem,\n});\n\nexport { SideNavigation };\n"]}
+{"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../../../src/side-navigation/SideNavigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n  autoUpdate,\n  Composite,\n  CompositeItem,\n  flip,\n  FloatingFocusManager,\n  FloatingList,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useDismiss,\n  useFloating,\n  useFocus,\n  useHover,\n  useInteractions,\n  useListItem,\n  useListNavigation,\n  useMergeRefs,\n  useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useRef, useState } from 'react';\n\nimport { IconIndicatorWrapper } from '../_common/IconIndicatorWrapper';\nimport {\n  type CommonProps,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { Divider } from '../divider';\nimport { ChevronRightIconOutline, PinIcon } from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport {\n  SideNavCategoryContext,\n  SideNavContext,\n  useSideNavCategoryContext,\n  useSideNavContext,\n} from './side-navigation-context';\nimport {\n  type CategoryHeaderProps,\n  type CategoryItemProps,\n  type ItemBadgeProps,\n  type NavItemProps,\n  type SideNavListItemProps,\n  type SideNavProps,\n} from './side-navigation-types';\n\n/**\n * SideNav\n */\nconst SideNavComponent = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  isExpanded = false,\n  shouldOverlayOnInteraction = true,\n  ariaLabel,\n  onPinButtonClick,\n  expandedWidth,\n  ref,\n  ...restProps\n}: CommonProps<'div', SideNavProps>) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const [hasFocusVisible, setHasFocusVisible] = useState(false);\n  const [isCollapseTransitioning, setIsCollapseTransitioning] = useState(false);\n  const collapseTransitionTimeoutRef = useRef<ReturnType<\n    typeof setTimeout\n  > | null>(null);\n\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const isFloatingExpanded =\n    shouldOverlayOnInteraction && (!isHovered ? hasFocusVisible : true);\n\n  const classes = classNames('ndl-side-nav', 'ndl-side-nav-root', className, {\n    'ndl-side-nav-collapsed':\n      isExpanded !== true && shouldOverlayOnInteraction !== true,\n    'ndl-side-nav-expanded': isExpanded,\n  });\n\n  const innerClasses = classNames('ndl-side-nav-inner', {\n    'ndl-side-nav-collapsing': isCollapseTransitioning,\n    'ndl-side-nav-hover': isFloatingExpanded === true && isExpanded !== true,\n  });\n\n  const customStyle = {\n    ...style,\n    ...(Boolean(expandedWidth) && {\n      '--side-nav-width-expanded':\n        typeof expandedWidth === 'string'\n          ? expandedWidth\n          : `${expandedWidth}px`,\n    }),\n  };\n\n  const mergedRef = useMergeRefs([ref, rootRef]);\n\n  const collapseTransitionDuration = Number.parseInt(\n    tokens.motion.duration.quick,\n    10,\n  );\n\n  useEffect(() => {\n    return () => {\n      if (collapseTransitionTimeoutRef.current !== null) {\n        clearTimeout(collapseTransitionTimeoutRef.current);\n        collapseTransitionTimeoutRef.current = null;\n      }\n    };\n  }, []);\n\n  return (\n    <SideNavContext.Provider\n      value={{\n        isExpanded,\n        isHovered: isFloatingExpanded, // needs refactoring\n        onPinButtonClick,\n        shouldOverlayOnInteraction,\n      }}\n    >\n      <div\n        className={classes}\n        ref={mergedRef}\n        style={customStyle}\n        onMouseEnter={() => {\n          if (collapseTransitionTimeoutRef.current !== null) {\n            clearTimeout(collapseTransitionTimeoutRef.current);\n            collapseTransitionTimeoutRef.current = null;\n          }\n          setIsCollapseTransitioning(false);\n          setIsHovered(true);\n        }}\n        onMouseLeave={() => {\n          const shouldDelayZIndexRemoval =\n            shouldOverlayOnInteraction &&\n            !isExpanded &&\n            (isHovered || hasFocusVisible);\n          setIsHovered(false);\n          if (shouldDelayZIndexRemoval) {\n            if (collapseTransitionTimeoutRef.current !== null) {\n              clearTimeout(collapseTransitionTimeoutRef.current);\n            }\n            setIsCollapseTransitioning(true);\n            collapseTransitionTimeoutRef.current = setTimeout(() => {\n              collapseTransitionTimeoutRef.current = null;\n              setIsCollapseTransitioning(false);\n            }, collapseTransitionDuration);\n          }\n        }}\n        onFocusCapture={() => {\n          // Delay slightly to let Composite's focus management settle\n          requestAnimationFrame(() => {\n            const activeElement = document.activeElement;\n            // Check if focus is inside and visible (using :focus-visible on the active element)\n            if (\n              activeElement instanceof HTMLElement &&\n              rootRef.current !== null &&\n              rootRef.current.contains(activeElement) &&\n              activeElement.matches(':focus-visible')\n            ) {\n              // Update state after another frame to let focus fully settle\n              // This updates the context for consumers without disrupting focus\n              requestAnimationFrame(() => {\n                setHasFocusVisible(true);\n              });\n            }\n          });\n        }}\n        onBlurCapture={() => {\n          // Small delay to check if focus moved to another element inside\n          requestAnimationFrame(() => {\n            const activeElement = document.activeElement;\n            const isInsideNav =\n              activeElement instanceof HTMLElement &&\n              rootRef.current !== null &&\n              rootRef.current.contains(activeElement);\n            // Check if focus is in a portaled floating menu\n            const isInsideFloatingMenu =\n              activeElement instanceof HTMLElement &&\n              activeElement.closest('.ndl-side-nav-popover') !== null;\n\n            if (\n              (isInsideNav || isInsideFloatingMenu) &&\n              activeElement instanceof HTMLElement &&\n              activeElement.matches(':focus-visible')\n            ) {\n              // Focus stayed inside with focus-visible\n              setHasFocusVisible(true);\n            } else {\n              // Focus left - collapse\n              setHasFocusVisible(false);\n            }\n          });\n        }}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        <div className={innerClasses}>\n          {/** TODO v5: should the nav be the one that gets all the stuff spread on it? */}\n          <nav className=\"ndl-side-nav-nav\" aria-label={ariaLabel}>\n            <Composite\n              as=\"ul\"\n              aria-label={ariaLabel}\n              role=\"menubar\"\n              orientation=\"vertical\"\n              aria-orientation=\"vertical\"\n              className=\"ndl-side-nav-list\"\n              loop={true}\n            >\n              {children}\n            </Composite>\n          </nav>\n          {shouldOverlayOnInteraction === true && (\n            <div className=\"ndl-side-nav-footer\">\n              <PinButton />\n            </div>\n          )}\n        </div>\n      </div>\n    </SideNavContext.Provider>\n  );\n};\n\n/**\n * SideNavListItem\n */\nconst SideNavListItem = ({\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'li', SideNavListItemProps>) => {\n  const classes = classNames('ndl-side-nav-list-item', className, {});\n\n  return (\n    <li\n      role=\"none\"\n      className={classes}\n      style={style}\n      ref={ref}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <SelectedIndicator />\n      {children}\n    </li>\n  );\n};\n\n/**\n * NavItem\n */\nconst NavItem = <T extends React.ElementType = 'button'>({\n  icon,\n  label,\n  trailingElement,\n  isActive,\n  className,\n  style,\n  htmlAttributes,\n  as,\n  badge,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, NavItemProps>) => {\n  const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n    useSideNavContext();\n  const categoryContext = useSideNavCategoryContext();\n  const isInCategory = categoryContext !== null;\n\n  const item = useListItem();\n  const mergedRef = useMergeRefs([item.ref, ref]);\n\n  const isActiveIndex = item.index === categoryContext?.activeIndex;\n\n  const Component: React.ElementType = as ?? 'button';\n  const classes = classNames('ndl-side-nav-nav-item', className, {\n    'ndl-active': isActive === true,\n  });\n\n  const Wrapper = isInCategory ? Component : CompositeItem;\n  const componentProps = {\n    className: classes,\n    ref: mergedRef,\n    role: 'menuitem',\n    style: style,\n    ...(isInCategory && {\n      ...categoryContext?.getItemProps(),\n      tabIndex: isActiveIndex ? 0 : -1,\n    }),\n    ...restProps,\n    ...htmlAttributes,\n  };\n  const wrapperProps = isInCategory\n    ? componentProps\n    : {\n        render: <Component {...componentProps} />,\n      };\n\n  return (\n    <ConditionalWrap\n      shouldWrap={\n        isExpanded === false &&\n        !shouldOverlayOnInteraction &&\n        !isInCategory &&\n        Boolean(label)\n      }\n      wrap={(children) => (\n        <Tooltip\n          type=\"simple\"\n          placement=\"right\"\n          hoverDelay={{ close: 0, open: shouldOverlayOnInteraction ? 100 : 0 }}\n        >\n          <Tooltip.Trigger hasButtonWrapper={true}>{children}</Tooltip.Trigger>\n          <Tooltip.Content>{label}</Tooltip.Content>\n        </Tooltip>\n      )}\n    >\n      <Wrapper {...wrapperProps}>\n        <div className=\"ndl-side-nav-item-inner\">\n          {Boolean(icon) && (\n            <div className=\"ndl-side-nav-item-leading-element\">\n              <ConditionalWrap\n                shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n                wrap={(children) => (\n                  <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n                    {children}\n                  </IconIndicatorWrapper>\n                )}\n              >\n                {icon}\n              </ConditionalWrap>\n            </div>\n          )}\n          {Boolean(label) && (\n            <Typography\n              variant=\"body-medium\"\n              as=\"div\"\n              className=\"ndl-side-nav-item-label\"\n            >\n              {label}\n            </Typography>\n          )}\n          {(Boolean(trailingElement) || Boolean(badge)) && (\n            <div className=\"ndl-side-nav-item-trailing-element\">\n              {trailingElement}\n              {badge !== undefined && (\n                <ItemBadge type={badge.type} number={badge.number} />\n              )}\n            </div>\n          )}\n        </div>\n      </Wrapper>\n    </ConditionalWrap>\n  );\n};\n\n/**\n * CategoryItem\n */\nconst CategoryItem = ({\n  children,\n  icon,\n  label,\n  isActive,\n  className,\n  style,\n  htmlAttributes,\n  badge,\n  isMenuOpen = false,\n  ref,\n  ...restProps\n}: CommonProps<'button', CategoryItemProps>) => {\n  const floatingId = useId();\n  const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n    useSideNavContext();\n  const anchorRef = useRef<HTMLLIElement>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [activeIndex, setActiveIndex] = useState<number | null>(null);\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  const elementsRef = useRef<\n    Array<HTMLButtonElement | HTMLAnchorElement | null>\n  >([]);\n\n  const classes = classNames('ndl-side-nav-category-item', className, {\n    'ndl-active': isActive === true,\n  });\n\n  // Floating UI setup\n  const { refs, context } = useFloating({\n    elements: {\n      reference: anchorRef.current,\n    },\n    middleware: [\n      offset(5),\n      flip({ crossAxis: true, fallbackAxisSideDirection: 'end', padding: 5 }),\n      shift({ padding: 5 }),\n    ],\n    onOpenChange: setIsOpen,\n    open: isOpen || isMenuOpen,\n    placement: 'right-start',\n    strategy: 'fixed',\n    whileElementsMounted: autoUpdate,\n  });\n\n  const dismiss = useDismiss(context, {\n    referencePress: false,\n  });\n  const hover = useHover(context, {\n    delay: { close: 130, open: 130 },\n    handleClose: safePolygon({\n      blockPointerEvents: false,\n      requireIntent: false,\n    }),\n  });\n  const focus = useFocus(context);\n  const listNavigation = useListNavigation(context, {\n    activeIndex: activeIndex,\n    focusItemOnHover: false,\n    focusItemOnOpen: false,\n    listRef: elementsRef,\n    loop: true,\n    nested: true,\n    onNavigate: setActiveIndex,\n    openOnArrowKeyDown: false,\n  });\n\n  // Separate interactions: reference (no listNavigation), floating (with listNavigation)\n  const refInteractions = useInteractions([dismiss, hover, focus]);\n  const floatInteractions = useInteractions([dismiss, hover, listNavigation]);\n  const { styles: transitionStyles } = useTransitionStyles(context, {\n    duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n  });\n\n  // Reset activeIndex when menu closes\n  useEffect(() => {\n    if (!context.open) {\n      setActiveIndex(null);\n    }\n  }, [context.open]);\n\n  const mergedRef = useMergeRefs([refs.setReference, ref]);\n\n  return (\n    <SideNavCategoryContext.Provider\n      value={{\n        activeIndex,\n        getItemProps: floatInteractions.getItemProps,\n      }}\n    >\n      <ConditionalWrap\n        shouldWrap={\n          isExpanded === false && !shouldOverlayOnInteraction && Boolean(label)\n        }\n        wrap={(children) => (\n          <Tooltip\n            type=\"simple\"\n            placement=\"top\"\n            hoverDelay={{\n              close: 0,\n              open: shouldOverlayOnInteraction ? 100 : 0,\n            }}\n            isOpen={isTooltipOpen}\n            onOpenChange={setIsTooltipOpen}\n          >\n            <Tooltip.Trigger hasButtonWrapper={true}>\n              {children}\n            </Tooltip.Trigger>\n            <Tooltip.Content className=\"ndl-side-nav ndl-side-nav-category-menu-tooltip-content\">\n              {label}\n            </Tooltip.Content>\n          </Tooltip>\n        )}\n      >\n        <CompositeItem\n          render={\n            <button\n              {...refInteractions.getReferenceProps({\n                className: classes,\n                ref: mergedRef,\n                style,\n                ...restProps,\n                ...htmlAttributes,\n              })}\n              // {...restProps}\n              // {...htmlAttributes}\n              role=\"menuitem\"\n              aria-haspopup=\"menu\"\n              aria-expanded={context.open}\n              aria-controls={floatingId}\n              onFocus={(e) => {\n                // Only show tooltip on focus-visible (keyboard navigation)\n                if (\n                  e.target instanceof HTMLElement &&\n                  e.target.matches(':focus-visible')\n                ) {\n                  setIsTooltipOpen(true);\n                }\n                // Call original handler if exists\n                const originalOnFocus = refInteractions.getReferenceProps({})\n                  .onFocus as\n                  | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n                  | undefined;\n                originalOnFocus?.(e);\n              }}\n              onBlur={(e) => {\n                setIsTooltipOpen(false);\n                // Call original handler if exists\n                const originalOnBlur = refInteractions.getReferenceProps({})\n                  .onBlur as\n                  | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n                  | undefined;\n                originalOnBlur?.(e);\n              }}\n              onKeyDown={(e) => {\n                if (e.key === 'ArrowRight') {\n                  // open and move focus into submenu\n                  setIsOpen(true);\n                  setActiveIndex(0);\n                  // Defer focusing first item (if needed) to next tick\n                  requestAnimationFrame(() => {\n                    const el = elementsRef.current[0];\n                    el?.focus();\n                  });\n                  e.preventDefault();\n                }\n                // ArrowDown/ArrowUp: let Composite handle top-level roving focus.\n              }}\n            />\n          }\n        >\n          <div className=\"ndl-side-nav-item-inner\">\n            {Boolean(icon) && (\n              <div className=\"ndl-side-nav-item-leading-element\">\n                <ConditionalWrap\n                  shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n                  wrap={(children) => (\n                    <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n                      {children}\n                    </IconIndicatorWrapper>\n                  )}\n                >\n                  {icon}\n                </ConditionalWrap>\n              </div>\n            )}\n            {Boolean(label) && (\n              <Typography\n                variant=\"body-medium\"\n                as=\"div\"\n                className=\"ndl-side-nav-item-label\"\n              >\n                {label}\n              </Typography>\n            )}\n            <div className=\"ndl-side-nav-item-trailing-element\">\n              {badge && <ItemBadge type={badge.type} number={badge.number} />}\n              <ChevronRightIconOutline className=\"n-size-4 n-text-neutral-icon\" />\n            </div>\n          </div>\n          {context.open && (\n            <FloatingList elementsRef={elementsRef}>\n              <FloatingPortal>\n                <FloatingFocusManager\n                  context={context}\n                  modal={false}\n                  initialFocus={-1}\n                  returnFocus={true}\n                  closeOnFocusOut={true}\n                  guards={true}\n                >\n                  <ul\n                    id={floatingId}\n                    ref={refs.setFloating}\n                    className=\"ndl-side-nav ndl-side-nav-popover ndl-side-nav-popover-list\"\n                    style={{\n                      ...context.floatingStyles,\n                      ...transitionStyles,\n                    }}\n                    {...floatInteractions.getFloatingProps()}\n                    role=\"menu\"\n                  >\n                    {children}\n                  </ul>\n                </FloatingFocusManager>\n              </FloatingPortal>\n            </FloatingList>\n          )}\n        </CompositeItem>\n      </ConditionalWrap>\n    </SideNavCategoryContext.Provider>\n  );\n};\n\n/**\n * CategoryHeader\n */\nconst CategoryHeader = ({\n  children,\n  className,\n  ref,\n  style,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'li', CategoryHeaderProps>) => {\n  const { isExpanded, isHovered } = useSideNavContext();\n\n  const classes = classNames('ndl-side-nav-category-header', className, {\n    'ndl-side-nav-category-header-expanded': isExpanded || isHovered,\n  });\n\n  return (\n    <Typography\n      ref={ref}\n      variant=\"label\"\n      as=\"li\"\n      className={classes}\n      htmlAttributes={{\n        ...htmlAttributes,\n        role: 'separator',\n      }}\n      style={style}\n      {...restProps}\n    >\n      {isExpanded || isHovered ? children : <Divider />}\n    </Typography>\n  );\n};\n\n/**\n * SelectedIndicator\n */\nconst SelectedIndicator = () => {\n  return <div className=\"ndl-side-nav-selected-indicator\" />;\n};\n\n/**\n * SideNavDivider\n */\nconst SideNavDivider = () => {\n  return (\n    <Divider\n      orientation=\"horizontal\"\n      className=\"ndl-side-nav-divider\"\n      as=\"li\"\n    />\n  );\n};\n\n/**\n * ItemBadge\n */\nconst ItemBadge = ({\n  number,\n  type,\n  ref,\n  htmlAttributes,\n  style,\n  className,\n  ...restProps\n}: CommonProps<'span', ItemBadgeProps>) => {\n  useSideNavContext();\n\n  const badgeClasses = classNames('ndl-side-nav-item-badge', className, {\n    'ndl-danger': type === 'danger',\n    'ndl-info': type === 'info',\n    'ndl-warning': type === 'warning',\n  });\n\n  return (\n    <Typography\n      as=\"span\"\n      className={badgeClasses}\n      variant=\"subheading-small\"\n      htmlAttributes={{\n        'aria-label': `${number} notifications of type ${type}`,\n        ...htmlAttributes,\n      }}\n      style={style}\n      ref={ref}\n      {...restProps}\n    >\n      {number}\n    </Typography>\n  );\n};\n\n/**\n * PinButton\n */\nconst PinButton = () => {\n  const { isExpanded, shouldOverlayOnInteraction, onPinButtonClick } =\n    useSideNavContext();\n\n  const classes = classNames('ndl-side-nav-pin-button');\n\n  if (!shouldOverlayOnInteraction) {\n    return null;\n  }\n\n  return (\n    <CleanIconButton\n      onClick={onPinButtonClick}\n      className={classes}\n      description=\"Pin\"\n      size=\"medium\"\n      isActive={isExpanded}\n      tooltipProps={{\n        root: {\n          autoUpdateOptions: {\n            animationFrame: true,\n          },\n          placement: 'right',\n        },\n      }}\n    >\n      <PinIcon />\n    </CleanIconButton>\n  );\n};\n\nconst SideNavigation = Object.assign(SideNavComponent, {\n  CategoryHeader: CategoryHeader,\n  CategoryItem: CategoryItem,\n  Divider: SideNavDivider,\n  ItemBadge: ItemBadge,\n  ListItem: SideNavListItem,\n  NavItem,\n});\n\nexport { SideNavigation };\n"]}

package/lib/cjs/side-navigation/stories/side-nav-secondary.story.js

@@ -29,7 +29,7 @@ const Component = () => {
     const [active, setActive] = (0, react_2.useState)('nav-item-8');
     const [secondaryActive, setSecondaryActive] = (0, react_2.useState)('beginner');
     const [isExpanded, setIsExpanded] = (0, react_2.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-h-[calc(40vh-32px)] n-min-h-[700px] n-flex n-bg-neutral-bg-default n-overflow-hidden", children: [(0, jsx_runtime_1.jsxs)(react_1.SideNavigation, { isExpanded: isExpanded, shouldOverlayOnInteraction: true, onPinButtonClick: () => setIsExpanded(!isExpanded), ariaLabel: "Main side navigation", className: "n-z-10", children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.HomeIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-1', onClick: () => setActive('nav-item-1') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.CodeBracketIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-2', onClick: () => setActive('nav-item-2') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.ServerIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-3', onClick: () => setActive('nav-item-3') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsxs)(react_1.SideNavigation.CategoryItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.WrenchScrewdriverIconOutline, {}), label: "Category Item", isActive: ['nav-item-4', 'nav-item-5'].includes(active), children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), label: "Nested Nav Item", isActive: active === 'nav-item-4', onClick: () => setActive('nav-item-4') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), label: "Nested Nav Item", isActive: active === 'nav-item-5', onClick: () => setActive('nav-item-5') }) })] }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.ChartBarIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-6', onClick: () => setActive('nav-item-6') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.Cog6ToothIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-7', onClick: () => setActive('nav-item-7') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.AcademicCapIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-8', onClick: () => setActive('nav-item-8') }) })] }), (0, jsx_runtime_1.jsxs)(react_1.SideNavigation, { isExpanded: true, shouldOverlayOnInteraction: false, expandedWidth: 220, ariaLabel: "Secondary side navigation", children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.CategoryHeader, { children: "Category Header" }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-1', onClick: () => setSecondaryActive('secondary-nav-item-1') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-2', onClick: () => setSecondaryActive('secondary-nav-item-2') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-3', onClick: () => setSecondaryActive('secondary-nav-item-3') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-4', onClick: () => setSecondaryActive('secondary-nav-item-4') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-5', onClick: () => setSecondaryActive('secondary-nav-item-5') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.CategoryHeader, { children: "Category Header" }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), isActive: secondaryActive === 'secondary-nav-item-6', onClick: () => setSecondaryActive('secondary-nav-item-6') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), isActive: secondaryActive === 'secondary-nav-item-7', onClick: () => setSecondaryActive('secondary-nav-item-7') }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "n-h-full n-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-p-8 n-w-full n-max-w-[1024px] n-mx-auto", children: (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-8 n-bg-neutral-bg-weak n-p-token-32 n-rounded-lg n-items-center n-justify-center", children: [(0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: "Secondary Side Nav" }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "body-medium", children: "If a page requires its own navigation, you can use a secondary side nav. The secondary side nav is always expanded and does not have a pin button." })] }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-h-[calc(40vh-32px)] n-min-h-[700px] n-flex n-bg-neutral-bg-default n-overflow-hidden", children: [(0, jsx_runtime_1.jsxs)(react_1.SideNavigation, { isExpanded: isExpanded, shouldOverlayOnInteraction: true, onPinButtonClick: () => setIsExpanded(!isExpanded), ariaLabel: "Main side navigation", children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.HomeIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-1', onClick: () => setActive('nav-item-1') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.CodeBracketIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-2', onClick: () => setActive('nav-item-2') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.ServerIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-3', onClick: () => setActive('nav-item-3') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsxs)(react_1.SideNavigation.CategoryItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.WrenchScrewdriverIconOutline, {}), label: "Category Item", isActive: ['nav-item-4', 'nav-item-5'].includes(active), children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), label: "Nested Nav Item", isActive: active === 'nav-item-4', onClick: () => setActive('nav-item-4') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), label: "Nested Nav Item", isActive: active === 'nav-item-5', onClick: () => setActive('nav-item-5') }) })] }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.ChartBarIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-6', onClick: () => setActive('nav-item-6') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.Cog6ToothIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-7', onClick: () => setActive('nav-item-7') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.Divider, {}), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { icon: (0, jsx_runtime_1.jsx)(icons_1.AcademicCapIconOutline, {}), label: "Nav Item", isActive: active === 'nav-item-8', onClick: () => setActive('nav-item-8') }) })] }), (0, jsx_runtime_1.jsxs)(react_1.SideNavigation, { isExpanded: true, shouldOverlayOnInteraction: false, expandedWidth: 220, ariaLabel: "Secondary side navigation", children: [(0, jsx_runtime_1.jsx)(react_1.SideNavigation.CategoryHeader, { children: "Category Header" }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-1', onClick: () => setSecondaryActive('secondary-nav-item-1') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-2', onClick: () => setSecondaryActive('secondary-nav-item-2') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-3', onClick: () => setSecondaryActive('secondary-nav-item-3') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-4', onClick: () => setSecondaryActive('secondary-nav-item-4') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", isActive: secondaryActive === 'secondary-nav-item-5', onClick: () => setSecondaryActive('secondary-nav-item-5') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.CategoryHeader, { children: "Category Header" }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), isActive: secondaryActive === 'secondary-nav-item-6', onClick: () => setSecondaryActive('secondary-nav-item-6') }) }), (0, jsx_runtime_1.jsx)(react_1.SideNavigation.ListItem, { children: (0, jsx_runtime_1.jsx)(react_1.SideNavigation.NavItem, { label: "Secondary Nav Item", icon: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}), isActive: secondaryActive === 'secondary-nav-item-7', onClick: () => setSecondaryActive('secondary-nav-item-7') }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "n-h-full n-w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-p-8 n-w-full n-max-w-[1024px] n-mx-auto", children: (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-8 n-bg-neutral-bg-weak n-p-token-32 n-rounded-lg n-items-center n-justify-center", children: [(0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: "Secondary Side Nav" }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "body-medium", children: "If a page requires its own navigation, you can use a secondary side nav. The secondary side nav is always expanded and does not have a pin button." })] }) }) })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=side-nav-secondary.story.js.map

package/lib/cjs/side-navigation/stories/side-nav-secondary.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"side-nav-secondary.story.js","sourceRoot":"","sources":["../../../../src/side-navigation/stories/side-nav-secondary.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SideNavigation, Typography } from '@neo4j-ndl/react';\nimport {\n  AcademicCapIconOutline,\n  ChartBarIconOutline,\n  CodeBracketIconOutline,\n  Cog6ToothIconOutline,\n  HomeIconOutline,\n  MagnifyingGlassIconOutline,\n  ServerIconOutline,\n  WrenchScrewdriverIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [active, setActive] = useState<string>('nav-item-8');\n  const [secondaryActive, setSecondaryActive] = useState<string>('beginner');\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  return (\n    <div className=\"n-h-[calc(40vh-32px)] n-min-h-[700px] n-flex n-bg-neutral-bg-default n-overflow-hidden\">\n      <SideNavigation\n        isExpanded={isExpanded}\n        shouldOverlayOnInteraction={true}\n        onPinButtonClick={() => setIsExpanded(!isExpanded)}\n        ariaLabel=\"Main side navigation\"\n        className=\"n-z-10\"\n      >\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<HomeIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-1'}\n            onClick={() => setActive('nav-item-1')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<CodeBracketIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-2'}\n            onClick={() => setActive('nav-item-2')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.Divider />\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<ServerIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-3'}\n            onClick={() => setActive('nav-item-3')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.CategoryItem\n            icon={<WrenchScrewdriverIconOutline />}\n            label=\"Category Item\"\n            isActive={['nav-item-4', 'nav-item-5'].includes(active)}\n          >\n            <SideNavigation.ListItem>\n              <SideNavigation.NavItem\n                icon={<MagnifyingGlassIconOutline />}\n                label=\"Nested Nav Item\"\n                isActive={active === 'nav-item-4'}\n                onClick={() => setActive('nav-item-4')}\n              />\n            </SideNavigation.ListItem>\n            <SideNavigation.ListItem>\n              <SideNavigation.NavItem\n                icon={<MagnifyingGlassIconOutline />}\n                label=\"Nested Nav Item\"\n                isActive={active === 'nav-item-5'}\n                onClick={() => setActive('nav-item-5')}\n              />\n            </SideNavigation.ListItem>\n          </SideNavigation.CategoryItem>\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<ChartBarIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-6'}\n            onClick={() => setActive('nav-item-6')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<Cog6ToothIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-7'}\n            onClick={() => setActive('nav-item-7')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.Divider />\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<AcademicCapIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-8'}\n            onClick={() => setActive('nav-item-8')}\n          />\n        </SideNavigation.ListItem>\n      </SideNavigation>\n      <SideNavigation\n        isExpanded={true}\n        shouldOverlayOnInteraction={false}\n        expandedWidth={220}\n        ariaLabel=\"Secondary side navigation\"\n      >\n        <SideNavigation.CategoryHeader>\n          Category Header\n        </SideNavigation.CategoryHeader>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-1'}\n            onClick={() => setSecondaryActive('secondary-nav-item-1')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-2'}\n            onClick={() => setSecondaryActive('secondary-nav-item-2')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-3'}\n            onClick={() => setSecondaryActive('secondary-nav-item-3')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-4'}\n            onClick={() => setSecondaryActive('secondary-nav-item-4')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-5'}\n            onClick={() => setSecondaryActive('secondary-nav-item-5')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.CategoryHeader>\n          Category Header\n        </SideNavigation.CategoryHeader>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            icon={<MagnifyingGlassIconOutline />}\n            isActive={secondaryActive === 'secondary-nav-item-6'}\n            onClick={() => setSecondaryActive('secondary-nav-item-6')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            icon={<MagnifyingGlassIconOutline />}\n            isActive={secondaryActive === 'secondary-nav-item-7'}\n            onClick={() => setSecondaryActive('secondary-nav-item-7')}\n          />\n        </SideNavigation.ListItem>\n      </SideNavigation>\n      <div className=\"n-h-full n-w-full\">\n        <div className=\"n-flex n-flex-col n-p-8 n-w-full n-max-w-[1024px] n-mx-auto\">\n          <div className=\"n-flex n-flex-col n-gap-token-8 n-bg-neutral-bg-weak n-p-token-32 n-rounded-lg n-items-center n-justify-center\">\n            <Typography variant=\"title-4\">Secondary Side Nav</Typography>\n            <Typography variant=\"body-medium\">\n              If a page requires its own navigation, you can use a secondary\n              side nav. The secondary side nav is always expanded and does not\n              have a pin button.\n            </Typography>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"side-nav-secondary.story.js","sourceRoot":"","sources":["../../../../src/side-navigation/stories/side-nav-secondary.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SideNavigation, Typography } from '@neo4j-ndl/react';\nimport {\n  AcademicCapIconOutline,\n  ChartBarIconOutline,\n  CodeBracketIconOutline,\n  Cog6ToothIconOutline,\n  HomeIconOutline,\n  MagnifyingGlassIconOutline,\n  ServerIconOutline,\n  WrenchScrewdriverIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [active, setActive] = useState<string>('nav-item-8');\n  const [secondaryActive, setSecondaryActive] = useState<string>('beginner');\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  return (\n    <div className=\"n-h-[calc(40vh-32px)] n-min-h-[700px] n-flex n-bg-neutral-bg-default n-overflow-hidden\">\n      <SideNavigation\n        isExpanded={isExpanded}\n        shouldOverlayOnInteraction={true}\n        onPinButtonClick={() => setIsExpanded(!isExpanded)}\n        ariaLabel=\"Main side navigation\"\n      >\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<HomeIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-1'}\n            onClick={() => setActive('nav-item-1')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<CodeBracketIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-2'}\n            onClick={() => setActive('nav-item-2')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.Divider />\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<ServerIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-3'}\n            onClick={() => setActive('nav-item-3')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.CategoryItem\n            icon={<WrenchScrewdriverIconOutline />}\n            label=\"Category Item\"\n            isActive={['nav-item-4', 'nav-item-5'].includes(active)}\n          >\n            <SideNavigation.ListItem>\n              <SideNavigation.NavItem\n                icon={<MagnifyingGlassIconOutline />}\n                label=\"Nested Nav Item\"\n                isActive={active === 'nav-item-4'}\n                onClick={() => setActive('nav-item-4')}\n              />\n            </SideNavigation.ListItem>\n            <SideNavigation.ListItem>\n              <SideNavigation.NavItem\n                icon={<MagnifyingGlassIconOutline />}\n                label=\"Nested Nav Item\"\n                isActive={active === 'nav-item-5'}\n                onClick={() => setActive('nav-item-5')}\n              />\n            </SideNavigation.ListItem>\n          </SideNavigation.CategoryItem>\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<ChartBarIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-6'}\n            onClick={() => setActive('nav-item-6')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<Cog6ToothIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-7'}\n            onClick={() => setActive('nav-item-7')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.Divider />\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            icon={<AcademicCapIconOutline />}\n            label=\"Nav Item\"\n            isActive={active === 'nav-item-8'}\n            onClick={() => setActive('nav-item-8')}\n          />\n        </SideNavigation.ListItem>\n      </SideNavigation>\n      <SideNavigation\n        isExpanded={true}\n        shouldOverlayOnInteraction={false}\n        expandedWidth={220}\n        ariaLabel=\"Secondary side navigation\"\n      >\n        <SideNavigation.CategoryHeader>\n          Category Header\n        </SideNavigation.CategoryHeader>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-1'}\n            onClick={() => setSecondaryActive('secondary-nav-item-1')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-2'}\n            onClick={() => setSecondaryActive('secondary-nav-item-2')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-3'}\n            onClick={() => setSecondaryActive('secondary-nav-item-3')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-4'}\n            onClick={() => setSecondaryActive('secondary-nav-item-4')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            isActive={secondaryActive === 'secondary-nav-item-5'}\n            onClick={() => setSecondaryActive('secondary-nav-item-5')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.CategoryHeader>\n          Category Header\n        </SideNavigation.CategoryHeader>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            icon={<MagnifyingGlassIconOutline />}\n            isActive={secondaryActive === 'secondary-nav-item-6'}\n            onClick={() => setSecondaryActive('secondary-nav-item-6')}\n          />\n        </SideNavigation.ListItem>\n        <SideNavigation.ListItem>\n          <SideNavigation.NavItem\n            label=\"Secondary Nav Item\"\n            icon={<MagnifyingGlassIconOutline />}\n            isActive={secondaryActive === 'secondary-nav-item-7'}\n            onClick={() => setSecondaryActive('secondary-nav-item-7')}\n          />\n        </SideNavigation.ListItem>\n      </SideNavigation>\n      <div className=\"n-h-full n-w-full\">\n        <div className=\"n-flex n-flex-col n-p-8 n-w-full n-max-w-[1024px] n-mx-auto\">\n          <div className=\"n-flex n-flex-col n-gap-token-8 n-bg-neutral-bg-weak n-p-token-32 n-rounded-lg n-items-center n-justify-center\">\n            <Typography variant=\"title-4\">Secondary Side Nav</Typography>\n            <Typography variant=\"body-medium\">\n              If a page requires its own navigation, you can use a secondary\n              side nav. The secondary side nav is always expanded and does not\n              have a pin button.\n            </Typography>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/wizard/Wizard.js

@@ -134,7 +134,9 @@ const WizardLarge = (_a) => {
             }), steps.map((step, index) => {
                 return ((0, jsx_runtime_1.jsx)("div", { className: stepClasses(index, step), style: {
                         gridRow: orientation === 'vertical' ? index + 1 : '',
-                    }, children: (0, jsx_runtime_1.jsx)(Circle, { status: step.status === 'error'
+                    }, "aria-current": getStatus(activeStepIndex, index) === 'active'
+                        ? 'step'
+                        : undefined, children: (0, jsx_runtime_1.jsx)(Circle, { status: step.status === 'error'
                             ? 'error'
                             : getStatus(activeStepIndex, index), number: index + 1, text: step.content, alignment: alignment }) }, index));
             })] })));
@@ -155,7 +157,9 @@ const WizardSmall = (_a) => {
         [`ndl-wizard-align-${alignment}`]: alignment,
     });
     return ((0, jsx_runtime_1.jsxs)(Component, Object.assign({ className: wizardClasses, style: style, ref: ref }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-wizard-steps-line" }), steps.map((step, index) => {
-                return ((0, jsx_runtime_1.jsx)("div", { className: stepClasses(index), children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-wizard-circle" }) }, index));
+                return ((0, jsx_runtime_1.jsx)("div", { className: stepClasses(index), "aria-current": getStatus(activeStepIndex, index) === 'active'
+                        ? 'step'
+                        : undefined, children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-wizard-circle" }) }, index));
             }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-wizard-steps-line" })] })));
 };
 exports.WizardSmall = WizardSmall;