npm package: @oviciandrus/vue-vuetify-foundation
Description: General TypeScript utilities and classes for Vue 3 + Vuetify 3 projects
Author: Andruș Ovidiu / Comptech Soft
Latest version: 1.2.0

# @oviciandrus/vue-vuetify-foundation

General TypeScript utilities and classes for Vue 3 + Vuetify 3 projects.

## Installation
```bash
npm install @oviciandrus/vue-vuetify-foundation
```

## Features

- ✅ **Bootstrap** - Vue app initialization with fluent interface
- ✅ **Route Management** - Fluent API for creating type-safe routes
- ✅ **Routes Collection** - Manage routes with unique name validation
- ✅ **Request Class** - HTTP client with fluent interface and callbacks
- ✅ **Sequential Requests** - Execute multiple requests one after another ⭐ NEW
- ✅ **Composables** - useRequest, useSequentialRequests ⭐ NEW
- ✅ **Type Augmentation** - Extend Vue Router types
- ✅ **Utility Functions** - getMetaContent, createAxiosInstance

## Quick Start

### Request with Callbacks
```typescript
import { useRequest } from '@oviciandrus/vue-vuetify-foundation'

const { loading, data, error, execute } = useRequest('POST', {
    onSuccess: (data) => console.log('Success!', data),
    onError: (err) => console.error('Error!', err)
})

await execute((request) => 
    request.setUrl('/api/users').setData({ name: 'John' }).execute()
)
```

### Sequential Requests
```typescript
import { useSequentialRequests, Request } from '@oviciandrus/vue-vuetify-foundation'

const { loading, progress, results, add, execute } = useSequentialRequests({
    stopOnFirstError: false,
    onProgress: (current, total) => console.log(`${current}/${total}`),
    onComplete: (results) => console.log('Done!', results)
})

// Add requests
add(new Request('GET').setUrl('/api/users'))
add(new Request('POST').setUrl('/api/posts').setData({...}))

// Dynamic request with dependency
add((items) => {
    const userId = items.get(0)?.result.data?.id
    return new Request('GET').setUrl(`/api/users/${userId}/orders`)
})

// Execute sequentially
await execute()
```

## Full Documentation

### Request Class

Execute HTTP requests with fluent interface and callbacks:
```typescript
import { Request } from '@oviciandrus/vue-vuetify-foundation'

const request = new Request('POST')
    .setUrl('/api/users')
    .setData({ name: 'John' })
    .setParams({ include: 'profile' })
    .setHeaders({ 'X-Custom': 'value' })
    .onSuccess((data) => console.log('Success:', data))
    .onError((error) => console.error('Error:', error))

const data = await request.execute()
```

**Methods:**
- `setUrl(url: string)` - Set request URL
- `setData(data: any)` - Set request body
- `setParams(params: object)` - Set query parameters
- `setHeaders(headers: object)` - Set custom headers
- `setResetAfterRequest(reset: boolean)` - Auto-reset after execution
- `onSuccess(callback)` - Success callback
- `onError(callback)` - Error callback
- `execute<T>()` - Execute the request

### Sequential Requests

Execute multiple requests one after another:
```typescript
import { SequentialRequests, Request } from '@oviciandrus/vue-vuetify-foundation'

const seq = new SequentialRequests()
    .add(new Request('GET').setUrl('/api/users'))
    .add((items) => {
        // Access previous results
        const userId = items.get(0)?.result.data?.id
        return new Request('GET').setUrl(`/api/users/${userId}/profile`)
    })
    .setStopOnFirstError(false)
    .onProgress((current, total) => console.log(`${current}/${total}`))
    .onComplete((results) => console.log('All done!'))
    .onError((error, index) => console.log(`Error at ${index}`))

const results = await seq.execute()
```

### Axios Instance

Create configured Axios instance with CSRF and meta tags support:
```typescript
import { createAxiosInstance } from '@oviciandrus/vue-vuetify-foundation'

// Reads base-url and csrf-token from meta tags
const axios = createAxiosInstance({
    onUnauthorized: () => router.push('/login'),
    onCsrfError: () => window.location.reload()
})
```

**Required meta tags in HTML:**
```html
<meta name="base-url" content="https://your-app.com" />
<meta name="csrf-token" content="your-csrf-token" />
```

### Get Meta Content

Read meta tags from HTML:
```typescript
import { getMetaContent } from '@oviciandrus/vue-vuetify-foundation'

// Optional (returns null if missing)
const apiUrl = getMetaContent('api-url')

// Required (throws if missing)
const baseUrl = getMetaContent('base-url', true)
```

### Bootstrap

Initialize Vue app with fluent interface:
```typescript
import { Bootstrap } from '@oviciandrus/vue-vuetify-foundation'
import router from './router'
import vuetify from './vuetify'
import i18nVue from './i18n'
import App from './App.vue'

new Bootstrap('app')
    .setRouter(router)
    .setVuetify(vuetify)
    .setI18nVue(i18nVue)
    .setRootComponent(App)
    .createVueApp()
```

## Changelog

### v1.3.0 (2025-12-30)
- ✨ Added Request class with callbacks (onSuccess, onError)
- ✨ Added SequentialRequests class for sequential execution
- ✨ Added useRequest composable with callbacks
- ✨ Added useSequentialRequests composable
- 📁 Reorganized structure (vue/composables, vue/components)

### v1.2.0
- ✨ Added Bootstrap class
- ✨ Added Request class
- ✨ Added createAxiosInstance utility

### v1.1.0
- ✨ Added Route and Routes classes
- ✨ Added type augmentation for Vue Router

### v1.0.0
- 🎉 Initial release

## License

MIT © Andruș Ovidiu / Comptech Soft

## Repository

[GitHub Repository](https://github.com/comptech-soft/vue-vuetify-foundation)