@charcuterie/ui 3.23.0 → 3.24.0

package/src/NavBar/NavBar.tsx

@@ -1,271 +1,85 @@
-import { useVisibility } from "@charcuterie/logic"
 import type { ControlSize } from "@charcuterie/tokens"
 import type { Placement } from "@floating-ui/react"
 import type { ReactNode } from "react"
 
-import { Button } from "../Button/Button.tsx"
-import { IconButton } from "../IconButton/IconButton.tsx"
-import { usePanelItemSize } from "../Overlay/usePanelItemSize.ts"
-import { Popover } from "../Popover/Popover.tsx"
-import { useToolbarOverflow } from "../Toolbar/useToolbarOverflow.ts"
-import { toClassName } from "../toClassName.ts"
-import { NavBarLink } from "./NavBarLink.tsx"
-import { getIsCurrentHref } from "./navBarCurrent.ts"
+import { Nav } from "../Nav/Nav.tsx"
+import type { NavItem } from "../Nav/navItems.ts"
 
-export type NavBarItem = {
-  /**
-   * Where it goes. Routed through the injected `RouterLink` when it
-   * is this app's own path, and left to the platform when it is not.
-   */
-  href: string
-  /** Decoration beside the label. Never the accessible name. */
-  icon?: ReactNode
-  /** Defaults to `href`, which is already unique in a nav. */
-  key?: string
-  /** The visible text, and the accessible name. */
-  label: string
-}
+/**
+ * @deprecated Use `Nav`'s `NavItem`. Removed in the next major.
+ */
+export type NavBarItem = NavItem
 
