open-index/open-npm huggingface dataset:
npm package: @previewcn/devtools
Description: Embedded devtools for PreviewCN - real-time shadcn/ui theme preview inside your app
Author: PreviewCN
Latest version: 0.1.12

# @previewcn/devtools

Embedded devtools for PreviewCN - real-time shadcn/ui theme preview inside your app.

## Features

- 🎨 **In-app theme editor** - No iframe, no separate server
- 🎯 **DevTools-style UI** - Click the palette icon to open
- 💾 **Persistent settings** - Theme choices saved in localStorage
- 🚀 **Production-safe** - Automatically excluded in production builds
- ⚡ **Lazy-loaded** - Panel only loads when opened

## Installation

```bash
# Using pnpm
pnpm add -D @previewcn/devtools

# Using npm
npm install -D @previewcn/devtools

# Using yarn
yarn add -D @previewcn/devtools
```

Or use the CLI:

```bash
npx previewcn init --devtools
```

## Usage

Add to your `app/layout.tsx`:

```tsx
import "@previewcn/devtools/styles.css";
import { PreviewcnDevtools } from "@previewcn/devtools";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {process.env.NODE_ENV === "development" && <PreviewcnDevtools />}
        {children}
      </body>
    </html>
  );
}
```

## How It Works

1. A small palette icon appears in the bottom-right corner of your app
2. Click it to open the theme editor panel
3. The theme is applied only after user interaction (opening the panel / changing settings)
4. Changes are applied directly to your app in real-time
5. Settings are persisted in localStorage

## License

MIT
npm package: @previewlinks/node-previewlinks
Description: The official PreviewLinks node.js SDK
Author: Logan Craft
Latest version: 0.1.0

# PreviewLinks for Node.js

This is the official [PreviewLinks](https://previewlinks.io) client for Node.js.

## Installation

You can install the package via NPM:

```bash
npm install @previewlinks/node-previewlinks
```

## Usage

### Creating an instance

```js
const { PreviewLinks } = require('@previewlinks/node-previewlinks')

const previewlinks = new PreviewLinks({ apiToken: '<YOUR_API_TOKEN>' })
```

### Methods

```js
// List sites
previewlinks
    .listSites()
    .then(response => response.data)

// Show site
let siteId = 1

previewlinks
    .showSite(siteId)
    .then(response => response.data)

// Show site's templates
let siteId = 1

previewlinks
    .listSiteTemplates(siteId)
    .then(response => response.data)

// Generate a direct image URL (useful for downloading and storing images yourself)
let siteId = 1
let templateId = 1
let fields = {
    'previewlinks:title': 'Hello from Node.js!',
    'previewlinks:subtitle': 'This is an example...',
}

previewlinks
    .downloadImage({
        siteId,
        templateId,
        fields,
    })
    .then(response => response.data)
```

## Security Vulnerabilities

Please review [our security policy](../../security/policy) on how to report security vulnerabilities.

## Credits

-   [Logan Craft](https://github.com/CraftLogan)
-   [Lars Klopstra](https://github.com/flowframe)
-   [All Contributors](../../contributors)

## License

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
npm package: @prevter/tiktok-scraper
Description: Library for downloading videos from TikTok (without watermark)
Author: prevter
Latest version: 1.0.1

# TikTok Video Downloader

![npm](https://img.shields.io/npm/v/%40prevter%2Ftiktok-scraper)
![npm type definitions](https://img.shields.io/npm/types/%40prevter%2Ftiktok-scraper)
![GitHub](https://img.shields.io/github/license/prevter/tiktok-scraper)  

Simple library to download TikTok videos without watermark in TypeScript.

## Installation

```bash
npm install @prevter/tiktok-scraper
```

## Usage

```ts
// Typescript:
import { fetchVideo } from '@prevter/tiktok-scraper';
import { writeFileSync } from 'fs';

// Javascript:
// const { fetchVideo } = require('@prevter/tiktok-scraper');
// const { writeFileSync } = require('fs');

const url = 'https://www.tiktok.com/@username/video/1234567891234567891';

// Using promise
fetchVideo(url)
  .then(async (video) => {
    const buffer = await video.download();
    writeFileSync('video.mp4', buffer);
  })
  .catch((err) => {
    console.error(err);
  });

// Using await
const video = await fetchVideo(url);
const buffer = await video.download();
writeFileSync('video.mp4', buffer);
```

Supports full URLs (www.tiktok.com) and short URLs (vm.tiktok.com).  
`fetchVideo` parameter can be a URL or a video ID. It will automatically detect how to handle the parameter. If it fails to detect, it will throw an error, so you can handle it.  
This method return a `Promise<Buffer>`, so you can either save it to a file or just send it to anywhere you want.

You can also download video with watermark or even download music from the video:

```ts
const video = await fetchVideo(url);

// add `true` argument to download video with watermark
const watermarkBuffer = await video.download({ watermark: true });
const noWatermarkBuffer = await video.download();
const musicBuffer = await video.music.download();
```

You can add a `progress` callback to track download progress:

```ts
const video = await fetchVideo(url);

const buffer = await video.download({
  progress: (p) => {
    console.log(`Downloaded ${p.progress}% (${p.downloaded}/${p.total} bytes)`);
  },
});
```

In addition, you can get some information about the video:

```ts
const video = await fetchVideo(url);

console.log('Video description:', video.description);
console.log('🔗 URL:', video.url);
console.log('👤 Author:', video.author);
console.log('❤️ Likes:', video.likes);
console.log('💬 Comments:', video.comments);
console.log('🔁 Shares:', video.shares);
console.log('▶️ Plays:', video.playCount);
console.log('🎵 Music:', video.music.name, '-', video.music.author);
console.log('🖼️ Thumbnail URL:', video.previewImageUrl);

/*
Video description: This is a video description
🔗 URL: https://www.tiktok.com/@username/video/1234567891234567891
👤 Author: username
❤️ Likes: 123456
💬 Comments: 1234
🔁 Shares: 1234
▶️ Plays: 1234567
🎵 Music: Music Name - Music Author
🖼️ Thumbnail URL: https://p16-sign-sg.tiktokcdn.com/...
*/
```

## Building and testing

Build typescript files:

```bash
npm run build
```

Build and run test script:

```bash
npm run build:test
```
npm package: @prevue/prevue
Description: [![Build status](https://img.shields.io/circleci/project/github/scottbedard/prevue/master.svg?style=flat)](https://circleci.com/gh/scottbedard/prevue) [![Coverage](https://img.shields.io/codecov/c/github/scottbedard/prevue/master.svg?style=flat)](https:/
Author: Scott Bedard
Latest version: 0.0.0

# prevue

[![Build status](https://img.shields.io/circleci/project/github/scottbedard/prevue/master.svg?style=flat)](https://circleci.com/gh/scottbedard/prevue)
[![Coverage](https://img.shields.io/codecov/c/github/scottbedard/prevue/master.svg?style=flat)](https://codecov.io/gh/scottbedard/prevue)
[![License](https://img.shields.io/badge/license-MIT-blue.svg?style=flat)](https://github.com/scottbedard/prevue/blob/master/LICENSE)

Prevue is an attempt to implement [Vue](https://github.com/vuejs/vue) at compile time, rather than run time. Frameworks like [Svelte](https://github.com/sveltejs/svelte) demonstrate that this is possible to do, and is likely the future of web frameworks. Hopefully, when all is said and done, this will be a framework with the amazing compile time logic of Svelte, with the beautiful and expressive API of Vue.

> **Note:** This project is a work in progress, is not ready to be used by anyone.