open-index/open-npm huggingface dataset:
npm package: @loopcod/ui
Description: CLI for Loopcod UI - SaaS-focused React components
Author: Loopcod
Latest version: 0.1.1

# @loopcod/ui

> **SaaS-focused UI components for React.**

The CLI tool for installing production-ready SaaS components in your Next.js applications.

## 🚀 Quick Start

```bash
npx @loopcod/ui@latest init
```

## ✨ Features

- **🧩 UI Primitives** - Button, Card, Input, and more
- **🔐 Auth Components** - Login forms, signup, password reset
- **📊 Dashboard** - Shell, stats cards, data tables
- **💳 Billing** - Pricing tables, checkout forms
- **🎨 Marketing** - Hero sections, features, testimonials

## 📦 Installation

### Initialize a new project

```bash
npx @loopcod/ui@latest init
```

### Add components

```bash
# Add specific components
npx @loopcod/ui@latest add button login-form

# Add all components
npx @loopcod/ui@latest add --all

# Interactive picker
npx @loopcod/ui@latest add
```

### Use templates

```bash
# SaaS starter template
npx @loopcod/ui@latest init --template saas-starter

# Admin dashboard
npx @loopcod/ui@latest init --template dashboard

# Landing page
npx @loopcod/ui@latest init --template landing-page
```

## 🛠️ CLI Commands

| Command | Description |
|---------|-------------|
| `init` | Initialize your project |
| `add [components]` | Add components to your project |
| `diff` | Check for component updates |
| `update [components]` | Update components to latest version |
| `info <component>` | Show component information |

## 📚 Documentation

