Skip to content

Commit

Permalink
Merge branch 'main' of https://github.com/tomcru/holy-loader
Browse files Browse the repository at this point in the history
  • Loading branch information
tomcru committed Sep 15, 2024
2 parents 2bca4a7 + f05618a commit be536a4
Showing 1 changed file with 13 additions and 11 deletions.
24 changes: 13 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
![Holy Loader](https://github.com/tomcru/holy-loader/assets/35841182/cd2d108a-6429-40c4-9881-df8b79cc9725)
![Holy Loader](https://github.com/user-attachments/assets/4058eb51-92ce-4df2-86ac-73ce4c049ded)

<h1>Holy Loader</h1>
<a href="https://www.npmjs.com/package/holy-loader"><img src="https://img.shields.io/npm/v/holy-loader.svg?style=flat" /></a>
Expand Down Expand Up @@ -123,13 +123,15 @@ onClick={(e) => {

`<HolyLoader />` accepts the following props for customization:

- `color` (string): Specifies the color of the top-loading bar. Default: "#59a2ff" (a shade of blue).
- `initialPosition` (number): Sets the initial position of the top-loading bar as a percentage of the total width. Default: 0.08 (8% of the total width).
- `height` (number | string): Defines the height of the top-loading bar in pixels or css unit. Default: 4 pixels.
- `easing` (string): Specifies the easing function to use for the loading animation. Accepts any valid CSS easing string. Default: "ease".
- `speed` (number): Sets the animation speed of the top-loading bar in milliseconds. Default: 200 milliseconds.
- `zIndex` (number): Defines the z-index property of the top-loading bar, controlling its stacking order. Default: 2147483647.
- `boxShadow` (string): Sets the box-shadow property of the top-loading bar. Turned off by default.
- `showSpinner` (boolean): Determines whether to accompany the loading bar with a spinner. Turned off by default.
- `ignoreSearchParams` (boolean): Determines whether to ignore search parameters in the URL when triggering the loader. Turned off by default.
- `dir` ('ltr' | 'rtl'): Sets the direction of the top-loading bar. Default: 'ltr'.
| Prop | Type | Description | Default |
|----------------------|----------------------|--------------------------------------------------------------------------------------------------------------|--------------|
| `color` | `string` | Specifies the color of the top-loading bar. | `"#59a2ff"` |
| `initialPosition` | `number` | Sets the initial position of the top-loading bar as a percentage of the total width. | `0.08` |
| `height` | `number` or `string` | Defines the height of the top-loading bar in pixels or CSS unit. | `4px` |
| `easing` | `string` | Specifies the easing function to use for the loading animation. Accepts any valid CSS easing string. | `"ease"` |
| `speed` | `number` | Sets the animation speed of the top-loading bar in milliseconds. | `200` |
| `zIndex` | `number` | Defines the z-index property of the top-loading bar, controlling its stacking order. | `2147483647` |
| `boxShadow` | `string` | Sets the box-shadow property of the top-loading bar. Turned off by default. | `null` |
| `showSpinner` | `boolean` | Determines whether to accompany the loading bar with a spinner. Turned off by default. | `false` |
| `ignoreSearchParams` | `boolean` | Determines whether to ignore search parameters in the URL when triggering the loader. Turned off by default. | `false` |
| `dir` | `ltr` or `rtl` | Sets the direction of the top-loading bar. | `'ltr'` |

0 comments on commit be536a4

Please sign in to comment.