open-index/open-npm huggingface dataset:
npm package: @stronghold-companies/ui
Description: A Vue 3 component library built with TypeScript, PrimeVue, PrimeFlex, and Tailwind CSS.
Latest version: 0.1.7

# @your-scope/my-vue-lib

A Vue 3 component library built with TypeScript, PrimeVue, PrimeFlex, and Tailwind CSS.

## Installation

```bash
npm install @your-scope/my-vue-lib
```

## Peer Dependencies

This library requires the following peer dependencies to be installed in your project:

```bash
npm install vue@^3.3.0 primevue@^3.26.1 primeflex@^3.3.0 primeicons@^6.0.1 tailwindcss@^3.4.1
```

## Setup

### 1. Install PrimeVue and Dependencies

```bash
npm install primevue@3.26.1 primeflex@3.3.0 primeicons@6.0.1
```

### 2. Configure PrimeVue in Your App

In your `main.ts` or main entry file:

```typescript
import { createApp } from 'vue'
import PrimeVue from 'primevue/config'
import App from './App.vue'

// Import PrimeVue theme
import 'primevue/resources/themes/saga-blue/theme.css' // or your preferred theme
import 'primeicons/primeicons.css'
import 'primeflex/primeflex.css'

const app = createApp(App)
app.use(PrimeVue)
app.mount('#app')
```

### 3. Configure Tailwind CSS

Create or update your `tailwind.config.js`:

```js
/** @type {import('tailwindcss').Config} */
export default {
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}",
    "./node_modules/@your-scope/my-vue-lib/**/*.{vue,js,ts}" // Include library components
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}
```

### 4. Use Components

```vue
<script setup lang="ts">
import { MyButton } from '@your-scope/my-vue-lib'
</script>

<template>
  <MyButton label="Click me" />
</template>
```

## Development

This template uses Vue 3 `<script setup>` SFCs. Learn more about the recommended Project Setup and IDE Support in the [Vue Docs TypeScript Guide](https://vuejs.org/guide/typescript/overview.html#project-setup).