open-index/open-npm huggingface dataset:
npm package: @noowah/content-builder
Description: A React component for building and managing web content, designed to offer a flexible, customizable content editor inspired by popular tools like [Sanity.io](https://www.sanity.io/) and [Builder.io](https://www.builder.io/). This component is built on top
Latest version: 0.0.15

# @noowah/content-builder

A React component for building and managing web content, designed to offer a flexible, customizable content editor inspired by popular tools like [Sanity.io](https://www.sanity.io/) and [Builder.io](https://www.builder.io/). This component is built on top of the [Tiptap](https://tiptap.dev/) editor, allowing for rich text editing with advanced features and custom content structures.

## Features

- **Customizable Content Structure**: Easily create and organize content with a flexible structure using `Pages`, `Sections`, and `Blocks`.
- **Rich Text Editing**: Leverage the power of the Tiptap editor for advanced rich text editing functionality.
- **Media Support**: Add images and galleries with captions, alt text, and styling options.
- **Drag-and-Drop Support**: Utilize the `react-sortable-js` library for easy drag-and-drop reordering of blocks and sections.
- **Mobile-Responsive Layouts**: Define different styles for mobile and desktop layouts.

## Installation

```bash
npm install @noowah/content-builder
yarn add @noowah/content-builder
```

## Basic Usage

```tsx
import React from "react";
import { Editor } from "@noowah/content-builder";

const MyPageEditor = () => {
  const initialContent = {
    id: "page_1",
    title: "About Us",
    slug: "about-us",
    sections: [
      {
        id: "section-1",
        order: 1,
        style: "width: 100%;",
        blocks: [
          {
            type: "html",
            id: "block_1",
            content:
              "<p>Welcome to our company. We are dedicated to providing the best services...</p>",
          },
        ],
      },
    ],
  };

  return <Editor data={initialContent} />;
};

export default MyPageEditor;
```

## Types

```ts
type Page = {
  title: string;
  slug: string;
  style: string;
  sections: Section[];
};

type Section = {
  id: string;
  order?: number;
  style?: string;
  style_mobile?: string;
  blocks: Block[];
};

type Block = {
  id: string;
  type: "html" | "image" | "gallery";
  style?: string;

  // For image / gallery
  src?: string;
  alt?: string;
  caption?: string;
  images?: {
    src?: string;
    alt?: string;
    caption?: string;
  }[];

  // For html
  content?: string;
};
```
npm package: @nopa/svelte-plus-blocks
Description: Experimental Interface between Svelte and Blocks
Latest version: 0.4.1

# @nopa/svelte-plus-blocks

Experimental interface between Svelte and Blocks, providing seamless integration for property management and button interactions.

## Installation

```sh
npm install @nopa/svelte-plus-blocks
```

## Requirements

- Svelte 5.0.0 or higher

## Usage

```svelte
<script>
  import { BlocksButton } from '@nopa/svelte-plus-blocks';
  import { BAction } from '@nopa/svelte-plus-blocks';
</script>

<BlocksButton label="Click me!" primaryAction={BAction.SetProperty('test', true)} />
```

## Components

### BlocksButton
A Svelte component for manipulating Blocks properties, etc. via a button click.


## License

MIT
npm package: @nopain1210/react-ui
Description: Modern and minimalist React UI library.
Latest version: 2.0.5

> Modern and minimalist React UI library, originating from Vercel's design.

<br/>

## Quick Start

1. run `yarn add @geist-ui/react` or `npm i @geist-ui/react` install it.

2. import into project:

```jsx
import { GeistProvider, CssBaseline } from '@geist-ui/react'

const Application = () => (
  <GeistProvider>
    <CssBaseline /> // ---> Normalize styles
    <AppComponent /> // ---> Your App Component
  </GeistProvider>
)
```

<br/>

## Documentation

- [Document Site](https://react.geist-ui.dev)
- [中文文档](https://react.geist-ui.dev/zh-cn)

<br/>

## Development

- [Contributing Guide](https://github.com/geist-org/react/blob/master/.github/CONTRIBUTING.md)

<br/>

## Showcases

- [Article view count](https://docs.views.show/)
- [Tree viewer for CDN](https://cdn.unix.bio/)
- [Better social image](https://img.unix.bio/)
- [Add here](https://github.com/geist-org/react/issues/new)

<br/>

## LICENSE

[MIT](./LICENSE)
npm package: @nopales-tech/shared-libs
Description: NPM Libraries to Share Across Our Services (DTOs, interfaces, utils, etc.)
Author: Nopales Technology LLC
Latest version: 1.0.6

# shared-libs
NPM libraries to share across microservices

## Folder Structure

```
shared-libs/
├── src/
│   ├── dtos/
│   │   └── login.dto.ts
│   ├── interfaces/
│   │   └── user.interface.ts
│   ├── enums/
│   │   └── role.enum.ts
│   ├── utils/
│   │   └── string.helper.ts
│   ├── decorators/
│   │   └── public.decorator.ts
│   ├── index.ts
├── dist/                   # Output after build
├── package.json
├── tsconfig.json
└── .github/workflows/
    ├── publish.yml
    └── auto-version.yml
```
npm package: @nopasswordlogin/react-nopasswordlogin
Description: Registration and Authentication Components to use with the NoPasswordLogin platform
Author: Chris McCaw
Latest version: 0.0.7

# react-nopasswordlogin

#### Enable your users to login using biometrics (TouchID, FaceID, Windows Hello) or hardware security tokens (Yubikey). Create an account at https://nopasswordlogin.com to get started.

Check out our [Demo](https://github.com/nopasswordlogin/react-nopasswordlogin-demo)

## Install and Usage

```
$ yarn add @nopasswordlogin/react-nopasswordlogin

# or

$ npm install @nopasswordlogin/react-nopasswordlogin

```

### Registration

This component renders a button which makes a call to the No Password Login platform to register a user. 
When the component is clicked it will ask the user to register an authenticator such as TouchID.

#### Example Usage

```
import { Registration } from '@nopasswordlogin/react-nopasswordlogin';

<Registration clientId="demo" identifier="myusername" />
```

### Authentication

This component renders a button which makes a call to the No Password Login platform to authenticate (login) a user.
The user will be challenge with the authenticator that they registered with (For Example. TouchID or FaceID)

#### Example Usage

```
import { Authentication } from '@nopasswordlogin/react-nopasswordlogin';

<Authentication clientId="demo" identifier="myusername" />
```

| Property | Type | Required |
| --------- | ------- | ------- |
| clientId    | string | ✔ |
| identifier | string | ✔ |
| name      | string | |
| onSuccess      | function | |
| onFailure      | function | |
| render      | node | |
| renderUnsupported      | node | |

## Get Started

1. Signup for an account at https://dashboard.nopasswordlogin.com
1. Create a new application which will generate a Client ID
3. Drop the `Registration` and `Authentication` component somewhere in your authentication flow
4. Your users can now register and login with biometrics

## Contributing

All PR's are welcome.

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details