Overview

The Remix-Progressbar is a progress bar component designed specifically for Remix applications. It allows users to display a loading bar with customizable options such as color, height, spinner, and animation speed.

Features

• Color: Customize the color of the bar and the spinner. The default color is #3366FF.
• Height: Set the height of the bar in pixels. The default height is 2px.
• Show Spinner: Toggle the display of a spinner. By default, the spinner is shown.
• Delay: Delay the animation by a specified number of milliseconds. Useful when you want to hide the bar for pages without loaders. The default delay is 0.
• Start From: Define the starting point of the bar as a percentage. The default starting point is 20%.
• Easing: Adjust the easing animation of the bar using a CSS easing string. The default easing is linear.
• Speed: Adjust the animation speed of the bar in milliseconds. The default speed is not specified.
• Trickle: Enable or disable automatic incrementing behavior of the bar. The default behavior is enabled.
• Trickle Speed: Set the interval between increments in milliseconds. The default trickle speed is not specified.
• Custom CSS: Use a callback function to receive and return a custom CSS string for styling. The default callback function returns the CSS string as a style tag.

Installation

To install the Remix-Progressbar, follow these steps:

1. Import the module with the name of your choice.
2. Place the imported module in the root of your app.
3. Configure the options by passing them as parameters to the Component.

Example code:

import RemixProgressbar from 'Remix-Progressbar'

// Place the component in the root of your app
<RemixProgressbar color="#FF0000" height={4} showSpinner={false} />

Summary

The Remix-Progressbar is a versatile progress bar component for Remix applications. It offers a range of customization options for color, height, spinner visibility, animation speed, and more. With its easy installation and configuration process, it provides a convenient way to display loading bars in Remix apps. The component is licensed under the MIT License, allowing for flexible usage and modification.