feat(ListView): add ListViewSkeleton component

[rzp-vyom]

Summary

Adds ListViewSkeleton — a shimmer placeholder that mirrors the full ListView layout so every list view has a consistent, first-class loading state without needing spinners or ad-hoc custom skeletons.

Discussed in the Blade Slack thread — agreed to implement standard skeleton loading for list views, without RazorSense animation (tried but looked odd).

What it renders

1. QuickFilter tab pills — 4 pill-shaped shimmer skeletons
2. Search / action area — rectangular skeleton, right-aligned
3. Table header row — one skeleton per column
4. Table body rows — configurable count, cell widths varied (70% / 75% / 50%) to look like real data
5. Pagination bar — 3 shimmer controls, bottom-right

API

<ListViewSkeleton
  rows={7}              // body row count   (default: 7)
  columns={5}           // column count     (default: 5)
  showFilters={true}    // filter bar       (default: true)
  showPagination={true} // pagination bar   (default: true)
/>

Usage

if (isLoading) {
  return <ListViewSkeleton rows={7} columns={5} />;
}
return (
  <ListView>
    <ListViewFilters ... />
    <Table ... />
  </ListView>
);

Files changed

File	Change
src/components/ListView/ListViewSkeleton.tsx	New component
src/components/ListView/__tests__/ListViewSkeleton.web.test.tsx	13 unit tests + 2 snapshots
src/components/ListView/index.ts	Export ListViewSkeleton + ListViewSkeletonProps
src/components/ListView/docs/ListView.stories.tsx	4 new Storybook stories (preview via Chromatic link once CI runs)

export * from './ListView' in components/index.ts already covers the new export — no separate change needed there.

Test coverage

• Renders all sections with default props
• rows prop renders correct count (tested: 1, 3, 5, 7)
• showFilters toggles filter bar
• showPagination toggles pagination bar
• Combined prop scenarios (table-only mode)
• Snapshot coverage for default + minimal variants

Notes

• No new dependencies — built on existing Skeleton + Box primitives
• RazorSense animation intentionally excluded per design discussion
• testID on every structural section for easy product-side test targeting

Storybook preview

Chromatic will generate a preview link once CI passes. Stories to look for:

• Patterns/ListView — Skeleton — Default
• Patterns/ListView — Skeleton — Table Only
• Patterns/ListView — Skeleton — Many Columns (6)
• Patterns/ListView — Skeleton → ListView transition (reload to replay)

🤖 Generated with Claude Code

[github-actions]

✅ PR title follows Conventional Commits specification.