A comprehensive React skeleton loading component library that provides animated placeholders for various UI elements during content loading states. The components use a pulsing animation to simulate loading content. ## Key Components - **`Skeleton`** - Base skeleton component with pulse animation - **`SkeletonText`** - Multi-line text placeholder with configurable line count - **`SkeletonCard`** - Card-style placeholder with optional image area - **`SkeletonGrid`** - Responsive grid layout of skeleton cards - **`SkeletonButton`** - Button placeholder with size variants (sm, default, lg) - **`SkeletonHeading`** - Heading placeholder with 6 size levels - **`SkeletonList`** - List items with avatar and text placeholders - **`SkeletonNavigation`** - Horizontal navigation bar placeholder ## Usage Example ```typescript import { Skeleton, SkeletonText, SkeletonCard, SkeletonGrid } from './skeleton' // Basic skeleton // Multi-line text placeholder // Card with image placeholder // Grid of loading cards // Different button sizes // Loading list with avatars ``` All components are built with `React.forwardRef` for ref forwarding and use the `cn` utility for className merging. They leverage Tailwind CSS classes with the `ods-border` design system color and include responsive breakpoints for optimal display across devices.