open-index/open-npm huggingface dataset:
npm package: @muxi/wx-srv-api
Description: 新增微信支付服务商版本支付
Author: wenlihou
Latest version: 1.0.0

# 功能介绍

拉取自[Github](https://github.com/gooking/apifm-wxapi)，在此基础上修改适配自己需求。

# 使用方法

## 安装

```
npm install @muxi/wx-srv-api
```

*如果你的项目还不支持 npm (检查根目录下有没有 package.json 文件)，请先初始化：*

```
npm init
```

## 构建 npm 模块

小程序安装的 npm 模块，还不能直接使用，你需要在开发工具： “工具” --> “构建 npm” ，提示构建成功后，才能使用！

## 小程序调用

1. js文件头部引入插件：

    ```
    const WXAPI = require('apifm-wxapi')
    WXAPI.init('gooking')
    ```

2. js文件直接调用方法：

    ```
    WXAPI.banners().then(res => {
      if (res.code == 0) {
        this.setData({
          banners: res.data
        })
      }
    })
    ```

*上述例子完成了读取后台的 banner 轮播图片的数据，后台发布轮播图，小程序端直接这样简单调用即可~*

# 返回值说明

WXAPI 方法返回数据主要包含 3 个内容： 

1. code 错误码，0 代表操作重构，其他数字均表示错误，具体错误描述请查看 msg；
2. msg 如果上面的code不为0，那么 msg 将会返回具体的错误说明描述
3. data 字段保存了 code 为0 时候的数据，一起你需要的数据，都保存在 data 中返回给你

# 相关资源

[「5分钟使用教程」](https://www.yuque.com/apifm/doc/mdldsd)
[「Demo程序下载」](https://github.com/gooking/apifm-wxapi-demo)
[「功能说明文档」](instructions.md)
[「api接口文档」](https://api.it120.cc/doc.html)

# 授权协议

[MIT License](LICENSE)
npm package: @muxiandong/cc-ancient-helper
Description: A simple helper.Its main function is to  get the ancient time.
Author: muxiandong
Latest version: 1.0.3

# npm-Mu-Ancient-Helper

#### 介绍
一个简易帮助类，获取古代时间

A simple helper.Its main function is to  get the ancient time.

#### 安装教程

1.  使用 `npm install @muxiandong/cc-ancient-helper` 安装 npm

#### 使用说明
```ts
import { MF_Ancient_Helper } from '@muxiandong/cc-ancient-helper'

let a = MF_Ancient_Helper.convertSolarTimeToLunarTime(6, 20); // 六月二十
let b = MF_Ancient_Helper.translateTimeToAncientChineseFifthHour(19, 30); // 一更天
let c = MF_Ancient_Helper.translateTimeToAncientChineseTwelveHours(19); // 戌时
```
npm package: @muxiandong/cc-calendar
Description: A simple tool. Its main function is to convert between the Chinese lunar calendar and the Gregorian calendar for the years 1900-2100. 
Author: muxiandong
Latest version: 1.0.3

# npm-Mu-Calendar

#### 介绍
一个简易工具，中国农历&公历互转

A simple tool. Its main function is to convert between the Chinese lunar calendar and the Gregorian calendar for the years 1900-2100. 


#### 安装教程

1.  使用 `npm install @muxiandong/cc-calendar` 安装 npm

#### 使用说明
```ts
import { MF_Calendar } from '@muxiandong/cc-calendar';

let a = MF_Calendar.getFestival(); // Object {"1-1":{title:'元旦节'}, ..., "12-25": {title:'圣诞节'}
let b = MF_Calendar.getTerm(2024, 18); // 22
let c = MF_Calendar.getAnimal(1992); // 猴
let d = MF_Calendar.getLunarFestival(); // Object {"1-1":{title:'春节'}, ..., "12-30": {title:'除夕'}
let e = MF_Calendar.lYearDays(2024); // 354
let f = MF_Calendar.leapDays(2024); // 0
let g = MF_Calendar.leapMonth(2024); // 0
let h = MF_Calendar.lunar2solar(2024, 6, 3, false); // Object {Animal:“龙”, ..., ncWeek:"星期一"}
let i = MF_Calendar.monthDays(2024, 7); // 30
let j = MF_Calendar.solar2lunar(2024, 7, 11); // Object {Animal:“龙”, ..., ncWeek:"星期四"} 
let k = MF_Calendar.solarDays(2024, 7); // 31
let l = MF_Calendar.toAstro(7, 21); // 巨蟹座
let m = MF_Calendar.toChinaDay(6); // 初六
let n = MF_Calendar.toChinaMonth(6); // 六月
let o = MF_Calendar.toGanZhi(5); // 己巳
let p = MF_Calendar.toGanZhiYear(2024); // 甲辰
```
npm package: @muxiandong/cc-encrypt
Description: A simple tool. Its main function is to encrypt or decrypt.
Author: muxiandong
Latest version: 1.0.29

# 加密模块

#### 使用方式
```ts
import { MF_Encrypt } form '@muxiandong/mf-encrypt';

let key = "a100k";
let str = "abcd";
// 加密
let str1 = MF_Encrypt.stringEncrypt(key, str); // SST
// 解密
let str2 = MF_Encrypt.stringDecrypt(key, str1); // abcd
```
npm package: @muxima-ui/autocomplete
Description: Autocomplete component with real-time search suggestions for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# @muxima-ui/autocomplete

Autocomplete component with real-time search suggestions, keyboard navigation, and virtual scrolling.

## Installation

```bash
npm install @muxima-ui/autocomplete
```

## Usage

```typescript
import { AutocompleteComponent } from '@muxima-ui/autocomplete';

@Component({
  standalone: true,
  imports: [AutocompleteComponent],
  template: `
    <muxima-autocomplete
      [options]="options"
      placeholder="Search..."
      [(ngModel)]="selectedValue"
      (search)="onSearch($event)">
    </muxima-autocomplete>
  `
})
export class MyComponent {
  options = ['Apple', 'Banana', 'Cherry'];
  selectedValue = '';

  onSearch(term: string) {
    // Filter options based on search term
  }
}
```

## Features

- Real-time search with debounce
- Keyboard navigation (arrow keys, enter, escape)
- Virtual scrolling for large datasets
- Customizable templates
- Accessibility support
npm package: @muxima-ui/breadcrumb
Description: Breadcrumb navigation component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# breadcrumb-breadcrumb

This library was generated with [Nx](https://nx.dev).

## Running unit tests

Run `nx test breadcrumb-breadcrumb` to execute the unit tests.
npm package: @muxima-ui/color-picker
Description: Color picker component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Color Picker Component

Seletor de cores avançado com suporte a múltiplos formatos, paletas predefinidas e criador de gradientes.

## 🎨 Recursos

- ✅ Sliders HSL interativos (Matiz, Saturação, Luminosidade)
- ✅ Formatos: HEX, RGB, HSL
- ✅ 3 paletas predefinidas (Material, Pastéis, Neutros)
- ✅ Criador de gradientes com ângulo ajustável
- ✅ Suporte a opacidade (alpha)
- ✅ Modo inline ou dropdown
- ✅ 3 tamanhos: small, medium, large
- ✅ Integração com Angular Forms (ngModel / FormControl)

## 📦 Instalação

```typescript
import { ColorPickerComponent } from '@muxima-ui/color-picker';

@Component({
  imports: [ColorPickerComponent]
})
```

## 🚀 Uso Básico

```html
<!-- Dropdown -->
<muxima-color-picker
  [(ngModel)]="selectedColor"
  (colorChange)="onColorChange($event)"
></muxima-color-picker>

<!-- Inline -->
<muxima-color-picker
  [inline]="true"
  [format]="'hex'"
  [(ngModel)]="color"
></muxima-color-picker>
```

## 📝 Propriedades

| Propriedade | Tipo | Padrão | Descrição |
|------------|------|---------|-----------|
| `format` | `'hex' \| 'rgb' \| 'hsl'` | `'hex'` | Formato de exibição da cor |
| `showPalettes` | `boolean` | `true` | Mostrar paletas de cores |
| `showGradient` | `boolean` | `false` | Mostrar criador de gradientes |
| `showAlpha` | `boolean` | `false` | Mostrar controle de opacidade |
| `inline` | `boolean` | `false` | Exibir sempre aberto |
| `disabled` | `boolean` | `false` | Desabilitar o componente |
| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` | Tamanho do botão trigger |
| `customPalettes` | `ColorPalette[]` | `[]` | Paletas personalizadas |

## 🎯 Eventos

| Evento | Tipo | Descrição |
|--------|------|-----------|
| `colorChange` | `ColorFormat` | Emitido quando a cor muda |
| `formatChange` | `'hex' \| 'rgb' \| 'hsl'` | Emitido quando o formato muda |

## 💡 Exemplos Avançados

### Com Gradientes

```html
<muxima-color-picker
  [showGradient]="true"
  [inline]="true"
></muxima-color-picker>
```

### Com Opacidade

```html
<muxima-color-picker
  [showAlpha]="true"
  [(ngModel)]="colorWithAlpha"
></muxima-color-picker>
```

### Paletas Personalizadas

```typescript
customPalettes: ColorPalette[] = [
  {
    name: 'Meu Tema',
    colors: ['#667eea', '#764ba2', '#f093fb', '#4facfe']
  }
];
```

```html
<muxima-color-picker
  [customPalettes]="customPalettes"
></muxima-color-picker>
```

## 🎨 Interface ColorFormat

```typescript
interface ColorFormat {
  hex: string;           // '#667eea'
  rgb: {                 // { r: 102, g: 126, b: 234 }
    r: number;
    g: number;
    b: number;
  };
  hsl: {                 // { h: 240, s: 76, l: 72 }
    h: number;
    s: number;
    l: number;
  };
}
```

## 🎨 Tema Muxima UI

Usa o gradiente característico: `linear-gradient(135deg, #667eea 0%, #764ba2 100%)`
npm package: @muxima-ui/command-palette
Description: Command Palette component for Angular 18+ - Ctrl+K quick actions - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Command Palette

Paleta de comandos com busca fuzzy e atalhos de teclado, inspirada no VSCode e Spotlight.

## Instalação

```bash
npm install @muxima-ui/command-palette
```

## Uso Básico

```typescript
import { CommandPaletteComponent, CommandItem } from '@muxima-ui/command-palette';

commands: CommandItem[] = [
  {
    id: 'nav-home',
    label: 'Ir para Home',
    icon: '🏠',
    category: 'Navegação',
    shortcut: 'Ctrl+H',
    action: () => this.navigateTo('/'),
    keywords: ['home', 'início']
  }
];
```

```html
<muxima-command-palette
  [commands]="commands"
  placeholder="Digite um comando..."
  (commandExecuted)="onCommandExecuted($event)">
</muxima-command-palette>
```

## Features

- ⚡ Atalho global (Ctrl+K)
- 🔍 Busca fuzzy inteligente
- ⌨️ Navegação por teclado
- 🎯 Organização por categorias
- 🎨 Totalmente customizável

## Atalhos de Teclado

- **Ctrl+K** - Abrir/Fechar
- **↑↓** - Navegar
- **Enter** - Executar
- **ESC** - Fechar

## Documentação Completa

Visite a documentação completa em `/components/command-palette`
npm package: @muxima-ui/comments
Description: Advanced comments system for Angular 18+ with replies, reactions, and mentions - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.1

# 💬 @muxima-ui/comments# Comments Section



> Advanced comments system for Angular 18+ with replies, reactions, and mentionsSistema completo de comentários com replies aninhadas, edição, curtidas e suporte a ControlValueAccessor.



[![npm version](https://img.shields.io/npm/v/@muxima-ui/comments.svg)](https://www.npmjs.com/package/@muxima-ui/comments)## Instalação

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

```bash

## 📦 Installationnpm install @muxima-ui/comments

```

```bash

npm install @muxima-ui/comments## Uso Básico

```

```typescript

## 🚀 Quick Startimport { CommentsComponent, Comment } from '@muxima-ui/comments';



```typescript@Component({

import { Component } from '@angular/core';  standalone: true,

import { CommentsComponent } from '@muxima-ui/comments';  imports: [CommentsComponent],

  template: `

@Component({    <muxima-comments

  selector: 'app-root',      [comments]="comments"

  standalone: true,      [currentUser]="user"

  imports: [CommentsComponent],      (commentAdded)="onCommentAdded($event)">

  template: `    </muxima-comments>

    <muxima-comments  `

      [comments]="comments"})

      [currentUser]="currentUser"export class MyComponent {

      (commentAdded)="onCommentAdded($event)">  user = { name: 'João Silva', avatar: 'avatar.jpg' };

    </muxima-comments>  comments: Comment[] = [];

  `

})  onCommentAdded(comment: Comment) {

export class AppComponent {    console.log('Novo comentário:', comment);

  currentUser = {  }

    id: '1',}

    name: 'John Doe',```

    avatar: 'https://i.pravatar.cc/150?img=1'

  };## Features



  comments = [- ✅ Comentários aninhados (replies)

    {- ✅ Edição e exclusão

      id: '1',- ✅ Sistema de curtidas

      user: this.currentUser,- ✅ Ordenação (recentes, antigos, curtidos)

      text: 'Great component!',- ✅ Avatares automáticos com iniciais

      timestamp: new Date(),- ✅ Timestamps relativos

      replies: []- ✅ ControlValueAccessor

    }- ✅ Tema roxo Muxima

  ];

## Licença

  onCommentAdded(comment: any) {

    console.log('New comment:', comment);MIT

  }
}
```

## ✨ Features

- ✅ Sistema de replies (respostas)
- ✅ Reactions (reações)
- ✅ Mentions (@user)
- ✅ Timestamps
- ✅ Avatar do usuário
- ✅ TypeScript support
- ✅ Responsive design

## 📚 Documentation

**Full documentation:** https://muxima-ui.vercel.app

**Component docs:** https://muxima-ui.vercel.app/components/comments

## 🔗 Links

- [NPM Package](https://www.npmjs.com/package/@muxima-ui/comments)
- [GitHub Repository](https://github.com/Aldemiro20/muxima-ui)
- [Documentation](https://muxima-ui.vercel.app)
- [Report Issues](https://github.com/Aldemiro20/muxima-ui/issues)

## 📝 License

MIT © Muxima UI Team
npm package: @muxima-ui/copy-to-clipboard
Description: Copy to clipboard component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Copy to Clipboard

Componente de cópia para clipboard com feedback visual e suporte a diferentes navegadores.

## Instalação

```bash
npm install @muxima-ui/copy-to-clipboard
```

## Uso Básico

```typescript
import { CopyToClipboardComponent } from '@muxima-ui/copy-to-clipboard';

@Component({
  standalone: true,
  imports: [CopyToClipboardComponent],
  template: `
    <muxima-copy-to-clipboard
      content="Texto para copiar"
      (copied)="onCopied($event)">
    </muxima-copy-to-clipboard>
  `
})
export class MyComponent {
  onCopied(text: string) {
    console.log('Copiado:', text);
  }
}
```

## API

### Inputs
- `content`: string - Conteúdo a ser copiado
- `label`: string - Label do botão
- `variant`: 'button' | 'icon' | 'inline' - Estilo do botão
- `size`: 'small' | 'medium' | 'large' - Tamanho
- `showFeedback`: boolean - Mostra feedback visual
- `showTooltip`: boolean - Mostra tooltip ao hover

### Outputs
- `copied`: EventEmitter<string> - Emitido quando copiado
- `error`: EventEmitter<Error> - Emitido em caso de erro

## Licença

MIT
npm package: @muxima-ui/image-cropper
Description: Image cropper component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Image Cropper

Componente de crop de imagens com zoom, rotação e preview em tempo real.

## Instalação

```bash
npm install @muxima-ui/image-cropper
```

## Uso

```typescript
import { ImageCropperComponent } from '@muxima-ui/image-cropper';

@Component({
  standalone: true,
  imports: [ImageCropperComponent],
  template: `
    <muxima-image-cropper
      [imageUrl]="imageUrl"
      (imageCropped)="onImageCropped($event)">
    </muxima-image-cropper>
  `
})
export class MyComponent {
  onImageCropped(result: CropResult) {
    console.log('Imagem cortada:', result);
  }
}
```

## Licença

MIT
npm package: @muxima-ui/kanban
Description: Kanban Board component for Angular 18+ with drag & drop - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.1

# 📋 @muxima-ui/kanban# Kanban



> Kanban Board component for Angular 18+ with drag & dropQuadro Kanban completo com drag & drop, limites WIP e busca integrada.



[![npm version](https://img.shields.io/npm/v/@muxima-ui/kanban.svg)](https://www.npmjs.com/package/@muxima-ui/kanban)## Instalação

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

```bash

## 📦 Installationnpm install @muxima-ui/kanban @angular/cdk

```

```bash

npm install @muxima-ui/kanban## Uso Básico

```

```typescript

## 🚀 Quick Startimport { KanbanComponent } from '@muxima-ui/kanban';



```typescriptcolumns = [

import { Component } from '@angular/core';  {

import { KanbanComponent } from '@muxima-ui/kanban';    id: 'todo',

    title: 'A Fazer',

@Component({    color: '#667eea',

  selector: 'app-root',    cards: [...]

  standalone: true,  }

  imports: [KanbanComponent],];

  template: ````

    <muxima-kanban 

      [boards]="boards"```html

      (taskMoved)="onTaskMoved($event)"><muxima-kanban

    </muxima-kanban>  [columns]="columns"

  `  [showSearch]="true"

})  [showLimits]="true"

export class AppComponent {  (cardMoved)="onCardMoved($event)">

  boards = [</muxima-kanban>

    {```

      id: '1',

      title: 'To Do',## Features

      tasks: [

        { id: '1', title: 'Task 1', description: 'Description' }- 🎯 Drag & Drop com Angular CDK

      ]- 🔍 Busca em tempo real

    }- ⚡ Limites WIP (Work In Progress)

  ];- 🎨 Customizável (cores, prioridades)

- 📱 Responsivo

  onTaskMoved(event: any) {

    console.log('Task moved:', event);## Documentação Completa

  }

}Visite a documentação completa em `/components/kanban`

```

## ✨ Features

- ✅ Drag & Drop entre colunas
- ✅ Gerenciamento de tarefas
- ✅ Totalmente customizável
- ✅ Angular 18+ com CDK
- ✅ TypeScript support
- ✅ Responsive design

## 📚 Documentation

**Full documentation:** https://muxima-ui.vercel.app

**Component docs:** https://muxima-ui.vercel.app/components/kanban

## 🔗 Links

- [NPM Package](https://www.npmjs.com/package/@muxima-ui/kanban)
- [GitHub Repository](https://github.com/Aldemiro20/muxima-ui)
- [Documentation](https://muxima-ui.vercel.app)
- [Report Issues](https://github.com/Aldemiro20/muxima-ui/issues)

## 📝 License

MIT © Muxima UI Team
npm package: @muxima-ui/notification-center
Description: Notification center component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Notification Center

Centro de notificações com painel, toasts e gerenciamento completo.

## Instalação

```bash
npm install @muxima-ui/notification-center
```

## Uso

```typescript
import { NotificationCenterComponent } from '@muxima-ui/notification-center';

@Component({
  standalone: true,
  imports: [NotificationCenterComponent],
  template: `
    <muxima-notification-center
      [notifications]="notifications"
      [position]="'top-right'"
      (notificationRead)="onRead($event)">
    </muxima-notification-center>
  `
})
export class MyComponent {
  notifications = [
    {
      id: '1',
      type: 'success',
      title: 'Sucesso!',
      message: 'Operação concluída',
      timestamp: new Date(),
      read: false
    }
  ];

  onRead(id: string) {
    console.log('Notification read:', id);
  }
}
```

## Licença

MIT
npm package: @muxima-ui/stepper
Description: Stepper/wizard component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Stepper

## Como instalar

```bash
npm install @agt-ui/stepper --registry http://massinga.minfin.gov.ao:4873/
```

### Imports

```diff
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';

+ import { StepsComponent } from '@agt-ui/steps'

@NgModule({
  declarations: [AppComponent],
  + imports: [BrowserModule, StepsComponent],
  + exports: [StepsComponent],
})
export class AppModule {}
```

### Como funciona

O exemplo abaixo mostra a lógica para implementação padrão do componente

```
+ import { StepsComponent } from '@agt-ui/steps'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  currentStep = 1

  @ViewChild(StepperComponent) stepper!: StepperComponent;

  handleNextStep() {
    this.stepper.next()
  }

  handlePrevStep() {
    this.stepper.prev()
  }

 steps: Array<string> = [
     'Detalhes do agente econômico',
     'Detalhes do proprietário',
     'Situação fiscal',
     'Informações da visita',
     'Resumo'
   ];
}

```

#### Explicação
- **steps**: Um array de strings responsável por fornecer os passos para o step

- **currentPage**: recebe o numero do passo atual [começa com 1]

- **handleNextStep**: função para avançar para o próximo passo

- **handlePrevStep**: função para voltar para o passo anterior


#### A seguir a utilização do componente no arquivo .html

```
<agt-stepper [steps]="steps" [(currentStep)]="currentStep" />


<div *ngIf="currentPage === 1">
  <p>Detalhes de agente economico</p>
</div>

<div *ngIf="currentPage === 2">
  <p>Detalhes do proprietário</p>
</div>

<div *ngIf="currentPage === 3">
  <p>Situação fiscal</p>
</div>
```


## Storybook

Consulte o Storybook para visualizar o componente

- [@Storybook](http://camuine06.minfin.gov.ao:86/)
npm package: @muxima-ui/video-player
Description: Video player component for Angular 18+ - Muxima UI
Author: Muxima UI Team
Latest version: 1.0.0

# Video Player

Componente de player de vídeo com controles personalizados, legendas e múltiplas qualidades.

## Instalação

```bash
npm install @muxima-ui/video-player
```

## Uso

```typescript
import { VideoPlayerComponent } from '@muxima-ui/video-player';

@Component({
  standalone: true,
  imports: [VideoPlayerComponent],
  template: `
    <muxima-video-player
      [sources]="videoSources"
      [subtitles]="subtitles"
      [config]="config">
    </muxima-video-player>
  `
})
export class MyComponent {
  videoSources = [
    { src: 'video-720p.mp4', type: 'video/mp4', quality: '720p' },
    { src: 'video-1080p.mp4', type: 'video/mp4', quality: '1080p' }
  ];

  subtitles = [
    { src: 'pt-br.vtt', srclang: 'pt-BR', label: 'Português' }
  ];

  config = {
    autoplay: false,
    loop: false,
    muted: false
  };
}
```

## Licença

MIT
npm package: @muxiu1997/define-emitter-composable
Description: Creates a Vue composable function for providing or injecting a mitt event emitter.
Author: MuXiu1997
Latest version: 0.1.0-rc.1
Deprecated: Deprecated: Move to `@muxiu1997/vue-use-emitter`

# define-emitter-composable
Creates a Vue composable function for providing or injecting a mitt event emitter.

## Install
```bash
$ npm install define-emitter-composable
```

```js
import defineEmitterComposable from 'define-emitter-composable'
```

## Usage
```js
// Creates a composable function for providing or injecting a mitt event emitter.
const useFooEmitter = defineEmitterComposable<{ bar: string, baz: number }>({ key: Symbol('bar') , throwOnNoProvider: () => new Error('No provider for bar') })
const useBarEmitter = defineEmitterComposable()
                                                                                                                                                               
// In a Vue component setup
setup() {
  const fooEmitter = useFooEmitter('provide') // Provides an emitter
  fooEmitter.on('bar', (payload) => {
    // Handle the event
  })
                                                                                                                                                               
  // Or inject an existing event emitter
  const injectedBarEmitter = useFooEmitter() // Or `useFooEmitter('inject')`
  injectedFooEmitter.emit('bar', 'bar')
  injectedFooEmitter.emit('baz', 123)
                                                                                                                                                               
  // If `injectDefault` or `throwOnNoProvider` options are not set, the return value may be undefined
  const undefinedEmitter = useBarEmitter() // undefined
}
```

## License
[MIT](./LICENSE)
npm package: @muxiu1997/eslint-plugin
Description: MuXiu1997's ESLint rules
Author: MuXiu1997
Latest version: 1.1.0

<h1 align="center">@muxiu1997/eslint-plugin</h1>
<div align="center">
<a href="https://github.com/MuXiu1997/eslint-plugin/actions/workflows/release.yml"><img alt="CI" src="https://img.shields.io/github/actions/workflow/status/MuXiu1997/eslint-plugin/release.yml?branch=main&style=flat-square&label=CI"></a>
<a href="https://www.npmjs.com/package/@muxiu1997/eslint-plugin"><img alt="npm version" src="https://img.shields.io/npm/v/@muxiu1997/eslint-plugin?style=flat-square&color=orange"></a>
<a href="LICENSE"><img alt="LICENSE" src="https://img.shields.io/github/license/MuXiu1997/eslint-plugin?style=flat-square"></a>
</div>
<br/>
<div align="center">MuXiu1997's personal ESLint rules.</div>

---

## 📦 Install

```bash
npm install -D @muxiu1997/eslint-plugin
```

## 📖 Usage

### Manual setup

Register the plugin and enable rules in your `eslint.config.js`:

```js
import muxiu1997 from '@muxiu1997/eslint-plugin'

export default [
  {
    plugins: {
      muxiu1997,
    },
    rules: {
      'muxiu1997/if-empty-return-same-line': 'error',
      'muxiu1997/if-non-empty-return-new-line': 'error',
    },
  },
]
```

### Preset (with `@antfu/eslint-config`)

If you use [`@antfu/eslint-config`](https://github.com/antfu/eslint-config), the `/preset` subpath bundles the plugin, all rules, and turns off the conflicting `antfu/if-newline` rule:

```js
import antfu from '@antfu/eslint-config'
import muxiu1997Preset from '@muxiu1997/eslint-plugin/preset'

export default antfu({ ... }).append(muxiu1997Preset)
```

## 📏 Rules

### `muxiu1997/if-empty-return-same-line`

Enforces that an empty `return` (guard clause) stays on the **same line** as the `if`.

```js
// ✅ Correct
if (condition) return

// ❌ Incorrect
if (condition)
  return
```

> 🔧 Auto-fixable.

---

### `muxiu1997/if-non-empty-return-new-line`

Enforces that a non-empty statement after a braceless `if` is on a **new line**.

```js
// ✅ Correct
if (condition)
  doSomething()

// ❌ Incorrect
if (condition) doSomething()
```

> 🔧 Auto-fixable.

## 🛠 Development

### Prerequisites

- [Node.js](https://nodejs.org/) >= 18
- [pnpm](https://pnpm.io/)

### Setup

```bash
git clone https://github.com/MuXiu1997/eslint-plugin.git
cd eslint-plugin
pnpm install
```

### Scripts

- `pnpm run build` — Build the plugin.
- `pnpm run dev` — Build in watch mode.
- `pnpm run lint` — Lint and auto-fix.
- `pnpm run test` — Run tests.
- `pnpm run typecheck` — Type-check without emitting.

## 📜 License

This project is licensed under the [MIT License](LICENSE).
npm package: @muxiu1997/let-also
Description: A tiny library inspired by Kotlin, designed for call chaining in JavaScript / TypeScript.
Author: MuXiu1997
Latest version: 0.1.0-beta.20240819

<h1 align="center">@MuXiu1997/let-also</h1>
<div align="center">
<img alt="GitHub Workflow Status" src="https://img.shields.io/github/actions/workflow/status/muxiu1997/let-also/release.yml?branch=main&style=flat-square">
<a href="LICENSE"><img alt="LICENSE" src="https://img.shields.io/github/license/muxiu1997/let-also?style=flat-square"></a>
<a href="https://github.com/muxiu1997/let-also/releases/latest"><img alt="Releases" src="https://img.shields.io/github/v/release/muxiu1997/let-also?style=flat-square&display_name=tag&include_prereleases&sort=semver"></a>
<a href="https://www.npmjs.com/package/@muxiu1997/let-also"><img alt="NPM" src="https://img.shields.io/npm/v/%40muxiu1997%2Flet-also?style=flat-square"></a>
</div>
<br/>
<div align="center">A tiny library inspired by Kotlin, designed for call chaining in JavaScript / TypeScript.</div>

## Install

```bash
$ npm install @muxiu1997/let-also
```

## Quick Start

```typescript
import { wrap } from '@muxiu1997/let-also'

const result = wrap(Math.random() * 100)
  .also(it => console.log(`Random number: ${it}`))
  .takeIf(it => it > 50)
  ?.let(it => it * 2)
```

## License

[MIT](./LICENSE)
npm package: @muxiu1997/vue-easy-di
Description: Type-safe dependency injection for Vue, simplified into a single composable.
Author: MuXiu1997
Latest version: 1.0.0

<h1 align="center">vue-easy-di</h1>
<div align="center">
<a href="https://github.com/MuXiu1997/vue-easy-di/actions/workflows/ci.yml"><img alt="CI" src="https://img.shields.io/github/actions/workflow/status/MuXiu1997/vue-easy-di/ci.yml?branch=main&style=flat-square&label=CI"></a>
<a href="https://www.npmjs.com/package/@muxiu1997/vue-easy-di"><img alt="npm version" src="https://img.shields.io/npm/v/@muxiu1997/vue-easy-di?style=flat-square&color=orange"></a>
<a href="LICENSE"><img alt="LICENSE" src="https://img.shields.io/github/license/MuXiu1997/vue-easy-di?style=flat-square"></a>
</div>
<br/>
<div align="center">Type-safe dependency injection for <a href="https://vuejs.org/">Vue</a>, simplified into a single composable.</div>

---

## 📦 Install

```bash
npm install @muxiu1997/vue-easy-di
```

## 📖 Usage

### Basic

```typescript
import defineUseDependencyInjection from '@muxiu1997/vue-easy-di'

// Define a DI composable
const useFoo = defineUseDependencyInjection<Foo>()

// Provide in parent component
useFoo('provide', () => new Foo())

// Inject in child component
const foo = useFoo() // foo: Foo | undefined
const foo = useFoo('inject') // equivalent
```

### With Default Initializer

```typescript
// The initializer is called automatically in provide mode
const useFoo = defineUseDependencyInjection(() => new Foo())

useFoo('provide') // uses default initializer
useFoo('provide', () => new Bar()) // overrides initializer
const foo = useFoo() // foo: Foo | undefined
```

### With Inject Default

```typescript
// Fallback value when no provider is found
const useFoo = defineUseDependencyInjection<Foo>({
  injectDefault: () => Foo.empty(),
})

const foo = useFoo() // foo: Foo (never undefined)
```

### With Throw On No Provider

```typescript
// Throws when no provider is found
const useFoo = defineUseDependencyInjection<Foo>({
  throwOnNoProvider: () => new Error('Foo provider is required'),
})

const foo = useFoo() // foo: Foo (throws if no provider)
```

### Override Options at Inject Site

```typescript
const useFoo = defineUseDependencyInjection<Foo>()

// Override injectDefault
const foo = useFoo('inject', { injectDefault: () => Foo.empty() })

// Override throwOnNoProvider
const foo = useFoo('inject', { throwOnNoProvider: () => new Error('missing') })
```

## 🛠 Development

### Prerequisites

- [Node.js](https://nodejs.org/) >= 24
- [pnpm](https://pnpm.io/)

### Setup

```bash
git clone https://github.com/MuXiu1997/vue-easy-di.git
cd vue-easy-di
pnpm install
```

### Scripts

- `pnpm run lint` — Lint and auto-fix.
- `pnpm run test` — Run tests with type checking.
- `pnpm run coverage` — Run tests with coverage report.
- `pnpm run build` — Build the library.

## 📜 License

This project is licensed under the [MIT License](LICENSE).
npm package: @muxiu1997/vue-use-cancellable-async-state
Description: Cancellable version of VueUse `useAsyncState`.
Author: MuXiu1997
Latest version: 0.1.0-rc.1

# vue-use-cancellable-async-state
Cancellable version of VueUse `useAsyncState`

## Install
```bash
$ npm install @muxiu1997/vue-use-cancellable-async-state
```

```js
import useCancellableAsyncState from '@muxiu1997/vue-use-cancellable-async-state'
```

## Usage
```typescript
import axios from 'axios'
import useCancellableAsyncState from '@muxiu1997/vue-use-cancellable-async-state'

const { state, isReady, isLoading } = useCancellableAsyncState(
  (onCancel) => {
    const abortController = new AbortController()

    onCancel(() => abortController.abort())

    const id = args?.id || 1
    return axios.get(
      `https://jsonplaceholder.typicode.com/todos/${id}`,
      { signal: abortController.signal },
    )
  },
  {},
)
```

## License
[MIT](./LICENSE)
npm package: @muxiu1997/vue-use-emitter
Description: A Vue composable event emitter library based on mitt, featuring an `autoOff` method for automatic call `off` on component unmount and dependency injection for ease of use, simplifying inter-component communication with minimal code.
Author: MuXiu1997
Latest version: 0.1.0-rc.8

# vue-use-emitter
A Vue composable event emitter library based on mitt, featuring an `autoOff` method for automatic call `off` on component unmount and dependency injection for ease of use, simplifying inter-component communication with minimal code.

## Install
```bash
$ npm install @muxiu1997/vue-use-emitter
```

```js
import defineEmitterComposable from '@muxiu1997/vue-use-emitter'
```

## Usage
```typescript
// Defining an emitter composable
const useMyEmitter = defineEmitterComposable<MyEvents>({ key: 'myEmitterKey' });

// Providing an emitter at the parent component
const parentComponent = defineComponent({
  setup() {
    const myEmitter = useMyEmitter('provide');
    myEmitter.emit('myEvent', 'Hello world!');
  }
});

// Injecting an emitter in a child component
const childComponent = defineComponent({
  setup() {
    const myEmitter = defineEmitterComposable<MyEvents>({ key: 'myEmitterKey' })('inject');
    myEmitter.autoOff('myEvent', () => console.log('Event received'));
  }
});

// Using with default emitter
const useDefaultEmitter = defineEmitterComposable<MyEvents>({
  key: 'myEmitterKey',
  injectDefault: () => wrapAutoOff(mitt())
})();

// Throwing error when no provider is found
const useStrictEmitter = defineEmitterComposable<MyEvents>({
  key: 'myEmitterKey',
  throwOnNoProvider: () => new Error('Emitter not found')
})();
```

## License
[MIT](./LICENSE)
npm package: @muxmuxmux/core
Description: Typesafe state-dependent behavior for modern apps
Author: Vadim Kotov
Latest version: 0.1.1

# @muxmuxmux/core

Core library for typesafe state-dependent behavior.

## Install

```bash
pnpm add @muxmuxmux/core
```

## Documentation

See the [main repository](https://github.com/vadirn/muxmuxmux) for full documentation and examples.

## License

MIT
npm package: @muxmuxmux/react
Description: React bindings for muxmuxmux
Author: Vadim Kotov
Latest version: 0.1.2

# @muxmuxmux/react

React bindings for muxmuxmux.

## Installation

```bash
npm install @muxmuxmux/react
```

## Usage

```tsx
import { useController } from "@muxmuxmux/react";

function Button() {
	const handleClick = async () => {
		button.set("loading");
		try {
			await submitForm();
			button.set("idle");
		} catch (error) {
			button.set("error");
		}
	};

	const button = useController("idle", {
		idle: { onClick: handleClick },
		loading: {},
		error: { onClick: handleClick }, // Retry on error
	});

	const state = button.get();

	return (
		<button
			onClick={button.onClick}
			disabled={state === "loading"}
		>
			{state === "loading" ? "Loading..." : "Submit"}
		</button>
	);
}
```

## API

### `useController(defaultState, methods)`

Hook that creates a controller and subscribes to its state changes.

**Parameters:**
- `defaultState` - The initial state
- `methods` - State-dependent methods object

**Returns:**
- The controller instance with reactive state

## License

MIT