# sapphire-plugin-modal-commands

> This plugin allows Discord bots using the [Sapphire Framework](https://npmjs.com/package/@sapphire/framework) to include modal submit logic in the same file as other command logic.

Latest version **2.0.2** (published 2023-03-31) · MIT license · 0 weekly downloads

> **Deprecated.** This package is deprecated.

## Install

```sh
npm install sapphire-plugin-modal-commands
pnpm add sapphire-plugin-modal-commands
yarn add sapphire-plugin-modal-commands
bun add sapphire-plugin-modal-commands
```

## Health

**Score 10/100 (F)** — status: deprecated.

Negative: deprecated.

## Facts

| | |
|---|---|
| Version | 2.0.2 |
| Published | 2023-03-31 |
| First published | 2022-06-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 22.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Harry Allen |
| Maintainers | majesticstring |
| Keywords | sapphire, plugin, modal, commands, discord.js, discord, discord-modals, modals, typescript, esm, bot |

## Links

- npm: https://www.npmjs.com/package/sapphire-plugin-modal-commands
- Repository: https://github.com/MajesticString/sapphire-plugin-modal-commands
- Homepage: https://github.com/MajesticString/sapphire-plugin-modal-commands#readme
- Issues: https://github.com/MajesticString/sapphire-plugin-modal-commands/issues
- npm.io page: https://npm.io/package/sapphire-plugin-modal-commands

## Dependencies (2)

- [tslib](https://npm.io/package/tslib.md) ^2.5.0
- [discord.js](https://npm.io/package/discord.js.md) ^14.8.0

## Alternatives

- [@openai/codex-sdk](https://npm.io/package/@openai/codex-sdk.md) — 731.4K weekly downloads
- [babel-plugin-transform-react-jsx](https://npm.io/package/babel-plugin-transform-react-jsx.md) — 565.0K weekly downloads
- [babel-helper-remove-or-void](https://npm.io/package/babel-helper-remove-or-void.md) — 508.5K weekly downloads
- [@pnpm/store-controller-types](https://npm.io/package/@pnpm/store-controller-types.md) — 186.9K weekly downloads
- [react-native-signature-canvas](https://npm.io/package/react-native-signature-canvas.md) — 155.6K weekly downloads

## Recent versions

- 2.0.2 (latest) — 2023-03-31
- 2.0.1 — 2023-03-31
- 2.0.0 — 2023-03-31
- 1.0.9 — 2022-08-24
- 1.0.8 — 2022-06-24
- 1.0.7 — 2022-06-22
- 1.0.6 — 2022-06-22
- 1.0.5 — 2022-06-20
- 1.0.4 — 2022-06-18
- 1.0.3 — 2022-06-04
- 1.0.2 — 2022-06-04
- 1.0.1 — 2022-06-04
- 1.0.0 — 2022-06-04

## README

# Sapphire Plugin Modal Commands

This plugin allows Discord bots using the [Sapphire Framework](https://npmjs.com/package/@sapphire/framework) to include modal submit logic in the same file as other command logic.

Example:

Typescript:

```ts
// src/lib/setup.ts
import 'sapphire-plugin-modal-commands/register';

// src/commands/modal.ts
import { Command, SapphireClient } from '@sapphire/framework';
import {
  ActionRowBuilder,
  ModalBuilder,
  ModalActionRowComponentBuilder,
  ModalSubmitInteraction,
  TextInputComponent,
  TextInputStyle,
} from 'discord.js';

export class UserCommand extends Command {
  constructor(ctx: Command.Context, options: Command.Options) {
    super(ctx, {
      ...options,
      name: 'example',
      chatInputCommand: {
        register: true,
      },
    });
  }

  chatInputRun(interaction: Command.ChatInputInteraction) {
    interaction.showModal(
      new ModalBuilder()
        .setTitle('Modal Example')
        // format: (command name)--(customId)
        // The separator can be changed in the client options (options.modalCommands.separator)
        .setCustomId('example--example-modal')
        .addComponents(
          new ActionRowBuilder<ModalActionRowComponentBuilder>().addComponents(
            new TextInputComponent()
              .setLabel('Example Input')
              .setCustomId('example-input')
              .setStyle(TextInputStyle.Short)
              .setRequired(true)
          )
        )
    );
  }

  // Triggered on the modal submit
  modalRun(interaction: ModalSubmitInteraction) {
    interaction.reply('Submitted!');
  }
}
```

---
_Source: https://npm.io/package/sapphire-plugin-modal-commands · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._