Flutter Empty State with Icon and Call to Action

WDiv(
  className: 'mx-auto max-w-sm flex flex-col items-center gap-4 rounded-2xl border p-10 bg-white border-gray-200 dark:bg-gray-900 dark:border-gray-800',
  children: [
    WDiv(
      className: 'flex items-center justify-center w-20 h-20 rounded-full bg-gray-100 dark:bg-gray-800',
      child: WIcon(
        Icons.search,
        className: 'text-gray-400 text-4xl dark:text-gray-500'
      )
    ),
    WText(
      'No results found',
      className: 'text-lg font-bold text-gray-900 dark:text-white'
    ),
    WText(
      'We could not find anything matching your search. Try a different keyword or clear the filters.',
      className: 'text-sm text-gray-500 dark:text-gray-400 text-center leading-relaxed'
    ),
    WButton(
      className: 'rounded-xl px-5 py-2.5 bg-indigo-600 hover:bg-indigo-500 dark:bg-indigo-500 dark:hover:bg-indigo-400',
      child: WDiv(
        className: 'flex flex-row items-center gap-2',
        children: [
          WIcon(
            Icons.refresh,
            className: 'text-white text-base'
          ),
          WText(
            'Clear filters',
            className: 'text-sm font-semibold text-white'
          )
        ]
      ),
    ),
  ],
)