Visit [https://ui.loopcod.in](https://ui.loopcod.in) for full documentation.

## 🎨 Example

```tsx
import { Button } from "@/components/ui/button"
import { LoginForm } from "@/components/auth/login-form"

export default function Page() {
  return (
    <div>
      <LoginForm />
    </div>
  )
}
```

## 🤝 Contributing

Contributions are welcome! See [CONTRIBUTING.md](https://github.com/loopcod/ui/blob/main/CONTRIBUTING.md).

## 📝 License

MIT © [Loopcod](https://loopcod.in)
npm package: @looped-ts/cli
Description: CLI utilities for the Looped Starter Kit
Author: Craig Morris @morrislaptop
Latest version: 0.0.1-alpha.6

@looped-ts/cli
==============

CLI utilities for the Looped Starter Kit

[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
[![Version](https://img.shields.io/npm/v/@looped-ts/cli.svg)](https://npmjs.org/package/@looped-ts/cli)
[![Downloads/week](https://img.shields.io/npm/dw/@looped-ts/cli.svg)](https://npmjs.org/package/@looped-ts/cli)
[![License](https://img.shields.io/npm/l/@looped-ts/cli.svg)](https://github.com/morrislaptop/looped-ts/blob/master/package.json)

<!-- toc -->
* [Usage](#usage)
* [Commands](#commands)
<!-- tocstop -->
# Usage
<!-- usage -->
```sh-session
$ npm install -g @looped-ts/cli
$ looped COMMAND
running command...
$ looped (-v|--version|version)
@looped-ts/cli/0.0.1-alpha.6 darwin-x64 node-v12.5.0
$ looped --help [COMMAND]
USAGE
  $ looped COMMAND
...
```
<!-- usagestop -->
# Commands
<!-- commands -->
* [`looped help [COMMAND]`](#looped-help-command)
* [`looped key:generate`](#looped-keygenerate)
* [`looped make:controller NAME`](#looped-makecontroller-name)
* [`looped make:middleware NAME`](#looped-makemiddleware-name)
* [`looped make:provider NAME`](#looped-makeprovider-name)

## `looped help [COMMAND]`

display help for looped

```
USAGE
  $ looped help [COMMAND]

ARGUMENTS
  COMMAND  command to show help for

OPTIONS
  --all  see all commands in CLI
```

_See code: [@oclif/plugin-help](https://github.com/oclif/plugin-help/blob/v2.2.0/src/commands/help.ts)_

## `looped key:generate`

generate a key and write to your .env file

```
USAGE
  $ looped key:generate

OPTIONS
  --help  show CLI help
  --show
```

_See code: [src/commands/key/generate.ts](https://github.com/morrislaptop/looped-ts/blob/v0.0.1-alpha.6/src/commands/key/generate.ts)_

## `looped make:controller NAME`

```
USAGE
  $ looped make:controller NAME

OPTIONS
  -h, --help     show CLI help
  --model=model
  --resource
```

_See code: [src/commands/make/controller.ts](https://github.com/morrislaptop/looped-ts/blob/v0.0.1-alpha.6/src/commands/make/controller.ts)_

## `looped make:middleware NAME`

```
USAGE
  $ looped make:middleware NAME

OPTIONS
  -h, --help  show CLI help
```

_See code: [src/commands/make/middleware.ts](https://github.com/morrislaptop/looped-ts/blob/v0.0.1-alpha.6/src/commands/make/middleware.ts)_

## `looped make:provider NAME`

```
USAGE
  $ looped make:provider NAME

OPTIONS
  -h, --help  show CLI help
```

_See code: [src/commands/make/provider.ts](https://github.com/morrislaptop/looped-ts/blob/v0.0.1-alpha.6/src/commands/make/provider.ts)_
<!-- commandsstop -->
npm package: @looped-ts/create
Description: Create Looped Starter Kit app
Author: Craig Morris @morrislaptop
Latest version: 0.0.1-alpha.6

@loopes-ts/create
=================

Create Looped Starter Kit app

[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
[![Version](https://img.shields.io/npm/v/@loopes-ts/create.svg)](https://npmjs.org/package/@loopes-ts/create)
[![Downloads/week](https://img.shields.io/npm/dw/@loopes-ts/create.svg)](https://npmjs.org/package/@loopes-ts/create)
[![License](https://img.shields.io/npm/l/@loopes-ts/create.svg)](https://github.com/morrislaptop/looped-ts/blob/master/package.json)

<!-- toc -->
# Usage
<!-- usage -->
# Commands
<!-- commands -->
npm package: @looped/hooks
Description: A library of useful react hooks
Author: Tobias Herber
Latest version: 0.1.3

# `@looped/hooks`

A library of useful react hooks

## Included Hooks

- **useDebounce**
- **useDelayed**
- **useGlobalMemo**
- **useGlobalState**
- **useIsMobile**
- **useIsSSR**
- **useLoading**
- **useInterval**
- **useMemoIf**
- **useLocalstorage**
- **useDefined**
- **useControlled**

## Installation

```sh
yarn add @looped/hooks
```

## Usage

```tsx
import { useDebounce, useDelayed, ... } from '@looped/hooks';

let Component = () => {
  let { debouncedValue, value, setValue } = useDebounce('hello', 500);

  return (
    <div>
      <input value={value} onChange={e => setValue(e.target.value)} />
      <p>{debouncedValue}</p>
    </div>
  );
};
```
npm package: @looped/id
Description: ## Installation
Author: Tobias Herber
Latest version: 0.1.0

# `@looped/id`

## Installation

```sh
yarn add @looped/id
```

## Usage

```tsx
import { generateId, generateDashedId } from '@looped/hooks';

generateId('prefix_', 10); // prefix_1234567890

generateDashedId(3); // 1234-5678-90ab
```
npm package: @looped/utils
Description: A library of useful utility functions
Author: Tobias Herber
Latest version: 0.1.0

# `@looped/utils`

A library of useful utility functions

## Installation

```sh
yarn add @looped/utils
```

## Usage

```tsx
import { fileSize } from '@looped/hooks';

fileSize(1024 ** 2) // 1.0 MB
```
npm package: @loopengine/sdk
Description: Official LoopEngine SDK for sending feedback to the Ingest API
Author: Loopengine
Latest version: 1.1.0

# @loopengine/sdk

Official LoopEngine SDK for sending feedback to the Ingest API. Two-line usage: create a client with your credentials, then call `send` with your payload.

- **Zero runtime dependencies** — uses Node.js 18+ built-ins (`crypto.subtle`, `fetch`)
- **ESM and CJS** — dual build with TypeScript types
- **Small surface** — one class, one method

## Install

```bash
npm install @loopengine/sdk
```

## Usage

### ESM

```ts
import { LoopEngine } from '@loopengine/sdk';

const client = new LoopEngine({
  projectKey: 'pk_live_...',
  projectSecret: 'psk_live_...',
  projectId: 'proj_...',
});

const result = await client.send({ message: 'User reported a bug' });
if (result.ok) {
  console.log(result.body); // { id: 'fb_...', analysis_status: 'pending' }
}
```

### CJS

```js
const { LoopEngine } = require('@loopengine/sdk');

const client = new LoopEngine({
  projectKey: 'pk_live_...',
  projectSecret: 'psk_live_...',
  projectId: 'proj_...',
});

// The payload you send must match the schema defined for your project.
const result = await client.send({ message: 'User reported a bug' });
```

## Config

Obtain `projectKey`, `projectSecret`, and `projectId` from your [LoopEngine dashboard](https://loopengine.dev). Pass them in an object (e.g. from env):

```ts
const client = new LoopEngine({
  projectKey: process.env.LOOPENGINE_PROJECT_KEY!,
  projectSecret: process.env.LOOPENGINE_PROJECT_SECRET!,
  projectId: process.env.LOOPENGINE_PROJECT_ID!,
});
```

## Payload

The payload object must match the fields and constraints you defined when creating your project in the LoopEngine dashboard. At a minimum, it should include all the required fields according to your project's schema. `project_id` is automatically appended to each payload by the SDK.

## Geolocation

You can send device location so feedback is associated with coordinates instead of IP-based geo. Pass an optional second argument to `send()` with `geoLat` and `geoLon`. When **both** are provided and finite, the SDK adds `geo_lat` and `geo_lon` to the request body; they are included in the HMAC signature. Omit the second argument (or omit geo fields) to use IP-based geolocation. The API expects valid ranges: latitude -90 to 90, longitude -180 to 180.

```ts
// Without geo (IP-based location is used)
const result = await client.send({ message: 'Feedback' });

// With device coordinates (e.g. from navigator.geolocation)
const { coords } = await new Promise<GeolocationPosition>((res, rej) =>
  navigator.geolocation.getCurrentPosition(res, rej, { timeout: 5000 })
);
const result = await client.send(
  { message: 'Bug at my location' },
  { geoLat: coords.latitude, geoLon: coords.longitude }
);
```

## Requirements

- Node.js **>= 18.0.0**

## License

MIT