KssPlugin markdownifies documentation + markup

for syntax highlighting

src/plugins/kss.ts

@@ -21,8 +21,16 @@ export interface IKssModifier {
 export interface IKssExample {
     /** Raw documentation string. */
     documentation: string;
-    /** HTML markup for example, with `{{.modifier}}` templates. */
+    /**
+     * Raw HTML markup for example with `{{.modifier}}` templates,
+     * to be used to render the markup for each modifier.
+     */
     markup: string;
+    /**
+     * Syntax-highlighted version of the markup HTML, to be used
+     * for rendering the markup itself with pretty colors.
+     */
+    markupHtml: string;
     /** Array of modifiers supported by HTML markup. */
     modifiers: IKssModifier[];
     /** Unique reference for addressing this example. */
@@ -39,10 +47,10 @@ export class KssPlugin implements IPlugin<IKssPluginData> {
     public constructor(private options: kss.IOptions) {
     }
 
-    public compile(cssFiles: IFile[], { objectify }: ICompiler) {
+    public compile(cssFiles: IFile[], dm: ICompiler) {
         const styleguide = this.parseFiles(cssFiles);
-        const sections = styleguide.sections().map(convertSection);
-        const css = objectify(sections, (s) => s.reference);
+        const sections = styleguide.sections().map(convertSection, dm);
+        const css = dm.objectify(sections, (s) => s.reference);
         return { css };
     }
 
@@ -57,18 +65,19 @@ export class KssPlugin implements IPlugin<IKssPluginData> {
     }
 }
 
-function convertSection(section: kss.ISection): IKssExample {
+function convertSection(this: ICompiler, section: kss.ISection): IKssExample {
     return {
-        documentation: section.description(),
+        documentation: this.renderMarkdown(section.description()),
         markup: section.markup() || "",
-        modifiers: section.modifiers().map(convertModifier),
+        markupHtml: this.renderMarkdown(`\`\`\`html\n${section.markup() || ""}\n\`\`\``),
+        modifiers: section.modifiers().map(convertModifier, this),
         reference: section.reference(),
     };
 }
 
-function convertModifier(mod: kss.IModifier): IKssModifier {
+function convertModifier(this: ICompiler, mod: kss.IModifier): IKssModifier {
     return {
-        documentation: mod.description(),
+        documentation: this.renderMarkdown(mod.description()),
         name: mod.name(),
     };
 }