open-index/open-npm huggingface dataset:
npm package: @jumpgroup/jump-components
Description: Stencil boilerplate for Web components
Author: Miriam Gonzalez
Latest version: 0.0.40

# Stencil for Web Components boilerplate with Storybook

Hi there 👋  
This is a boilerplate for building a standalone Web Component using [Stencil](https://github.com/ionic-team/stencil) and [Storybook](https://github.com/storybookjs/storybook) with addon controls.

<img src="https://i.gyazo.com/53b3ea84104bd254c5e097fa573f67d6.gif">

## 🚀 Getting Started

To start using this boilerplate, clone this repo to a new directory:

```bash
git clone https://github.com/miriamgonp/stencil-web-components-boilerplate.git
```

## 👩‍💻 Usage
To build the component and run Storybook, run:
```bash
npm start
```
To generate a new component, run: 
```bash
npm run generate <sub-folder>
```

## 👏 Contributing
- :octocat: [Pull requests](https://github.com/miriamgonp/stencil-web-components-boilerplate/pulls) and 🌟 stars are always welcome.
- For major changes, please open an [issue](https://github.com/miriamgonp/stencil-web-components-boilerplate/issues) first to discuss what you would like to change.
- Please make sure to update tests as appropriate.

## 📩 Contact
📧 miriam.mgp@gmail.com

🐦 Twitter [@miriamgonp](https://twitter.com/miriamgonp)

💼 Linkedin [@miriamgop](https://www.linkedin.com/in/miriamgonp/)

## License
MIT &copy; [Miriam Gonzalez](https://github.com/miriamgonp)
npm package: @jumpgroup/kolinpharma-stripe-button
Description: Kolinpharma Stripe Button
Author: JumpGroup
Latest version: 1.0.9

# Kolinpharma stripe button

## Test
- Impostare nexl file `.env` il parametro `STRIPE_API_KEY` con la `sk_test_`
- Impostare nel file `index.html` la prop `api-key-stripe` con la `pk_test_`
- Impostare nel file `index.html` la prop `price-id` con il prezzo `price_1HRw8ZChWLZyI10Z3ZXWlY2X`
- Impostare nel file env la voce `API_URL=/api`
- Eseguire il comando `npx vercel dev`
- Visitare su browser http://localhost:3000/
- Qualsiasi modifica al frontend viene visualizzata immediatamente ed è possibile testare l'api inviando acquisti di test

## Production
- Impostare nel file `.env` il parametro `STRIPE_API_KEY` con la `sk_live_`
- Impostare nel file `index.html` la prop `api-key-stripe` con la `pk_live_`
- Impostare nel file `index.html` la prop `price-id` con il prezzo del prodotto live.
- Aggiornare la versione in package.json e package-lock.json
- Eseguire `npm run build`
- Deployare le api pushando su master
- Se sono state fatte modifiche al frontend aggiornare su npm il componente `npm publish --access public`

## Utilizzare il componente
Includere i seguenti script nella pagina dove si vuole utilizzare il componente:

``` 
<script type="module" src="https://unpkg.com/@jumpgroup/kolinpharma-stripe-button/dist/kolin-stripebutton/kolin-stripebutton.esm.js"></script>
  <script nomodule="" src="https://unpkg.com/@jumpgroup/kolinpharma-stripe-button/dist/kolin-stripebutton/kolin-stripebutton.js"></script>
  <link rel="stylesheet" type="text/css" href="https://unpkg.com/@jumpgroup/kolinpharma-stripe-button/dist/kolin-stripebutton/kolin-stripebutton.css">
```
npm package: @jumpgroup/stencil-env
Description: The stencil env plugin
Author: Aleksey Popov
Latest version: 0.0.1

# @jumpgroup/stencil-env
This package is a fork of @alepop/stencil-env. It loads envs from process.env during build time, useful while working with Vercel. Swaps [dotenv](https://github.com/motdotla/dotenv) for [dotenv-flow](https://github.com/kerimdzhanov/dotenv-flow).

Here's the original package README.

# @alepop/stencil-env

This package is used to use env variables from `.env` file in your stencil project files.

First, npm install within the project:

```
npm install @alepop/stencil-env --save-dev
```

Next, within the project's `stencil.config.js` file, import the plugin and add
it to the `plugins` config.

#### stencil.config.ts
```ts
import { Config } from '@stencil/core';
import { env } from '@alepop/stencil-env';

export const config: Config = {
  plugins: [
      env()
  ]
};
```
You can additionally, pass [options](https://github.com/motdotla/dotenv#options) to the `env` plugin.

Add `.env` file in the root of your project

### .env
```bash
TEST=test string
```

After compilation, `process.env.TEST` will be replaced by it variable from `.env` file.

## Related

* [Stencil](https://stenciljs.com/)
* [Stencil Worldwide Slack](https://stencil-worldwide.slack.com)
* [dotenv](https://github.com/motdotla/dotenv)
npm package: @jumpitt/imed-components
Description: Imed VueJS components
Author: Julio Contreras
Latest version: 0.0.78

# imed-vuejs

> Componentes imed con sistema de diseño hecho en VueJS


## Comandos disponibles

``` bash
# instalar dependencias
npm install

# servidor con hot reload en localhost:8080
npm run dev

# minificar y hacer carpeta dist con App.vue
npm run build

# Minificar plugin
npm run pack

# los dos ultimos comandos en uno
npm run dist

#deploy a NPM
npm run pack && npm publish --access=public


```

## Contribuciones

Si vas a contribuir al proyecto
asegurate de crear una rama aparte desde **develop** para hacer 
el merge

Ej : develop -> feature/add-button-colors


##Advertencia

En el proyecto va un archivo llamado .npmrc . 
Este archivo se usa para hacer deploy a npm .
Dentro de este hay una **apiKey**.
No compartir este archivo fuera del repo. Ya que expones
el package de npm
npm package: @jumpmind/openpos-client-core-lib-cli
Description: A blank schematics
Latest version: 0.0.5

# Openpos Schematics

This library include angular cli extensions for scaffolding OpenPos components.

After installing the package to your project run the appropriate command below. If you have multiple modules you'll need to change your directory to the root directory for the module you want to add the component to.

`ng g @jumpmind/openpos-client-core-lib-cli:screen` will generate a new screen component

`ng g @jumpmind/openpos-client-core-lib-cli:dialog` will generate a new dialog component

`ng g @jumpmind/openpos-client-core-lib-cli:screen-part` will generate a new screen-part component

*Note - these schematics will add theme.scss files for each component but it doesn't add the '_' prefix to the file name and it doesn't include the mixin anywhere. You'll need to do both of those things manually.*

*Note - if you adding to the core you'll need to fix a couple imports from the core*
npm package: @jumpstartjs/core
Description: Jumpstart.js allows you to easly develop web applications by handling most of the work for you. It automatically wires together your web application, by using a simple to use design language.
Latest version: 0.1.1

# jumpstart.js #

Jumpstart.js allows you to easly develop web applications by handling most of the work for you. It automatically wires together your web application, by using a simple to use design language.

Jumpstart.js is automatically cross-browser and works on mobile devices and desktop browsers, with no extra coding.

* Demo: https://labs.zoomapps.com.au/jumpstart

Building Jumpstart.js
---------
Once you have set up your environment, just run:

    grunt package

This will lint the source, bundle it, minify it and run the unit tests.

Installation
---------

```html
todo();
```

Design Away!
---------

```javascript
todo();
```
npm package: @jumpu-ui/tailwindcss
Description: A Tailwind CSS plugin of Jumpu UI implementation.
Author: tuqulore inc.
Latest version: 2.0.1

# @jumpu-ui/tailwindcss

@jumpu/tailwindcss package is a Tailwind CSS plugin of Jumpu UI implementation.

## Documentation

https://jumpu-ui.pages.dev/

## Installation

Install the package to your project.

```shell
npm i -D @jumpu-ui/tailwindcss
```

Import the package to CSS file which installed Tailwind CSS.

```css
@import "tailwindcss";
@import "@jumpu-ui/tailwindcss";
```

### Partially Installation

If you want to use partial styles, please import several CSS files from the package as follows:

```css
@import "tailwindcss";
@import "@jumpu-ui/tailwindcss/theme.css" layer(theme);
@import "@jumpu-ui/tailwindcss/components/button.css" layer(components);
```

### Using CDN

If you want to use in client directly, you can use CDN as follows:

```html
<link rel="stylesheet" href="https://esm.sh/@jumpu-ui/tailwindcss" />
```

> [!NOTE]
>
> In this case, there are limitations that utility unavailable. Please use `var(--*)` instead.

## Configuration

Jumpu UI does extend [Tailwind CSS Theme](https://tailwindcss.com/docs/theme). You can customize several CSS values.

### [colors](https://tailwindcss.com/docs/customizing-colors)

- `var(--color-primary-*)`: Primary color palette. Default is `var(--color-blue-*)`

### spacing

- `var(--spacing-relative)`: Unit of relative spacing. Default is `0.25em`

## How to contribute

Please refer https://jumpu-ui.pages.dev/development-guide.html
npm package: @jun-b/firebase-mcp
Description: Firebase MCP server for AI agents to fully implement backend functionality
Author: JuN-B
Latest version: 1.0.0

# Firebase MCP

AI 에이전트가 Firebase 백엔드를 완전히 구현하고 관리할 수 있는 MCP(Model Context Protocol) 서버입니다.

## Installation

```bash
npx -y @jun-b/firebase-mcp --project-id <PROJECT_ID> --key-file <PATH>
```

## Configuration

### Claude Desktop

`claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "firebase": {
      "command": "npx",
      "args": [
        "-y",
        "@jun-b/firebase-mcp",
        "--project-id",
        "your-project-id",
        "--key-file",
        "/path/to/service-account.json"
      ]
    }
  }
}
```

### Arguments

| Argument | Required | Description |
|----------|----------|-------------|
| `--project-id` | Yes | Firebase project ID |
| `--key-file` | No | Path to service account key JSON file. Uses Application Default Credentials if not provided. |

## Tools

### Firestore (9 tools)

| Tool | Description |
|------|-------------|
| `firestore_add_document` | Add document with auto-generated ID |
| `firestore_set_document` | Create/overwrite document with specific ID |
| `firestore_get_document` | Get document by ID |
| `firestore_update_document` | Update specific fields |
| `firestore_delete_document` | Delete document |
| `firestore_list_documents` | List all documents in collection |
| `firestore_query_documents` | Query with filters, ordering, pagination |
| `firestore_list_collections` | List collections/subcollections |
| `firestore_batch_write` | Atomic batch operations |

### Authentication (9 tools)

| Tool | Description |
|------|-------------|
| `auth_create_user` | Create new user |
| `auth_get_user` | Get user by UID |
| `auth_get_user_by_email` | Get user by email |
| `auth_update_user` | Update user properties |
| `auth_delete_user` | Delete user |
| `auth_list_users` | List all users |
| `auth_set_custom_claims` | Set custom claims for RBAC |
| `auth_create_custom_token` | Create custom auth token |
| `auth_verify_id_token` | Verify ID token |

### Storage (8 tools)

| Tool | Description |
|------|-------------|
| `storage_upload_string` | Upload string/base64 content |
| `storage_download_file` | Download file (returns base64) |
| `storage_delete_file` | Delete file |
| `storage_list_files` | List files in directory |
| `storage_get_file_metadata` | Get file metadata |
| `storage_get_signed_url` | Generate signed URL |
| `storage_copy_file` | Copy file |
| `storage_move_file` | Move file |

## Service Account Setup

1. Go to [Firebase Console](https://console.firebase.google.com/)
2. Select your project
3. Go to Project Settings > Service accounts
4. Click "Generate new private key"
5. Save the JSON file securely
6. Use the path in `--key-file` argument

## License

MIT
npm package: @jun-b/supadesign-mcp
Description: Design Principles Engine - Universal UI quality through principles, not heuristics
Author: JuN-B
Latest version: 4.2.0

# SupaDesign MCP

**Design Principles Engine** - Universal UI quality through principles, not heuristics

## Philosophy

> Works for ANY design style. Principles over heuristics. Context-aware.

## Features

| Module | Description |
|--------|-------------|
| **Design Principles** | Hierarchy, Rhythm, Contrast analysis |
| **UX Laws** | Fitts, Hick, Miller, Jakob, and more |
| **Gestalt** | Proximity, Similarity, Continuity, Closure |
| **Design Systems** | Material, Ant, Chakra, Tailwind, Radix |
| **Reference Patterns** | Linear, Stripe, Vercel, Raycast, Notion, Figma |
| **Context Detection** | Expressiveness level by context |
| **Quality Metrics** | A+ to F grade with feedback |
| **Accessibility** | WCAG AA/AAA validation |

## Installation

```bash
npm install -g @jun-b/supadesign-mcp
```

## MCP Config

```json
{
  "mcpServers": {
    "supadesign": {
      "command": "npx",
      "args": ["-y", "@jun-b/supadesign-mcp"]
    }
  }
}
```

## Output Example

```
Quality Grade: B+ (78%)

Context: agency-portfolio (85% expressiveness)
Reference Pattern: Raycast

UX Laws Analysis:
| Fitts' Law | 70% | CTA 48px+ height |
| Hick's Law | 80% | Reduce nav to 5-7 |

Gestalt Principles:
| Proximity | 8-16px for related items |
| Similarity | Consistent button styles |

Recommended Design System:
Chakra UI - Accessible, composable
```

## File Structure

```
src/
├── principles/    # Hierarchy, Rhythm, Contrast
├── ux/            # Laws, Gestalt, Design Systems
├── context/       # Expressiveness detection
├── quality/       # A+ to F grading
├── references/    # Linear, Stripe, Vercel patterns
├── blueprints/    # Components, Responsive
├── engine/        # Style Vector, Layout, Accessibility
└── presets/       # W3C Design Tokens
```

## License

MIT