Custom Cards

Un simple módulo de manipulación de imágenes con Canvas, escrito en TypeScript.

Tabla de contenido

• Instalación

• Importar Módulo

• Tarjetas

• Métodos

  • Estáticos
  • Extras

• Clase Welcome

• Función render

• Detalles del proyecto

Instalación

npm install custom-cards

Uso

Importar módulo

• ESM:

import * as CustomCards from "custom-cards";

• CommonJS:

const CustomCards = require("custom-cards");

Tarjetas:

Los métodos disponibles al importar el módulo.

| Tarjeta | Tipo | | --------- | --------- | | Welcome | Class |

Métodos estáticos:

• <card>.render()

Métodos extras:

| Método | Tipo | Descripción | | ------------ | ---------- | ------------------------------------------ | | registerFont | Function | Registra tus propias fuentes tipográficas. | | Fonts | Enum | Enumerado con las fuentes por defecto. |

Clase Welcome:

| Método | Tipo | Descripción | | ------------------------ | ------------------------ | -------------------------------------------- | | setAvatar(options) | options: AvatarOptions | Establece el avatar de la tarjeta. | | setImage(src) | src: Source | Establece la imágen de fondo. (opcional) | | setFont(font) | font: Fonts \| string | Establece la fuente tipográfica. | | setText(options) | options: TextOptions[] | Establece el texto de la tarjeta. |

const card = new CustomCards.Welcome()
  .setAvatar({
    src: "https://yumikodev.vercel.app/avatar.webp",
    frameColor: "#ff7eae",
    frameType: "square",
  })
  .setBackground("https://cdn.nekos.life/wallpaper/cGsBtWbjaGs.jpg")
  .setText([
    {
      content: "Bienvenid@ usuario",
      color: "#fff",
    },
    {
      content: "Descripción aquí.",
      color: "#eee",
    },
  ])
  .setFont(CustomCards.Fonts.Fredoka);

Ejemplo:

Función render:

El uso de la función render (teoría).

[!NOTE] La función render es asíncrona, por lo que tendra que usar Promesas o async / await.

• Ejemplo de uso:

  Cada tarjeta tendrá un método estático que construirá la Tarjeta respectiva. A esta función se le debe pasar la instancia de la tarjeta.

  const buffer = await Welcome.render(card);
  
  console.log(buffer);

Detalles del proyecto:

• Licencia: MIT License
• Autor: Yasu Yumiko

Gracias :D