@fairmint/ui 0.3.28 → 0.3.30

package/dist/components/layout/SideNav/SideNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideNav.js","sources":["../../../../src/components/layout/SideNav/SideNav.tsx"],"sourcesContent":["import {\n  ActionIcon,\n  Box,\n  Divider,\n  Group,\n  Menu,\n  NavLink,\n  type NavLinkProps,\n  Stack,\n  Tooltip,\n  UnstyledButton,\n} from \"@mantine/core\";\nimport { useUncontrolled } from \"@mantine/hooks\";\nimport { IconLayoutSidebarLeftCollapse, IconLayoutSidebarLeftExpand } from \"@tabler/icons-react\";\nimport { type ReactNode, useEffect, useState } from \"react\";\nimport { fairmintVars, radii } from \"../../../theme\";\n\n/** Expanded product side-nav width (Brand System shell metric). */\nexport const SIDE_NAV_WIDTH = 260;\n\n/**\n * Collapsed icon-rail width.\n * Proposed shell metric for Dylan / Brand System review — not yet in Brand System v3.4.\n */\nexport const SIDE_NAV_COLLAPSED_WIDTH = 80;\n\n/**\n * Floating chrome (tooltips, nested flyouts) must clear Studio/Investor fixed\n * shell layers — side nav ≈1200, header ≈1201, menus ≥1300.\n */\nconst SIDE_NAV_FLOATING_Z_INDEX = 1300;\n\nexport interface SideNavItem {\n  /** Unique identifier for this nav item (e.g., route path or slug). */\n  id: string;\n  /** Display label. */\n  label: ReactNode;\n  /**\n   * Accessible name when `label` is not a plain string.\n   * Also used for collapsed tooltips and letter-fallback derivation.\n   */\n  ariaLabel?: string;\n  /** Icon element. */\n  icon?: ReactNode;\n  /** Optional content rendered at the end of the item, such as a badge. */\n  rightSection?: ReactNode;\n  /** Whether this item is currently active. */\n  active?: boolean;\n  /** Whether the item is unavailable. */\n  disabled?: boolean;\n  /** Nested navigation items. */\n  children?: SideNavItem[];\n  /** Controlled expanded state for items with children. */\n  open?: boolean;\n}\n\nexport interface SideNavSection {\n  /** Unique identifier for the section. */\n  id: string;\n  /** Navigation items in this section. */\n  items: SideNavItem[];\n}\n\nexport interface SideNavProps {\n  /** Navigation items to render when section headings are not needed. */\n  items?: SideNavItem[];\n  /** Grouped navigation items. Sections are data-only — Fairmint product nav does not render section titles. */\n  sections?: SideNavSection[];\n  /** Callback when a nav item is clicked. Receives the item's `id`. */\n  onItemClick: (id: string) => void;\n  /** Active color. @default colors.primary */\n  color?: string;\n  /** Accessible label for the navigation landmark. @default \"Main navigation\" */\n  ariaLabel?: string;\n  /** Render a light right border when the parent shell does not already own the divider. @default false */\n  withBorder?: boolean;\n  /**\n   * Logo or other chrome above the nav list.\n   * Consumers own expanded wordmark vs collapsed mark switching.\n   */\n  header?: ReactNode;\n  /**\n   * Primary nav CTA pinned above the profile (Investor \"Add Investment\", Studio \"New\").\n   * Prefer this over stuffing the CTA into `items`.\n   */\n  cta?: ReactNode;\n  /**\n   * Account / profile control pinned to the bottom of the rail.\n   * Product shells keep profile here — not in the scrollable destination list or AppHeader.\n   */\n  profile?: ReactNode;\n  /**\n   * Custom bottom chrome. When set, replaces the standard `cta` + divider + `profile` composition.\n   */\n  footer?: ReactNode;\n  /** Controlled collapsed (icon-rail) state. */\n  collapsed?: boolean;\n  /** Uncontrolled initial collapsed state. @default false */\n  defaultCollapsed?: boolean;\n  /** Called when the user toggles collapse. */\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** When true, render a collapse/expand control beside the logo (visible on header hover). @default false */\n  collapsible?: boolean;\n}\n\nfunction hasActiveDescendant(item: SideNavItem): boolean {\n  return item.children?.some((child) => child.active || hasActiveDescendant(child)) ?? false;\n}\n\n/** Resolve a plain-text name for tooltips, aria-label, and letter fallback. */\nexport function getSideNavItemLabelText(item: Pick<SideNavItem, \"label\" | \"ariaLabel\">): string {\n  if (item.ariaLabel) {\n    return item.ariaLabel;\n  }\n  if (typeof item.label === \"string\") {\n    return item.label;\n  }\n  if (typeof item.label === \"number\") {\n    return String(item.label);\n  }\n  return \"Item\";\n}\n\n/** First letter/number monogram for icon-less items in the collapsed rail. */\nexport function getSideNavLetterFallback(labelText: string): string {\n  const match = labelText.match(/[\\p{L}\\p{N}]/u);\n  return match ? match[0].toUpperCase() : \"?\";\n}\n\nfunction LetterFallback({ letter, active = false }: { letter: string; active?: boolean }) {\n  return (\n    <Box\n      component=\"span\"\n      aria-hidden\n      data-active={active || undefined}\n      style={{\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        width: 20,\n        height: 20,\n        flexShrink: 0,\n        fontSize: 12,\n        fontWeight: active ? 700 : 600,\n        lineHeight: 1,\n        // Selected chrome lives on the parent control — glyph matches icon sizing.\n        color: active ? fairmintVars.colorIconOnSurfaceSelected : \"inherit\",\n      }}\n    >\n      {letter}\n    </Box>\n  );\n}\n\nfunction CollapseToggle({\n  collapsed,\n  onToggle,\n  visible,\n}: {\n  collapsed: boolean;\n  onToggle: () => void;\n  /** When false, hide visually but keep focusable for keyboard users via opacity/focus styles. */\n  visible: boolean;\n}) {\n  const label = collapsed ? \"Expand navigation\" : \"Collapse navigation\";\n  const Icon = collapsed ? IconLayoutSidebarLeftExpand : IconLayoutSidebarLeftCollapse;\n\n  const button = (\n    <UnstyledButton\n      data-sidenav-collapse\n      aria-label={label}\n      aria-expanded={!collapsed}\n      onClick={onToggle}\n      style={{\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        height: 32,\n        flexShrink: 0,\n        borderRadius: radii.md,\n        color: fairmintVars.colorIconTertiary,\n        opacity: visible ? 1 : 0,\n        pointerEvents: visible ? \"auto\" : \"none\",\n        transition: \"opacity 120ms ease\",\n        // Keep a layout slot when expanded so the wordmark does not shift on hover.\n        // Collapsed: always a fixed control below the logo.\n        width: 32,\n        overflow: \"hidden\",\n        padding: 0,\n      }}\n    >\n      <Icon size={20} stroke={1.5} aria-hidden />\n    </UnstyledButton>\n  );\n\n  if (!collapsed) {\n    return button;\n  }\n\n  return (\n    <Tooltip\n      label={label}\n      position=\"right\"\n      withArrow\n      withinPortal\n      zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n      events={{ hover: true, focus: true, touch: true }}\n      disabled={!visible}\n    >\n      {button}\n    </Tooltip>\n  );\n}\n\nfunction resolveLeftSection(\n  item: SideNavItem,\n  labelText: string,\n  { requireIcon, active }: { requireIcon: boolean; active?: boolean },\n): ReactNode {\n  if (item.icon) {\n    return item.icon;\n  }\n  if (requireIcon) {\n    return <LetterFallback letter={getSideNavLetterFallback(labelText)} active={Boolean(active)} />;\n  }\n  return undefined;\n}\n\n/** Collapsed rail control size — matches square CTA chrome. */\nconst COLLAPSED_ITEM_SIZE = 36;\n\nconst navLinkStyles = (active: boolean | undefined): NavLinkProps[\"styles\"] => ({\n  root: {\n    color: active ? fairmintVars.colorTextPrimary : fairmintVars.colorTextSecondary,\n    fontWeight: active ? 500 : 400,\n    borderRadius: radii.md,\n    // Prefer Fairmint selected surface over Mantine defaults for active chrome.\n    ...(active\n      ? {\n          \"--nl-bg\": fairmintVars.colorSurfaceSelected,\n          \"--nl-hover\": fairmintVars.colorSurfaceSelected,\n          \"--nl-color\": fairmintVars.colorIconOnSurfaceSelected,\n          backgroundColor: fairmintVars.colorSurfaceSelected,\n        }\n      : {}),\n  },\n  section: {\n    color: active ? fairmintVars.colorIconOnSurfaceSelected : fairmintVars.colorIconTertiary,\n  },\n});\n\ninterface SideNavNodeProps {\n  color: string;\n  item: SideNavItem;\n  onItemClick: (id: string) => void;\n  collapsed: boolean;\n}\n\nfunction ExpandedSideNavNode({ color, item, onItemClick }: Omit<SideNavNodeProps, \"collapsed\">) {\n  const containsActiveItem = hasActiveDescendant(item);\n  const [opened, setOpened] = useState(item.open ?? containsActiveItem);\n  const labelText = getSideNavItemLabelText(item);\n\n  useEffect(() => {\n    if (item.open !== undefined) {\n      setOpened(item.open);\n    } else if (containsActiveItem) {\n      setOpened(true);\n    }\n  }, [containsActiveItem, item.open]);\n\n  const hasChildren = Boolean(item.children?.length);\n\n  return (\n    <NavLink\n      component=\"button\"\n      type=\"button\"\n      label={item.label}\n      leftSection={resolveLeftSection(item, labelText, {\n        requireIcon: false,\n        active: item.active,\n      })}\n      rightSection={item.rightSection}\n      active={item.active}\n      disabled={item.disabled}\n      color={color}\n      variant=\"light\"\n      childrenOffset={16}\n      opened={hasChildren ? opened : undefined}\n      aria-label={item.ariaLabel}\n      onClick={\n        hasChildren\n          ? () => setOpened((currentOpened) => !currentOpened)\n          : () => onItemClick(item.id)\n      }\n      styles={navLinkStyles(item.active)}\n    >\n      {item.children?.map((child) => (\n        <ExpandedSideNavNode key={child.id} item={child} color={color} onItemClick={onItemClick} />\n      ))}\n    </NavLink>\n  );\n}\n\n/** Flatten nested groups to leaves for the collapsed flyout (one actionable list). */\nfunction collectCollapsedMenuLeaves(items: SideNavItem[]): SideNavItem[] {\n  return items.flatMap((item) =>\n    item.children?.length ? collectCollapsedMenuLeaves(item.children) : [item],\n  );\n}\n\nfunction CollapsedNestedMenuItems({\n  items,\n  onItemClick,\n  color,\n}: {\n  items: SideNavItem[];\n  onItemClick: (id: string) => void;\n  color: string;\n}) {\n  return collectCollapsedMenuLeaves(items).map((child) => {\n    const childLabel = getSideNavItemLabelText(child);\n    const isActive = Boolean(child.active);\n    return (\n      <Menu.Item\n        key={child.id}\n        disabled={child.disabled}\n        leftSection={resolveLeftSection(child, childLabel, {\n          requireIcon: true,\n          active: isActive,\n        })}\n        onClick={() => onItemClick(child.id)}\n        aria-current={isActive ? \"page\" : undefined}\n        data-active={isActive || undefined}\n        color={isActive ? color : undefined}\n        style={\n          isActive\n            ? {\n                backgroundColor: fairmintVars.colorSurfaceSelected,\n                color: fairmintVars.colorIconOnSurfaceSelected,\n                fontWeight: 600,\n              }\n            : undefined\n        }\n      >\n        {child.label}\n      </Menu.Item>\n    );\n  });\n}\n\nfunction CollapsedSideNavNode({ color, item, onItemClick }: Omit<SideNavNodeProps, \"collapsed\">) {\n  const labelText = getSideNavItemLabelText(item);\n  const hasChildren = Boolean(item.children?.length);\n  const isActive = Boolean(item.active || hasActiveDescendant(item));\n  const leftSection = resolveLeftSection(item, labelText, {\n    requireIcon: true,\n    active: isActive,\n  });\n\n  // ActionIcon (not NavLink): NavLink.css forces `width: 100%` and asymmetric\n  // horizontal padding, which makes selected/hover chrome a wide pill.\n  // Selected fill uses Fairmint surface/selected — Mantine `light` is too dim in dark mode.\n  const link = (\n    <ActionIcon\n      type=\"button\"\n      variant=\"subtle\"\n      color={color}\n      size={COLLAPSED_ITEM_SIZE}\n      radius=\"md\"\n      disabled={item.disabled}\n      aria-label={labelText}\n      aria-current={isActive ? \"page\" : undefined}\n      data-active={isActive || undefined}\n      onClick={hasChildren ? undefined : () => onItemClick(item.id)}\n      style={{\n        width: COLLAPSED_ITEM_SIZE,\n        height: COLLAPSED_ITEM_SIZE,\n        minWidth: COLLAPSED_ITEM_SIZE,\n        minHeight: COLLAPSED_ITEM_SIZE,\n        ...(isActive\n          ? {\n              \"--ai-bg\": fairmintVars.colorSurfaceSelected,\n              \"--ai-hover\": fairmintVars.colorSurfaceSelected,\n              \"--ai-color\": fairmintVars.colorIconOnSurfaceSelected,\n              \"--ai-hover-color\": fairmintVars.colorIconOnSurfaceSelected,\n              backgroundColor: fairmintVars.colorSurfaceSelected,\n              color: fairmintVars.colorIconOnSurfaceSelected,\n            }\n          : {\n              color: fairmintVars.colorIconTertiary,\n            }),\n      }}\n    >\n      {leftSection}\n    </ActionIcon>\n  );\n\n  const control = hasChildren ? (\n    <Menu position=\"right-start\" offset={8} withinPortal zIndex={SIDE_NAV_FLOATING_Z_INDEX}>\n      <Tooltip\n        label={labelText}\n        position=\"right\"\n        withArrow\n        withinPortal\n        zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n        events={{ hover: true, focus: true, touch: true }}\n      >\n        <Menu.Target>{link}</Menu.Target>\n      </Tooltip>\n      <Menu.Dropdown>\n        <CollapsedNestedMenuItems\n          items={item.children ?? []}\n          onItemClick={onItemClick}\n          color={color}\n        />\n      </Menu.Dropdown>\n    </Menu>\n  ) : (\n    <Tooltip\n      label={labelText}\n      position=\"right\"\n      withArrow\n      withinPortal\n      zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n      events={{ hover: true, focus: true, touch: true }}\n    >\n      {link}\n    </Tooltip>\n  );\n\n  // Uniform Stack child so Menu vs Tooltip wrappers cannot skew item gaps.\n  return <Box style={{ width: \"100%\", display: \"flex\", justifyContent: \"center\" }}>{control}</Box>;\n}\n\nfunction SideNavNode(props: SideNavNodeProps) {\n  if (props.collapsed) {\n    return <CollapsedSideNavNode {...props} />;\n  }\n  return <ExpandedSideNavNode {...props} />;\n}\n\nexport function SideNav({\n  items = [],\n  sections,\n  onItemClick,\n  color = \"indigo\",\n  ariaLabel = \"Main navigation\",\n  withBorder = false,\n  header,\n  cta,\n  profile,\n  footer,\n  collapsed,\n  defaultCollapsed = false,\n  onCollapsedChange,\n  collapsible = false,\n}: SideNavProps) {\n  const resolvedSections = sections ?? [{ id: \"main\", items }];\n  const [collapsedState, setCollapsedState] = useUncontrolled({\n    value: collapsed,\n    defaultValue: defaultCollapsed,\n    finalValue: false,\n    onChange: onCollapsedChange,\n  });\n\n  const hasBottomChrome = Boolean(footer || cta || profile);\n  const [headerHovered, setHeaderHovered] = useState(false);\n  const showExpandedCollapseControl = headerHovered;\n  const showHeaderChrome = Boolean(header) || collapsible;\n\n  const collapseToggle = collapsible ? (\n    <CollapseToggle\n      collapsed={collapsedState}\n      visible={collapsedState ? true : showExpandedCollapseControl}\n      onToggle={() => setCollapsedState(!collapsedState)}\n    />\n  ) : null;\n\n  return (\n    <Stack\n      component=\"nav\"\n      gap=\"md\"\n      h=\"100%\"\n      p={collapsedState ? \"sm\" : \"md\"}\n      aria-label={ariaLabel}\n      data-collapsed={collapsedState || undefined}\n      style={{\n        borderRight: withBorder ? \"1px solid\" : undefined,\n        borderRightColor: withBorder ? fairmintVars.colorBorderDefault : undefined,\n        boxShadow: \"none\",\n      }}\n    >\n      {showHeaderChrome ? (\n        collapsedState ? (\n          <Stack gap={6} align=\"center\">\n            {header ? (\n              <Box\n                style={{\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  justifyContent: \"center\",\n                  width: \"100%\",\n                }}\n              >\n                {header}\n              </Box>\n            ) : null}\n            {collapseToggle}\n          </Stack>\n        ) : (\n          <Group\n            justify=\"space-between\"\n            wrap=\"nowrap\"\n            gap=\"xs\"\n            align=\"center\"\n            style={{ minHeight: 32 }}\n            onMouseEnter={() => setHeaderHovered(true)}\n            onMouseLeave={() => setHeaderHovered(false)}\n            onFocusCapture={() => setHeaderHovered(true)}\n            onBlurCapture={(event) => {\n              if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n                setHeaderHovered(false);\n              }\n            }}\n          >\n            {header ? (\n              <Box\n                style={{\n                  flex: 1,\n                  minWidth: 0,\n                  overflow: \"hidden\",\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  justifyContent: \"flex-start\",\n                }}\n              >\n                {header}\n              </Box>\n            ) : null}\n            {collapseToggle}\n          </Group>\n        )\n      ) : null}\n\n      <Stack gap={4} style={{ flex: 1, minHeight: 0, overflow: \"auto\" }}>\n        {resolvedSections.flatMap((section) =>\n          section.items.map((item) => (\n            <SideNavNode\n              key={`${section.id}:${item.id}`}\n              item={item}\n              color={color}\n              onItemClick={onItemClick}\n              collapsed={collapsedState}\n            />\n          )),\n        )}\n      </Stack>\n\n      {hasBottomChrome ? (\n        <Stack gap=\"sm\" style={{ flexShrink: 0 }}>\n          {footer ?? (\n            <>\n              {cta ? (\n                <Box\n                  style={{\n                    width: \"100%\",\n                    display: \"flex\",\n                    justifyContent: collapsedState ? \"center\" : \"stretch\",\n                  }}\n                >\n                  {cta}\n                </Box>\n              ) : null}\n              {cta && profile ? <Divider color={fairmintVars.colorBorderDefault} /> : null}\n              {profile ? <Box style={{ width: \"100%\" }}>{profile}</Box> : null}\n            </>\n          )}\n        </Stack>\n      ) : null}\n    </Stack>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SideNav.js","sources":["../../../../src/components/layout/SideNav/SideNav.tsx"],"sourcesContent":["import {\n  ActionIcon,\n  Box,\n  Divider,\n  Group,\n  Menu,\n  NavLink,\n  type NavLinkProps,\n  Stack,\n  Tooltip,\n  UnstyledButton,\n} from \"@mantine/core\";\nimport { useUncontrolled } from \"@mantine/hooks\";\nimport { IconLayoutSidebarLeftCollapse, IconLayoutSidebarLeftExpand } from \"@tabler/icons-react\";\nimport { type ReactNode, useEffect, useState } from \"react\";\nimport { fairmintVars, radii, spacing } from \"../../../theme\";\n\n/** Expanded product side-nav width (Brand System shell metric). */\nexport const SIDE_NAV_WIDTH = 260;\n\n/**\n * Collapsed icon-rail width.\n * Proposed shell metric for Dylan / Brand System review — not yet in Brand System v3.4.\n */\nexport const SIDE_NAV_COLLAPSED_WIDTH = 80;\n\n/**\n * Floating chrome (tooltips, nested flyouts) must clear Studio/Investor fixed\n * shell layers — side nav ≈1200, header ≈1201, menus ≥1300.\n */\nconst SIDE_NAV_FLOATING_Z_INDEX = 1300;\n\nexport interface SideNavItem {\n  /** Unique identifier for this nav item (e.g., route path or slug). */\n  id: string;\n  /** Display label. */\n  label: ReactNode;\n  /**\n   * Accessible name when `label` is not a plain string.\n   * Also used for collapsed tooltips and letter-fallback derivation.\n   */\n  ariaLabel?: string;\n  /** Icon element. */\n  icon?: ReactNode;\n  /** Optional content rendered at the end of the item, such as a badge. */\n  rightSection?: ReactNode;\n  /** Whether this item is currently active. */\n  active?: boolean;\n  /** Whether the item is unavailable. */\n  disabled?: boolean;\n  /** Nested navigation items. */\n  children?: SideNavItem[];\n  /** Controlled expanded state for items with children. */\n  open?: boolean;\n}\n\nexport interface SideNavSection {\n  /** Unique identifier for the section. */\n  id: string;\n  /** Navigation items in this section. */\n  items: SideNavItem[];\n}\n\nexport interface SideNavProps {\n  /** Navigation items to render when section headings are not needed. */\n  items?: SideNavItem[];\n  /** Grouped navigation items. Sections are data-only — Fairmint product nav does not render section titles. */\n  sections?: SideNavSection[];\n  /** Callback when a nav item is clicked. Receives the item's `id`. */\n  onItemClick: (id: string) => void;\n  /** Active color. @default colors.primary */\n  color?: string;\n  /** Accessible label for the navigation landmark. @default \"Main navigation\" */\n  ariaLabel?: string;\n  /** Render a light right border when the parent shell does not already own the divider. @default false */\n  withBorder?: boolean;\n  /**\n   * Logo or other chrome above the nav list.\n   * Consumers own expanded wordmark vs collapsed mark switching.\n   */\n  header?: ReactNode;\n  /**\n   * Primary nav CTA pinned above the profile (Investor \"Add Investment\", Studio \"New\").\n   * Prefer this over stuffing the CTA into `items`.\n   */\n  cta?: ReactNode;\n  /**\n   * Account / profile control pinned to the bottom of the rail.\n   * Product shells keep profile here — not in the scrollable destination list or AppHeader.\n   */\n  profile?: ReactNode;\n  /**\n   * Custom bottom chrome. When set, replaces the standard `cta` + divider + `profile` composition.\n   */\n  footer?: ReactNode;\n  /** Controlled collapsed (icon-rail) state. */\n  collapsed?: boolean;\n  /** Uncontrolled initial collapsed state. @default false */\n  defaultCollapsed?: boolean;\n  /** Called when the user toggles collapse. */\n  onCollapsedChange?: (collapsed: boolean) => void;\n  /** When true, render a collapse/expand control beside the logo (visible on header hover). @default false */\n  collapsible?: boolean;\n}\n\nfunction hasActiveDescendant(item: SideNavItem): boolean {\n  return item.children?.some((child) => child.active || hasActiveDescendant(child)) ?? false;\n}\n\n/** Resolve a plain-text name for tooltips, aria-label, and letter fallback. */\nexport function getSideNavItemLabelText(item: Pick<SideNavItem, \"label\" | \"ariaLabel\">): string {\n  if (item.ariaLabel) {\n    return item.ariaLabel;\n  }\n  if (typeof item.label === \"string\") {\n    return item.label;\n  }\n  if (typeof item.label === \"number\") {\n    return String(item.label);\n  }\n  return \"Item\";\n}\n\n/** First letter/number monogram for icon-less items in the collapsed rail. */\nexport function getSideNavLetterFallback(labelText: string): string {\n  const match = labelText.match(/[\\p{L}\\p{N}]/u);\n  return match ? match[0].toUpperCase() : \"?\";\n}\n\nfunction LetterFallback({ letter, active = false }: { letter: string; active?: boolean }) {\n  return (\n    <Box\n      component=\"span\"\n      aria-hidden\n      data-active={active || undefined}\n      style={{\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        width: 20,\n        height: 20,\n        flexShrink: 0,\n        fontSize: 12,\n        fontWeight: active ? 700 : 600,\n        lineHeight: 1,\n        // Selected chrome lives on the parent control — glyph matches icon sizing.\n        color: active ? fairmintVars.colorIconOnSurfaceSelected : \"inherit\",\n      }}\n    >\n      {letter}\n    </Box>\n  );\n}\n\nfunction CollapseToggle({\n  collapsed,\n  onToggle,\n  visible,\n}: {\n  collapsed: boolean;\n  onToggle: () => void;\n  /** When false, hide visually but keep focusable for keyboard users via opacity/focus styles. */\n  visible: boolean;\n}) {\n  const label = collapsed ? \"Expand navigation\" : \"Collapse navigation\";\n  const Icon = collapsed ? IconLayoutSidebarLeftExpand : IconLayoutSidebarLeftCollapse;\n\n  const button = (\n    <UnstyledButton\n      data-sidenav-collapse\n      aria-label={label}\n      aria-expanded={!collapsed}\n      onClick={onToggle}\n      style={{\n        display: \"inline-flex\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n        height: 32,\n        flexShrink: 0,\n        borderRadius: radii.md,\n        color: fairmintVars.colorIconTertiary,\n        opacity: visible ? 1 : 0,\n        pointerEvents: visible ? \"auto\" : \"none\",\n        transition: \"opacity 120ms ease\",\n        // Keep a layout slot when expanded so the wordmark does not shift on hover.\n        // Collapsed: always a fixed control below the logo.\n        width: 32,\n        overflow: \"hidden\",\n        padding: 0,\n      }}\n    >\n      <Icon size={20} stroke={1.5} aria-hidden />\n    </UnstyledButton>\n  );\n\n  if (!collapsed) {\n    return button;\n  }\n\n  return (\n    <Tooltip\n      label={label}\n      position=\"right\"\n      withArrow\n      withinPortal\n      zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n      events={{ hover: true, focus: true, touch: true }}\n      disabled={!visible}\n    >\n      {button}\n    </Tooltip>\n  );\n}\n\nfunction resolveLeftSection(\n  item: SideNavItem,\n  labelText: string,\n  { requireIcon, active }: { requireIcon: boolean; active?: boolean },\n): ReactNode {\n  if (item.icon) {\n    return item.icon;\n  }\n  if (requireIcon) {\n    return <LetterFallback letter={getSideNavLetterFallback(labelText)} active={Boolean(active)} />;\n  }\n  return undefined;\n}\n\n/** Collapsed rail control size — matches square CTA chrome. */\nconst COLLAPSED_ITEM_SIZE = 36;\n\n/**\n * Nested leaf indent so label text lines up with parent labels.\n * Parent rows use a 20px icon + `spacing.sm` section gap before the label.\n */\nconst NESTED_NAV_CHILDREN_OFFSET = `calc(20px + ${spacing.sm})`;\n\nconst navLinkStyles = (active: boolean | undefined): NavLinkProps[\"styles\"] => ({\n  root: {\n    color: active ? fairmintVars.colorTextPrimary : fairmintVars.colorTextSecondary,\n    fontWeight: active ? 500 : 400,\n    borderRadius: radii.md,\n    // Prefer Fairmint selected surface over Mantine defaults for active chrome.\n    ...(active\n      ? {\n          \"--nl-bg\": fairmintVars.colorSurfaceSelected,\n          \"--nl-hover\": fairmintVars.colorSurfaceSelected,\n          \"--nl-color\": fairmintVars.colorIconOnSurfaceSelected,\n          backgroundColor: fairmintVars.colorSurfaceSelected,\n        }\n      : {}),\n  },\n  section: {\n    color: active ? fairmintVars.colorIconOnSurfaceSelected : fairmintVars.colorIconTertiary,\n  },\n});\n\ninterface SideNavNodeProps {\n  color: string;\n  item: SideNavItem;\n  onItemClick: (id: string) => void;\n  collapsed: boolean;\n}\n\nfunction ExpandedSideNavNode({ color, item, onItemClick }: Omit<SideNavNodeProps, \"collapsed\">) {\n  const containsActiveItem = hasActiveDescendant(item);\n  const [opened, setOpened] = useState(item.open ?? containsActiveItem);\n  const labelText = getSideNavItemLabelText(item);\n\n  useEffect(() => {\n    if (item.open !== undefined) {\n      setOpened(item.open);\n    } else if (containsActiveItem) {\n      setOpened(true);\n    }\n  }, [containsActiveItem, item.open]);\n\n  const hasChildren = Boolean(item.children?.length);\n\n  return (\n    <NavLink\n      component=\"button\"\n      type=\"button\"\n      label={item.label}\n      leftSection={resolveLeftSection(item, labelText, {\n        requireIcon: false,\n        active: item.active,\n      })}\n      rightSection={item.rightSection}\n      active={item.active}\n      disabled={item.disabled}\n      color={color}\n      variant=\"light\"\n      childrenOffset={NESTED_NAV_CHILDREN_OFFSET}\n      opened={hasChildren ? opened : undefined}\n      aria-label={item.ariaLabel}\n      onClick={\n        hasChildren\n          ? () => setOpened((currentOpened) => !currentOpened)\n          : () => onItemClick(item.id)\n      }\n      styles={navLinkStyles(item.active)}\n    >\n      {item.children?.map((child) => (\n        <ExpandedSideNavNode key={child.id} item={child} color={color} onItemClick={onItemClick} />\n      ))}\n    </NavLink>\n  );\n}\n\n/** Flatten nested groups to leaves for the collapsed flyout (one actionable list). */\nfunction collectCollapsedMenuLeaves(items: SideNavItem[]): SideNavItem[] {\n  return items.flatMap((item) =>\n    item.children?.length ? collectCollapsedMenuLeaves(item.children) : [item],\n  );\n}\n\nfunction CollapsedNestedMenuItems({\n  items,\n  onItemClick,\n  color,\n}: {\n  items: SideNavItem[];\n  onItemClick: (id: string) => void;\n  color: string;\n}) {\n  return collectCollapsedMenuLeaves(items).map((child) => {\n    const childLabel = getSideNavItemLabelText(child);\n    const isActive = Boolean(child.active);\n    return (\n      <Menu.Item\n        key={child.id}\n        disabled={child.disabled}\n        // Flyout rows already show the full label — only keep a real icon, not a letter monogram.\n        leftSection={resolveLeftSection(child, childLabel, {\n          requireIcon: false,\n          active: isActive,\n        })}\n        onClick={() => onItemClick(child.id)}\n        // Only apply an explicit override — never stamp the generic \"Item\" fallback\n        // over a React-node label's naturally derived accessible name.\n        aria-label={child.ariaLabel}\n        aria-current={isActive ? \"page\" : undefined}\n        data-active={isActive || undefined}\n        color={isActive ? color : undefined}\n        style={\n          isActive\n            ? {\n                backgroundColor: fairmintVars.colorSurfaceSelected,\n                color: fairmintVars.colorIconOnSurfaceSelected,\n                fontWeight: 600,\n              }\n            : undefined\n        }\n      >\n        {child.label}\n      </Menu.Item>\n    );\n  });\n}\n\nfunction CollapsedSideNavNode({ color, item, onItemClick }: Omit<SideNavNodeProps, \"collapsed\">) {\n  const labelText = getSideNavItemLabelText(item);\n  const hasChildren = Boolean(item.children?.length);\n  const isActive = Boolean(item.active || hasActiveDescendant(item));\n  const leftSection = resolveLeftSection(item, labelText, {\n    requireIcon: true,\n    active: isActive,\n  });\n\n  // ActionIcon (not NavLink): NavLink.css forces `width: 100%` and asymmetric\n  // horizontal padding, which makes selected/hover chrome a wide pill.\n  // Selected fill uses Fairmint surface/selected — Mantine `light` is too dim in dark mode.\n  const link = (\n    <ActionIcon\n      type=\"button\"\n      variant=\"subtle\"\n      color={color}\n      size={COLLAPSED_ITEM_SIZE}\n      radius=\"md\"\n      disabled={item.disabled}\n      aria-label={labelText}\n      aria-current={isActive ? \"page\" : undefined}\n      data-active={isActive || undefined}\n      onClick={hasChildren ? undefined : () => onItemClick(item.id)}\n      style={{\n        width: COLLAPSED_ITEM_SIZE,\n        height: COLLAPSED_ITEM_SIZE,\n        minWidth: COLLAPSED_ITEM_SIZE,\n        minHeight: COLLAPSED_ITEM_SIZE,\n        ...(isActive\n          ? {\n              \"--ai-bg\": fairmintVars.colorSurfaceSelected,\n              \"--ai-hover\": fairmintVars.colorSurfaceSelected,\n              \"--ai-color\": fairmintVars.colorIconOnSurfaceSelected,\n              \"--ai-hover-color\": fairmintVars.colorIconOnSurfaceSelected,\n              backgroundColor: fairmintVars.colorSurfaceSelected,\n              color: fairmintVars.colorIconOnSurfaceSelected,\n            }\n          : {\n              color: fairmintVars.colorIconTertiary,\n            }),\n      }}\n    >\n      {leftSection}\n    </ActionIcon>\n  );\n\n  const control = hasChildren ? (\n    <Menu position=\"right-start\" offset={8} withinPortal zIndex={SIDE_NAV_FLOATING_Z_INDEX}>\n      <Tooltip\n        label={labelText}\n        position=\"right\"\n        withArrow\n        withinPortal\n        zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n        events={{ hover: true, focus: true, touch: true }}\n      >\n        <Menu.Target>{link}</Menu.Target>\n      </Tooltip>\n      <Menu.Dropdown>\n        <CollapsedNestedMenuItems\n          items={item.children ?? []}\n          onItemClick={onItemClick}\n          color={color}\n        />\n      </Menu.Dropdown>\n    </Menu>\n  ) : (\n    <Tooltip\n      label={labelText}\n      position=\"right\"\n      withArrow\n      withinPortal\n      zIndex={SIDE_NAV_FLOATING_Z_INDEX}\n      events={{ hover: true, focus: true, touch: true }}\n    >\n      {link}\n    </Tooltip>\n  );\n\n  // Uniform Stack child so Menu vs Tooltip wrappers cannot skew item gaps.\n  return <Box style={{ width: \"100%\", display: \"flex\", justifyContent: \"center\" }}>{control}</Box>;\n}\n\nfunction SideNavNode(props: SideNavNodeProps) {\n  if (props.collapsed) {\n    return <CollapsedSideNavNode {...props} />;\n  }\n  return <ExpandedSideNavNode {...props} />;\n}\n\nexport function SideNav({\n  items = [],\n  sections,\n  onItemClick,\n  color = \"indigo\",\n  ariaLabel = \"Main navigation\",\n  withBorder = false,\n  header,\n  cta,\n  profile,\n  footer,\n  collapsed,\n  defaultCollapsed = false,\n  onCollapsedChange,\n  collapsible = false,\n}: SideNavProps) {\n  const resolvedSections = sections ?? [{ id: \"main\", items }];\n  const [collapsedState, setCollapsedState] = useUncontrolled({\n    value: collapsed,\n    defaultValue: defaultCollapsed,\n    finalValue: false,\n    onChange: onCollapsedChange,\n  });\n\n  const hasBottomChrome = Boolean(footer || cta || profile);\n  const [headerHovered, setHeaderHovered] = useState(false);\n  const showExpandedCollapseControl = headerHovered;\n  const showHeaderChrome = Boolean(header) || collapsible;\n\n  const collapseToggle = collapsible ? (\n    <CollapseToggle\n      collapsed={collapsedState}\n      visible={collapsedState ? true : showExpandedCollapseControl}\n      onToggle={() => setCollapsedState(!collapsedState)}\n    />\n  ) : null;\n\n  return (\n    <Stack\n      component=\"nav\"\n      gap=\"md\"\n      h=\"100%\"\n      p={collapsedState ? \"sm\" : \"md\"}\n      aria-label={ariaLabel}\n      data-collapsed={collapsedState || undefined}\n      style={{\n        borderRight: withBorder ? \"1px solid\" : undefined,\n        borderRightColor: withBorder ? fairmintVars.colorBorderDefault : undefined,\n        boxShadow: \"none\",\n      }}\n    >\n      {showHeaderChrome ? (\n        collapsedState ? (\n          <Stack gap={6} align=\"center\">\n            {header ? (\n              <Box\n                style={{\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  justifyContent: \"center\",\n                  width: \"100%\",\n                }}\n              >\n                {header}\n              </Box>\n            ) : null}\n            {collapseToggle}\n          </Stack>\n        ) : (\n          <Group\n            justify=\"space-between\"\n            wrap=\"nowrap\"\n            gap=\"xs\"\n            align=\"center\"\n            style={{ minHeight: 32 }}\n            onMouseEnter={() => setHeaderHovered(true)}\n            onMouseLeave={() => setHeaderHovered(false)}\n            onFocusCapture={() => setHeaderHovered(true)}\n            onBlurCapture={(event) => {\n              if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n                setHeaderHovered(false);\n              }\n            }}\n          >\n            {header ? (\n              <Box\n                style={{\n                  flex: 1,\n                  minWidth: 0,\n                  overflow: \"hidden\",\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  justifyContent: \"flex-start\",\n                }}\n              >\n                {header}\n              </Box>\n            ) : null}\n            {collapseToggle}\n          </Group>\n        )\n      ) : null}\n\n      <Stack gap={4} style={{ flex: 1, minHeight: 0, overflow: \"auto\" }}>\n        {resolvedSections.flatMap((section) =>\n          section.items.map((item) => (\n            <SideNavNode\n              key={`${section.id}:${item.id}`}\n              item={item}\n              color={color}\n              onItemClick={onItemClick}\n              collapsed={collapsedState}\n            />\n          )),\n        )}\n      </Stack>\n\n      {hasBottomChrome ? (\n        <Stack gap=\"sm\" style={{ flexShrink: 0 }}>\n          {footer ?? (\n            <>\n              {cta ? (\n                <Box\n                  style={{\n                    width: \"100%\",\n                    display: \"flex\",\n                    justifyContent: collapsedState ? \"center\" : \"stretch\",\n                  }}\n                >\n                  {cta}\n                </Box>\n              ) : null}\n              {cta && profile ? <Divider color={fairmintVars.colorBorderDefault} /> : null}\n              {profile ? <Box style={{ width: \"100%\" }}>{profile}</Box> : null}\n            </>\n          )}\n        </Stack>\n      ) : null}\n    </Stack>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/primitives/muiCompat.cjs

@@ -25,23 +25,6 @@ const Stack$1 = require("../../node_modules/@mantine/core/esm/components/Stack/S
 const Menu = require("../../node_modules/@mantine/core/esm/components/Menu/Menu.cjs");
 const TextInput = require("../../node_modules/@mantine/core/esm/components/TextInput/TextInput.cjs");
 dayjs_min.extend(customParseFormat);
-const ChevronIcon = ({ direction }) => /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    "aria-hidden": "true",
-    fill: "none",
-    focusable: "false",
-    height: "20",
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: "2",
-    viewBox: "0 0 24 24",
-    width: "20",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: direction === "left" ? "M15 6 9 12l6 6" : "m9 6 6 6-6 6" })
-  }
-);
 const compatBreakpointKeys = ["xs", "sm", "md", "lg", "xl"];
 const compatFallbackBreakpoints = {
   xs: "30em",
@@ -628,72 +611,6 @@ const TableCell = ({ align, children, component, style, sx: sx2, ...props }) =>
   const CellComponent = component === "th" ? Table.Table.Th : Table.Table.Td;
   return /* @__PURE__ */ jsxRuntime.jsx(CellComponent, { ta: align, style: { ...sxToStyle(sx2), ...style }, ...props, children });
 };
