Left Liquid Background
Right Liquid Background

Quick Actions

The Quick Actions preset consolidates a set of commonly performed tasks into an easily accessible UI cluster. Perfect for contextual shortcuts in productivity tools.

Quick Links

Installation

Install the presets individually or as part of the complete @aristobyte-ui library.

Installation of Quick Actions

Install the Quick Actions preset individually, unless already included via the global @aristobyte-ui package.

Package Manager

Individual Package

Install only the presets if you need specific functionality.

Full Library

Skip this if you have the complete @aristobyte-ui already installed.

Import

Choose between individual package imports or global library imports based on your project's needs and bundle size requirements.

Import Quick Actions

Import Quick Actions to provide users with rapid entry points to frequent workflows. Supports icons, tooltips, and grouped layouts.

Import Method

;

Individual Package

Import directly from the presets package for optimal tree-shaking and smaller bundle sizes.

Recommended for component-specific usage

Global Library

Import from the main library package when using multiple components from AristoByte UI.

Recommended for component-specific usage

Basic Usage Example

Basic implementation of the component using default properties. Suitable for general-purpose interactions.

Disabled

Represents Quick Actions when shortcuts are disabled due to context, permission constraints, or when an action is already in progress.

Preview

Guidelines

    Operational Context

  • Disable quick actions if prerequisites (selection, permissions) are not satisfied.

  • Throttle or disable quick actions when server-side rate limits are exceeded.

  • Disable actions that would conflict with in-progress background jobs to prevent duplicates.

  • Use disabled variants when quick actions are deprecated pending migration.

    Developer Guidance

  • Show contextual helper copy explaining how to enable the quick action (e.g., 'Select a file to enable').

  • Keep the visual affordance consistent so users understand which actions are temporarily unavailable.

  • Provide an API hook to surface enablement suggestions or links to relevant settings.

  • Log attempted uses of disabled quick actions to guide UX improvements and feature prioritization.

Props Reference

Complete reference for all props available on QuickActions component(s), including type definitions, default values, and usage examples.

  • QuickActions

    • Core Props

      • children

        React.ReactNode | stringdefault: ''

Viewing Unit with ID quick-actions