Flutter Avatar Group with Status and Count Badges

WDiv(
  className: 'mx-auto flex flex-row items-center gap-3 rounded-2xl border p-6 bg-white border-gray-200 shadow-sm dark:bg-gray-900 dark:border-gray-800',
  children: [
    WDiv(
      className: 'relative w-12 h-12',
      children: [
        WDiv(className: 'flex items-center justify-center w-12 h-12 rounded-full bg-indigo-100 dark:bg-indigo-900', child: WText('AC', className: 'text-sm font-bold text-indigo-600 dark:text-indigo-300')),
        WDiv(className: 'absolute bottom-0 right-0 w-3.5 h-3.5 rounded-full border-2 bg-emerald-500 border-white dark:border-gray-900'),
      ],
    ),
    WDiv(
      className: 'relative w-12 h-12',
      children: [
        WDiv(className: 'flex items-center justify-center w-12 h-12 rounded-full bg-rose-100 dark:bg-rose-900', child: WText('MJ', className: 'text-sm font-bold text-rose-600 dark:text-rose-300')),
        WDiv(className: 'absolute bottom-0 right-0 w-3.5 h-3.5 rounded-full border-2 bg-amber-400 border-white dark:border-gray-900'),
      ],
    ),
    WDiv(
      className: 'relative w-12 h-12',
      children: [
        WDiv(className: 'flex items-center justify-center w-12 h-12 rounded-full bg-sky-100 dark:bg-sky-900', child: WText('TS', className: 'text-sm font-bold text-sky-600 dark:text-sky-300')),
        WDiv(className: 'absolute bottom-0 right-0 w-3.5 h-3.5 rounded-full border-2 bg-gray-300 border-white dark:bg-gray-600 dark:border-gray-900'),
      ],
    ),
    WDiv(className: 'flex items-center justify-center w-12 h-12 rounded-full bg-gray-100 dark:bg-gray-800', child: WText('+5', className: 'text-sm font-bold text-gray-600 dark:text-gray-300')),
  ],
)