Skip to content
Pinky UI

feedback

Delayed Feedback Escalation

Keeps fast actions quiet, then escalates to useful status only when work crosses perceived-performance thresholds.

  • feedback
  • delay
  • loading
  • perceived performance
  • status
Related pattern

Avoids flashing a loader for fast work while still telling the truth when an operation takes longer.

Live preview

Save changes

Fast work stays quiet.

idle

Quick usage

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

<DelayedFeedbackEscalation />

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

Keep fast actions quiet, then escalate to useful status only when elapsed time makes waiting meaningful.

Use when

An operation often completes before a loader would be perceived, but needs more detail when it crosses a measured threshold.

Avoid

Arbitrary suspense, a permanent silent wait, or flashing a spinner for work that completes within a frame or two.

Accessibility

Expose each meaningful phase through one polite status update and keep the final result explicit. Do not announce every timer tick.

Keyboard and touch

The initiating action remains a native control and can be run again after completion. Thresholds must never require pointer hover.

Reduced motion and performance

Remove visual travel but preserve the timing model and text states. Clear every threshold timer on restart and unmount.

Composition and anti-patterns

Escalate from quiet to pending to detailed status; do not turn the pattern into a spinner variant or a generic toast.

Open this skill on its own page