{"version":3,"sources":["../src/TableContainer/TableContainer.tsx","../src/SideNavItem/SideNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { clsx } from 'clsx';\n\nexport interface TableContainerProps {\n  /**\n   * Children to render inside the container (TableControls, Table, TableFooterPagination)\n   */\n  children: React.ReactNode;\n  /**\n   * Custom className\n   */\n  className?: string;\n  /**\n   * Custom style\n   */\n  style?: React.CSSProperties;\n  /**\n   * Test ID for testing\n   */\n  'data-testid'?: string;\n}\n\nconst containerStyles: React.CSSProperties = {\n  backgroundColor: '#ffffff',\n  padding: '8px',\n  borderRadius: '8px',\n  width: '100%',\n  boxSizing: 'border-box',\n};\n\n/**\n * TableContainer component - Arbor Design System\n *\n * A wrapper container for the full table experience.\n * Use to wrap TableControls, Table, and TableFooterPagination together\n * in a white box with 8px padding and 8px border radius.\n *\n * @example\n * ```tsx\n * <TableContainer>\n *   <TableControls {...controlsProps} />\n *   <Table {...tableProps} />\n *   <TableFooterPagination {...paginationProps} />\n * </TableContainer>\n * ```\n */\nexport const TableContainer = React.forwardRef<HTMLDivElement, TableContainerProps>(\n  ({ children, className, style, 'data-testid': dataTestId }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={clsx('arbor-table-container', className)}\n        style={{ ...containerStyles, ...style }}\n        data-testid={dataTestId}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n\nTableContainer.displayName = 'TableContainer';\n","import * as React from 'react';\nimport { Star, ChevronRight, ChevronDown } from 'lucide-react';\n\nexport type SideNavItemTier = 1 | 2 | 3 | 4 | 5;\n\nexport interface SideNavItemProps {\n  /**\n   * The text label for the navigation item\n   */\n  label: string;\n  /**\n   * The tier/depth level (1-5). Each tier adds 12px indentation.\n   * Tier 1 = 24px left padding (base)\n   * @default 1\n   */\n  tier?: SideNavItemTier;\n  /**\n   * Whether the item is currently active/selected\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * Whether the item has child items (shows expand/collapse chevron)\n   * @default false\n   */\n  hasChildren?: boolean;\n  /**\n   * Whether the item is expanded (only relevant when hasChildren is true)\n   * @default false\n   */\n  expanded?: boolean;\n  /**\n   * Whether the item is favourited (star is filled)\n   * @default false\n   */\n  favourited?: boolean;\n  /**\n   * Whether the item is focused (shows green ring)\n   * @default false\n   */\n  focused?: boolean;\n  /**\n   * Click handler for the item\n   */\n  onClick?: () => void;\n  /**\n   * Click handler for the expand/collapse chevron\n   */\n  onExpandClick?: () => void;\n  /**\n   * Click handler for the favourite star\n   */\n  onFavouriteClick?: () => void;\n  /**\n   * Custom className\n   */\n  className?: string;\n  /**\n   * Custom style\n   */\n  style?: React.CSSProperties;\n}\n\n/**\n * SideNavItem component - Arbor Design System\n *\n * A navigation list item used in the side navigation panel.\n * Supports multiple tiers for nested navigation, favourite functionality,\n * and expand/collapse for parent items with children.\n */\nexport const SideNavItem = React.forwardRef<HTMLDivElement, SideNavItemProps>(\n  (\n    {\n      label,\n      tier = 1,\n      active = false,\n      hasChildren = false,\n      expanded = false,\n      favourited = false,\n      focused = false,\n      onClick,\n      onExpandClick,\n      onFavouriteClick,\n      className,\n      style,\n    },\n    ref\n  ) => {\n    const [isHovered, setIsHovered] = React.useState(false);\n    const [isStarHovered, setIsStarHovered] = React.useState(false);\n\n    // Calculate left padding based on tier\n    // Tier 1 = 24px, each additional tier adds 12px\n    // If hasChildren, reduce padding to make room for chevron\n    const basePadding = 24;\n    const tierIndent = (tier - 1) * 12;\n    const chevronSpace = hasChildren ? 20 : 0;\n    const leftPadding = basePadding + tierIndent - chevronSpace;\n\n    // Determine text color based on state\n    const getTextColor = () => {\n      if (active) return '#005700';\n      if (isHovered) return '#2f2f2f';\n      return '#333333';\n    };\n\n    // Determine background color based on state\n    const getBackgroundColor = () => {\n      if (active) return '#f0faf3';\n      if (isHovered) return '#f8f8f8';\n      return 'transparent';\n    };\n\n    // Determine font weight\n    const getFontWeight = () => {\n      return active ? 600 : 400;\n    };\n\n    // Show star when hovered or active\n    const showStar = isHovered || active;\n\n    // Star icon color\n    const getStarColor = () => {\n      if (favourited) return '#0e8a0e';\n      if (isStarHovered) return '#2f2f2f';\n      return '#0e8a0e';\n    };\n\n    const containerStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '8px',\n      width: '168px',\n      paddingTop: '8px',\n      paddingBottom: '8px',\n      paddingLeft: `${leftPadding}px`,\n      paddingRight: '8px',\n      borderRadius: '99px',\n      backgroundColor: getBackgroundColor(),\n      boxShadow: focused ? '0px 0px 0px 3px #3cad51' : 'none',\n      cursor: 'pointer',\n      boxSizing: 'border-box',\n      transition: 'background-color 150ms ease',\n      outline: 'none',\n      ...style,\n    };\n\n    const chevronStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      width: '16px',\n      height: '16px',\n      marginLeft: '-4px',\n    };\n\n    const labelStyles: React.CSSProperties = {\n      flex: 1,\n      fontFamily: \"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif\",\n      fontSize: '13px',\n      fontWeight: getFontWeight(),\n      color: getTextColor(),\n      lineHeight: 1.5,\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n    };\n\n    const starContainerStyles: React.CSSProperties = {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      width: '16px',\n      height: '16px',\n      opacity: showStar ? 1 : 0,\n      transition: 'opacity 150ms ease',\n    };\n\n    const handleClick = () => {\n      onClick?.();\n    };\n\n    const handleChevronClick = (e: React.MouseEvent) => {\n      e.stopPropagation();\n      onExpandClick?.();\n    };\n\n    const handleStarClick = (e: React.MouseEvent) => {\n      e.stopPropagation();\n      onFavouriteClick?.();\n    };\n\n    const handleKeyDown = (e: React.KeyboardEvent) => {\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        onClick?.();\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={className}\n        style={containerStyles}\n        onClick={handleClick}\n        onMouseEnter={() => setIsHovered(true)}\n        onMouseLeave={() => {\n          setIsHovered(false);\n          setIsStarHovered(false);\n        }}\n        onKeyDown={handleKeyDown}\n        tabIndex={0}\n        role=\"button\"\n        aria-expanded={hasChildren ? expanded : undefined}\n        aria-label={label}\n      >\n        {/* Expand/Collapse Chevron */}\n        {hasChildren && (\n          <div\n            style={chevronStyles}\n            onClick={handleChevronClick}\n            role=\"button\"\n            aria-label={expanded ? 'Collapse' : 'Expand'}\n          >\n            {expanded ? (\n              <ChevronDown size={14} color=\"#7e7e7e\" strokeWidth={2} />\n            ) : (\n              <ChevronRight size={14} color=\"#7e7e7e\" strokeWidth={2} />\n            )}\n          </div>\n        )}\n\n        {/* Label */}\n        <span style={labelStyles}>{label}</span>\n\n        {/* Favourite Star */}\n        <div\n          style={starContainerStyles}\n          onClick={handleStarClick}\n          onMouseEnter={() => setIsStarHovered(true)}\n          onMouseLeave={() => setIsStarHovered(false)}\n          role=\"button\"\n          aria-label={favourited ? 'Remove from favourites' : 'Add to favourites'}\n          aria-pressed={favourited}\n        >\n          <Star\n            size={15}\n            color={getStarColor()}\n            fill={favourited ? '#0e8a0e' : 'none'}\n            strokeWidth={2}\n          />\n        </div>\n      </div>\n    );\n  }\n);\n\nSideNavItem.displayName = 'SideNavItem';\n"],"mappings":"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","names":["React","jsx","containerStyles"]}