open-index/open-npm huggingface dataset:
npm package: @shadeup/cli
Description: <p align="center"><a href="https://shadeup.dev" target="_blank" rel="noopener noreferrer"><img width="200" src="https://shadeup.dev/favicon.png" alt="Shadeup logo"></a></p>
Author: AskingQuestions
Latest version: 1.3.0

<p align="center"><a href="https://shadeup.dev" target="_blank" rel="noopener noreferrer"><img width="200" src="https://shadeup.dev/favicon.png" alt="Shadeup logo"></a></p>

<h1 align="center"><a href="https://shadeup.dev">Shadeup CLI</a></h1>

# Shadeup compiler tools

## Installation

```sh
npm install -g @shadeup/cli
```

## Usage

```sh
shadeup --help
```

```sh
CLI tool for compiling shadeup files

Options:
  -V, --version           output the version number
  -v
  -h, --help              display help for command

Commands:
  build [options] <file>  Build file
  watch <file>            Watch a shadeup file and recompile on change
  preview <file>          Live preview of a shadeup file in electron
```

## Example

```ts
// main.shadeup
fn main() {
  draw(shader {
    out.color = (in.uv, 0.5, 1.0);
  });
}
```

```sh
$ shadeup build main.shadeup
```

After running the above command, you should find the following files in the same directory as `main.shadeup`:

- `main.js`
- `main.d.ts`

You can use the above files inside of a vite or webpack project to use the shader in your web application.

```sh
$ npm i shadeup
```

```js
// example.ts
import { makeShadeupInstance } from "./main";

const canvas = document.querySelector<HTMLCanvasElement>("#canvas")!;

(async () => {
  const engine = await makeShadeupInstance(canvas);

  // Optionally enable the UI
  await engine.enableUI();

  // The frame loop will start automatically

  // You can call pub functions on the engine instance
  // engine.files.main.exampleFunction();
})();
```

## Preview mode

```sh
$ shadeup preview main.shadeup
```

This will open an electron window with the shader preview. You can use this to quickly test your shader without having to set up a web project.

