open-index/open-npm huggingface dataset:
npm package: @mocklantis/ui
Description: Web Components for Mocklantis plugins
Author: Mocklantis
Latest version: 0.1.2

# @mocklantis/ui

Web Components library for Mocklantis plugins. Built with Svelte, works everywhere.

## Installation

```bash
npm install @mocklantis/ui
```

Or via CDN:

```html
<script src="https://unpkg.com/@mocklantis/ui"></script>
```

## Usage

### ES Module (React, Vue, Svelte, etc.)

```javascript
import '@mocklantis/ui';
```

Then use in your HTML/JSX:

```html
<ml-input placeholder="Enter text..." />
<ml-button variant="primary">Click me</ml-button>
```

### Script Tag

```html
<script src="https://unpkg.com/@mocklantis/ui"></script>

<ml-input placeholder="Enter text..." />
<ml-button variant="primary">Click me</ml-button>
```

## Components

### ml-input

Text input component.

```html
<ml-input
  value="text"
  placeholder="Enter..."
  type="text|number|password|email"
  size="sm|md|lg"
  disabled
  readonly
  error
/>
```

**Events:** `input`, `change`, `focus`, `blur`

### ml-textarea

Multiline text input component.

```html
<ml-textarea
  value="text"
  placeholder="Enter..."
  rows="4"
  size="sm|md|lg"
  resize="none|vertical|horizontal|both"
  monospace
  disabled
  readonly
  error
/>
```

**Events:** `input`, `change`, `focus`, `blur`

### ml-select

Dropdown select component.

```html
<ml-select
  value="option1"
  placeholder="Select..."
  size="sm|md|lg"
  disabled
  options='[{"value":"opt1","label":"Option 1"},{"value":"opt2","label":"Option 2"}]'
/>
```

**Events:** `change`

### ml-checkbox

Checkbox component.

```html
<ml-checkbox
  checked
  label="Enable feature"
  size="sm|md|lg"
  disabled
/>
```

**Events:** `change`

### ml-button

Button component.

```html
<ml-button
  variant="primary|secondary|danger|ghost"
  size="sm|md|lg"
  disabled
  loading
  fullwidth
>
  Button Text
</ml-button>
```

**Events:** `click`

### ml-icon-button

Icon-only button component.

```html
<ml-icon-button
  variant="default|primary|danger|ghost"
  size="sm|md|lg"
  title="Delete item"
  disabled
  loading
>
  <svg>...</svg>
</ml-icon-button>
```

**Events:** `click`

### ml-card

Card container component.

```html
<ml-card padding="none|sm|md|lg" hoverable>
  Card content
</ml-card>
```

### ml-label

Label component.

```html
<ml-label size="sm|md|lg" required secondary>
  Label Text
</ml-label>
```

### ml-badge

Badge/status indicator component.

```html
<ml-badge variant="default|success|warning|error|info" size="sm|md" dot>
  Badge Text
</ml-badge>
```

## Theming

Components use CSS custom properties for theming. Set these on a parent element:

```css
:root {
  --bg-primary: #1a1a2e;
  --bg-secondary: #16213e;
  --bg-tertiary: #0f3460;
  --text-primary: #ffffff;
  --text-secondary: #a0a0a0;
  --accent: #4f46e5;
  --success: #10b981;
  --warning: #f59e0b;
  --error: #ef4444;
  --border-color: #333;
}
```

## Development

```bash
# Install dependencies
npm install

# Start dev server
npm run dev

# Build for production
npm run build
```

## License

MIT
npm package: @mockmask/accounts-controller
Description: Manages internal accounts
Latest version: 17.2.0

# `@metamask/accounts-controller`

Manages internal accounts used in place of regular ethereum addresses.

## Installation

`yarn add @metamask/accounts-controller`

or

`npm install @metamask/accounts-controller`

## Contributing

