open-index/open-npm huggingface dataset:
npm package: @pimd/classes-plugin
Description: Adds classes to HTML elements
Author: Nico Hagenburger
Latest version: 0.1.6

# PIMD Classes Plugin

Adds HTML classes to code blocks and other elements.

## Example usage

````markdown +highlight=".my-headline",".my-code",".my-paragraph"
# Headline <?: .my-headline ?>

```html .my-code
<p>Example</p>
```

Lorem ipsum dolor sit amet. <?: .my-paragraph ?>
````

Results in:

```html +highlight="class=\"my-headline\"","my-code","class=\"my-paragraph\""
<h1 class="my-headline">Headline</h1>

<div class="pimd-example my-code">
  ...
</div>

<p class="my-paragraph">Lorem ipsum dolor sit amet.</p>
```

## Setup

```sh
npm i pimd @pimd/classes-plugin
```

```javascript +highlight=/classesPlugin/g,"require(\"@pimd/classes-plugin\")",/(?<!\/)config/g +showmore=1..2,9..15
const { Document } = require("pimd")
const Config = require("pimd/lib/config")
const classesPlugin = require("@pimd/classes-plugin")

const config = new Config()
config.use(classesPlugin)

const markdown = `
# Headline <?: .my-headline ?>

\`\`\`html .my-code
<p>Example</p>
\`\`\`

Lorem ipsum dolor sit amet. <?: .my-paragraph ?>
`
const doc = new Document(markdown, config)
console.log(doc.render())
```

---

## Copyright

Copyright 2018++ [Nico Hagenburger](https://www.hagenburger.net). See
[MIT-LICENSE](MIT-LICENSE) for details. Get in touch with
[@hagenburger](https://twitter.com/hagenburger) on Twitter or
[open an issue](https://github.com/hagenburger/pimd/issues/new).
npm package: @pimd/id-plugin
Description: Adds an ID to HTML elements
Author: Nico Hagenburger
Latest version: 0.1.5

# PIMD ID Plugin

Adds an HTML ID to code blocks and other elements.

## Example usage

````markdown +highlight="#my-headline","#my-code","#my-paragraph"
# Headline <?: #my-headline ?>

```html #my-code
<p>Example</p>
```

Lorem ipsum dolor sit amet. <?: #my-paragraph ?>
````

Results in:

```html +highlight="id=\"my-headline\"","id=\"my-code\"","id=\"my-paragraph\""
<h1 id="my-headline">Headline</h1>

<div id="my-code">
  ...
</div>

<p id="my-paragraph">Lorem ipsum dolor sit amet.</p>
```

## Setup

```sh
npm i pimd @pimd/id-plugin
```

```javascript +highlight=/idPlugin/g,"require(\"@pimd/id-plugin\")",/(?<!\/)config/g +showmore=1..2,9..15
const { Document } = require("pimd")
const Config = require("pimd/lib/config")
const idPlugin = require("@pimd/id-plugin")

const config = new Config()
config.use(idPlugin)

const markdown = `
# Headline <?: #my-headline ?>

\`\`\`html #my-code
<p>Example</p>
\`\`\`

Lorem ipsum dolor sit amet. <?: #my-paragraph ?>
`
const doc = new Document(markdown, config)
console.log(doc.render())
```

---

## Copyright

Copyright 2018++ [Nico Hagenburger](https://www.hagenburger.net). See
[MIT-LICENSE](MIT-LICENSE) for details. Get in touch with
[@hagenburger](https://twitter.com/hagenburger) on Twitter or
[open an issue](https://github.com/hagenburger/pimd/issues/new).
npm package: @pimd/preview-plugin
Description: Adds a preview (live HTML) to code blocks.
Author: Nico Hagenburger
Latest version: 0.1.6

# PIMD Preview Plugin

Adds a preview (live HTML) to code blocks.

## Example usage

````markdown +highlight="+preview"
```html +preview
<p>Example</p>
```
````

## Setup

```sh
npm i pimd @pimd/preview-plugin
```

```javascript +highlight=/previewPlugin/g,"require(\"@pimd/preview-plugin\")",/(?<!\/)config/g+showmore=1..2,9..11
const { Document } = require("pimd")
const Config = require("pimd/lib/config")
const previewPlugin = require("@pimd/preview-plugin")

const config = new Config()
config.use(previewPlugin)

const markdown = `
\`\`\`html +preview
<p>Example</p>
\`\`\`
`
const doc = new Document(markdown, config)
console.log(doc.render())
```

---

## Copyright

Copyright 2018++ [Nico Hagenburger](https://www.hagenburger.net). See
[MIT-LICENSE](MIT-LICENSE) for details. Get in touch with
[@hagenburger](https://twitter.com/hagenburger) on Twitter or
[open an issue](https://github.com/hagenburger/pimd/issues/new).
npm package: @pimd/prism-plugin
Description: Highlights code blocks using Prism
Author: Nico Hagenburger
Latest version: 0.2.0

# PIMD Prism Plugin

Uses [Prism](https://prismjs.com) to highlight code blocks.

## Example usage

````markdown +highlight=/javascript|html/g
# Example usage

Add the language to a code block:

```html
<p>Example</p>
```

Or for JavaScript:

```javascript
alert("Hello world!")
```

Alternatively a file name with suffix can be used:

```index.html
<p>Example</p>
```
````

## Setup

```sh
npm i pimd @pimd/prism-plugin
```

```javascript +highlight=/prismPlugin/g,"require(\"@pimd/prism-plugin\")",/(?<!\/)config/g+showmore=1..2,9..11
const { Document } = require("pimd")
const Config = require("pimd/lib/config")
const prismPlugin = require("@pimd/prism-plugin")

