wdl-doc 0.11.0

Documentation generator for Workflow Description Language (WDL) documents.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46

class SprocketCode extends HTMLElement {
  constructor() {
    super();
    this.attachShadow({ mode: 'open' });
  }

  _getStyles() {
    return `
      :host { display: block; font-size: 14px; }
      .code-block {
        margin: 0;
        border-radius: 6px;
        overflow: hidden;
      }
      .code-block pre {
        margin: 0;
        padding: 1em;
        overflow-x: auto;
      }
      .code-block :global(pre.shiki) {
        background: var(--shiki-bg, #2e3440) !important;
      }
    `;
  }

  async connectedCallback() {
    try {
      const { initializeHighlighter } = await import('./sprocket-code.utils.js');
      const highlighter = await initializeHighlighter();
      const code = this.textContent.trim();
      this.textContent = '';
      
      const html = highlighter.codeToHtml(code, {
        lang: this.getAttribute('language') || 'wdl',
        theme: 'material-theme-ocean'
      });

      this.shadowRoot.innerHTML = `
        <style>${this._getStyles()}</style>
        <div class="code-block">${html}</div>
      `;
    } catch {}
  }
}

customElements.define('sprocket-code', SprocketCode);