open-index/open-npm huggingface dataset:
npm package: @nag5000/vue-view-transitions
Description: View Transitions API primitives for Vue.js
Author: Aleksei Nagovitsyn
Latest version: 0.0.1

# View Transitions API primitives for Vue.js

## Installation

```sh
npm i @nag5000/vue-view-transition
```

## Usage

### `useViewTransition` composable

```vue
<template>
  <button @click="toggle">Toggle</button>

  <span v-if="flag">🦄</span>
  <span v-else class="rotate-90 scale-150">🌸</span>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { useViewTransition } from '@nag5000/vue-view-transitions'

const { startViewTransition } = useViewTransition()
const flag = ref(false)

function toggle() {
  startViewTransition(() => {
    flag.value = !flag.value
  })
}
</script>

<style scoped>
span {
  view-transition-name: 🦄🌸;
}
</style>
```

### `<ViewTransition>` component

```vue
<template>
  <button @click="toggle">Toggle</button>

  <ViewTransition>
    <span v-if="flag">🦄</span>
    <span v-else class="rotate-90 scale-150">🌸</span>
  </ViewTransition>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { ViewTransition } from '@nag5000/vue-view-transitions'

const flag = ref(false)

function toggle() {
  flag.value = !flag.value
}
</script>
```

## Documentation and Demos

Check them out on the website: https://vue-view-transitions.vercel.app/
npm package: @nagabhushanadiga/multi-select-dropdown-react
Description: A customizable, responsive multi-select dropdown built with Material UI
Author: Nagabhushan adiga
Latest version: 1.0.13

# Multi Select Dropdown

A customizable, responsive multi-select dropdown built with Material UI (MUI).

## Installation

```bash
npm install @nagabhushanadiga/multi-select-dropdown-react


## Usage

import MultiSelectDropdown from '@nagabhushanadiga/multi-select-dropdown-react';
import React, { useState } from 'react';

function App() {
  const [selected, setSelected] = useState([]);

  return (
    <MultiSelectDropdown
      label="Select Options"
      options={['Option 1', 'Option 2', 'Option 3']}
      selected={selected}
      onChange={setSelected}
    />
  );
}

props provided
Prop | Type | Description
label | string | Label text
options | array | List of options
selected | array | Selected values
onChange | function | Callback when changed
placeholder | string | Placeholder text
fullWidth | boolean | Full width?
customStyles | object | Style overrides
menuMaxHeight | number | Max menu height
...selectProps | any | Extra MUI props
npm package: @naganpm/fetch-prompts
Description: Fetch prompts from GitLab repository
Latest version: 1.0.6

# fetch-prompts

Fetch prompts from a public GitLab repository.

## Quick Start

**Simple - no authentication required!**

```bash
npx -y @naganpm/fetch-prompts
```

This downloads all `.md` prompt files from https://gitlab.com/prompts4/prompt-manager into a local `prompts/` folder.

---

## Alternative: For Private Repos

If the GitLab repo becomes private, users will need:
1. Access to the GitLab repo (ask owner to add you as member)
2. A GitLab personal access token

### Step 1: Get Added to GitLab Repo
Ask the repo owner to add you at:
https://gitlab.com/prompts4/prompt-manager/-/project_members

### Step 2: Create GitLab Token
1. Go to: https://gitlab.com/-/profile/personal_access_tokens
2. Create token with scopes: `read_api`, `read_repository`
3. Copy your token (starts with `glpat-`)

### Step 3: Run with Token
```bash
GITLAB_TOKEN=glpat-your-token-here npx -y @naganpm/fetch-prompts
```

Or export it first:
```bash
export GITLAB_TOKEN=glpat-your-token-here
npx -y @naganpm/fetch-prompts
```

---

## For Repo Owner: Adding Users (Private Repos Only)

To grant someone access to fetch prompts:

1. Go to: https://gitlab.com/prompts4/prompt-manager/-/project_members
2. Click **"Invite members"**
3. Add their GitLab username or email
4. Set role to **"Reporter"** (read-only access)
5. Click **"Invite"**

They can then create their own token and use the `npx` command above.

## Setup (For Development)

If you want to fork/modify this package:

1. **Edit `bin/index.js`** to point to your GitLab repo:
   ```js
   const GITLAB_PROJECT = 'your-group/your-project';
   const GITLAB_BRANCH = 'main';
   const PROMPTS_PATH = 'prompts';
   ```

2. **Create `.env`** for local testing:
   ```bash
   # Copy the example
   cp .env.example .env
   
   # Edit .env and add your GitLab token
   GITLAB_TOKEN=glpat-xxxxxxxxxxxx
   ```
   
   Create a token at: https://gitlab.com/-/profile/personal_access_tokens
   Required scopes: `read_api`, `read_repository`

3. **Prepare your GitLab repo** with a `prompts/` folder containing `.md` files:
   ```
   your-gitlab-repo/
   └── prompts/
       ├── assessments-result-feed.md
       └── other-prompt.md
   ```

3. **Test locally:**

```bash
# Install dependencies
npm install

# Make bin/index.js executable
chmod +x bin/index.js

# Create .env with your token (for private repos)
cp .env.example .env
# Edit .env and add your GITLAB_TOKEN

# Test locally
npm link
npx -y @naganpm/fetch-prompts

# Or run directly
node bin/index.js
```

## GitLab Repository Structure

Your GitLab repo should have:
```
prompts/
├── assessments-result-feed.md
├── another-route.md
└── more-prompts.md
```

All `.md` files in the `prompts/` folder will be downloaded.