-const TablePagination = ({
-  count,
-  onPageChange,
-  onRowsPerPageChange,
-  page,
-  rowsPerPage,
-  rowsPerPageOptions = [10, 25, 50, 100]
-}) => {
-  const isAllRows = rowsPerPage === -1;
-  const hasRows = count !== 0;
-  const firstRow = hasRows ? isAllRows ? 1 : page * rowsPerPage + 1 : 0;
-  const lastRow = !hasRows ? 0 : isAllRows ? count === -1 ? firstRow : count : count === -1 ? (page + 1) * rowsPerPage : Math.min(count, (page + 1) * rowsPerPage);
-  const totalRowsLabel = count === -1 ? `more than ${lastRow}` : count;
-  const canGoBack = page > 0;
-  const canGoForward = count === -1 ? !isAllRows : !isAllRows && (page + 1) * rowsPerPage < count;
-  const rowsPerPageData = rowsPerPageOptions.map((option) => {
-    if (option && typeof option === "object") {
-      return { label: String(option.label ?? option.value), value: String(option.value) };
-    }
-    return { label: String(option), value: String(option) };
-  });
-  return /* @__PURE__ */ jsxRuntime.jsxs(Group.Group, { gap: "sm", justify: "flex-end", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Text.Text, { size: "sm", children: "Rows per page:" }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Select.Select,
-      {
-        value: String(rowsPerPage),
-        data: rowsPerPageData,
-        onChange: (value) => onRowsPerPageChange?.({ target: { value } })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(Text.Text, { size: "sm", children: [
-      firstRow,
-      "–",
-      lastRow,
-      " of ",
-      totalRowsLabel
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(Group.Group, { gap: "xs", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ActionIcon.ActionIcon,
-        {
-          "aria-label": "Previous page",
-          disabled: !canGoBack,
-          onClick: (event) => onPageChange?.(event, page - 1),
-          color: resolveCompatColor("default"),
-          type: "button",
-          variant: "subtle",
-          children: /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { direction: "left" })
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        ActionIcon.ActionIcon,
-        {
-          "aria-label": "Next page",
-          disabled: !canGoForward,
-          onClick: (event) => onPageChange?.(event, page + 1),
-          color: resolveCompatColor("default"),
-          type: "button",
-          variant: "subtle",
-          children: /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { direction: "right" })
-        }
-      )
-    ] })
-  ] });
-};
 const MenuItem = ({ children, component, disabled, onClick, value, ...props }) => {
   const Component = component || Menu.Menu.Item;
   return /* @__PURE__ */ jsxRuntime.jsx(Component, { disabled, onClick, value, ...props, children });
@@ -1605,7 +1522,6 @@ exports.SvgIcon = SvgIcon;
 exports.TableBody = TableBody;
 exports.TableCell = TableCell;
 exports.TableHead = TableHead;
-exports.TablePagination = TablePagination;
 exports.TableRow = TableRow;
 exports.TextField = TextField;
 exports.ThemeProvider = ThemeProvider;