bytefield-svg browser wrapper

bytefield-svg browser wrapper

Use case: Hugo translated code block(code element with classname and dataset) client-side rendering

<script src="https://cdn.jsdelivr.net/gh/LMinJae/bytefield-svg-browser-wrapper/dist/bundle.js"></script>
<script>
	document.addEventListener('DOMContentLoaded', () => {
		document.body.querySelectorAll('code.language-bytefield').forEach(n => {
			n.outerHTML = bytefield.generate(n.innerText, { 'embedded': true });
		});
	});
</script>

<pre tabindex="0"><code class="language-bytefield" data-lang="bytefield">(def row-header-fn {})
	(draw-column-headers)
	(draw-box "Address" {:span 4})
	(draw-box "Size" {:span 2})
	(draw-box 0 {:span 2})
	(draw-gap "Payload")
	(draw-bottom)
</code></pre>