Skip to content
Pinky UI

feedback

Partial Success Summary

Summarizes mixed batch outcomes, preserves successful items and isolates only the failures for retry.

  • feedback
  • batch
  • partial
  • retry
  • summary
Related pattern

A mixed result is neither falsely successful nor needlessly framed as a total failure.

Live preview

Batch result

2 succeeded · 1 need attention

  • Cover imageCompletesuccess
  • Gallery imagesCompletesuccess
  • Archive copyUnsupported formatfailed

Successful items are kept; only failed items enter recovery.

Quick usage

usage
import { PartialSuccessSummary } from "@pinky-ui/systems";

<PartialSuccessSummary items={results} />

Install

Add @pinky-ui/systems as a dependency, or use the CLI to copy this component's source directly into your project — no dependency to manage, fully editable.

shell
npm install @pinky-ui/systems

Prefer to run the whole repository locally instead?

repository
git clone https://github.com/florash/Pinky-UI.git
cd Pinky-UI
npm install
npm run dev

Accessibility

  • Pointer and keyboard paths expose the same state change.
  • Status and focus remain meaningful when motion is disabled.

Performance

  • Uses local state and transforms; no per-frame React pointer loop.

Reduced motion

Resolves state changes without layout animation while preserving semantics.

When to use

  • Product workflows with a clear reversible or inspectable state.

When not to use

  • Decorative motion without a user task.

Skill

Purpose

Explain mixed batch outcomes without framing successful work as failed or hiding the items that need recovery.

Use when

Uploads, imports, exports or batch edits complete with both successful and failed items.

Avoid

One red banner for an otherwise successful batch, a success message that hides failures, or a retry that repeats every item.

Accessibility

State the success and failure counts in text, give each item a readable status, and label retry as applying only to failed items.

Keyboard and touch

Retry is a native button and failed rows stack cleanly on mobile. Item status must remain readable without hover, color or an icon.

Reduced motion and performance

Resolve item updates without animated reordering when motion is reduced. Retry only the failed subset and avoid duplicate batch requests.

Composition and anti-patterns

Keep the summary and failed-item list together. Use Completion Morph when one working object becomes one result rather than a mixed collection outcome.

Open this skill on its own page