open-index/open-npm huggingface dataset:
npm package: @microcosmix/modulight
Description: Libreria para gestionar modulos en Node y Typescript, uso muy similar a NestJS o Angular
Author: Nelson R. Graña Vivas nelsongraa8@gmail.com
Latest version: 0.0.1

# Modulight

[![npm version](https://img.shields.io/npm/v/modulight.svg)](https://www.npmjs.com/package/modulight)
[![Node.js Version](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org/)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)

**Estado:** 🚧 En desarrollo temprano

**Modulight** es una librería ligera para **Node.js** que ofrece:
- Gestión modular de tu aplicación
- Inyección e inversión de dependencias
- Uso de decoradores para un código más declarativo y limpio

Ideal para proyectos que buscan la flexibilidad de un sistema modular sin la sobrecarga de frameworks pesados.

---

## Instalación

```bash
npm install modulight
```

## Uso Basico

```typescript
import { Module, Injectable, Inject } from "modulight";

@Injectable()
class MyService {
  sayHello() {
    return "Hola desde MyService";
  }
}

@Module({
  providers: [MyService]
})
class AppModule {
  constructor(@Inject(MyService) private myService: MyService) {}

  start() {
    console.log(this.myService.sayHello());
  }
}

new AppModule().start();
```

## Características

* 🎯 Ligero: sin dependencias innecesarias

* 🧩 Modular: organiza tu aplicación en módulos independientes

* 🛠 Inyección de dependencias: fácil gestión de instancias y dependencias

* 🪄 Decoradores: para un código más expresivo y limpio

## Roadmap

* Soporte para middlewares

* Integración con aplicaciones HTTP

* CLI para generación de módulos

* Documentación avanzada y ejemplos

## Contribuir

Las contribuciones son bienvenidas 🤝.

Para cambios grandes, abre primero un issue para discutir lo que te gustaría modificar.

## Licencia

MIT © Microcosmix
npm package: @microdeft/facebook-conversion-api-nextjs
Description: Facebook Conversion API for Next.js
Author: Microdeft
Latest version: 1.0.0

# Facebook Conversion API for Next.js

A lightweight, type-safe implementation of the Facebook Conversion API for Next.js applications.

## Features

- Server-side event tracking for Facebook Pixel
- Compatible with Next.js App Router and Pages Router
- TypeScript support
- Easy-to-use React components
- Automatic event deduplication
- GDPR-friendly implementation

## Installation

```bash
npm install @microdeft/facebook-conversion-api-nextjs
```

or

```bash
yarn add @microdeft/facebook-conversion-api-nextjs
```

## Setup

### 1. Create a Facebook Pixel

If you don't already have a Facebook Pixel set up, create one in your [Meta Business Manager](https://business.facebook.com/events_manager/).

### 2. Configure environment variables

Add these environment variables to your `.env.local` file:

```
FACEBOOK_PIXEL_ID=your_pixel_id
FACEBOOK_ACCESS_TOKEN=your_access_token
```

You can obtain your access token from the [Facebook Business Manager](https://business.facebook.com/events_manager/) under your Pixel's settings.

## Usage

### Basic Server Component (App Router)

```tsx
// app/page.tsx
import { trackPageView } from '@microdeft/facebook-conversion-api-nextjs';

export default async function Page() {
  // Track page view server-side
  await trackPageView();
  
  return <div>My Page Content</div>;
}
```

### API Route (Pages Router)

```tsx
// pages/api/track-event.js
import { createFacebookConversionApiHandler } from '@microdeft/facebook-conversion-api-nextjs/handlers';

export default createFacebookConversionApiHandler({
  // Optional configuration
  debug: process.env.NODE_ENV === 'development',
});
```

### Client-side Component

```tsx
// components/AddToCart.tsx
import { TrackEvent } from '@microdeft/facebook-conversion-api-nextjs/components';

export function AddToCartButton({ product }) {
  return (
    <TrackEvent 
      event="AddToCart" 
      data={{
        content_ids: [product.id],
        content_name: product.name,
        value: product.price,
        currency: 'USD'
      }}
    >
      <button>Add to Cart</button>
    </TrackEvent>
  );
}
```

## API Reference

### Server-side functions

- `trackPageView(options?: PageViewOptions)` - Track a page view event
- `trackEvent(eventName: string, eventData: EventData)` - Track a custom event
- `trackPurchase(purchaseData: PurchaseData)` - Track a purchase event

### Components

- `<TrackEvent />` - React component to track events on user interactions
- `<TrackPageView />` - React component to track page views client-side

### Handler Creators

- `createFacebookConversionApiHandler(config)` - Create an API route handler for Pages Router
- `createFacebookConversionApiRoute(config)` - Create a route handler for App Router

## License

MIT © [Microdeft](https://github.com/microdeft)
npm package: @microdesign/micro-cli
Description: 一个基于MicroDesign微服务开箱即用的大前端脚手架创建工具。
Author: MicroDesign
Latest version: 1.0.1

# MICRO CLI
一款基于MicroDesign的微服务脚手架创建工具
## 安装
```sh
npm i @microdesign/micro-cli -g
```
## .eslintrc.js
```json
module.exports = {
    "env": {
        "node": true,
        "browser": true,
        "es2021": true.
    },
    "extends": "eslint:recommended",
    "overrides": [
    ],
    "parserOptions": {
        "ecmaVersion": "latest",
        "sourceType": "module"
    },
    "rules": {
        "indent": [
            "error",
            "tab"
        ],
        "linebreak-style": [
            "error",
            "windows"
        ],
        "quotes": [
            "error",
            "double"
        ],
        "semi": [
            "error",
            "always"
        ]
    }
}

```
## 插件
- [semver](https://www.npmjs.com/package/semver)
- [chalk]()
- [Inquirer.js]()
- [ora]()
- [figlet.js]()
- [boxen]()
npm package: @microdesign/micro-design-layout
Description: Micro Design Layout of Vue, easy to use Micro scaffolding.
Author: MicroDesign
Latest version: 1.0.6

<h1 align="center">
Micro Design Layout
</h1>

<div align="center">

[![NPM version](https://img.shields.io/npm/v/@ant-design-vue/micro-layout/next?style=flat)](https://npmjs.org/package/@ant-design-vue/micro-layout) [![Vue Support](https://img.shields.io/badge/support-Vue3-green?style=flat)](./package.json) [![Vue Grammar Level](https://img.shields.io/badge/full-Composition%20API-blue?style=flat)](https://v3.vuejs.org/guide/composition-api-introduction.html) [![NPM downloads](http://img.shields.io/npm/dm/@ant-design-vue/micro-layout.svg?style=flat)](https://npmjs.org/package/@ant-design-vue/micro-layout) [![License](https://img.shields.io/github/license/vueComponent/micro-layout)](./LICENSE)

</div>

## Install

```bash
# yarn
yarn add micro-design-layout@next -S
# npm
npm i micro-design-layout@next -S
```
npm package: @microdesign/vitepress-theme-micro
Description: A Vitepress Theme, Have blog and document styles
Author: lauset
Latest version: 0.0.2

## 仓库地址

[gitee](https://gitee.com/MicroDesign/micro-design-theme)

## 感谢

[Vue](https://vuejs.org/)

[Vite](https://cn.vitejs.dev/)

[Vitepress](https://vitepress.vuejs.org/)

[Vercel](https://vercel.com/docs)

[ElementPlus](https://element-plus.gitee.io/zh-CN/)

[Crowdin](https://crowdin.com/)
npm package: @microdesign/vuepress-theme-micro
Description: Docs theme for VuePress.
Author: xunzhaotch
Latest version: 1.0.1

<!--
 * @Author: luyb luyb@xunzhaotech.com
 * @Date: 2022-12-10 15:52:52
 * @LastEditors: luyb luyb@xunzhaotech.com
 * @LastEditTime: 2022-12-17 12:46:42
 * @FilePath: \kuaizhidao\docs\.vuepress\theme\README.md
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<p align="center"><a href="https://s1.ax1x.com/2022/12/17/zbmcHs.png" target="_blank" rel="nofollow"><img width="120" src="https://s1.ax1x.com/2022/12/17/zbmcHs.png" alt="AntDocs logo"></a></p>

<h1 align="center">MicroDocs</h1>

<div align="center">

An Micro Design style theme for VuePress.

</div>

# Features
- Equipped with Ant Design style, you can directly use various components of the UI library.
- Optimize parts of styles.
- More features are waiting for you to discover ...

# Quick start

#### Install microdocs theme

```sh
$ npm i -D @microdesign/vuepress-theme-microdocs
```
or
```sh
$ yarn add -D @microdesign/vuepress-theme-microdocs
```
or
```sh
$ pnpm add -D @microdesign/vuepress-theme-microdocs
```


#### Use theme  

Open your `.vuepress/config.ts`, and then add VuePress theme reference code:
```js
module.exports = {
  theme: '@microdesign/microdocs'
}
```
You can get help here: [Using a theme](https://vuepress.vuejs.org/theme/using-a-theme.html#theme-shorthand)
npm package: @microdesign/vuepress-theme-microdocs
Description: Docs theme for VuePress.
Author: xunzhaotech
Latest version: 1.0.1

<!--
 * @Author: luyb luyb@xunzhaotech.com
 * @Date: 2022-12-10 15:52:52
 * @LastEditors: luyb luyb@xunzhaotech.com
 * @LastEditTime: 2022-12-17 12:46:42
 * @FilePath: \kuaizhidao\docs\.vuepress\theme\README.md
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<p align="center"><a href="https://s1.ax1x.com/2022/12/17/zbmcHs.png" target="_blank" rel="nofollow"><img width="120" src="https://s1.ax1x.com/2022/12/17/zbmcHs.png" alt="AntDocs logo"></a></p>

<h1 align="center">MicroDocs</h1>

<div align="center">

An Micro Design style theme for VuePress.

</div>

# Features
- Equipped with Ant Design style, you can directly use various components of the UI library.
- Optimize parts of styles.
- More features are waiting for you to discover ...

# Quick start

#### Install microdocs theme

```sh
$ npm i -D @microdesign/vuepress-theme-microdocs
```
or
```sh
$ yarn add -D @microdesign/vuepress-theme-microdocs
```
or
```sh
$ pnpm add -D @microdesign/vuepress-theme-microdocs
```


#### Use theme  

Open your `.vuepress/config.ts`, and then add VuePress theme reference code:
```js
module.exports = {
  theme: '@microdesign/microdocs'
}
```
You can get help here: [Using a theme](https://vuepress.vuejs.org/theme/using-a-theme.html#theme-shorthand)
npm package: @microdom/mode
Description: **Mode JS** is a low-level interaction engine for the web. It belongs to the **Microdom** ecosystem.
Latest version: 1.0.3


# Mode JS

**Mode JS** is a low-level interaction engine for the web.
It belongs to the **Microdom** ecosystem.

It does not provide widgets, components, or behaviors.
It provides a way to reason about **movement**, **intent**, and **structure**.

Mode JS is designed for developers who want to *build* interactions,
not configure them.

---

## What Mode JS is

![Mode JS ](./assets/logo.png)
- A low-level interaction primitive
- Pointer- and touch-aware
- Minimal by design
- Framework-agnostic
- DOM-friendly
- Data-binding ready

Mode JS helps you express *how things move* — not *what they are*.

---

## What Mode JS is not

- ❌ A WebComponents library
- ❌ A UI framework
- ❌ A state machine
- ❌ A collection of ready-made behaviors

Those things can be **built with Mode JS**, but they do not belong inside it.

---
### Install

```bash
npm install @microdom/mode
```
**Usage**
```bash
import µ from "@microdom/mode"
// or: import { µ } from "@microdom/mode"
```

**CDN**
```html
<script src="https://cdn.jsdelivr.net/gh/microdom/mode.js/dist/mode.min.js"></script>
<script>
  µ("body", { /* ... */ })
</script>
```


## Why Mode JS exists

Most interaction libraries:
- abstract too early
- hide intent behind state
- grow uncontrollably
- break at the edges (touch, empty states, nested structures)

Mode JS takes a different approach:

> **Movement first.  
> Intent is explicit.  
> Structure matters more than features.**

---

## Why not X?

Modern UI stacks often require tens of kilobytes of code
to express a simple interaction.

Mode JS asks a different question:

> *How much code do you actually need  
> to make something feel right?*

```md
A complete multi-list sortable with touch support
can be built in **~6 KB total**.
```

Read the full comparison in  
[`docs/why-not-x.md`](docs/why-not-x.md).

---

### Code weight in perspective
>Characters © Team Cherry

![Mode JS vs frameworks — code weight comparison](./assets/mode-weight-meme.jpg)

> The little one can rule the town.

---

## Repository structure

If you’re looking for examples, start in **/demos**.  
If you’re looking for ideas, start in **/docs**.

---

## Demos

- **Sortable (multi-list + touch)**  
  A complete sortable interaction built with ~6 KB of code.
  Demonstrates intent gating, empty container handling, and cross-list movement.

Each demo is intentionally **self-contained**.
They are not plugins — they are *proofs of thought*.

---

## Philosophy

Mode JS is opinionated:

> “If an interaction cannot be expressed simply,
> the abstraction is probably wrong.”

Read more in [`docs/philosophy.md`](docs/philosophy.md).

---

## License

MIT