0.0.17 • Published 12 months ago

console-play v0.0.17

Weekly downloads
-
License
MIT
Repository
github
Last release
12 months ago

ConsolePlay: A Fancy Console Output Library

ConsolePlay is a library that provides a way to output fancy and styled text in the browser console using Figlet fonts and custom style options.

Quick Start

Install:

npm install console-play

Simple usage:

import { consolePlay } from "console-play";

consolePlay({
    text: "Hello, World!",
    options: {
        styleOptions: {
            color: "red",
        },
    },
});

In console:

Features

  • Output text using Figlet fonts (currently only Standard, but more Figlet fonts will be supported in the future).
  • Custom styling options for the console output
  • Dark mode support

API

consolePlay

PropertyTypeRequiredDefaultDescription
textstringYesN/AThe text to be output in the console.
optionsConsolePlayPropsNoN/AAn object containing configuration options for the console output.

Option

PropertyTypeRequiredDefaultDescription
consoleType"log", "info", "warn", "error"No"log"The type of console output (e.g., log, error, warn, etc.).
wrapUnitstringNoN/AA string representing the character(s) to wrap around the text. this prop is alpha version. so it may not work.
styleOptionsStyleOptionsYesN/AAn object containing the style options for the console output.
styleDebugbooleanNofalseA boolean flag to enable/disable style debugging.if true then console.log CSS style will be applied

Style Options

Style options is unfinished. So, it may not work except color and backGroundColor.

PropertyTypeRequiredDefaultDescription
imageUrlstringYesN/AURL of the image to be displayed as a background image. if this prop set, then you also need to set padding to allocate place for image
colorHasThemeStyleNoN/AText color. Can be a single color or an object with light and dark properties (can automatically switch between dark or light mode depending on the user's environment).
backgroundColorHasThemeStyleNoN/ABackground color. Can be a single color or an object with light and dark properties (can automatically switch between dark or light mode depending on the user's environment).
display"inline-block" \| "block" \| "flex" \| "grid"NoN/ACSS display value.
paddingFourDirectionStyleNoN/APadding around the text. Can be a single number or an object with top, right, left, and bottom properties.
marginFourDirectionStyleNoN/AMargin around the text. Can be a single number or an object with top, right, left, and bottom properties.
boxShadowstringNoN/ACSS box-shadow value. such as box-shadow: 12px 12px 2px 1px rgba(0, 0, 255, .2);

The HasThemeStyle type is defined as follows:

type HasThemeStyle =
  | string
  | {
      light: string;
      dark: string;
    };

The FourDirectionStyle type is defined as follows:

type FourDirectionStyle =
  | number
  | {
      top?: number;
      right?: number;
      left?: number;
      bottom?: number;
    };

For more information on HasThemeStyle and FourDirectionStyle, please refer to the original code provided.

License

MIT © skyt-a

0.0.17

12 months ago

0.0.16

12 months ago

0.0.15

12 months ago

0.0.14

12 months ago

0.0.13

12 months ago

0.0.12

12 months ago

0.0.11

12 months ago

0.0.10

12 months ago

0.0.9

12 months ago

0.0.8

12 months ago

0.0.7

12 months ago

0.0.6

12 months ago

0.0.5

12 months ago

0.0.4

12 months ago

0.0.3

12 months ago

0.0.2

12 months ago

0.0.1

12 months ago