open-index/open-npm huggingface dataset:
npm package: @fluencypassdevs/cycle
Description: Cycle Design System — UI component library by Fluencypass
Latest version: 1.5.1

# Cycle Design System

Design System da [Fluencypass](https://fluencypass.com), construido sobre shadcn/ui + Next.js 16 + Tailwind CSS 4.

## Instalacao

```bash
npm install @fluencypassdevs/cycle geist
```

No `src/app/layout.tsx`, configurar a fonte Geist:

```tsx
import { GeistSans } from "geist/font/sans"
import { GeistMono } from "geist/font/mono"

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="pt-BR" className={`${GeistSans.variable} ${GeistMono.variable}`}>
      <body>{children}</body>
    </html>
  )
}
```

No `globals.css`:

```css
@import "tailwindcss";
@import "@fluencypassdevs/cycle/styles.css";
```

```tsx
import { Button, Badge, CycleIcon } from "@fluencypassdevs/cycle"
```

## Configurar IA (Claude Code, Cursor, Copilot)

```bash
npx cycle init
```

Esse comando:
- Adiciona regras do Cycle ao seu `CLAUDE.md`, `.cursorrules` e outros spec-kits (preserva regras existentes)
- Cria `.mcp.json` para Claude Code — habilita 6 tools do Cycle (buscar componentes, tokens, regras)

### MCP Server (Claude Code)

O `init` configura automaticamente o MCP server. O Claude Code passa a ter acesso a:

| Tool | Funcao |
|------|--------|
| `cycle_search_component` | Busca componentes por nome/keyword |
| `cycle_get_component` | Detalhes completos (props, exemplos) |
| `cycle_get_icon_usage` | Regras de uso de icones |
| `cycle_get_setup` | Instrucoes de setup |
| `cycle_get_tokens` | Tokens semanticos disponiveis |
| `cycle_get_rules` | Regras obrigatorias para IA |

Isso garante que a IA **consulte** os componentes existentes antes de gerar codigo, em vez de depender apenas de instrucoes estaticas.

## Documentacao

- **Setup Guide**: https://cycle-design.fluencypass.com/docs
- **Componentes**: https://cycle-design.fluencypass.com/docs/components
- **Tokens**: https://cycle-design.fluencypass.com/docs/tokens

## Desenvolvimento

```bash
npm run dev        # servidor de desenvolvimento
npm run build      # build de producao (Next.js)
npm run build:lib  # build do pacote npm
npm run lint       # ESLint
```

## Stack

- Next.js 16 (App Router)
- React 19
- TypeScript 5
- Tailwind CSS 4
- shadcn/ui (new-york style)
- Radix UI primitives
- Lucide React icons
npm package: @fluent-blocks/basic-icons
Description: <img alt="Fluent Blocks logo" src="https://cdn.jsdelivr.net/gh/OfficeDev/fluent-blocks@next/packages/react/.storybook/public/brandImage.svg#gh-light-mode-only" width="320" /> <img alt="Fluent Blocks logo" src="https://cdn.jsdelivr.net/gh/OfficeDev/fluent-
Latest version: 9.1.3
npm package: @fluent-blocks/react
Description: <img alt="Fluent Blocks logo" src="https://cdn.jsdelivr.net/gh/OfficeDev/fluent-blocks@next/packages/react/.storybook/public/brandImage.svg#gh-light-mode-only" width="320" /> <img alt="Fluent Blocks logo" src="https://cdn.jsdelivr.net/gh/OfficeDev/fluent-
Latest version: 9.2.0
npm package: @fluent-form/ui-zorro
Description: The ng-zorro-antd UI adapter for @fluent-form/core.
Latest version: 0.29.16

# @fluent-form/ui-zorro

The ng-zorro-antd UI adapter for @fluent-form/core.

## License

[MIT](https://github.com/fluent-form/fluent-form/blob/main/LICENSE)
npm package: @fluent-iterable/js-sdsl
Description: A plugin with useful operations to generate js-sdsl data structures
Author: Thiago O Santos
Latest version: 0.7.2

[![Actions Status](https://github.com/Codibre/fluent-iterable-js-sdsl/workflows/build/badge.svg)](https://github.com/Codibre/fluent-iterable-js-sdsl/actions)
[![Actions Status](https://github.com/Codibre/fluent-iterable-js-sdsl/workflows/test/badge.svg)](https://github.com/Codibre/fluent-iterable-js-sdsl/actions)
[![Actions Status](https://github.com/Codibre/fluent-iterable-js-sdsl/workflows/lint/badge.svg)](https://github.com/Codibre/fluent-iterable-js-sdsl/actions)
[![Test Coverage](https://api.codeclimate.com/v1/badges/ab8fe8c90db9d596e996/test_coverage)](https://codeclimate.com/github/Codibre/fluent-iterable-js-sdsl/test_coverage)
[![Maintainability](https://api.codeclimate.com/v1/badges/ab8fe8c90db9d596e996/maintainability)](https://codeclimate.com/github/Codibre/fluent-iterable-js-sdsl/maintainability)
[![Packages](https://david-dm.org/Codibre/fluent-iterable-js-sdsl.svg)](https://david-dm.org/Codibre/fluent-iterable-js-sdsl)
[![npm version](https://badge.fury.io/js/%40codibre%2Ffluent-iterable-js-sdsl.svg)](https://badge.fury.io/js/%40codibre%2Ffluent-iterable-js-sdsl)

This packages is an ex extension to [@codibr/fluent-iterable](https://www.npmjs.com/package/@codibre/fluent-iterable) which integrates it with [js-sdsl](https://www.npmjs.com/package/js-sdsl), a library with some great data structures implementations

## How to Install

```
npm i @fluent-iterable/js-sdsl @fluent-iterable js-sdsl
```

## How to use it

To use it, you need to import this package in the main file of your project, making its methods accesible in anywhere.
Remember: you have to make sure the package is imported on your unit tests too!

About the integration, we have some resolving operations to generate some of the data structures provided by **js-sdsl**, which is:

* toBinarySearchTree: creates an OrderedMap
* toBinarySearchTreeAsync: creates an OrderedMap asynchronously
* toBinarySearchTreeSet: creates an OrderedSet
* toBinarySearchTreeSetAsync: creates an OrderedSet asynchronously
* toQueue: creates a Queue
* toQueueAsync: creates a Queue asynchronously
* toStack: creates a Stack
* toStackAsync: creates a Stack asynchronously
* toDeque: creates a Deque
* toStackAsync: creates a Deque asynchronously
* toPriorityQueue: creates a PriorityQueue
* toPriorityQueue: creates a PriorityQueue asynchronously

To see how to use each of those methods, checkout it out on the in code documentation!

## License

Licensed under [MIT](https://en.wikipedia.org/wiki/MIT_License).
npm package: @fluent-iterable/rxjs
Description: A plugin with useful operations to generate rxjs data structures
Author: Thiago O Santos
Latest version: 1.0.2

[![Actions Status](https://github.com/Codibre/fluent-iterable-rxjs/workflows/build/badge.svg)](https://github.com/Codibre/fluent-iterable-rxjs/actions)
[![Actions Status](https://github.com/Codibre/fluent-iterable-rxjs/workflows/test/badge.svg)](https://github.com/Codibre/fluent-iterable-rxjs/actions)
[![Actions Status](https://github.com/Codibre/fluent-iterable-rxjs/workflows/lint/badge.svg)](https://github.com/Codibre/fluent-iterable-rxjs/actions)
[![Test Coverage](https://api.codeclimate.com/v1/badges/ab8fe8c90db9d596e996/test_coverage)](https://codeclimate.com/github/Codibre/fluent-iterable-rxjs/test_coverage)
[![Maintainability](https://api.codeclimate.com/v1/badges/ab8fe8c90db9d596e996/maintainability)](https://codeclimate.com/github/Codibre/fluent-iterable-rxjs/maintainability)
[![Packages](https://david-dm.org/Codibre/fluent-iterable-rxjs.svg)](https://david-dm.org/Codibre/fluent-iterable-rxjs)
[![npm version](https://badge.fury.io/js/%40codibre%2Ffluent-iterable-rxjs.svg)](https://badge.fury.io/js/%40codibre%2Ffluent-iterable-rxjs)

This packages is an ex extension to [@codibr/fluent-iterable](https://www.npmjs.com/package/@codibre/fluent-iterable) which integrates it with [rxjs](https://www.npmjs.com/package/rxjs), a library with some great data structures implementations

## How to Install

```
npm i @fluent-iterable/rxjs @fluent-iterable rxjs
```

## How to use it

To use it, you need to import this package in the main file of your project, making its methods accessible in anywhere.
Remember: you have to make sure the package is imported on your unit tests too!

About the integration, we have the following resolving operations to generate an rxjs Observable:

* toObservable: creates an Observable based on the FluentIterable/FluentAsyncIterable

To see how to use each of those methods, checkout it out on the in code documentation!

## License

Licensed under [MIT](https://en.wikipedia.org/wiki/MIT_License).
npm package: @fluent-windows/core
Description: React components that inspired by Microsoft's Fluent Design System.
Author: chenyueban
Latest version: 1.0.0

# @fluent-windows/core

React components that inspired by Microsoft's Fluent Design System.

## Installation

Install the package in your project directory with:

```
// with npm
npm install @fluent-windows/core

// with yarn
yarn add @fluent-windows/core
```
npm package: @fluent-windows/hooks
Description: Fluent-Windows React hooks.
Author: chenyueban
Latest version: 1.0.0

# @fluent-windows/hooks

React components that inspired by Microsoft's Fluent Design System.

## Installation

Install the package in your project directory with:

```
// with npm
npm install @fluent-windows/hooks

// with yarn
yarn add @fluent-windows/hooks
```
npm package: @fluent-windows/icons
Description: Fluent-Windows Svg Icons.
Author: chenyueban
Latest version: 1.0.0

# @fluent-windows/icons

Fluent-Windows Svg Icons Based on [RemixIcon](https://remixicon.com/).

## Installation

Install the package in your project directory with:

```
// with npm
npm install @fluent-windows/icons

// with yarn
yarn add @fluent-windows/icons
```