From 1cf40dd17354613f2b59e0e147b828f3e49cb672 Mon Sep 17 00:00:00 2001 From: AleksandrHovhannisyan Date: Wed, 7 Dec 2022 18:29:08 -0500 Subject: [PATCH] Support custom shortcode name --- README.md | 3 +++ src/index.js | 9 ++++----- src/typedefs.js | 1 + 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index a73fa3b..713e315 100644 --- a/README.md +++ b/README.md @@ -16,6 +16,8 @@ Register it as a plugin in your Eleventy config: const { EleventyPluginCodeDemo } = require('eleventy-plugin-code-demo'); eleventyConfig.addPlugin(EleventyPluginCodeDemo, { + // Use any shortcode name you want + name: 'shortcodeName', // Render whatever content you want to go in the renderHead: ({ css }) => ``, // Render whatever content you want to go in the @@ -35,6 +37,7 @@ See [example usage](#example-usage) for how to use the shortcode. |Name|Type|Description| |----|----|-----------| +|`name`|`string`|The name to use for the shortcode. Defaults to `'codeDemo'` if not specified.| |`renderHead`|`(args: { css: string; js: string }) => string`|A render function to return custom markup for the iframe ``'s children.| |`renderBody`|`(args: { html: string; js: string }) => string`|A render function to return custom markup for the iframe ``'s children.| |`iframeAttributes`|`Record`|Any HTML attributes you want to set globally on all code demos.| diff --git a/src/index.js b/src/index.js index b75ac00..f0587bd 100644 --- a/src/index.js +++ b/src/index.js @@ -4,8 +4,6 @@ const markdownIt = require('markdown-it'); const outdent = require('outdent'); const { parseCode, stringifyAttributes } = require('./utils'); -const SHORTCODE_NAME = 'codeDemo'; - /** * Higher-order function that takes user configuration options and returns the plugin shortcode. * @param {import('./typedefs').EleventyPluginCodeDemoOptions} options @@ -18,7 +16,7 @@ const makeCodeDemoShortcode = (options) => { */ const codeDemoShortcode = (source, title, props = {}) => { if (!title) { - throw new Error(`${SHORTCODE_NAME}: you must provide a non-empty title for the iframe.`); + throw new Error(`${options.name}: you must provide a non-empty title for the iframe.`); } const tokens = markdownIt().parse(source); @@ -52,10 +50,11 @@ const makeCodeDemoShortcode = (options) => { /** * @param {import('@11ty/eleventy/src/UserConfig')} eleventyConfig - * @param {EleventyPluginCodeDemoOptions} options + * @param {import('./typedefs').EleventyPluginCodeDemoOptions} options */ const EleventyPluginCodeDemo = (eleventyConfig, options) => { - eleventyConfig.addPairedShortcode(SHORTCODE_NAME, makeCodeDemoShortcode(options)); + const name = options.name ?? 'codeDemo'; + eleventyConfig.addPairedShortcode(name, makeCodeDemoShortcode({ ...options, name })); }; module.exports = { EleventyPluginCodeDemo }; diff --git a/src/typedefs.js b/src/typedefs.js index 2b736df..5523b3a 100644 --- a/src/typedefs.js +++ b/src/typedefs.js @@ -7,6 +7,7 @@ /** * @typedef EleventyPluginCodeDemoOptions + * @property {string} name The shortcode name to use. * @property {(args: Pick) => string} renderHead A render function to render a custom HTML ``. * @property {(args: Pick) => string} renderBody A render function to render a custom HTML ``'s contents. * @property {Record} iframeAttributes Any HTML attributes you want to set on the `