diff --git a/README.md b/README.md
index db82723..16d5909 100644
--- a/README.md
+++ b/README.md
@@ -135,3 +135,13 @@ onClick={(e) => {
| `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` |
+
+## Playground
+
+A simple playground page is available for testing HolyLoader.
+
+### Instructions
+
+1. Navigate to the `src/pages/Playground.tsx` file.
+2. Modify the `Playground` component as needed to test different configurations of HolyLoader.
+3. Run the application and visit the playground page to see the changes in action.
diff --git a/biome.json b/biome.json
index 39743bc..7898575 100644
--- a/biome.json
+++ b/biome.json
@@ -1,7 +1,7 @@
{
"$schema": "https://biomejs.dev/schemas/1.8.3/schema.json",
"files": {
- "include": ["src/**/*.ts"],
+ "include": ["src/**/*.ts", "src/**/*.tsx", "src/pages/Playground.tsx"],
"ignore": ["dist", ".github", "node_modules"]
},
"formatter": {
diff --git a/src/__tests__/Playground.test.tsx b/src/__tests__/Playground.test.tsx
new file mode 100644
index 0000000..85b30e7
--- /dev/null
+++ b/src/__tests__/Playground.test.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import Playground from '../pages/Playground';
+
+describe('Playground', () => {
+ it('renders the Playground component', () => {
+ render(
This is a simple playground page for testing HolyLoader.
+