+/**
+ * @deprecated Use `NavProps` with `layout="bar"`. Removed in the
+ * next major.
+ */
 export type NavBarProps = {
   className?: string
-  /**
-   * Where the reader is — `useLocation().pathname` in a
-   * react-router app. `aria-current="page"` is derived from it by
-   * `getIsCurrentHref`, which matches a parent path for its
-   * children and treats `/` as exact.
-   *
-   * Omitted means nothing is current, which is the honest answer on
-   * a route no destination owns.
-   */
   currentHref?: string
-  /**
-   * **Initial** only, and the bar owns it from then on — the same
-   * uncontrolled contract every other component here has. It exists
-   * so a story (and a screenshot) can show the menu open; an app
-   * almost never passes it.
-   */
   isMenuVisible?: boolean
   items: readonly NavBarItem[]
-  /**
-   * Required, and it becomes the `<nav>`'s `aria-label`. Two unnamed
-   * navigation landmarks in one page is axe's `landmark-unique`, and
-   * more to the point it is a screen reader announcing "navigation"
-   * twice with no way to tell which is the main one.
-   */
   label: string
-  /**
-   * Where the trigger sits in the bar's track once the row has
-   * folded. `"end"` when the header puts its own actions at the
-   * far edge, so the fold control joins them instead of hugging
-   * the wordmark with the whole track empty after it.
-   *
-   * It reaches **only** the folded row, which holds exactly one
-   * item — so it cannot disturb where the links sit when the bar
-   * is whole, and there is deliberately no prop that can.
-   */
   menuAlign?: "end" | "start"
-  /**
-   * The collapsed trigger's glyph. **No default** — the library
-   * ships no icons, and `☰` renders as nothing where the font lacks
-   * it. With no icon the trigger is a text button reading
-   * `menuLabel`, which works everywhere.
-   */
   menuIcon?: ReactNode
-  /**
-   * Names the trigger and, through it, the panel it opens. A
-   * `role="dialog"` takes no accessible name from its content.
-   */
   menuLabel?: string
   menuPlacement?: Placement
   size?: ControlSize
 }
 
 /**
- * The app's destinations as real links, in one line — folding into a
- * single menu button, whole, when that line does not fit.
- *
- * ## Why this is not `Toolbar`
- *
- * `Toolbar` already solves collapse-into-an-overflow, and this
- * component **reuses its measurement** (`useToolbarOverflow`) rather
- * than growing a second one. What it cannot reuse is the rendering:
- * a `ToolbarAction` is `{ label, onSelect }` and a collapsed one
- * becomes a `MenuItem`, so a nav folded into a `Toolbar` is a row of
- * `<button>`s. Navigation is an `<a href>` — see `NavBarLink`.
- *
- * The overflow is a `Popover` (`role="dialog"`) rather than a `Menu`
- * for the same reason: `role="menu"` permits only the `menuitem`
- * family, and a `menuitem` is something you *do*, not somewhere you
- * *go*.
- *
- * ## It folds WHOLE, and that is the decision
+ * @deprecated Use `Nav` with `layout="bar"` — which is `Nav`'s
+ * default, so `<Nav activeHref={…} items={…} label="Main" />` is the
+ * whole migration. **Removed in the next major.**
  *
- * `Toolbar` collapses **progressively** — items drop off the end one
- * at a time — because its items are ranked: the two things you do to
- * a running job matter more than the two you do to the deck. A nav
- * is not ranked. Its order is the shape of the product (Docket's
- * reads as the pipeline: Triage → Backlog → Phases → Board →
- * Archives), and a half-collapsed one splits that shape across two
- * places with no rule the reader can learn — "some of the app is up
- * here and the rest is behind a button" is worse than either whole
- * answer. So the bar shows **every** destination or **none**, and
- * the menu, when it opens, is the complete list in the product's own
- * order.
+ * This is now a thin adapter over `Nav` and keeps every behaviour it
+ * shipped with: the measured whole-row fold, the real `<a href>` in
+ * both the bar and the panel, and the same props under the same
+ * names. Only two things differ, and both are fixes:
  *
- * ## Measured, not breakpointed
+ * 1. `currentHref` is `activeHref` on `Nav`.
+ * 2. **Two items can no longer both be current.** This component
+ *    asked the question once per item, so a bar holding `/settings`
+ *    and `/settings/labels` marked *both* while the reader was on
+ *    the deeper one — against its own decision record, which says a
+ *    nav with two current items has stopped saying anything. `Nav`
+ *    takes the deepest match. If an app was relying on the parent
+ *    also lighting up, it was relying on a defect.
  *
- * There is no `collapseAt` prop and no media query. The bar reads
- * the width its links actually have and folds when their sum stops
- * fitting, so a longer label, a tenth destination, a
- * `data-density="kiosk"` or a reader at 175% browser zoom each move
- * the fold on their own. A hardcoded pixel number is wrong the first
- * time any of those changes — mux-magic collapses at `480px` and
- * plex-channels at `760px`, and neither number has a reason.
+ * ## Why it went away
  *
- * ⚠️ **The bar must not be sized by its own contents.** It measures
- * its own box to decide what to draw in it, so a container that
- * shrink-wraps makes the answer its own input: put it in a
- * `minmax(0, 1fr)` grid track or a `flex-1 min-w-0` row. The root
- * carries `min-w-0 flex-1` for the flex case; a grid track is the
- * caller's to declare. Same trap `useAdaptiveColumns` documents from
- * the other end.
- *
- * ## Mounted exactly once
- *
- * A destination is in the bar or in the panel, never both. The
- * fleet's habit is to render the whole nav twice and hide one copy
- * with `hidden md:flex` — mux-magic's `PageHeader` across two
- * ~55-line blocks, mail-sifter's `TriageQueue` again — which puts
- * every link in the DOM at every width, so an agent driving the page
- * finds two of each and cannot tell which one a human can see.
+ * It answered half the question. A horizontal row that folds is one
+ * shape an app's destinations take; a labelled side rail, a
+ * collapsed icon rail and a Narrow-View bottom strip are the others,
+ * and this component could not become any of them — so an app that
+ * wanted a rail was back to hand-rolling, which is the state this
+ * was built to end. `Nav` is the same list drawn in whichever of the
+ * five places fits, and `useNavLayout` is the width rule that says
+ * which.
  */
 export const NavBar = ({
   className,
   currentHref,
-  isMenuVisible = false,
+  isMenuVisible,
   items,
   label,
-  menuAlign = "start",
+  menuAlign,
   menuIcon,
-  menuLabel = "Menu",
-  menuPlacement = "bottom-start",
-  size = "sm",
-}: NavBarProps): ReactNode => {
-  const itemKeys = items.map(
-    (item) => item.key ?? item.href,
-  )
-
-  const { containerRef, trackItem, visibleCount } =
-    useToolbarOverflow({ itemKeys })
-
-  /**
-   * All or nothing. `visibleCount` is the progressive answer and
-   * this is the only thing read off it: the moment one link stops
-   * fitting, every link goes into the menu together.
-   *
-   * The hook's `trackTrigger` is deliberately not wired up, and the
-   * missing measurement costs nothing here. It exists so a
-   * progressive bar can ask "how many fit **beside a trigger**",
-   * which is a question this bar never asks: either every link fits
-   * with no trigger at all, or the row is one trigger and nothing
-   * else. `chooseVisibleCount` tests the whole-row case first and
-   * with the trigger costed at zero, so that branch is exact.
-   */
-  const isCollapsed = visibleCount < items.length
-
-  const { hide, isVisible, toggle } = useVisibility({
-    isVisible: isMenuVisible,
-  })
-
-  const panelItemSize = usePanelItemSize("lg")
-
-  const renderLink = (
-    item: NavBarItem,
-    placement: "bar" | "panel",
-  ) => (
-    <NavBarLink
-      isCurrent={getIsCurrentHref({
-        currentHref,
-        href: item.href,
-      })}
-      item={item}
-      key={item.key ?? item.href}
-      onNavigate={placement === "panel" ? hide : undefined}
-      placement={placement}
-      size={placement === "bar" ? size : panelItemSize}
-      trackElement={
-        placement === "bar" ? trackItem : undefined
-      }
-    />
-  )
-
-  const trigger =
-    menuIcon === undefined ? (
-      <Button
-        appearance="ghost"
-        intent="neutral"
-        onClick={toggle}
-        size={size}
-      >
-        {menuLabel}
-      </Button>
-    ) : (
-      <IconButton
-        appearance="ghost"
-        intent="neutral"
-        label={menuLabel}
-        onClick={toggle}
-        size={size}
-      >
-        {menuIcon}
-      </IconButton>
-    )
-
-  return (
-    <nav
-      aria-label={label}
-      className={toClassName(
-        "flex min-w-0 flex-1 items-center gap-1",
-        // Two written-out entries rather than one interpolated
-        // string: Tailwind's scanner cannot see a class that
-        // exists only at runtime.
-        isCollapsed && menuAlign === "end"
-          ? "justify-end"
-          : "justify-start",
-        className,
-      )}
-      ref={containerRef}
-    >
-      {isCollapsed ? (
-        <Popover
-          // The default panel is `max-w-xs p-3` — sized for a
-          // paragraph of prose. This one holds full-bleed rows that
-          // bring their own inset, so the padding shrinks to the
-          // gutter around them and the width is left to the list.
-          className="max-w-none p-1"
-          heading={menuLabel}
-          isVisible={isVisible}
-          onDismiss={hide}
-          placement={menuPlacement}
-          trigger={trigger}
-        >
-          {/*
-            A list, so a screen reader says how many destinations
-            there are before the reader starts down them — the one
-            thing the bar's own row communicates by simply being
-            visible all at once.
-          */}
-          <ul className="flex min-w-48 list-none flex-col gap-0.5">
-            {items.map((item) => (
-              <li key={item.key ?? item.href}>
-                {renderLink(item, "panel")}
-              </li>
-            ))}
-          </ul>
-        </Popover>
-      ) : (
-        items.map((item) => renderLink(item, "bar"))
-      )}
-    </nav>
-  )
-}
+  menuLabel,
+  menuPlacement,
+  size,
+}: NavBarProps): ReactNode => (
+  <Nav
+    activeHref={currentHref}
+    className={className}
+    isMenuVisible={isMenuVisible}
+    items={items}
+    label={label}
+    layout="bar"
+    menuAlign={menuAlign}
+    menuIcon={menuIcon}
+    menuLabel={menuLabel}
+    menuPlacement={menuPlacement}
+    size={size}
+  />
+)

