open-index/open-npm huggingface dataset:
npm package: @julianmemberstack/webflow-code-components-docs
Description: Documentation and Claude Code context for Webflow Code Components development
Author: Julian Galluzzo
Latest version: 1.0.0

# Webflow Code Components Documentation

📚 Complete documentation and Claude Code context for developing Webflow Code Components with React and TypeScript.

## What This Package Does

When you install this package, it automatically adds:

1. **`WEBFLOW_CODE_COMPONENTS_GUIDE.md`** - A comprehensive guide covering:
   - Setting up a Webflow code components project
   - Creating and defining components
   - Working with props and variants
   - Deploying to Webflow
   - Best practices and troubleshooting

2. **`.claude.md` context** - Adds Webflow-specific context to your Claude Code setup (non-destructive merge if file exists)

## Installation

```bash
npm install @julianmemberstack/webflow-code-components-docs --save-dev
```

That's it! The documentation files will be automatically added to your project root.

## What Gets Installed

### WEBFLOW_CODE_COMPONENTS_GUIDE.md
A complete step-by-step guide for building Webflow code components, including:
- Prerequisites and setup
- Creating React components
- Webflow component definitions
- Supported prop types
- Deployment workflow
- Troubleshooting tips

### .claude.md Updates
If you're using Claude Code, this package intelligently updates your `.claude.md` file with Webflow-specific context:
- **If `.claude.md` exists**: Appends Webflow context (checks for duplicates)
- **If `.claude.md` doesn't exist**: Creates it with Webflow context
- **Non-destructive**: Preserves all existing content

## Usage

After installation, you can:

1. Open `WEBFLOW_CODE_COMPONENTS_GUIDE.md` for the complete guide
2. If using Claude Code, it will automatically have context about your Webflow project
3. Follow the guide to create and deploy your code components

## Supported Prop Types

- Text
- Rich Text
- Image
- Link
- Variant
- Visibility

## Requirements

- Node.js 20+
- npm 10+
- Webflow account (Freelancer, Core, Growth, Agency, or Enterprise plan)

## Resources

