Merge pull request #71 from damianricobelli/chore/update-readme-and-a…

…dd-contributing-file

chore: update readme and add contributing file

CONTRIBUTING.md

@@ -0,0 +1,35 @@
+# Contributing to Stepperize
+
+We're glad you're interested in contributing to our project! Here are some guidelines to help you get started.
+
+## Getting Started
+
+1. Fork the repository
+2. Clone your fork: `git clone https://github.com/damianricobelli/stepperize.git`
+3. Create a new branch: `git checkout -b your-feature-name`
+4. Make your changes
+5. Commit your changes: `git commit -m "Add some feature"`
+6. Push to the branch: `git push origin your-feature-name`
+7. Create a pull request
+
+## Development Setup
+
+1. Install dependencies: `pnpm i`
+2. Run the development docs server: `pnpm dev --filter docs`
+
+## Code Style
+
+We use Biome for code formatting. Please ensure your code is formatted before submitting a pull request.
+
+## Submitting Pull Requests
+
+1. Ensure your code adheres to the existing style.
+2. Include tests for any new functionality.
+3. Update documentation if necessary.
+4. Describe your changes in detail in the pull request description.
+
+## Reporting Issues
+
+Use the GitHub issue tracker to report bugs or suggest features.
+
+Thank you for contributing!

README.md

@@ -1,56 +1,80 @@
-
 <p align="center">
-  <img src="https://stepperize.vercel.app/og.png" />
+  <img src="https://stepperize.vercel.app/og.png" alt="Stepperize Logo" />
 </p>
 
 [![Build Size](https://img.shields.io/bundlephobia/minzip/@stepperize/react@latest?label=bundle%20size&style=flat&colorA=000000&colorB=000000)](https://bundlephobia.com/result?p=@stepperize/react@latest)
 [![Version](https://img.shields.io/npm/v/@stepperize/react?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@stepperize/react)
 [![Downloads](https://img.shields.io/npm/dt/@stepperize/react.svg?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/@stepperize/react)
 
-A library for creating step-by-step workflows in your applications.
+A library for creating step-by-step workflows in your apps
 
-- 🚀 Fast
-- 🔥 Powerful
-- 📦 Lightweight, < 1kB (gzip)
-- 🪄 Typesafe
-- 🔗 Composable
-- 🎨 Unstyled
+- 🚀 Fast and efficient
+- 🔥 Powerful and flexible
+- 📦 Lightweight (< 1kB gzipped)
+- 🪄 Fully typesafe
+- 🔗 Composable architecture
+- 🎨 Unstyled for maximum customization
 
 ## Installation
 
 ```bash
-npm i @stepperize/react
+npm install @stepperize/react
 ```
 
-## Understanding the steps
-
-The main idea is that we can define our IDs that will identify each step.
-When we define the steps, we get an object that contains everything we need to build our stepper.
-
-## Usage
+## Quick Start
 
-### Import the constructor
-
-In order to create our steps we need to import the `defineSteps` from the library.
+1. Import the constructor:
 
 ```tsx
 import { defineStepper } from "@stepperize/react";
 ```
 
-### Create the steps
-
-`defineStepper` is a function that allows us to get a Provider, a hook and the array of steps we are using.
-The only mandatory value for each step is the `id`. Then, we can add whatever we need and this will be typesafe when we use the hook.
+2. Define your steps:
 
 ```tsx
 const { Scoped, useStepper, steps } = defineStepper(
-  { id: "step-1", title: "Label 1", description: "Description 1" },
-  { id: "step-2", title: "Label 2", description: "Description 2" },
-  { id: "step-3", title: "Label 3", description: "Description 3" },
-  { id: "step-4", title: "Label 4", description: "Description 4" }
+  { id: "step-1", title: "Step 1", description: "Description for step 1" },
+  { id: "step-2", title: "Step 2", description: "Description for step 2" },
+  { id: "step-3", title: "Step 3", description: "Description for step 3" },
+  { id: "step-4", title: "Step 4", description: "Description for step 4" }
 );
 ```
 
-### Next steps
+3. Use the hook in your components:
+
+```tsx
+function StepperComponent() {
+  const { currentStep, nextStep, prevStep } = useStepper();
+
+  return (
+    <div>
+      <h2>{currentStep.title}</h2>
+      <p>{currentStep.description}</p>
+      <button onClick={prevStep}>Previous</button>
+      <button onClick={nextStep}>Next</button>
+    </div>
+  );
+}
+```
+
+## How It Works
+
+Stepperize allows you to define a series of steps with unique IDs. When you create your steps using `defineStepper`, you get:
+
+- A `Scoped` component for context management
+- A `useStepper` hook for step control
+- An array of `steps` for rendering
+
+The only required field for each step is the `id`. You can add any additional properties you need, and they'll be fully typesafe when using the hook.
+
+## Documentation
+
+For more detailed information on usage, configuration, and advanced features, visit our [full documentation](https://stepperize.vercel.app).
+
+## Contributing
+
+We welcome contributions! Please see our [Contributing Guide](CONTRIBUTING.md) for more details.
+
+## License
 
-Visit the [documentation](https://stepperize.vercel.app/docs/getting-started/use-stepper) to see more details.
+Stepperize is [MIT licensed](LICENSE).

turbo.json

@@ -15,7 +15,8 @@
 		},
 		"dev": {
 			"cache": false,
-			"persistent": true
+			"persistent": true,
+			"dependsOn": ["^build"]
 		},
 		"clean": {
 			"cache": false