npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

codebook-terminal

v12.0.3

Published

A sleek React.js terminal emulator for enhanced user interaction...

Downloads

20

Readme

CodeBook Terminal 🚀

GitHub stars GitHub forks GitHub issues


🌈 Welcome to the Colorful World of CodeBook Terminal!

Elevate your coding experience with CodeBook Terminal – where functionality meets flair in the most colorful way possible! 🎨💻

Key Features

  • Sleek Design: A visually appealing terminal that turns coding into an immersive journey.

  • Customizable Themes: Tailor the appearance to match your coding personality.

  • User-Friendly Interface: Whether you're a pro or just starting, our terminal makes coding stylish and intuitive.

  • Dynamic Commands: Explore a plethora of available commands, each with its own distinct flavor.


Getting Started

  1. Installation:

    npm install codebook-terminal
  2. Usage:

    import CodebookTerminal from "codebook-terminal";
    
    // Your code here
  3. Customization: Explore the themes folder for exciting theme options!


Let's Get Coding! 🚀

Ready to unleash your creativity? Dive into CodeBook Terminal and let every line of code become a stroke of brilliance! 🌟


Terminal Component README

Welcome to the README for the Terminal component! 🚀 This versatile React component allows you to create an interactive terminal experience in your applications.

Props

setUserInput

  • Type: Function
  • Description: Callback function to handle user input.

userOutput

  • Type: String
  • Description: Output from user commands or responses.

mode

  • Type: String
  • Description: Determines the mode of the terminal (e.g., "command" or "progressBar").

userCommand

  • Type: Object
  • Description: Custom user commands to extend the functionality of the terminal.

background

  • Type: String (Hex Color)
  • Default: #292929
  • Description: Background color of the terminal.

welcomeMessage

  • Type: String
  • Default: "Welcome to the Terminal! 🚀\nFeel free to explore and type 'help' for a list of available commands."
  • Description: Initial message displayed when the terminal is loaded.

textColor

  • Type: String (Hex Color)
  • Default: #dbd8d5
  • Description: Text color of the terminal.

promtColor

  • Type: String (Hex Color)
  • Default: #d6994a
  • Description: Prompt text color.

promtText

  • Type: String
  • Default: "$"
  • Description: Text displayed in the prompt.

progressBarColor

  • Type: String (Hex Color)
  • Default: #50f50f
  • Description: Color of the progress bar.

progres

  • Type: Number
  • Default: 0
  • Description: Progress value for the progress bar.

Example Usage

import CodebookTerminal from "codebook-terminal";

const MyTerminalApp = () => {
  return (
    <CodebookTerminal
      setUserInput={handleUserInput}
      userOutput={outputMessage}
      mode="command"
      userCommand={{ customCommand: { description: "Custom command", usage: "customCommand", fn: () => {} } }}
      background="#292929"
      welcomeMessage="Welcome to My App!"
      textColor="#dbd8d5"
      promtColor="#d6994a"
      promtText="$"
      progressBarColor="#50f50f"
      progres={50}
    />
  );
};

export default MyTerminalApp;


Alt text

###Progress Bar 🎉🎉🎉

Alt text

🤝 Contributing

We welcome contributions! Feel free to open issues, submit pull requests, or share your feedback.

📝 License

This project is licensed under the MIT License.

👤 Author

[Adithyan M]


Enjoy coding with CodeBook Terminal – where coding meets creativity!

Made with Love