open-index/open-npm huggingface dataset:
npm package: @italq/vloop
Description: A fully publicable, minified library to embed the Italq VLoop widget in any website with a single script tag and a custom element.
Latest version: 0.0.6

# @italq/vloop Widget

A fully publicable, minified library to embed the Italq VLoop widget in any website with a single script tag and a custom element.

## 🚀 Features
- **Zero dependencies for the user**: CSS is bundled in the JS.
- **Custom Web Component**: Easy integration with `<vloop-widget />`.
- **Highly configurable**: Pass attributes directly to the element.
- **Production-ready**: Minified using Terser for minimal footprint.

## 📦 Usage

Add the following to your HTML:

```html
<!-- The Widget Container -->
<vloop-widget 
  btnText="Support" 
  size="200px" 
  position="right" 
  agentId="YOUR_AGENT_ID"
  styles='{"bottom": "40px"}' 
/>

<!-- The Bundle -->
<script src="https://unpkg.com/@italq/vloop@0.0.0/dist/bundle.min.js" async type="text/javascript"></script>
```

## 🛠 Available Attributes

| Attribute | Description | Default |
|-----------|-------------|---------|
| `btnText` | The text shown on the action button. | `"Call"` |
| `size` | Width of the button (e.g., `200px`). | `"180px"` |
| `position`| `left`, `center`, or `right`. | `"center"` |
| `agentId` | Your unique agent identifier. | `undefined` |
| `styles` | JSON string for extra CSS styles. | `""` |

## 📦 Publishing to NPM

1. **Build the library**:
   ```bash
   npm run build
   ```
2. **Login to NPM** (if not already):
   ```bash
   npm login
   ```
3. **Publish**:
   ```bash
   npm publish --access public
   ```

## 🏗 Development

1. **Install dependencies**: `npm install`
2. **Run dev server**: `npm run dev`
3. **Test bundled version**: Open `examples/test.html` in your browser.