This package is part of a monorepo. Instructions for contributing can be found in the [monorepo README](https://github.com/MetaMask/core#readme).
npm package: @mockmaster/core
Description: Core mocking engine for mock-master
Latest version: 1.0.4

# @mockmaster/core

> Core mocking engine for mock-master - Path matching and HTTP routing

Part of the [mock-master](https://github.com/PxPerfectMike/MockMaster) monorepo.

## Installation

```bash
npm install @mockmaster/core
```

## Features

- **Path Matching** - Exact paths, parameters (`:id`), and wildcards (`*`)
- **HTTP Methods** - GET, POST, PUT, DELETE, PATCH, and more
- **Type Safe** - Full TypeScript support with strict typing
- **Zero Dependencies** - Lightweight and fast

## Usage

### Path Matching

```typescript
import { matchPath } from '@mockmaster/core'

// Exact match
matchPath('/users', '/users') // true
matchPath('/users', '/posts') // false

// Parameter matching
matchPath('/users/:id', '/users/123') // true
matchPath('/users/:id', '/users/abc') // true

// Wildcard matching
matchPath('/api/*', '/api/users') // true
matchPath('/api/*', '/api/users/123') // true
```

### Mock Matching

```typescript
import { createMock, findMatchingMock } from '@mockmaster/core'

const mocks = [
  createMock('/users', 'GET', { users: [] }),
  createMock('/users/:id', 'GET', { id: 1, name: 'John' }),
]

// Find matching mock
const mock = findMatchingMock(mocks, '/users/123', 'GET')
console.log(mock?.response) // { id: 1, name: 'John' }
```

## API

### `matchPath(pattern: string, path: string): boolean`

Matches a URL path against a pattern.

**Patterns:**
- Exact: `/users`
- Parameters: `/users/:id` (matches any value)
- Wildcards: `/api/*` (matches any path after `/api/`)

### `matchMethod(pattern: string, method: string): boolean`

Matches an HTTP method (case-insensitive).

### `createMock<T>(path: string, method: string, response: T): Mock<T>`

Creates a mock object with path, method, and response.

### `findMatchingMock<T>(mocks: Mock<T>[], path: string, method: string): Mock<T> | undefined`

Finds the first mock matching the given path and method.

### `extractParams(pattern: string, path: string): Record<string, string> | null`

Extracts parameter values from a path.

```typescript
import { extractParams } from '@mockmaster/core'

const params = extractParams('/users/:id', '/users/123')
// { id: '123' }

const params2 = extractParams('/users/:userId/posts/:postId', '/users/1/posts/42')
// { userId: '1', postId: '42' }
```

### `createMatcher(patterns: string[]): (path: string) => boolean`

Creates a matcher function from multiple patterns.

```typescript
import { createMatcher } from '@mockmaster/core'

const matcher = createMatcher(['/api/*', '/users/:id'])

matcher('/api/users')    // true
matcher('/users/123')    // true
matcher('/posts/456')    // false
```

## Links

- [Main Documentation](https://github.com/PxPerfectMike/MockMaster)
- [npm Organization](https://www.npmjs.com/org/mockmaster)
- [Report Issues](https://github.com/PxPerfectMike/MockMaster/issues)

## License

MIT
npm package: @mockmate/mockmate
Description: <p>   <img src="https://img.shields.io/npm/v/@mockmate/mockmate" alt="npm version" />   <img src="https://img.shields.io/npm/dw/@mockmate/mockmate" alt="downloads" />   <img src="https://img.shields.io/github/license/monokkai/mockmate" alt="license" />   
Author: monokkai
Latest version: 1.0.3

# mockmate

<p>
  <img src="https://img.shields.io/npm/v/@mockmate/mockmate" alt="npm version" />
  <img src="https://img.shields.io/npm/dw/@mockmate/mockmate" alt="downloads" />
  <img src="https://img.shields.io/github/license/monokkai/mockmate" alt="license" />
  <img src="https://img.shields.io/badge/tests-Jest-blue" alt="Jest tests" />
</p>

Mockmate is a lightweight mock data generator for JavaScript and TypeScript.
It helps frontend and full-stack developers generate, filter, and extend JSON data
from public APIs with a clean and declarative API.

<img src="./docs/generated.png" alt="generated data" width="100%"/>


---

## Features

- Works with JavaScript and TypeScript
- Zero configuration
- Uses real public APIs
- Fully typed API
- Extend and customize data
- Node.js and browser compatible
- Customize *view* of data

<img src="./docs/tableView.png" alt="table-view" width="100%"/>

---

## Installation

```bash
yarn add mockmate
npm install mockmate
pnpm add mockmate
```

### Basic Usage

```ts
import { mockmate } from "mockmate";

const users = await mockmate({
  category: "users",
  quantity: 5,
});
```

### Pick Fields

```ts
const users = await mockmate({
  category: "users",
  pick: ["name", "email"],
});
```

### Extend Data

```ts
const users = await mockmate({
  category: "users",
  extend: {
    isActive: () => true,
    score: () => Math.floor(Math.random() * 100),
  },
});
```

### Different sources

```ts
const users = await mockmate({
  category: "users",
  source: "fakestoreapi", // source: "jsonplaceholder"
  quantity: 2,
});
```

### Generate Schema

```ts
const users = await generate({
  quantity: 3,
  schema: {
    id: () => crypto.randomUUID(),
    username: () => `user_${Math.random().toString(36).slice(2)}`,
    age: () => Math.floor(Math.random() * 50) + 18,
    email: () => "test@mail.com",
  },
});
```

### Error Handling

```ts
try {
  await mockmate({ category: "users" });
} catch (error) {
  if (error instanceof Error) {
    console.error(error.message);
  }
}
```

### Supported Categories

```
users
posts
comments
todos
```

### Running Tests

Mockmate uses Jest for testing. You can run tests locally with:

```bash
pnpm add -D jest ts-jest @types/jest
pnpm jest
```

Or using npm/yarn:

```
npm install --save-dev jest ts-jest @types/jest
npm test
```

### License

MIT