open-index/open-npm huggingface dataset:
npm package: @product-simple/escpos
Description: ESCPOS printing builder library
Author: Joe Hartzell
Latest version: 0.1.1

# @product-simple/escpos [![npm](https://img.shields.io/npm/v/@product-simple/escpos.svg)](https://www.npmjs.com/package/@product-simple/escpos)

_**BETA**_

## Motivation

Most thermal printers on the market support the ESC/POS command protocol made by EPSON ([Reference](https://reference.epson-biz.com/modules/ref_escpos/index.php?content_id=2)). There seems to be a lack of options when it comes to using typescript to support this protocol. This library serves one fundamental purpose; provide a typescript builder pattern library for constructing ESC/POS compatible buffers in Node.js.

## Getting Started

Start by installing the package with your favorite package manager.

### Using npm

```
npm i @product-simple/escpos
```

### Using yarn

```
yarn add @product-simple/escpos
```

### Using pnpm

```
pnpm add @product-simple/escpos
```

Once installed, simply import the package and start building escpos compatible buffers.

```ts
import {
  DocumentBuilder,
  DocumentBuilderFormatOptions,
  DefaultFormatter,
  FormatTextAlign,
  FormatTextUnderline,
  NetworkPrinter,
} from '@product-simple/escpos';

// create the builder with default formatting
const builder = new DocumentBuilder(
  new DefaultFormatter({
    align: FormatTextAlign.Left,
    bold: false,
    underline: FormatTextUnderline.None,
  }),
);

// build our print document
const buffer = builder
  .text('Line 1')
  .text('Line 2')
  .format({ draw: (b) => b.text('underlined text'), underline: FormatTextUnderline.TwoDot })
  .cut()
  .build();

// create and connect to the printer
const printer = await NetworkPrinter.create({
  port: 9100,
  host: '192.168.1.87',
});
await printer.write(buffer);
await printer.close();
```

## Features

- [x] Text
- [x] Text line
- [ ] Feed line
- [x] Bold text
- [x] Underline text
- [ ] Font size
- [ ] Small mode
- [ ] White mode
- [x] Align
- [ ] Barcode
- [ ] QRcode
- [x] Paper cut node
- [ ] Image (base64) (png only)
npm package: @productbet/tracker-next
Description: Next.js App Router integration for ProductBet behavioral analytics SDK
Latest version: 0.1.9

# @productbet/tracker-next

Next.js App Router integration for [ProductBet](https://productbet.io) behavioral analytics. Drop-in session recording, event tracking, and user identification with automatic route change tracking.

## Install

```bash
npm install @productbet/tracker-next
```

## Quick start

Add `ProductBetScript` to your root layout:

```tsx
// app/layout.tsx
import { ProductBetScript } from "@productbet/tracker-next"

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html>
      <body>
        <ProductBetScript apiKey="pb_live_xxxx">
          {children}
        </ProductBetScript>
      </body>
    </html>
  )
}
```

That's it. The SDK will automatically track page views on route changes, clicks, form interactions, scroll depth, console errors, and network failures.

## Components

### `ProductBetScript`

The simplest way to add ProductBet to a Next.js app. Wraps your app with the provider and enables route tracking.

```tsx
<ProductBetScript apiKey="pb_live_xxxx" enableSessionRecording={true}>
  {children}
</ProductBetScript>
```

### `ProductBetProvider`

If you need more control, use the provider directly. It extends the React provider with automatic `usePathname()` route tracking.

```tsx
import { ProductBetProvider } from "@productbet/tracker-next"

<ProductBetProvider
  apiKey="pb_live_xxxx"
  trackRouteChanges={true}
  enableSessionRecording={true}
>
  {children}
</ProductBetProvider>
```

Set `trackRouteChanges={false}` to disable automatic page view tracking on route changes.

## Hooks

All hooks from `@productbet/tracker-react` are re-exported:

```tsx
import { useIdentify, useTrackEvent, useTracker } from "@productbet/tracker-next"
```

### `useIdentify`

Identify the current user once authenticated.

```tsx
function Dashboard({ user }) {
  useIdentify(user.id, { plan: user.plan })
  return <div>...</div>
}
```

### `useTrackEvent`

Track custom events.

```tsx
function UpgradeButton() {
  const track = useTrackEvent()
  return <button onClick={() => track("upgrade_clicked", { from: "free" })}>Upgrade</button>
}
```

## Configuration

All props from `@productbet/tracker-core` are supported:

```tsx
<ProductBetScript
  apiKey="pb_live_xxxx"
  enableSessionRecording={true}
  enableAutoTracking={true}
  enableConsoleTracking={true}
  enableNetworkTracking={true}
  redaction={{ mode: "privacy-first", unredactFields: ["search"] }}
  debug={false}
>
  {children}
</ProductBetScript>
```

See [@productbet/tracker-core](https://www.npmjs.com/package/@productbet/tracker-core) for the full list of options.

## License

MIT
npm package: @productbet/tracker-react
Description: React integration for ProductBet behavioral analytics SDK
Latest version: 0.1.9

# @productbet/tracker-react

React integration for [ProductBet](https://productbet.io) behavioral analytics. Provides a context provider and hooks for session recording, event tracking, and user identification.

> For **Next.js App Router** projects, use **[@productbet/tracker-next](https://www.npmjs.com/package/@productbet/tracker-next)** instead, which adds automatic route tracking.

## Install

```bash
npm install @productbet/tracker-react
```

## Quick start

Wrap your app with `ProductBetProvider`:

```tsx
import { ProductBetProvider } from "@productbet/tracker-react"

function App() {
  return (
    <ProductBetProvider apiKey="pb_live_xxxx">
      <YourApp />
    </ProductBetProvider>
  )
}
```

That's it. The SDK will automatically track clicks, form interactions, scroll depth, navigation, console errors, and network failures.

## Hooks

### `useIdentify`

Identify the current user. Call this once the user is authenticated.

```tsx
import { useIdentify } from "@productbet/tracker-react"

function Dashboard({ user }) {
  useIdentify(user.id, { plan: user.plan, company: user.company })

  return <div>...</div>
}
```

### `useTrackEvent`

Track custom events.

```tsx
import { useTrackEvent } from "@productbet/tracker-react"

function ExportButton() {
  const track = useTrackEvent()

  return (
    <button onClick={() => track("export_clicked", { format: "csv" })}>
      Export
    </button>
  )
}
```

### `usePageView`

Manually track page views (useful for SPAs without Next.js).

```tsx
import { usePageView } from "@productbet/tracker-react"
import { useLocation } from "react-router-dom"

function PageTracker() {
  const location = useLocation()
  usePageView(location.pathname)

  return null
}
```

### `useTracker`

Access the underlying tracker instance for advanced use cases.

```tsx
import { useTracker } from "@productbet/tracker-react"

function Component() {
  const tracker = useTracker()

  // tracker.getSessionId()
  // tracker.track(...)
  // tracker.identify(...)
}
```

## Configuration

Pass any option as a prop to `ProductBetProvider`:

```tsx
<ProductBetProvider
  apiKey="pb_live_xxxx"
  enableSessionRecording={true}
  enableAutoTracking={true}
  enableConsoleTracking={true}
  enableNetworkTracking={true}
  debug={false}
  redaction={{ mode: "privacy-first", unredactFields: ["search"] }}
>
  <App />
</ProductBetProvider>
```

See [@productbet/tracker-core](https://www.npmjs.com/package/@productbet/tracker-core) for the full list of options.

## License

MIT
npm package: @productboard/slate
Description: A completely customizable framework for building rich text editors.
Latest version: 0.42.7

This package contains the core logic of Slate. It's separated further into a series of directories:

* [**Changes**](./src/changes) — containing the changes that are used to alter a Slate document.
* [**Constants**](./src/constants) — containing constants that are used in Slate's codebase.
* [**Models**](./src/models) — containing the models that define Slate's data structure.
* [**Operations**](./src/operations) — containing the low-level operations that create Slate changes.
* [**Schemas**](./src/schemas) - containing the core schema that ships with Slate by default.
* [**Utils**](./src/utils) — containing a few private convenience modules.

Feel free to poke around in each of them to learn more!
npm package: @productboard/slate-hyper-markdown
Description: Slate Markdown serializer based on marked.js.
Author: productboard
Latest version: 1.1.1

# Slate markdown serializer

## Motivation

At first we wanted to use [Netlify's `slate-markdown-serializer`](https://github.com/netlify/slate-markdown-serializer/tree/master/src) since it does exactly what we need.

There were, however, several tiny issues:

- It does not seem to be **updated anymore** (last update is from two years ago, but this could have been solved using [tommoor's fork](https://github.com/tommoor/slate-md-serializer))
- Both libraries reuse parts [`marked`](https://github.com/markedjs/marked) which **prevents simple updates**
- Both libraries **dictate `type`** string for `Block`, `Inline` and `Mark`
- Both libraries lack **TypeScript support**
npm package: @productboard/storybook-addon-smart-knobs
Description: Automatically created knobs for storybook.
Latest version: 3.2.12

# Smart knobs addon for Storybook

This Storybook plugin uses `@storybook/addon-knobs` but creates the knobs automatically based on PropTypes.

This fork has a goal of adding support for creating knobs from Flow type definitions next to PropTypes.

## Installation:

```
npm i storybook-addon-smart-knobs --save-dev
```

## Usage:

```js
import React, { PropTypes } from 'react'
import { storiesOf } from '@storybook/react'
import { withKnobs } from '@storybook/addon-knobs'
import { withSmartKnobs } from 'storybook-addon-smart-knobs'

const Button = ({ children, onClick }) => (
  <button onClick={ onClick }>{ children }</button>
)

Button.propTypes = {
  children: PropTypes.node,
  onClick: PropTypes.func
}

storiesOf('Button')
  .addDecorator(withSmartKnobs)
  .addDecorator(withKnobs)
  .add('simple', () => <Button>Smart knobed button</Button>)

```
npm package: @productboard/webpack-deploy
Description: Collection of useful utilities for deploying (not only) Webpack apps
Author: Tomas Ruzicka
Latest version: 0.14.2

# Webpack deploy utilities
Collection of useful utilities for deploying (not only) Webpack apps

## Installation
```
cd $YOUR_PROJECT
npm install --save-dev productboard/webpack-deploy
````

## Configuration
Copy `deploy-config-example.js` and `secrets-example.js` into the root of your
project and fit them to your needs.
Also make sure you have `./node_modules/.bin` in your `$PATH`.

## Use
Build your Webpack project and run `deploy [environment]`.
The script will automatically detect the build hash from `build.log`.

## Commands
- `deploy`
Batch command for quick deployment.
- `deploy-s3`
AWS S3 asset upload of build files.
- `deploy-redis`
Redis deployment of revision index html file.
- `activate-rev`
Redis activation of deployed revision.
- `list-revs`
List of deployed revisions with meta information.
- `rollbar-source-map`
Rollbar source map upload.
- `slack-notify`
Slack channel notifier.
- `git-deploy-tag`
Git tag creation and push to remote.

## Other

### Why Bash with Gulp?
Gulp is great for building, Bash for running tasks.

### NPM >= 5.2.0 required
To find gulp binary also in mono-repos, `npx` is used. `npx` is included with npm from version 5.2.0.

## TODO
- reupload/rewrite source map upload to fix activation of feature branches
- build sample app in monolithic repo
- forbid rev redeploy; force with --force
- add example ala https://github.com/FormidableLabs/webpack-stats-plugin
- list deployed feature branches
- init: config copy
- github PR deploy notification: https://developer.github.com/changes/2014-01-09-preview-the-new-deployments-api/
- rollbar deploy notification: https://rollbar.com/docs/deploys_bash/
- optional deploy message (for slack)
- list commits in slack message
- provide reference backend code snippet
- notification center updates
- friendlier error messages "Did you forget to ...?"
- abstract slack notifs into utils
- disallow activation of feature branches?
- get rid of the callback hell
- deploy tags don't work well with feature branches, they keep overwriting
- integrate new deploy info command

## License
MIT
npm package: @productdevbook/nuxt-build-size
Description: Nuxt module to measure build size
Author: Mehmet - productdevbook hi@productdevbook.com
Latest version: 0.0.4

# Nuxt Typescript Bundle Template

![Nuxt Typescript Bundle Template](https://github.com/productdevbookcom/nuxt-bundle-template/blob/main/.github/assets/nuxt-bundle-template.png?raw=true)

This is a template for creating a Typescript bundle. It is based on the [Typescript](https://www.typescriptlang.org/) compiler with the [Vite](https://vitejs.dev/) bundler.

## Features

- [x] [Nuxt](https://nuxtjs.org/)
- [x] [Typescript](https://www.typescriptlang.org/)
- [x] [Vite](https://vitejs.dev/)
- [x] [Vue](https://vuejs.org/)
- [x] [Vue Macros](https://github.com/sxzz/unplugin-vue-macros)
- [x] [ESLint](https://eslint.org/) with [Antfu's ESLint Config](https://github.com/antfu/eslint-config)
- [x] [Bumpp](https://github.com/antfu/bumpp) github changelog generator
- [x] [Vitest](https://vitest.dev/)
- [x] [Pnpm](https://pnpm.io/)
- [x] [GitHub Actions]()
- [x] [NPM Local Registry]()
- [x] [Renovate]()

## Usage

- To use this template, click the "Use this template" button above.
- Clone the repository to your local machine.
- Run `pnpm install` to install the dependencies.
- Run `pnpm dev` to start the development server.
- Run `pnpm dev:build` nuxt build playground nuxt app.
- Run `pnpm dev:prepare` nuxt build playground nuxt app prepare.
- Run `pnpm build` to build the bundle.
- Run `dev:prepare` to build the bundle in watch mode.
- Run `pnpm start` to start the bundle.
- Run `pnpm lint` to lint the code. (You can also run `pnpm lint:fix` to fix the linting errors.)
- Run `pnpm test` to run the tests. (You can also run `pnpm test:watch` to run the tests in watch mode.)
- Run `pnpm release` to bump the version. Terminal will ask you to select the version type. And then it will automatically commit and push the changes. GitHub Actions will automatically publish git tags. NPM local registry will automatically publish the package.

## Configuration

### Renovate

[Setup Github App](https://github.com/apps/renovate) for Renovate.

## Sponsors

<p align="center">
  <a href="https://cdn.jsdelivr.net/gh/oku-ui/static/sponsors/sponsors.svg">
    <img alt="sponsors" src='https://cdn.jsdelivr.net/gh/oku-ui/static/sponsors/sponsors.svg'/>
  </a>
</p>

## License

This project is licensed under the [MIT License](LICENSE).