enerthya.dev-modal

Camada comum de modais para o ecossistema Enerthya. Inspirado em luna:modal-common (Loritta/MrPowerGamerBR).

Framework-agnostic — define tipos, constantes, factory e estilos dark-glass. A dashboard integra via React portal + hook useModal.

Instalação

npm install enerthya.dev-modal

O que está incluído

Constantes

const { MODAL_TYPES, MODAL_ACTION_TYPES } = require("enerthya.dev-modal");

MODAL_TYPES.CONFIRM   // "confirm" — confirmação neutra (azul/índigo)
MODAL_TYPES.INFO      // "info"    — informativo (blurple)
MODAL_TYPES.WARNING   // "warning" — atenção (âmbar)
MODAL_TYPES.DANGER    // "danger"  — ação destrutiva (vermelho)

MODAL_ACTION_TYPES.CONFIRM  // "confirm"
MODAL_ACTION_TYPES.CANCEL   // "cancel"
MODAL_ACTION_TYPES.CUSTOM   // "custom"

Factory

const {
  createModal, createModalAction,
  createConfirmModal, createDangerModal,
  createInfoModal, createWarningModal,
  isModal
} = require("enerthya.dev-modal");

// Shorthand — casos de uso mais comuns:
createConfirmModal("Salvar alterações?", "As mudanças serão aplicadas imediatamente.");
createDangerModal("Apagar cargo", "Esta ação é permanente.", { confirmLabel: "Sim, apagar" });
createInfoModal("Dica", "Você pode usar {member:name} para personalizar mensagens.");
createWarningModal("Atenção", "Este módulo pode afetar todos os membros.");

// Avançado — modal totalmente customizado:
const m = createModal("danger", "Título", "Mensagem", [
  createModalAction("cancel",  "Cancelar"),
  createModalAction("confirm", "Confirmar"),
]);

// Type guard:
isModal(m) // true

Estilos

const { getModalStyle, getButtonStyle, MODAL_GRADIENTS } = require("enerthya.dev-modal");

getModalStyle("danger")
// → { overlay, container, iconBg, iconBorder, iconEmoji, confirmButton, cancelButton }

getButtonStyle("danger", "confirm")
// → { background: "rgba(239,68,68,...)", border: "..." }

Uso na dashboard (com React)

Hook useModal

import useModal from "@hooks/useModal";

const { confirm, danger, info, warning } = useModal();

// Retorna Promise<boolean> — true = usuário confirmou
const ok = await confirm("Salvar?", "As alterações serão aplicadas.");
if (ok) { ... }

// Ação destrutiva com visual vermelho
const del = await danger("Remover aviso", "Esta ação não pode ser desfeita.");
if (del) { ... }

// Modal informacional — aguarda o usuário fechar
await info("Dica", "Use {member:name} nas mensagens personalizadas.");

// Avançado — factory manual + open()
import { createDangerModal } from "enerthya.dev-modal";
const { open } = useModal();
const { actionType, payload } = await open(
  createDangerModal("Apagar", "Permanente.", { payload: { id: "abc" } })
);

Setup (App.jsx — já feito)

import { ModalProvider } from "@ui/ModalContext";
import ModalRenderer    from "@ui/Modal";

<ModalProvider>
  <BrowserRouter>
    <ModalRenderer />
    <Routes>...</Routes>
  </BrowserRouter>
</ModalProvider>

Testes

node test.js
# Total: 55 | ✅ 55 passed | ❌ 0 failed

Inspiração

luna:modal-common — módulo interno da Loritta (MrPowerGamerBR). Adaptado de Kotlin/KMP para JavaScript/Node.js com foco na dashboard da Enerthya.