Add loading, empty, error, and success feedback states to StyleSeed components and pages with practical mobile-first rules.
Part of StyleSeed, this skill ensures data-dependent UI does not stop at the happy path. It adds the four core feedback states every serious product needs: loading, empty, error, and success.
Use skeletons that match the final layout. Avoid spinners inside cards unless the pattern genuinely requires them. Delay skeletons slightly to avoid flashes on fast responses.
Provide a friendly explanation and a next action. Zero values should still render meaningfully instead of disappearing.
Use plain-language failure messages and always offer recovery where possible. Localize failures to the affected card or section if the rest of the page can still work.
Use toasts or equivalent lightweight confirmation for completed actions. Add undo for reversible destructive changes.
Return: