Code Monkey home page Code Monkey logo

muteferrika's Introduction

Muteferrika

A simple and lightweight shortcode rendering engine.

Downloads install size

Muteferrika is a rendering engine with no dependency that gives you full control of how your shortcodes are getting rendered. Create your shortcodes, let Muteferrika know them, and get the rendered output. It's that much simple. It also supports nested shortcodes, yeey!

Wheel is not reinvented, instead Wordpress shortcode and shortcode attribute parser regular expressions are used in the engine.

Features

  • Supports creating multiple instances
  • Supports self-closing, enclosing and nested shortcodes
  • Supports shortcode attribute parsing with automatic type casting (primitive types)
  • Supports bulk shortcode insert
  • Supports overriding a shortcode callback function at runtime
  • Supports sync and async rendering
  • Standard style source code
  • Comprehensive unit tests
  • No dependency!

Install

$ npm install muteferrika

Usage

// CommonJS syntax
const Muteferrika = require('muteferrika')

// ES6 syntax
import Muteferrika from 'muteferrika'

Examples

const Muteferrika = require('muteferrika')

const ibrahim = new Muteferrika()

// define a shortcode
ibrahim.add('entry_image', async (attrs, data) => {
  return `<img src="${attrs.src}" alt="${data}"/>`
})

const response =
  await ibrahim.render('lorem ipsum [entry_image src="https://upload.wikimedia.org/wikipedia/commons/a/a2/Ibrahim_M%C3%BCteferrika.jpg"]Ibrahim Muteferrika[/entry_image] dolor sit amet.')

console.log(response)

/*
output:
lorem ipsum <img src="https://upload.wikimedia.org/wikipedia/commons/a/a2/Ibrahim_M%C3%BCteferrika.jpg" alt="Ibrahim Muteferrika"/> dolor sit amet
*/

Nested shortcode example:

const Muteferrika = require('muteferrika')

const ibrahim = new Muteferrika()

ibrahim.add('parent', (attrs, data) => {
  return data
})

ibrahim.add('child', (attrs, data) => {
  return 'you said nested?'
})

const response = ibrahim.renderSync('[parent]so, [child][/parent]')

console.log(response)

/*
output:
so, you said nested?
*/

API

Muteferrika.add(name, callback)

Adds given shortcode to the shortcode list to be used in rendering process.

name is the unique shortcode name and can contain hyphen(s) and dash(es).

callback is the shortcode handler function that renders shortcode and returns the output. The handler function receives (attrs, data). attrs is an object that holds all the shortcode attributes, data is a string that holds all the content in enclosed/nested shortcodes.

Muteferrika.addRange(shortcodes)

Adds given shortcodes to the shortcode list. Each array item must contain name and callback properties.

{
  name: string,
  callback: function
}
: Array

Muteferrika.remove(name)

Removes the given shortcode from the shortcode list.

name is the unique shortcode name and can contain hyphen(s) and dash(es).

Muteferrika.clear()

Clears/removes all shortcodes from the list.

Muteferrika.override(name, callback)

Overrides the shortcode handler function of the given shortcode.

name is the unique shortcode name and can contain hyphen(s) and dash(es).

callback is the new shortcode handler function.

Muteferrika.shortcodes()

Returns defined shortcodes list.

{
  name: string,
  callback: function
}
: Array

Muteferrika.render(content)

Asynchronously renders the shortcodes in the given content through shortcode (sync and async) handler functions.

content must be a string.

Muteferrika.renderSync(content)

Synchronously renders the shortcodes in the given content through shortcode (sync and async) handler functions.

content must be a string.

Muteferrika.on(name, handler)

Sets the handler for the given event.

name is the name of the event. See events section for more information.

handler the event handler function which will be called when the event is fired. See events section for more information.

Events

Name Arguments Description
tagRender fullMatch finalOutput shortcodeOutput This event will be fired before the shortcode tag is being replaced by the rendered output

muteferrika's People

Contributors

hsynlms avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.