![Preview](https://i.imgur.com/PVjn7BA.png)
npm package: @shadeup/unreal
Description: <p align="center"><a href="https://unreal.shadeup.dev" target="_blank" rel="noopener noreferrer"><img width="100" src="https://unreal.shadeup.dev/favicon.png" alt="Shadeup logo"></a></p>
Author: AskingQuestions
Latest version: 1.2.1

<p align="center"><a href="https://unreal.shadeup.dev" target="_blank" rel="noopener noreferrer"><img width="100" src="https://unreal.shadeup.dev/favicon.png" alt="Shadeup logo"></a></p>

<p align="center">
  <a href="https://www.npmjs.com/package/shadeup"><img src="https://img.shields.io/npm/v/shadeup.svg?sanitize=true" alt="Version"></a>
  <a href="https://www.npmjs.com/package/shadeup"><img src="https://img.shields.io/npm/l/shadeup.svg?sanitize=true" alt="License"></a>
</p>

<h1 align="center"><a href="https://unreal.shadeup.dev">Shadeup - Unreal Engine</a></h1>

## More shaders less boilerplate

Shadeup is a CLI-based scaffolding tool for rapidly whipping up shaders in Unreal Engine

---

Shadeup helps with the following:

📜 Compute shaders

⠶ Indirect instancing

↝ Custom Material Nodes

---

## Installation & Usage

```sh
$ npm install shadeup
```

```sh
$ cd MyUnrealProject
$ shadeup # This will start the scaffolding wizard
```

For more information visit [unreal.shadeup.dev](https://unreal.shadeup.dev/docs)
npm package: @shadeweave/sw-image
Description: Image placeholder web component
Author: Matthew Brambilla
Latest version: 0.3.0

# `<sw-image>`

Somewhat overengineered web component to create image placeholders.

## Installation
Via [`npm`](https://www.npmjs.com/package/@shadeweave/sw-image) or download [`sw-image.js`](./sw-image.js) directly for use in your project.

```sh
npm install @shadeweave/sw-image
```

## Usage
Default:
`<sw-image></sw-image>`

Custom size:
`<sw-image width="200" height="200"></sw-image>`

Text inside of image:
`<sw-image text="Lorem ipsum"></sw-image>`

Responsive image:
`<sw-image fluid></sw-image>`

## Options
| Attribute | Default | Description |
|-|-|-|
| `img` | | Output as an `<img>`.  This encodes the SVG as the image's data source. |
| `fluid` | | Create responsive image that scales to the width of their container. |
| `replace` | | Replace the `<sw-image>` element with an image. Output can be SVG or `<img>`. |
| `width` | `100%` | Image width.  Can be a percentage or a unitless pixel value. |
| `height` | `160` | Image height. Can be a percentage  or a unitless pixel value. |
| `bg-color` | `#dadef0` | Color of the background. |
| `text-color` | `#1c2428` | Text color.  Please keep minimum contrast ratios in mind. |
| `font-family` | `system-ui, sans-serif` | Font family |
| `font-size` | `1rem` | Font size |
| `font-weight` | `600` | Font weight |
| `title` | `"Placeholder"` | Title text.  Shown as browser tooltip on hover. First part of `alt` attribute. |
| `text` | `""` | Text to display within the image. Second portion of the `alt` attribute.  |
npm package: @shadext/cli
Description: A CLI tool to generate UI components for your project
Author: thusithawijethunga
Latest version: 1.0.6

# Shadcn-Extension

A CLI (inspired by shadcn-ui) for adding components to your project, making it easier to integrate and manage UI components within your codebase.

## Installation

To get started with the `shadcn-Extension` CLI, ensure you have `npx` installed. This tool allows you to run packages directly from npm without globally installing them.

> ## NOTE
>
> ALL TYPES PACKAGES FOR NOW NEEDS TO BE INSTALLED MANUALLY

## Usage

### Initializing a New Project

Use the `init` command to initialize dependencies for a new project. This command sets up everything you need, including installing necessary dependencies, adding the `cn` utility, configuring `tailwind.config.js`, and setting up CSS variables.

1. **Initialize Dependencies**

   Run the following command to initialize the project:

   ```bash
   npx shadcn-ui init
   ```

2. **Initialize Shadcn-Extension CLI**

   Next, set up your project with the shadcn-extension CLI:

   ```bash
   npx @shadext/cli init
   ```

### Adding Components

Use the `add` command to add components to your project. This command installs the required dependencies and integrates the specified component into your project.

1. **Add a Specific Component**

   To add a specific component, specify the component name:

   ```bash
   npx @shadext/cli add [component]
   ```

   **Example:**

   Adding a `tree-view` component:

   ```bash
   npx @shadext/cli add tree-view
   ```

2. **View Available Components**

   If you want to see a list of all available components, run the `add` command without any arguments:

   ```bash
   npx @shadext/cli add
   ```

   This will display a list of components that you can add to your project.

## Full Documentation

For detailed documentation, including installation guides, component usage, and more, visit the [shadcn-Extension Documentation](https://ui.byheart.lk/docs/installation).

## License

This project is licensed under the [MIT license](https://github.com/thusithawijethunga/ext-shadcn-cliblob/master/packages/cli/LICENSE.md).

## Contributing

Contributions are welcome! If you have suggestions for improvements, please open an issue or submit a pull request on the [GitHub repository](https://github.com/BelkacemYerfa/shadcn-extension).
npm package: @shadng/sng-mcp
Description: MCP server for ShadNG UI and Icons
Latest version: 1.0.2

# ShadNG MCP (`@shadng/sng-mcp`)

MCP server for ShadNG:

- `@shadng/sng-ui`
- `@shadng/sng-icons`

This server runs from a bundled snapshot file (`data/snapshot.json`), so tool responses are stable and fast at runtime.

## Gallery

https://shadng.js.org

![npm](https://img.shields.io/npm/v/%40shadng%2Fsng-mcp)
![MCP](https://img.shields.io/badge/MCP-Server-111827)
![Node](https://img.shields.io/badge/Node-20%2B-339933)
![License](https://img.shields.io/badge/License-MIT-97CA00)

## Install

```bash
npm i -D @shadng/sng-mcp
```

## Build and Run

```bash
npm install
npm run build
npm run start
```

## Supported Tools

- `list_components`
- `get_component_docs`
- `get_component_examples`
- `get_install_command`
- `get_dependency_map`
- `get_icon_catalog`
- `get_dashboard_context`

## MCP Client Config

Recommended package mode:

- `command`: `npx`
- `args`: `["-y", "@shadng/sng-mcp"]`

### Antigravity

```yaml
mcp:
  servers:
    sng:
      command: npx
      args:
        - -y
        - "@shadng/sng-mcp"
```

### Claude Code

```bash
claude mcp add sng npx -y @shadng/sng-mcp
```

### Cline

```json
{
  "mcpServers": {
    "sng": {
      "command": "npx",
      "args": ["-y", "@shadng/sng-mcp"]
    }
  }
}
```

### Codex

```bash
codex mcp add sng -- npx -y @shadng/sng-mcp
```

### Copilot CLI

```bash
copilot mcp add sng -- npx -y @shadng/sng-mcp
```

### Copilot / VS Code

Use command line:

```bash
copilot mcp add sng -- npx -y @shadng/sng-mcp
```

Or if your editor asks for raw JSON config, use the same `mcpServers` shape as Cline/Cursor.

### Cursor

```json
{
  "mcpServers": {
    "sng": {
      "command": "npx",
      "args": ["-y", "@shadng/sng-mcp"]
    }
  }
}
```

### Gemini CLI

```bash
gemini mcp add sng -- npx -y @shadng/sng-mcp
```

### Gemini Code Assist

Add an MCP server in Gemini Code Assist settings with:

- `command`: `npx`
- `args`: `-y @shadng/sng-mcp`

### JetBrains AI Assistant & Junie

Add MCP server in IDE MCP settings with:

- `command`: `npx`
- `args`: `-y @shadng/sng-mcp`

### Visual Studio

Add MCP server in Visual Studio MCP settings with:

- `command`: `npx`
- `args`: `-y @shadng/sng-mcp`

### Windsurf

```json
{
  "mcpServers": {
    "sng": {
      "command": "npx",
      "args": ["-y", "@shadng/sng-mcp"]
    }
  }
}
```

## Test

```bash
npm run test
npm run smoke
```

## Notes

- Component inputs accept aliases (`button`, `sng-button`, `SngButton`).
- If a requested UI part is not in `sng-ui`, guidance returns Angular-focused custom build advice using ShadNG patterns.
- `@shadng/sng-icons` is preferred, not required. Inline SVG fallback guidance is returned when needed.
npm package: @shadng/sng-ui
Description: Angular UI components inspired by shadcn/ui design patterns.
Latest version: 1.0.6

# ShadNG UI (`@shadng/sng-ui`)

Angular UI component library inspired by shadcn/ui design patterns.

## Gallery
https://shadng.js.org

[![npm](https://img.shields.io/npm/v/%40shadng%2Fsng-ui)](https://www.npmjs.com/package/@shadng/sng-ui)
[![Angular](https://img.shields.io/badge/Angular-21-dd0031)](https://angular.dev)
[![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS-4-38bdf8)](https://tailwindcss.com)
[![License](https://img.shields.io/badge/License-MIT-green)](LICENSE)

## CLI (Copy-Paste Model)

```bash
npx @shadng/sng-ui init
npx @shadng/sng-ui add button
npx @shadng/sng-ui add --all
npx @shadng/sng-ui add table menu
```

The CLI copies editable component source into your app.

## Installation

```bash
npm install @shadng/sng-ui
```

Peer dependencies:

```json
{
  "@angular/common": "^21.0.0",
  "@angular/core": "^21.0.0",
  "@angular/platform-browser": "^21.0.0",
  "shiki": "^3.0.0"
}
```

`shiki` is optional and only needed for `code-block` / `preview-box`.

## Usage

```ts
import { Component } from '@angular/core';
import { SngButton } from '@shadng/sng-ui';

@Component({
  selector: 'app-example',
  imports: [SngButton],
  template: `
    <sng-button class="bg-primary text-primary-foreground shadow-xs hover:bg-primary/90">
      Click me
    </sng-button>
  `,
})
export class ExampleComponent {}
```

## Theming

Theme tokens are defined in `src/lib/styles/sng-themes.css`.

## Package Checks

```bash
npm run test:cli
npm run pack:check
```

## License

MIT
npm package: @shadoll/poppy
Description: Poppy for amoCrm widgets
Author: sHa
Latest version: 1.0.6

## Status

![npm (scoped)](https://img.shields.io/npm/v/@shadoll/poppy)
![npm](https://img.shields.io/npm/dm/@shadoll/poppy)
![NPM](https://img.shields.io/npm/l/@shadoll/poppy)

# sscript
Poppy for amoCrm widgets

# Install

with npm

`npm install @shadoll/poppy`

with yarn

`yarn add @shadoll/poppy`


## use

```js
import {Poppy} from '@shadoll/poppy';

new Poppy().init();
```
npm package: @shadoll/scrawl
Description: Useful Shell scripts for projects
Author: sHa
Latest version: 1.0.33

## Status

![npm (scoped)](https://img.shields.io/npm/v/@shadoll/scrawl)
![npm](https://img.shields.io/npm/dm/@shadoll/scrawl)
![NPM](https://img.shields.io/npm/l/@shadoll/scrawl)

# sscript
Useful Shell scripts for projects

# Install

with npm

`npm install @shadoll/scrawl`

with yarn

`yarn add @shadoll/scrawl`

# Run

shell

`./node_modules/.bin/{script_name}`

npm

`npm run {script_name}`

yarn 

`yarn {script_name}`

# Scripts

## 📁 git (2)
subfolder: `/git`

### storage_push
Upload all changes in storage folder into git repository

### submodule_pull
Update git submodules

## 📁 File system (1)
subfolder: `/fs`

### fix_permissions

## 📁 Docker (3)
subfolder: `/docker`

### up
run docker-compose containers in demonise

`--build` - for (re)build containers

### down
stop docker-compose containers

## prune
Cleanup Docker

## 📁 app (6)
execute command in 'app' container

subfolder: `/app`

### php
### npm
### yarn
### git
### composer
### artisan

## 📁 db (3)
execute command in 'db' container

subfolder: `/db`

### mysql
### dump
### restore
npm package: @shadoll/viola
Description: Patch Element component chalk theme.
Author: yi.shyang@ele.me
Latest version: 2.20.0

# @shadoll/viola
> element component chalk theme.


## Installation
```shell
npm i @shadoll/viola -S
```

## Usage

отличие от обычного пакета

- объявляете переменные верхнего класса
```scss
// sass | scss

// mix
$viola-core: 'fk-tomato'; // без точки
$namespace: #{$viola-core+' .el'};
$namespace2: #{$viola-core+'.el'};

// optional
$--color-primary: violet;
```
обратить внимание на переменную `$core-class` - название класса (без точки)
`$namespace` и `$namespace2` - служебные (нужны для sass @mixin)

- после переменных импортируете пакет на верхнем уровне
```scss
// sass | scss
@import "~@shadoll/viola/src";
```

---

если не будете использовать эти особенности - не рекомендую использовать этот 
пакет взамен обычного `element-theme-chalk` , так как тут он немного "раздувается".

ниже документация от родного пакета `element-theme-chalk`

Use Sass import
```css
@import '@shadoll/viola';
```

Or Use webpack
```javascript
import '@shadoll/viola';
```

Or
```html
<link rel="stylesheet" href="path/to/node_modules/@shadoll/viola/lib/index.css">
```

##  Import on demand
```javascript
import '@shadoll/viola/lib/input.css';
import '@shadoll/viola/lib/select.css';

// ...
```
npm package: @shadom.co/mcp
Description: MCP server for shadom.co — WHOIS lookups, domain monitoring, and alerts via AI assistants
Latest version: 1.0.0

# shadom.co MCP Server

Model Context Protocol server for shadom.co — enables AI assistants to manage domains, run WHOIS lookups, and monitor alerts.

## Quick Install

### Claude Code (one command)

```bash
claude mcp add shadom -e SHADOM_API_KEY=sk_your_key_here -- npx -y @shadom.co/mcp
```

### Claude Desktop

Add to your Claude Desktop config (`~/Library/Application Support/Claude/claude_desktop_config.json` on macOS):

```json
{
  "mcpServers": {
    "shadom": {
      "command": "npx",
      "args": ["-y", "@shadom.co/mcp"],
      "env": {
        "SHADOM_API_KEY": "sk_your_key_here"
      }
    }
  }
}
```

### Get your API key

Generate one from **Settings > API Key** in your [shadom.co dashboard](https://shadom.co/dashboard/settings).

## Environment Variables

| Variable | Required | Default | Description |
|---|---|---|---|
| `SHADOM_API_KEY` | Yes | — | API key from shadom.co settings |
| `SHADOM_BASE_URL` | No | `https://shadom.co` | API base URL |

## Available Tools

| Tool | Description |
|---|---|
| `whois_lookup` | WHOIS/RDAP lookup for any domain |
| `check_availability` | Check if a domain is available for registration |
| `list_domains` | List all monitored domains |
| `add_domain` | Add a domain to monitoring |
| `remove_domain` | Remove a monitored domain |
| `domain_details` | Get domain details + latest WHOIS snapshot |
| `list_alerts` | List alerts with optional type/unread filters |
| `mark_alerts_read` | Mark all alerts as read |

## API Reference

For full HTTP API documentation, see **[API.md](../API.md)**.

## Development

Run without building:

```bash
SHADOM_API_KEY=sk_... SHADOM_BASE_URL=http://localhost:3000 npm run dev
```
npm package: @shadom/cluster
Description: Select(copy) & rebuild data with node path & modifiers
Author: chengxiao
Latest version: 1.1.1

# Cluster

Also called "data cluster", it makes an easy way for fetching sub data from the origin data object by a "path" expression
And also, Cluster provides "defaultValue, validator, translator" to make what you want is what you expected.

## Installation

```bash
npm install @shadom/cluster
```
npm package: @shadow-bridge/core
Description: ![Version](https://img.shields.io/npm/v/@shadow-bridge/core) ![Downloads](https://img.shields.io/npm/dw/@shadow-bridge/core) ![Bundle size](https://img.shields.io/bundlephobia/minzip/@shadow-bridge/core)
Author: Guo Yunhe
Latest version: 0.2.0

# @shadow-bridge/core

![Version](https://img.shields.io/npm/v/@shadow-bridge/core)
![Downloads](https://img.shields.io/npm/dw/@shadow-bridge/core)
![Bundle size](https://img.shields.io/bundlephobia/minzip/@shadow-bridge/core)

Provide internal classes used by different implementations:

- [@shadow-bridge/react](./react/README.md)
- [@shadow-bridge/preact](./preact/README.md)
- [@shadow-bridge/vue](./vue/README.md)
npm package: @shadow-library/ui
Description: Shared React component library for the Shadow Apps ecosystem, built on Mantine with Storybook stories, and full TypeScript support
Author: Leander Paul
Latest version: 0.1.3

# @shadow-library/ui

Shared UI components, layout primitives, and utilities for all Shadow Library apps.

## Installation

```sh
# npm
npm install @shadow-library/ui

# bun
bun add @shadow-library/ui
```

### Peer Dependencies

```sh
# npm
npm install react react-dom @mantine/core @mantine/hooks @tanstack/react-router lucide-react

# bun
bun add react react-dom @mantine/core @mantine/hooks @tanstack/react-router lucide-react
```

## Setup

Wrap your app with Mantine's `MantineProvider` using the exported `shadowTheme`:

```tsx
import { MantineProvider } from '@mantine/core';
import { shadowTheme } from '@shadow-library/ui';

function App() {
  return <MantineProvider theme={shadowTheme}>{/* your app */}</MantineProvider>;
}
```

## What's Included

### Layout

A full application shell with a collapsible sidebar, top navigation bar, and optional footer.

```tsx
import { AppLayout } from '@shadow-library/ui';
import { LayoutDashboard } from 'lucide-react';

const navItems = [{ label: 'Dashboard', path: '/', icon: LayoutDashboard }];

function Shell({ children }) {
  return (
    <AppLayout appName='My App' navItems={navItems} user={{ name: 'Jane Doe', email: 'jane@example.com' }}>
      {children}
    </AppLayout>
  );
}
```

### API Client

A chainable HTTP client with pre/post hooks and typed errors.

```ts
import { APIRequest, ApiError } from '@shadow-library/ui';

const data = await APIRequest.get('/users')
  .query({ limit: 20 })
  .header('X-Tenant', 'acme')
  .then((res) => res.json());
```

### OpenAPI Code Generation

Generate typed API clients from an OpenAPI spec URL.

```ts
import { generateApi } from '@shadow-library/ui';

await generateApi('https://api.example.com/openapi.json');
```

### Hooks

| Hook              | Description                                          |
| ----------------- | ---------------------------------------------------- |
| `useSearchParams` | Read and update URL query params via TanStack Router |

## Full Documentation

Component props, usage examples, and visual previews are available in Storybook.

```sh
npm run storybook
```

## License

MIT
npm package: @shadow-panda/preset
Description: The preset for PandaCSS that contains the theme for Shadow Panda
Latest version: 0.7.1

# @shadow-panda/preset

`Shadow Panda` is created based on [shadcn/ui](https://ui.shadcn.com/), tailored specifically for developers utilizing [Panda CSS](https://panda-css.com/) as an alternative to Tailwind CSS.

This package is a **preset** for [Panda CSS](https://panda-css.com/) that allows you to use the same components as [shadcn/ui](https://ui.shadcn.com/), but with [Panda CSS](https://panda-css.com/).

## Documentation

Visit our documentation: [https://shadow-panda.dev/](https://shadow-panda.dev/)

## Install

Install the preset and a utility package (used by most components) by running:

```bash
npm i -D @shadow-panda/preset
```

```bash
npm i @shadow-panda/style-context
```

Add the preset to your `panda.config.ts`

```ts
import { defineConfig } from '@pandacss/dev'

export default defineConfig({
  // Required: Add the preset to your config.
  presets: ['@shadow-panda/preset'],

  // Optional: Enable CSS reset
  preflight: true,

  // Use React
  jsxFramework: 'react',

  // Optional: Emit artifacts to `node_modules` as a package.
  // The copy-paste component examples use `@shadow-panda/styled-system` as the import path of the generated files.
  // If you choose not to use this option, you should rewrite your component imports as needed.
  // @see https://panda-css.com/docs/references/config#emitpackage
  emitPackage: true,
  outdir: '@shadow-panda/styled-system',

  // Other configurations and overrides...
})
```

Compile Panda CSS, copy [components](https://shadow-panda.dev/docs/overview/supported-components) and use it!

## Acknowledgement

A huge thanks to the creators of [shadcn/ui](https://ui.shadcn.com/) for providing an excellent set of components and documentation.  
Most of the components and documentation were taken from [shadcn/ui](https://ui.shadcn.com/).

Also, a huge thanks to:

- [Panda CSS](https://panda-css.com/)
- [Radix UI](https://radix-ui.com/)