package/src/index.ts

@@ -276,12 +276,31 @@ export type {
 export { Menu } from "./Menu/Menu.tsx"
 export type { ModalProps } from "./Modal/Modal.tsx"
 export { Modal } from "./Modal/Modal.tsx"
+export type {
+  NavLayout,
+  NavProps,
+} from "./Nav/Nav.tsx"
+export { Nav } from "./Nav/Nav.tsx"
+export type {
+  NavItem,
+  NavRailItem,
+} from "./Nav/navItems.ts"
+export {
+  getIsCurrentHref,
+  resolveActiveKey,
+} from "./Nav/navItems.ts"
+export type {
+  NavLayoutMode,
+  NavLayoutState,
+  ResolvedNavLayout,
+  UseNavLayoutOptions,
+} from "./Nav/useNavLayout.ts"
+export { useNavLayout } from "./Nav/useNavLayout.ts"
 export type {
   NavBarItem,
   NavBarProps,
 } from "./NavBar/NavBar.tsx"
 export { NavBar } from "./NavBar/NavBar.tsx"
-export { getIsCurrentHref } from "./NavBar/navBarCurrent.ts"
 export type {
   PickerOption,
   PickerProps,

package/src/sourceRules.test.ts

@@ -525,7 +525,19 @@ test("the barrel is the only place components are re-exported", async () => {
   // `VirtualizedGrid` calls `useAdaptiveColumns`. It renders no
   // row, no handle and no buttons; `renderItem` is what lets one
   // component serve three grids that have nothing in common.
-  expect(componentNames.length).toBe(59)
+  //
+  // `Nav` — the destinations as a rail, a collapsed icon rail or a
+  // bottom strip — is +1 -> 60. It is the other half of `NavBar`,
+  // which folds a horizontal row and cannot become a vertical one:
+  // no media query moves an element across `Shell`'s grid, so the
+  // rail is a different corner of the page rather than a restyling
+  // of the same one. Two members stay out of this count by the
+  // `<Name>/<Name>.tsx` rule and are exported from the barrel
+  // anyway — `navItems.ts`, because `resolveActiveKey` is the
+  // active-path rule an app's tests want to assert directly, and
+  // `useNavLayout.ts`, because the app has to read the width rule to
+  // know which corner to render into.
+  expect(componentNames.length).toBe(60)
 
   for (const name of componentNames) {
     expect(barrel).toContain(`export { ${name} }`)

package/dist/NavBar/NavBarLink.d.ts

@@ -1,43 +0,0 @@
-import type { ControlSize } from "@charcuterie/tokens";
-import type { ReactNode } from "react";
-import type { NavBarItem } from "./NavBar.tsx";
-export type NavBarLinkProps = {
-    isCurrent: boolean;
-    item: NavBarItem;
-    /**
-     * Fires when the reader activates this link **in a way that keeps
-     * them on the page** — a plain left click, Enter, Space. It is
-     * what closes the collapsed panel behind them.
-     *
-     * A modified click (ctrl, meta, shift, alt) opens a new tab and
-     * leaves this document exactly where it was, so it deliberately
-     * does not fire: shutting the menu the reader is still working
-     * through is the behaviour that makes people stop ctrl-clicking.
-     */
-    onNavigate?: () => void;
-    /** Where it is drawn. A bar row and a panel row paint differently. */
-    placement: "bar" | "panel";
-    size: ControlSize;
-    /** Hands the bar row's box to the measuring hook. Bar only. */
-    trackElement?: (key: string, element: HTMLElement | null) => void;
-};
-/**
- * One destination, drawn either in the bar or in the collapsed
- * panel — and it is a real `<a href>` in both.
- *
- * That is the whole reason this component exists rather than the
- * `Menu` a collapsed `Toolbar` opens: `MenuItem` is `{ label,
- * onSelect }`, so a nav folded into one becomes a row of
- * `<button>`s. It looks identical in a screenshot and it loses
- * middle-click, ctrl-click, "open in a new tab", "copy link
- * address", the status bar, and the browser's own visited styling.
- * `BuildingAnApp.mdx` names `<button onClick={navigate}>` as the
- * fleet's most common navigation defect; a collapse mechanism that
- * introduced it at narrow widths would be that defect on a timer.
- *
- * The router seam is `ButtonLink`'s, unchanged: an external
- * destination or a fragment falls back to a plain anchor rather than
- * being pushed onto a history stack that has no route for it.
- */
-export declare const NavBarLink: ({ isCurrent, item, onNavigate, placement, size, trackElement, }: NavBarLinkProps) => ReactNode;
-//# sourceMappingURL=NavBarLink.d.ts.map

package/dist/NavBar/NavBarLink.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"NavBarLink.d.ts","sourceRoot":"","sources":["../../src/NavBar/NavBarLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,KAAK,EAAc,SAAS,EAAE,MAAM,OAAO,CAAA;AAUlD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAE9C,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,UAAU,CAAA;IAChB;;;;;;;;;OASG;IACH,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;IACvB,sEAAsE;IACtE,SAAS,EAAE,KAAK,GAAG,OAAO,CAAA;IAC1B,IAAI,EAAE,WAAW,CAAA;IACjB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,CACb,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,WAAW,GAAG,IAAI,KACxB,IAAI,CAAA;CACV,CAAA;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,UAAU,GAAI,iEAOxB,eAAe,KAAG,SA4EpB,CAAA"}

package/dist/NavBar/NavBarLink.js

@@ -1,67 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CONTROL_SIZE_CLASS, PANEL_ITEM_SIZE_CLASS, } from "../controlStyles.js";
-import { FOCUS_RING_CLASS } from "../intentStyles.js";
-import { useRouterLink } from "../RouterLink/RouterLinkProvider.js";
-import { getIsRoutedHref } from "../RouterLink/routerLink.js";
-import { toClassName } from "../toClassName.js";
-/**
- * One destination, drawn either in the bar or in the collapsed
- * panel — and it is a real `<a href>` in both.
- *
- * That is the whole reason this component exists rather than the
- * `Menu` a collapsed `Toolbar` opens: `MenuItem` is `{ label,
- * onSelect }`, so a nav folded into one becomes a row of
- * `<button>`s. It looks identical in a screenshot and it loses
- * middle-click, ctrl-click, "open in a new tab", "copy link
- * address", the status bar, and the browser's own visited styling.
- * `BuildingAnApp.mdx` names `<button onClick={navigate}>` as the
- * fleet's most common navigation defect; a collapse mechanism that
- * introduced it at narrow widths would be that defect on a timer.
- *
- * The router seam is `ButtonLink`'s, unchanged: an external
- * destination or a fragment falls back to a plain anchor rather than
- * being pushed onto a history stack that has no route for it.
- */
-export const NavBarLink = ({ isCurrent, item, onNavigate, placement, size, trackElement, }) => {
-    const RouterLink = useRouterLink();
-    const LinkElement = getIsRoutedHref(item.href)
-        ? RouterLink
-        : "a";
-    const className = placement === "bar"
-        ? toClassName("inline-flex shrink-0 items-center rounded-md border border-transparent whitespace-nowrap transition-colors duration-(--duration-fast) ease-standard", CONTROL_SIZE_CLASS[size], 
-        // Two written-out entries rather than one interpolated
-        // string, the same rule `SegmentedOption` follows:
-        // Tailwind's scanner cannot see a class that exists only
-        // at runtime, and `tailwindCandidates.test.ts` rejects a
-        // template literal in a className outright.
-        isCurrent
-            ? "bg-intent-neutral-surface font-medium text-content-primary"
-            : "text-content-secondary hover:bg-intent-neutral-surface hover:text-content-primary", FOCUS_RING_CLASS)
-        : toClassName("flex w-full items-center rounded-sm text-start transition-colors duration-(--duration-fast) ease-standard", PANEL_ITEM_SIZE_CLASS[size], 
-        // `-hover`, not the plain surface: the panel is drawn on
-        // `surface-overlay`, which every dark scheme paints
-        // *lighter* than the base tint, so the plain one reads as
-        // no change at all. Same correction `MenuAction` carries.
-        isCurrent
-            ? "bg-intent-neutral-surface-hover font-medium text-content-primary"
-            : "text-content-primary hover:bg-intent-neutral-surface-hover", FOCUS_RING_CLASS);
-    return (_jsxs(LinkElement
-    // The platform's own "you are here", and the reason the paint
-    // above is never the only signal: a highlight is invisible to
-    // a screen reader and to anyone who cannot tell the two
-    // surfaces apart.
-    , { "aria-current": isCurrent ? "page" : undefined, className: className, href: item.href, onClick: (event) => {
-            if (event.defaultPrevented ||
-                event.button !== 0 ||
-                event.altKey ||
-                event.ctrlKey ||
-                event.metaKey ||
-                event.shiftKey) {
-                return;
-            }
-            onNavigate?.();
-        }, ref: (element) => {
-            trackElement?.(item.key ?? item.href, element);
-        }, children: [item.icon === undefined ? null : (_jsx("span", { "aria-hidden": "true", className: "shrink-0 text-content-secondary", children: item.icon })), item.label] }));
-};
-//# sourceMappingURL=NavBarLink.js.map

package/dist/NavBar/NavBarLink.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NavBarLink.js","sourceRoot":"","sources":["../../src/NavBar/NavBarLink.tsx"],"names":[],"mappings":";AAGA,OAAO,EACL,kBAAkB,EAClB,qBAAqB,GACtB,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,qCAAsC,CAAA;AACpE,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AA2B/C;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,SAAS,EACT,IAAI,EACJ,UAAU,EACV,SAAS,EACT,IAAI,EACJ,YAAY,GACI,EAAa,EAAE;IAC/B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAElC,MAAM,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;QAC5C,CAAC,CAAC,UAAU;QACZ,CAAC,CAAC,GAAG,CAAA;IAEP,MAAM,SAAS,GACb,SAAS,KAAK,KAAK;QACjB,CAAC,CAAC,WAAW,CACT,qJAAqJ,EACrJ,kBAAkB,CAAC,IAAI,CAAC;QACxB,uDAAuD;QACvD,mDAAmD;QACnD,yDAAyD;QACzD,yDAAyD;QACzD,4CAA4C;QAC5C,SAAS;YACP,CAAC,CAAC,4DAA4D;YAC9D,CAAC,CAAC,mFAAmF,EACvF,gBAAgB,CACjB;QACH,CAAC,CAAC,WAAW,CACT,2GAA2G,EAC3G,qBAAqB,CAAC,IAAI,CAAC;QAC3B,yDAAyD;QACzD,oDAAoD;QACpD,0DAA0D;QAC1D,0DAA0D;QAC1D,SAAS;YACP,CAAC,CAAC,kEAAkE;YACpE,CAAC,CAAC,4DAA4D,EAChE,gBAAgB,CACjB,CAAA;IAEP,OAAO,CACL,MAAC,WAAW;IACV,8DAA8D;IAC9D,8DAA8D;IAC9D,wDAAwD;IACxD,kBAAkB;wBACJ,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC5C,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,CAAC,KAAoC,EAAE,EAAE;YAChD,IACE,KAAK,CAAC,gBAAgB;gBACtB,KAAK,CAAC,MAAM,KAAK,CAAC;gBAClB,KAAK,CAAC,MAAM;gBACZ,KAAK,CAAC,OAAO;gBACb,KAAK,CAAC,OAAO;gBACb,KAAK,CAAC,QAAQ,EACd,CAAC;gBACD,OAAM;YACR,CAAC;YAED,UAAU,EAAE,EAAE,CAAA;QAChB,CAAC,EACD,GAAG,EAAE,CAAC,OAAiC,EAAE,EAAE;YACzC,YAAY,EAAE,CAAC,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,CAAC,CAAA;QAChD,CAAC,aAEA,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAGhC,8BACc,MAAM,EAClB,SAAS,EAAC,iCAAiC,YAE1C,IAAI,CAAC,IAAI,GACL,CACR,EAEA,IAAI,CAAC,KAAK,IACC,CACf,CAAA;AACH,CAAC,CAAA"}

package/dist/NavBar/navBarCurrent.d.ts

@@ -1,37 +0,0 @@
-/**
- * Which destination the reader is on — the rule behind
- * `aria-current="page"`, kept pure so it can be checked in Node.
- *
- * The library is router-agnostic (see `RouterLinkProvider`), so it
- * cannot ask a router which link is active. The app hands it one
- * string — `useLocation().pathname`, `window.location.pathname`,
- * whatever it has — and this decides the rest.
- *
- * ## A parent path is current for its children
- *
- * `/tasks` is current while the reader is on `/tasks/41`, because a
- * nav item names a **section** and a section does not stop being the
- * one you are in when you open something inside it. The match is on
- * whole segments: `/task` is *not* current for `/tasks`, which a bare
- * `startsWith` would get wrong.
- *
- * ## `/` is exact, and that is deliberately not react-router
- *
- * react-router's `<NavLink to="/">` is active on **every** route
- * unless the caller remembers `end`, which is the footgun behind
- * every "why is Home always highlighted" bug in the fleet. The root
- * matches only itself here, and there is no prop to change it: a nav
- * with two current items is a nav that has stopped saying anything.
- *
- * ## The query string and the fragment are not part of the answer
- *
- * `/backlog?focus=search` is still the Backlog. Sorting a list does
- * not move the reader to a different destination.
- */
-export declare const getIsCurrentHref: ({ currentHref, href, }: {
-    /** Where the reader is. `undefined` means "nothing is current". */
-    currentHref: string | undefined;
-    /** Where this destination goes. */
-    href: string;
-}) => boolean;
-//# sourceMappingURL=navBarCurrent.d.ts.map

package/dist/NavBar/navBarCurrent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"navBarCurrent.d.ts","sourceRoot":"","sources":["../../src/NavBar/navBarCurrent.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAUH,eAAO,MAAM,gBAAgB,GAAI,wBAG9B;IACD,mEAAmE;IACnE,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAA;CACb,KAAG,OAgBH,CAAA"}

package/dist/NavBar/navBarCurrent.js

@@ -1,48 +0,0 @@
-/**
- * Which destination the reader is on — the rule behind
- * `aria-current="page"`, kept pure so it can be checked in Node.
- *
- * The library is router-agnostic (see `RouterLinkProvider`), so it
- * cannot ask a router which link is active. The app hands it one
- * string — `useLocation().pathname`, `window.location.pathname`,
- * whatever it has — and this decides the rest.
- *
- * ## A parent path is current for its children
- *
- * `/tasks` is current while the reader is on `/tasks/41`, because a
- * nav item names a **section** and a section does not stop being the
- * one you are in when you open something inside it. The match is on
- * whole segments: `/task` is *not* current for `/tasks`, which a bare
- * `startsWith` would get wrong.
- *
- * ## `/` is exact, and that is deliberately not react-router
- *
- * react-router's `<NavLink to="/">` is active on **every** route
- * unless the caller remembers `end`, which is the footgun behind
- * every "why is Home always highlighted" bug in the fleet. The root
- * matches only itself here, and there is no prop to change it: a nav
- * with two current items is a nav that has stopped saying anything.
- *
- * ## The query string and the fragment are not part of the answer
- *
- * `/backlog?focus=search` is still the Backlog. Sorting a list does
- * not move the reader to a different destination.
- */
-const toComparablePath = (href) => {
-    const path = href.split(/[#?]/u)[0] ?? "";
-    // A trailing slash is the same place, so it must not change the
-    // answer — but `/` itself has to survive being trimmed.
-    return path.length > 1 ? path.replace(/\/+$/u, "") : path;
-};
-export const getIsCurrentHref = ({ currentHref, href, }) => {
-    if (currentHref === undefined) {
-        return false;
-    }
-    const current = toComparablePath(currentHref);
-    const target = toComparablePath(href);
-    if (target === "" || target === "/") {
-        return current === target;
-    }
-    return (current === target || current.startsWith(`${target}/`));
-};
-//# sourceMappingURL=navBarCurrent.js.map

package/dist/NavBar/navBarCurrent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"navBarCurrent.js","sourceRoot":"","sources":["../../src/NavBar/navBarCurrent.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AAEH,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAU,EAAE;IAChD,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAA;IAEzC,gEAAgE;IAChE,wDAAwD;IACxD,OAAO,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;AAC3D,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAC/B,WAAW,EACX,IAAI,GAML,EAAW,EAAE;IACZ,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;QAC9B,OAAO,KAAK,CAAA;IACd,CAAC;IAED,MAAM,OAAO,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAA;IAE7C,MAAM,MAAM,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAA;IAErC,IAAI,MAAM,KAAK,EAAE,IAAI,MAAM,KAAK,GAAG,EAAE,CAAC;QACpC,OAAO,OAAO,KAAK,MAAM,CAAA;IAC3B,CAAC;IAED,OAAO,CACL,OAAO,KAAK,MAAM,IAAI,OAAO,CAAC,UAAU,CAAC,GAAG,MAAM,GAAG,CAAC,CACvD,CAAA;AACH,CAAC,CAAA"}