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 🙏

© 2026 – Pkg Stats / Ryan Hefner

@duongtdn/style-factory

v1.0.0

Published

## Overview

Readme

Style Factory

Overview

The Style Factory is a JavaScript class designed to help you apply inline styles to specific patterns within a text string. It provides a clean and efficient way to format text with different styles based on user-defined patterns.

Table of Contents

Installation

npm install @duongtdn/style-factory

Usage

Creating a Style Factory Instance

To start using the Style Factory, you need to create an instance of the StyleFactory class:

import StyleFactory from '@duongtdn/style-factory';

const styleFactory = new StyleFactory();

Defining Style Rules

The Style Factory allows you to define patterns and associate them with inline styles. You can use the useStyle(pattern, style) method to add style rules. The pattern parameter can be a string or a regular expression, and style is an object that defines the inline style for matching words or patterns.

styleFactory.useStyle('error', { color: 'red' })
            .useStyle(/\serror\s/, { backgroundColor: 'yellow' });

Defining Clean Rules

In some cases, you may want to remove specific patterns from the text. The useCleaner(pattern) method allows you to add clean rules. Just like with style rules, pattern can be a string or a regular expression.

styleFactory.useCleaner(/\d+/); // Remove all digits from the text

Creating Styled Text

Once you've defined your style and clean rules, you can use the create(text) method to apply those rules to a text string. This method returns an array of objects, where each object represents a piece of text with its associated style.

const styledText = styleFactory.create('This is an error message: error 404.');
console.log(styledText);

API Reference

useStyle(pattern, style)

  • pattern: Can be a string or a regular expression. It defines the pattern to match in the text.
  • style: An object that defines the inline style for the matched pattern.
  • Returns: this (allows method chaining)

useCleaner(pattern)

  • pattern: Can be a string or a regular expression. It defines the pattern to remove from the text.
  • Returns: this (allows method chaining)

create(text)

  • text: The input text string to be formatted.
  • Returns: An array of objects containing text and their associated styles.

Examples

Here's a simple example of using the Style Factory:

import StyleFactory from '@duongtdn/style-factory';

const styleFactory = new StyleFactory();

styleFactory.useStyle('error', { color: 'red' })
            .useStyle(/\serror\s/, { backgroundColor: 'yellow' })
            .useCleaner(/\d+/);

const text = 'This is an error message: error 404.';
const styledText = styleFactory.create(text);
console.log(styledText);

The above example will format the text and produce an array with styled text segments.

Contributing

Contributions to the Style Factory are welcome! If you have ideas, suggestions, or bug reports, please open an issue or submit a pull request.

License

This project is licensed under the MIT License.