- [Webflow Code Components Documentation](https://developers.webflow.com/code-components)
- [Component Architecture](https://developers.webflow.com/code-components/introduction/architecture)
- [Webflow CLI Reference](https://developers.webflow.com/code-components/reference/cli)

## License

MIT

## Author

Julian Galluzzo
npm package: @julianmemberstack/webflow-code-components-helper
Description: Documentation and Claude Code context for Webflow Code Components development
Author: Julian Galluzzo
Latest version: 1.0.0

# Webflow Code Components Helper

📚 Complete documentation and Claude Code context for developing Webflow Code Components with React and TypeScript.

## What This Package Does

When you install this package, it automatically adds:

1. **`WEBFLOW_CODE_COMPONENTS_GUIDE.md`** - A comprehensive guide covering:
   - Setting up a Webflow code components project
   - Creating and defining components
   - Working with props and variants
   - Deploying to Webflow
   - Best practices and troubleshooting

2. **`.claude.md` context** - Adds Webflow-specific context to your Claude Code setup (non-destructive merge if file exists)

## Installation

```bash
npm install @julianmemberstack/webflow-code-components-helper --save-dev
```

That's it! The documentation files will be automatically added to your project root.

## What Gets Installed

### WEBFLOW_CODE_COMPONENTS_GUIDE.md
A complete step-by-step guide for building Webflow code components, including:
- Prerequisites and setup
- Creating React components
- Webflow component definitions
- Supported prop types
- Deployment workflow
- Troubleshooting tips

### .claude.md Updates
If you're using Claude Code, this package intelligently updates your `.claude.md` file with Webflow-specific context:
- **If `.claude.md` exists**: Appends Webflow context (checks for duplicates)
- **If `.claude.md` doesn't exist**: Creates it with Webflow context
- **Non-destructive**: Preserves all existing content

## Usage

After installation, you can:

1. Open `WEBFLOW_CODE_COMPONENTS_GUIDE.md` for the complete guide
2. If using Claude Code, it will automatically have context about your Webflow project
3. Follow the guide to create and deploy your code components

## Supported Prop Types

- Text
- Rich Text
- Image
- Link
- Variant
- Visibility

## Requirements

- Node.js 20+
- npm 10+
- Webflow account (Freelancer, Core, Growth, Agency, or Enterprise plan)

## Resources

- [Webflow Code Components Documentation](https://developers.webflow.com/code-components)
- [Component Architecture](https://developers.webflow.com/code-components/introduction/architecture)
- [Webflow CLI Reference](https://developers.webflow.com/code-components/reference/cli)

## License

MIT

## Author

Julian Galluzzo
npm package: @julianmx/react-native-google-cast-plugin-updates
Description: Config plugin to auto configure Google Cast on prebuild
Latest version: 8.0.5

# config-plugins/react-native-google-cast

Config plugin to auto-configure `react-native-google-cast` when the native code is generated (`npx expo prebuild`).

## Versioning

Ensure you use versions that work together!

| `expo` | `react-native-google-cast` | `@config-plugins/react-native-google-cast` |
| ------ | -------------------------- | ------------------------------------------ |
| 51.0.0 | 4.8.0                      | 8.0.0                                      |
| 50.0.0 | 4.6.2                      | 7.0.0                                      |
| 49.0.0 | 4.6.2                      | 6.0.0                                      |

## Expo installation

> This package cannot be used in the "Expo Go" app because [it requires custom native code](https://docs.expo.io/workflow/customizing/).

First install the package with yarn, npm, or [`npx expo install`](https://docs.expo.io/workflow/expo-cli/#expo-install).

```sh
npx expo install react-native-google-cast @config-plugins/react-native-google-cast
```

After installing this npm package, add the [config plugin](https://docs.expo.io/guides/config-plugins/) to the [`plugins`](https://docs.expo.io/versions/latest/config/app/#plugins) array of your `app.json` or `app.config.js`:

```json
{
  "plugins": ["@config-plugins/react-native-google-cast"]
}
```

Next, rebuild your app as described in the ["Adding custom native code"](https://docs.expo.io/workflow/customizing/) guide.

## API

The plugin provides props for extra customization. Every time you change the props or plugins, you'll need to rebuild (and `prebuild`) the native app. If no extra properties are added, defaults will be used.

- `iosReceiverAppId` (_string_): unknown. Default `CC1AD845`
- `iosStartDiscoveryAfterFirstTapOnCastButton` (_boolean_) Default `true`
- `iosPhysicalVolumeButtonsWillControlDeviceVolume` (\_boolean) Default `false`
- `androidReceiverAppId` (_string_): unknown.
- `androidPlayServicesCastFrameworkVersion` (_string_): Version for the gradle package. Default `+`

#### Example

```json
{
  "plugins": [
    [
      "@config-plugins/react-native-google-cast",
      {
        "iosReceiverAppId": "...",
        "iosStartDiscoveryAfterFirstTapOnCastButton": "...",
        "iosPhysicalVolumeButtonsWillControlDeviceVolume": "...",
        "androidReceiverAppId": "...",
        "androidPlayServicesCastFrameworkVersion": "..."
      }
    ]
  ]
}
```
npm package: @julianobrasil/timemask
Description: @angular time mask for input controls
Latest version: 1.1.2

[GitHub](https://github.com/julianobrasil/lib-time-mask) | [Stackblitz demo](https://stackblitz.com/edit/angular-timemask-demo)

# Important Note

This directive was built just for personal use (I used it mainly to try out a new `@angular/cli`
feature: `ng generate library`).

By 'personal' I mean there isn't any unit tests. So if you decide to use it, it's at your own risk.
Also, if you would like to contribute, go to [github repo](https://github.com/julianobrasil/lib-time-mask) and submit a PR.

If you want more info on how to build an angular library with `@angular/cli`, take a look at
[this great article](https://medium.com/@tomsu/how-to-build-a-library-for-angular-apps-4f9b38b0ed11).

# Input Time Mask

This is an `@angular` directive to turn a text input into a simple time input. The improvement of
this directive over the default `<input type="time">` is the fact that the input will have the same
looking accross browsers. There's no graphical interface: this is just a directive to impose a time
mask (HH:mm) on a regular html `<input>`.

## Getting Started

You can see a [demo at stackblitz](https://stackblitz.com/edit/angular-timemask-demo).

`npm i @julianobrasil/timemask --save`

In the `@NgModule` where it will be used (usually `app.module.ts` for an application wide
installation):

```ts
  import {JpTimeMaskModule} from '@julianobrasil/timemask';
  
  ...

  imports: [...,JpTimeMaskModule,...]
```

Currently it works with `Moment.js` only and you can use it with template-driven or reactive forms
like this:

```html
<input jpTimeMask [formControl]="inputCtrl">

<input jpTimeMask [(ngModel)]="value">
```

```ts
inputCtrl = new FormControl(moment());
value = moment();
```

## Value changes strategies

There are two value change strategies: eager and lazy. The lazy is the default one and it means
that the Control will register any change in its value just when the input loose focus or the user
press `ENTER`. In the eager mode, the input register changes as the user types in a new time. The
change strategy can be switched by the `jpTimeMaskChangeLazy` attribute:

```html
<!-- This sets the change strategy to eager --> 
<input jpTimeMask [jpTimeMaskChangeLazy]="false" [formControl]="inputCtrl">
```

## UTC

If you want the component to work internally with UTC time, just set the `useUtc` input to ' true'
(the default value is `false`):

```html
<!-- This sets the underlying moment object to work with Utc --> 
<input jpTimeMask [useUtc]="true" [formControl]="inputCtrl">
```

## Known Caveats

This directive doesn't prevent/support the use of `value` attribute on the input.
npm package: @julianoczkowski/modus-nextjs-demos
Description: Demo pages for Modus Web Components Next.js integration
Author: Juliano Czkowski
Latest version: 1.0.7

# Modus Next.js Demos

Demo pages for Modus Web Components Next.js integration. This package automatically provides demo pages for all Modus Web Components in your Next.js application.

## Installation

```bash
npm install @julianoczkowski/modus-nextjs-demos
```

The demo pages will be automatically copied to your `app/demos/` directory during installation.

## What's Included

This package includes demo pages for:

- **Forms**: Button, Checkbox, Date, Number Input, Radio, Select, Switch, Text Input, Textarea, Time Input
- **Layout**: Accordion, Card, Divider, Toolbar, Utility Panel
- **Navigation**: Breadcrumbs, Dropdown Menu, Menu, Navbar, Pagination, Side Navigation, Stepper, Tabs
- **Display**: Avatar, Badge, Chip, Icon, Skeleton
- **Feedback**: Alert, Input Feedback, Input Label, Loader, Progress, Toast, Tooltip
- **Overlays**: Modal
- **Data**: Table
- **Appearance**: Theme Switcher

## Usage

After installation, the demo pages are available at:

- `/demos/components-demo` - Overview of all available components
- `/demos/button-demo` - Button component demos
- `/demos/modal-demo` - Modal component demos
- `/demos/table-demo` - Table component demos
- And many more...

## Component Imports

The demo pages use the standard Next.js path aliases:

```tsx
import ModusButton from "@/app/components/ModusButton";
import DemoPage from "@/app/components/DemoPage";
import DemoExample from "@/app/components/DemoExample";
```

## Requirements

- Next.js 15+
- React 19+
- Modus Web Components React package

## How It Works

1. **Installation**: When you install this package, the postinstall script automatically runs
2. **Detection**: The script detects your Next.js app structure
3. **Copy**: All demo pages are copied to `app/demos/` directory
4. **Ready**: Demo pages are immediately available at `/demos/*` routes

## Manual Setup

If automatic installation doesn't work, you can manually copy the demos:

1. Copy the `demos/` folder from `node_modules/@julianoczkowski/modus-nextjs-demos/`
2. Paste it into your `app/` directory
3. Rename it to `demos` if needed

## Troubleshooting

### Demos Not Appearing

If the demo pages don't appear after installation:

1. Check that you have an `app/` directory in your Next.js project
2. Verify the installation completed successfully
3. Look for any error messages during `npm install`
4. Try running the postinstall script manually: `node node_modules/@julianoczkowski/modus-nextjs-demos/scripts/copy-demos.js`

### Import Errors

If you see import errors in the demo pages:

1. Ensure you have the required Modus Web Components installed:
   ```bash
   npm install @trimble-oss/moduswebcomponents-react
   ```
2. Check that your Next.js path aliases are configured correctly
3. Verify your `app/components/` directory contains the required components

## Contributing

This package is part of the Modus Next.js integration. For issues or contributions, please visit the [GitHub repository](https://github.com/julianoczkowski/modus-nextjs-demos).

## License

MIT
npm package: @julianpoy/prisma-cursorstream
Description: Prisma Stream Client Extension (Cursor-based Implementation)
Author: Hasan Arous
Latest version: 0.4.2

# prisma-cursorstream

Prisma Stream Client Extension (Cursor-based Implementation)

## Features

- Clean API (`for await`)
- Fully typed <img src="https://www.typescriptlang.org/favicon-32x32.png" height="16" width="16" alt="" />
- Minimal implementation. The [source](https://github.com/etabits/prisma-cursorstream/blob/main/src/index.ts) itself is well below 100 LOCs.

## Installation & Activation

```sh
npm install prisma-cursorstream
```

Then, extend your prisma client like this:

```js
import { PrismaClient } from "@prisma/client";
import cursorStream from "prisma-cursorstream";

const db = new PrismaClient().$extends(cursorStream);
```

<details>
<summary>Using CommonJS `require`?</summary>

### CommonJS `require`

```js
const cursorStream = require("prisma-cursorstream").default;

const db = new PrismaClient().$extends(cursorStream);
```

Refer to [#1](https://github.com/etabits/prisma-cursorstream/issues/1).

</details>

## Usage

```js
const stream = db.post.cursorStream({
  // Your usual findMany args
  select: {
    id: true,
    title: true,
  },
  where: {
    published: true,
  },
});
for await (const post of stream) {
  console.log(post); // {id: 1, title: 'Hello!'}
}
```

## Advanced API

The following options (passed as a second argument) provide additional controls over the streaming process.

- **Batch size**: `batchSize` specifies how many rows are fetched each batch. Defaults to `100`
- **Pre-fill size**: Since the streaming happens asynchronously, it may be useful to fetch more rows well before current batch is completely consumed. `prefill` specifies the internal `highWaterMark` of the `Readable` stream. Defaults to double the batch size (usually `200`).
- **Batch transformation**: Sometimes you may need to pre-process the resulting rows in batches before they are consumed. This is where the `batchTransformer` comes in. If provided, it receives an array of the last fetched batch of rows, can operate on them asynchronously, and then return an array of transformed rows to be consumed instead. Types are properly handled.

```js
const stream = db.post.cursorStream(
  {
    where: {
      published: true,
    },
  },
  {
    batchSize: 42, // batches of 42 posts at a time
    prefill: 69, // prefetch up to 69+ posts
    async batchTransformer(posts) {
      const translations = await translate(posts.map((p) => p.title));
      return posts.map((p, i) => ({
        ...p,
        translatedTitle: translations[i],
      }));
    },
  }
);

for await (const translatedPost of stream) {
  console.log(translatedPost); // {..., translatedTitle: "مرحبا!"}
}
```
npm package: @julians/nunjucks-loader
Description: A nunjucks loader for webpack, supporting both javascript template usage and static compilation through HtmlWebpackPlugin.
Author: Julian Stahnke
Latest version: 2.0.0

# Nunjucks loader for Webpack

Nunjucks loader for webpack, supporting both javascript templating and generating static HTML files through the HtmlWebpackPlugin.

Originally forked from [SudoCat/Nunjucks-Isomorphic-Loader](https://github.com/SudoCat/Nunjucks-Isomorphic-Loader).

## Installation

This loader needs [`nunjucks`](https://www.npmjs.com/package/nunjucks) as a peer dependency. Versions >= 2.5.0 <= 4.0.0 are accepted. If you do not have nunjucks already installed, first run:

Using yarn:

```bash
yarn add nunjucks -D
```

Using npm:

```bash
npm install nunjucks -D
```

If you have nunjucks installed, you can then install the loader.

Using yarn:

```bash
yarn add @julians/nunjucks-loader -D
```

Using npm:

```bash
npm install @julians/nunjucks-loader -D
```

## Usage

Basic usage of this loader with `html-webpack-plugin`

```js
module: {
  rules: [
    {
      test: /\.(njk|nunjucks|html|tpl|tmpl)$/,
      use: [
        {
          loader: '@julians/nunjucks-loader',
          query: {
            root: [path.resolve(__dirname, 'path/to/templates/root')]
          }
        }
      ]
    }
  ]
},

plugins: [
  new HtmlWebpackPlugin({
    customData: { foo: 'bar' },
    filename: 'list.html',
    template: 'path/to/template.nunjucks'
  })
]
```

## Requiring assets in templates

Uses regular Webpack loaders to load the required file, so you have to have them configured in your Webpack config.

```nunjucks
{{ "src/assets/whatever.jpg" | require }}
```

## Options

```js
// include specific templates
includeTemplates: [/.*\.(njk|nunjucks|html|tpl|tmpl)$/],
// enable jinja compatibility
jinjaCompat: true,
// add custom filters
filters: {
  obj_debug: function(variable) {
    return JSON.stringify(variable, null, 2);
  },
},
```

Accessing data from the templates with the above config of `html-webpack-plugin`

`path/to/template.njk` :

```nunjucks
{% set vars = htmlWebpackPlugin.options.customData %}

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>{{ vars.foo }}</title>{# outputs 'bar' #}
  </head>
  <body>
    <header class="header">
    {% block header %}
      <h1 class="header-logo">
        <a href="#">{{ vars.foo }}</a>{# outputs 'bar' #}
      </h1>
    {% endblock %}
    </header>

    {% block content %}
      <section>
        <p>I was generated with html-webpack-plugin and @julians/nunjucks-loader!</p>
      </section>
    {% endblock %}
  </body>
</html>
```
npm package: @julianwebb/discord-logger
Description: Discord Logger
Author: JulianWebb
Latest version: 0.2.2

# Discord Logger

## What is it?
An in-place wrapper for console.log, console.warn, and console.error that sends all the logs to a Discord Webhook if specified as well as basic log formatting. Has no dependencies.

## Should I use it?
This package is mainly for personal use, I don't really intend for others to use it but you can if you want.

## How do I use it?

```
npm install --save @julianwebb/discord-logger
```

```js
require('discord-logger')( "appName", "webhookURL");
console.log("Wrapped log()") // returns: "[HH:mm][appName][LOG] Wrapped log()"
console.warn("Wrapped warn()") // returns: "[HH:mm][appName][WARN] Wrapped warn()"
console.error("Wrapped error()") // returns: "[HH:mm][appName][ERROR] Wrapped error()"
```

| Parameter | Type | Optional | Description |
| --- | --- | --- | --- |
| `appName` | string | **true** | Identifer to use in the logs |
| `webhookURL` | string | **true** | Webhook URL, required if you want to use a webhook |