const config = new Config()
config.use(prismPlugin)

const markdown = `
\`\`\`html
<p>Example</p>
\`\`\`
`
const doc = new Document(markdown, config)
console.log(doc.render())
```

---

## Copyright

Copyright 2018++ [Nico Hagenburger](https://www.hagenburger.net). See
[MIT-LICENSE](MIT-LICENSE) for details. Get in touch with
[@hagenburger](https://twitter.com/hagenburger) on Twitter or
[open an issue](https://github.com/hagenburger/pimd/issues/new).
npm package: @pimd/showmore-plugin
Description: Hides non-relevant parts of code examples
Author: Nico Hagenburger
Latest version: 0.1.2

# PIMD Showmore Plugin

Hides non-relevant parts of code examples.

Very often code examples require more code to be rendered as preview than to be
understood by a human. Those extra code is noise and should be hidden.

This plugin shows `···` instead of the noise and reveals the code on click.

![Video preview of Showmore plugin](https://user-images.githubusercontent.com/103399/46336396-f7049980-c62a-11e8-94ec-9acdee8e858f.gif)

## Example usage

````markdown +highlight=/\+showmore=[^\s]+/
```html +showmore=5..13
<ul>
  <li class="my-list-item">
    Item 1
  </li>
  <li class="my-list-item">
    Item 2
  </li>
  <li class="my-list-item">
    Item 3
  </li>
  <li class="my-list-item">
    Item 4
  </li>
</ul>
```
````

Result:

![preview](https://user-images.githubusercontent.com/103399/44298456-b4d60180-a2e3-11e8-96f7-5740028c564c.png)

## Setup

This requires the _HTML injector_ plugin to be loaded first:

```javascript +highlight=/showmorePlugin/g,"require(\"@pimd/showmore-plugin\")",/(?<!\/)config/g +showmore=1..2,11..26
const { Document } = require("pimd")
const Config = require("pimd/lib/config")
const htmlInjector = require("@pimd/html-injector-plugin")
const showmorePlugin = require("@pimd/showmore-plugin")

const config = new Config()
config.use(htmlInjector)
config.use(showmorePlugin)

const markdown = `
\`\`\`html +showmore=5..13
<ul>
  <li class="my-list-item">
    Item 1
  </li>
  <li class="my-list-item">
    Item 2
  </li>
  <li class="my-list-item">
    Item 3
  </li>
  <li class="my-list-item">
    Item 4
  </li>
</ul>
\`\`\`
`
const doc = new Document(markdown, config)
const html = doc.render()
console.log(html)
```

---

## Copyright

Copyright 2018++ [Nico Hagenburger](https://www.hagenburger.net). See
[MIT-LICENSE](MIT-LICENSE) for details. Get in touch with
[@hagenburger](https://twitter.com/hagenburger) on Twitter or
[open an issue](https://github.com/hagenburger/pimd/issues/new).
npm package: @pimlico/schemas
Description: Zod schemas and utilities related to Account Abstraction. Made by https://pimlico.io
Author: Pimlico
Latest version: 0.0.1

# @pimlico/schemas

Zod schemas and utilities for Pimlico types.

## Installation

```bash
pnpm add @pimlico/schemas zod viem
```

## Usage

```typescript
import { } from "@pimlico/schemas"

// Usage examples will be added as schemas are implemented
```

## Peer Dependencies

This package requires:
- `zod` ^3.23.8
- `viem` ^2.21.52
npm package: @pimred/camera-poster
Description: Camera Poster is a lightweight npm package that lets you easily add a camera viewport to your web application. With just a few lines of code, you can spawn a camera canvas in the browser and allow your users to snap a picture and send it via a post reques
Author: Armin Emmert
Latest version: 0.0.8

# Camera Poster

Camera Poster is a lightweight npm package that lets you easily add a camera viewport to your web application. With just a few lines of code, you can spawn a camera canvas in the browser and allow your users to snap a picture and send it via a post request to a specified endpoint. Optionally you can handle the response by specifying a callback function.

This library is intentionally build with vanilla JS in order to keep it lightweight, and simple in terms of dependencies.

## Installation
To install Camera Poster, simply run the following command:

```sh
npm install @pimred/camera-poster
```

## Usage
To use Camera Poster, you need to import it into your project and call the setup function with the appropriate parameters. Here's an example of how to do that:

```javascript
import { setupCamera } from '@pimred/camera-poster'
import '@pimred/camera-poster/style.css'

/**
 * Sets up a camera preview and allows the user to take a photo to be uploaded to a specified URL.
 *
 * @param {HTMLElement} spawnerButton - The HTML element that will spawn the camera module when clicked.
 * @param {string} postUrl - The URL to which the photo will be uploaded.
 * @param {function} callbackFunction - The function to be called after the photo is uploaded. Takes a single parameter, which is the data returned from the server.
 * @returns {void}
 */
setupCamera(document.querySelector('#button'), 'http://<where-to-send-image>/', (data) => { console.log(data) })

```

In this example, we call the setup function, and pass in three options:
- `spawnerButton`: an HTML element to which an event listener will be attached. Clicking on it will spawn the camera utility.
- `postUrl`: the URL where the captured image will be sent via a post request.
- `callbackFunction`: Optional, handles the response data of the endpoint at `postUrl`.

## API
Camera Poster provides the following methods:

### setupCamera()
Attaches an event listener to the specified HTML element, which will spawn the camera utility on click.

## Development

1. **Increment version** in package.json

2. Build the dist files
`npm run build`

3. Publish to npm
`npm publish --access public`

## License
Camera Poster is released under the MIT License. See LICENSE file for details.