bitwrench 1.2.16 → 2.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (130) hide show
  1. package/README.md +160 -158
  2. package/bin/bitwrench.js +3 -0
  3. package/dist/bitwrench-code-edit.cjs.js +639 -0
  4. package/dist/bitwrench-code-edit.es5.js +875 -0
  5. package/dist/bitwrench-code-edit.es5.min.js +15 -0
  6. package/dist/bitwrench-code-edit.esm.js +628 -0
  7. package/dist/bitwrench-code-edit.esm.min.js +15 -0
  8. package/dist/bitwrench-code-edit.umd.js +645 -0
  9. package/dist/bitwrench-code-edit.umd.min.js +15 -0
  10. package/dist/bitwrench.cjs.js +6983 -0
  11. package/dist/bitwrench.cjs.min.js +62 -0
  12. package/dist/bitwrench.css +5100 -0
  13. package/dist/bitwrench.es5.js +8446 -0
  14. package/dist/bitwrench.es5.min.js +31 -0
  15. package/dist/bitwrench.esm.js +6981 -0
  16. package/dist/bitwrench.esm.min.js +62 -0
  17. package/dist/bitwrench.umd.js +6989 -0
  18. package/dist/bitwrench.umd.min.js +62 -0
  19. package/dist/builds.json +127 -0
  20. package/dist/sri.json +18 -0
  21. package/package.json +86 -24
  22. package/readme.html +288 -0
  23. package/src/bitwrench-code-edit.js +627 -0
  24. package/src/bitwrench-color-utils.js +311 -0
  25. package/src/bitwrench-component-base.js +736 -0
  26. package/src/bitwrench-components-inline.js +374 -0
  27. package/src/bitwrench-components-v2.js +1879 -0
  28. package/src/bitwrench-components.js +610 -0
  29. package/src/bitwrench-styles.js +3240 -0
  30. package/src/bitwrench.js +3367 -0
  31. package/src/cli/convert.js +205 -0
  32. package/src/cli/index.js +122 -0
  33. package/src/cli/inject.js +55 -0
  34. package/src/cli/layout-default.js +142 -0
  35. package/src/generate-css.js +381 -0
  36. package/src/vendor/quikdown.js +654 -0
  37. package/src/version.js +16 -0
  38. package/.eslintrc.json +0 -27
  39. package/.github/workflows/codeql-analysis.yml +0 -72
  40. package/.travis.yml +0 -34
  41. package/bitwrench.css +0 -92
  42. package/bitwrench.js +0 -3348
  43. package/bitwrench.js_sri.txt +0 -1
  44. package/bitwrench.min.js +0 -1
  45. package/bitwrench.min.js_sri.txt +0 -1
  46. package/bitwrench_ESM.js +0 -3207
  47. package/bitwrench_ESM.js_sri.txt +0 -1
  48. package/bitwrench_ESM.min.js +0 -1
  49. package/bitwrench_ESM.min.js_sri.txt +0 -1
  50. package/dev/bitwrench-todo.md +0 -215
  51. package/dev/css-arrows.md +0 -23
  52. package/dev/docStringDev.js +0 -124
  53. package/dev/docStringParseDev.js +0 -171
  54. package/dev/example11-load-mjs-page.html +0 -17
  55. package/dev/figures.html +0 -37
  56. package/dev/html_gen.js +0 -349
  57. package/dev/htmld.md +0 -250
  58. package/dev/htmldev.html +0 -45
  59. package/dev/index-old.html +0 -87
  60. package/dev/misc-notes.md +0 -21
  61. package/dev/norm.css +0 -30
  62. package/dev/notes.md +0 -2
  63. package/dev/pageData.mjs +0 -69
  64. package/dev/sizes.html +0 -49
  65. package/dev/universal-js-module.js +0 -37
  66. package/examples/example1.html +0 -78
  67. package/examples/example10.html +0 -84
  68. package/examples/example11.html +0 -17
  69. package/examples/example12.html +0 -18
  70. package/examples/example2.html +0 -44
  71. package/examples/example3.html +0 -50
  72. package/examples/example4.html +0 -22
  73. package/examples/example5.html +0 -82
  74. package/examples/example6.html +0 -128
  75. package/examples/example7.html +0 -91
  76. package/examples/example8.html +0 -27
  77. package/examples/example9.html +0 -102
  78. package/examples/examplePageData12.mjs +0 -73
  79. package/examples/pageData.mjs +0 -69
  80. package/examples/pico.min.css +0 -5
  81. package/icon/bitwrench-dark-tall.png +0 -0
  82. package/icon/bitwrench-dark.png +0 -0
  83. package/icon/bitwrench-icon-lt-grey.png +0 -0
  84. package/icon/bitwrench-icon.vsd +0 -0
  85. package/icon/bitwrench-logo-dark.png +0 -0
  86. package/icon/bitwrench-logo-full.png +0 -0
  87. package/icon/bitwrench-logo-green.png +0 -0
  88. package/icon/bitwrench-logo-grey.png +0 -0
  89. package/icon/bitwrench-logo-white.png +0 -0
  90. package/icon/bitwrench-logos-colors.png +0 -0
  91. package/icon/bitwrench-thick-logo.png +0 -0
  92. package/icon/bitwrench-thick-teal/android-chrome-192x192.png +0 -0
  93. package/icon/bitwrench-thick-teal/android-chrome-512x512.png +0 -0
  94. package/icon/bitwrench-thick-teal/apple-touch-icon.png +0 -0
  95. package/icon/bitwrench-thick-teal/browserconfig.xml +0 -9
  96. package/icon/bitwrench-thick-teal/favicon-16x16.png +0 -0
  97. package/icon/bitwrench-thick-teal/favicon-32x32.png +0 -0
  98. package/icon/bitwrench-thick-teal/favicon.ico +0 -0
  99. package/icon/bitwrench-thick-teal/mstile-144x144.png +0 -0
  100. package/icon/bitwrench-thick-teal/mstile-150x150.png +0 -0
  101. package/icon/bitwrench-thick-teal/mstile-310x150.png +0 -0
  102. package/icon/bitwrench-thick-teal/mstile-310x310.png +0 -0
  103. package/icon/bitwrench-thick-teal/mstile-70x70.png +0 -0
  104. package/icon/bitwrench-thick-teal/site.webmanifest +0 -19
  105. package/icon/bitwrench-thick-teal.ico +0 -0
  106. package/icon/bitwrench-thick-teal.svg +0 -44
  107. package/icon/bitwrench-thick-teal.zip +0 -0
  108. package/icon/favicon-test.html +0 -20
  109. package/icon/logos-test.PNG +0 -0
  110. package/images/bitwrench-512x512.png +0 -0
  111. package/images/bitwrench-logo-med.png +0 -0
  112. package/images/bitwrench-thick-logo.png +0 -0
  113. package/images/bitwrench-thick-logo.svg +0 -64
  114. package/images/bitwrench-thick-teal.ico +0 -0
  115. package/images/favicon.ico +0 -0
  116. package/index.html +0 -282
  117. package/instr_tmp/bitwrench.js +0 -1350
  118. package/karma.conf.js +0 -140
  119. package/makefile +0 -21
  120. package/quick-docs.html +0 -206
  121. package/test/bitwrench_test.js +0 -1255
  122. package/test/karma-test.js +0 -1081
  123. package/tools/bw_deprecatedNames.js +0 -19
  124. package/tools/bwconsole.js +0 -20
  125. package/tools/createSimpleHTMLPage.js +0 -41
  126. package/tools/emitreadme.sh +0 -4
  127. package/tools/export-bw-default-css.js +0 -41
  128. package/tools/umd2ModuleHack.js +0 -32
  129. package/tools/update-bw-package.js +0 -36
  130. package/tools/updatereadme.js +0 -34
package/readme.html ADDED
@@ -0,0 +1,288 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <meta name="generator" content="bitwrench v2.0.4">
7
+ <title>bitwrench.js - README</title>
8
+ <link rel="icon" type="image/x-icon" href="images/favicon.ico">
9
+ <script src="dist/bitwrench.umd.js"></script>
10
+ <link rel="stylesheet" href="dist/bitwrench.css">
11
+ <link rel="stylesheet" href="pages/shared-theme.css">
12
+ <script src="pages/shared-nav.js"></script>
13
+ <style>
14
+ .quikdown-h1 { font-size:2em;font-weight:600;margin:.67em 0;text-align:left;color:#333 }
15
+ .quikdown-h2 { font-size:1.5em;font-weight:600;margin:.83em 0;color:#333 }
16
+ .quikdown-h3 { font-size:1.25em;font-weight:600;margin:1em 0;color:#333 }
17
+ .quikdown-h4 { font-size:1em;font-weight:600;margin:1.33em 0;color:#333 }
18
+ .quikdown-h5 { font-size:.875em;font-weight:600;margin:1.67em 0;color:#333 }
19
+ .quikdown-h6 { font-size:.85em;font-weight:600;margin:2em 0;color:#333 }
20
+ .quikdown-pre { background:#f4f4f4;padding:10px;border-radius:4px;overflow-x:auto;margin:1em 0 }
21
+ .quikdown-code { background:#f0f0f0;padding:2px 4px;border-radius:3px;font-family:monospace }
22
+ .quikdown-blockquote { border-left:4px solid #ddd;margin-left:0;padding-left:1em;color:#333 }
23
+ .quikdown-table { border-collapse:collapse;width:100%;margin:1em 0 }
24
+ .quikdown-th { border:1px solid #ddd;padding:8px;background-color:#f2f2f2;font-weight:bold;text-align:left }
25
+ .quikdown-td { border:1px solid #ddd;padding:8px;text-align:left;color:#333 }
26
+ .quikdown-hr { border:none;border-top:1px solid #ddd;margin:1em 0 }
27
+ .quikdown-img { max-width:100%;height:auto }
28
+ .quikdown-a { color:#06c;text-decoration:underline }
29
+ .quikdown-strong { font-weight:bold }
30
+ .quikdown-em { font-style:italic }
31
+ .quikdown-del { text-decoration:line-through }
32
+ .quikdown-ul { margin:.5em 0;padding-left:2em }
33
+ .quikdown-ol { margin:.5em 0;padding-left:2em }
34
+ .quikdown-li { margin:.25em 0;color:#333 }
35
+ .quikdown-task-item { list-style:none }
36
+ .quikdown-task-checkbox { margin-right:.5em }
37
+
38
+ /* README-specific overrides to match pages/ look */
39
+ .readme-body {
40
+ max-width: 48rem;
41
+ margin: 0 auto;
42
+ padding: 0;
43
+ line-height: 1.6;
44
+ }
45
+ .readme-body img { max-width: 100%; height: auto; }
46
+ .readme-body table { border-collapse: collapse; width: 100%; margin: 1em 0; }
47
+ .readme-body th, .readme-body td { border: 1px solid var(--bw-card-border); padding: 0.5em 0.75em; text-align: left; }
48
+ .readme-body th { background: var(--bw-teal-bg); font-weight: 600; }
49
+ .readme-body h2 { border-bottom: 1px solid var(--bw-card-border); padding-bottom: 0.3em; }
50
+ .readme-body a { color: var(--bw-teal); }
51
+ .readme-body a:hover { color: var(--bw-teal-dark); }
52
+ .readme-body pre { background: var(--bw-code-bg); border-radius: 6px; overflow-x: auto; border: 1px solid rgba(0,0,0,0.1); }
53
+ .readme-body pre code { display: block; padding: 1rem; color: var(--bw-code-text); font-family: var(--bw-font-mono); font-size: 0.8125rem; line-height: 1.6; background: transparent; border: none; }
54
+ .readme-body code:not(pre code) { background: var(--bw-teal-light); color: var(--bw-teal-dark); padding: 0.15em 0.4em; border-radius: 3px; font-size: 0.85em; font-family: var(--bw-font-mono); }
55
+ .readme-body blockquote { border-left: 4px solid var(--bw-teal); margin-left: 0; padding-left: 1em; color: var(--bw-text-secondary); }
56
+ </style>
57
+ </head>
58
+ <body>
59
+ <div id="example-nav"></div>
60
+
61
+ <div class="page-header">
62
+ <div class="content-container wide" style="padding-top: 0; padding-bottom: 0;">
63
+ <h1>README</h1>
64
+ <p class="subtitle">The project README rendered with bitwrench site styling.</p>
65
+ </div>
66
+ </div>
67
+
68
+ <div class="content-container">
69
+ <div class="demo-section">
70
+ <div class="demo-content">
71
+ <div class="readme-body">
72
+ <h1 class="quikdown-h1">bitwrench.js</h1>
73
+ <img class="quikdown-img" src="https://img.shields.io/badge/License-BSD%202--Clause-blue.svg" alt="License"> <img class="quikdown-img" src="https://img.shields.io/npm/v/bitwrench.svg?style=flat-square" alt="NPM version"> <img class="quikdown-img" src="https://github.com/deftio/bitwrench/actions/workflows/ci.yml/badge.svg" alt="CI"></p><p><a class="quikdown-a" href="http://www.deftio.com/bitwrench" rel="noopener noreferrer"><img class="quikdown-img" src="./images/bitwrench-logo-med.png" alt="bitwrench"></a></p><p><strong class="quikdown-strong">bitwrench.js</strong> is a lightweight JavaScript UI library that builds HTML from plain objects — no JSX, no virtual DOM, no build step. Define UI with the TACO format (<code class="quikdown-code">{t, a, c, o}</code> — Tag, Attributes, Content, Options), render to strings or live DOM, and ship under 45 KB gzipped with zero dependencies. Works in browsers (IE11+) and Node.js.</p><h2 class="quikdown-h2">Quick Example</h2>
74
+ <p><pre class="quikdown-pre"><code class="language-javascript">// Define a component as a plain object
75
+ const card = {
76
+ t: &#39;div&#39;, a: { class: &#39;bw-card&#39; },
77
+ c: [
78
+ { t: &#39;h3&#39;, c: &#39;Hello bitwrench&#39; },
79
+ { t: &#39;p&#39;, c: &#39;UI as native JavaScript objects.&#39; }
80
+ ]
81
+ };
82
+
83
+ // Render to live DOM
84
+ bw.DOM(&#39;#app&#39;, card);
85
+
86
+ // Or render to an HTML string (server-side, emails, etc.)
87
+ const html = bw.html(card);</code></pre></p><h2 class="quikdown-h2">Key Features</h2>
88
+ <ul class="quikdown-ul">
89
+ <li class="quikdown-li"><strong class="quikdown-strong">TACO format</strong> — <code class="quikdown-code">{ t, a, c, o }</code> objects describe UI; nest them, loop them, compose them with plain JS</li>
90
+ <li class="quikdown-li"><strong class="quikdown-strong">Zero dependencies</strong> — under 45 KB gzipped, IE11+ compatible</li>
91
+ <li class="quikdown-li"><strong class="quikdown-strong">Batteries-included components</strong> — grid, buttons, cards, forms, tables, alerts, badges, tabs, navbars</li>
92
+ <li class="quikdown-li"><strong class="quikdown-strong">Server &amp; client rendering</strong> — <code class="quikdown-code">bw.html()</code> returns strings, <code class="quikdown-code">bw.DOM()</code> mounts to the DOM</li>
93
+ <li class="quikdown-li"><strong class="quikdown-strong">Dynamic CSS &amp; theming</strong> — <code class="quikdown-code">bw.css()</code> generates stylesheets from objects, <code class="quikdown-code">bw.generateTheme()</code> builds full themes from seed colors, dark mode toggle included</li>
94
+ <li class="quikdown-li"><strong class="quikdown-strong">State management</strong> — <code class="quikdown-code">bw.patch()</code> for targeted DOM updates, <code class="quikdown-code">bw.update()</code> for re-renders, <code class="quikdown-code">bw.pub()</code>/<code class="quikdown-code">bw.sub()</code> for app-wide messaging</li>
95
+ <li class="quikdown-li"><strong class="quikdown-strong">CLI tool</strong> — the <code class="quikdown-code">bitwrench</code> command converts Markdown, HTML, and JSON files into styled pages</li>
96
+ <li class="quikdown-li"><strong class="quikdown-strong">Utilities</strong> — color functions, random data, lorem ipsum, cookies, URL params, file I/O</li>
97
+ </ul><h2 class="quikdown-h2">Installation</h2>
98
+ <h3 class="quikdown-h3">npm</h3>
99
+ <p><pre class="quikdown-pre"><code class="language-bash">npm install bitwrench</code></pre></p><pre class="quikdown-pre"><code class="language-javascript">// ES module
100
+ import bw from &#39;bitwrench&#39;;
101
+
102
+ // CommonJS
103
+ const bw = require(&#39;bitwrench&#39;);</code></pre><h3 class="quikdown-h3">Browser</h3>
104
+ <p><pre class="quikdown-pre"><code class="language-html">&lt;script src=&quot;dist/bitwrench.umd.js&quot;&gt;&lt;/script&gt;</code></pre></p><h3 class="quikdown-h3">CDN</h3>
105
+ <p><pre class="quikdown-pre"><code class="language-html">&lt;script src=&quot;https://cdn.jsdelivr.net/npm/bitwrench/dist/bitwrench.umd.min.js&quot;&gt;&lt;/script&gt;</code></pre></p><h2 class="quikdown-h2">Getting Started</h2>
106
+ <h3 class="quikdown-h3">Browser</h3>
107
+ <p><pre class="quikdown-pre"><code class="language-html">&lt;!DOCTYPE html&gt;
108
+ &lt;html lang=&quot;en&quot;&gt;
109
+ &lt;head&gt;
110
+ &lt;title&gt;bitwrench app&lt;/title&gt;
111
+ &lt;script src=&quot;dist/bitwrench.umd.js&quot;&gt;&lt;/script&gt;
112
+ &lt;/head&gt;
113
+ &lt;body&gt;
114
+ &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;
115
+ &lt;script&gt;
116
+ bw.loadDefaultStyles();
117
+
118
+ bw.DOM(&#39;#app&#39;, {
119
+ t: &#39;div&#39;, a: { class: &#39;bw-container&#39; },
120
+ c: [
121
+ { t: &#39;h1&#39;, c: &#39;My App&#39; },
122
+ { t: &#39;button&#39;, a: { class: &#39;bw-btn bw-btn-primary&#39; }, c: &#39;Click me&#39; }
123
+ ]
124
+ });
125
+ &lt;/script&gt;
126
+ &lt;/body&gt;
127
+ &lt;/html&gt;</code></pre></p><h3 class="quikdown-h3">Node.js</h3>
128
+ <p><pre class="quikdown-pre"><code class="language-javascript">import bw from &#39;bitwrench&#39;;
129
+
130
+ const page = bw.html({
131
+ t: &#39;div&#39;, a: { class: &#39;bw-container&#39; },
132
+ c: [
133
+ { t: &#39;h1&#39;, c: &#39;Server-rendered page&#39; },
134
+ { t: &#39;p&#39;, c: &#39;Generated with bw.html() in Node.js.&#39; }
135
+ ]
136
+ });
137
+
138
+ console.log(page);</code></pre></p><h2 class="quikdown-h2">Core API</h2>
139
+ <table class="quikdown-table">
140
+ <thead class="quikdown-thead">
141
+ <tr class="quikdown-tr">
142
+ <th class="quikdown-th">Function</th>
143
+ <th class="quikdown-th">Description</th>
144
+ </tr>
145
+ </thead>
146
+ <tbody class="quikdown-tbody">
147
+ <tr class="quikdown-tr">
148
+ <td class="quikdown-td"><code class="quikdown-code">bw.html(taco)</code></td>
149
+ <td class="quikdown-td">Convert a TACO object to an HTML string</td>
150
+ </tr>
151
+ <tr class="quikdown-tr">
152
+ <td class="quikdown-td"><code class="quikdown-code">bw.DOM(selector, taco)</code></td>
153
+ <td class="quikdown-td">Mount a TACO object to a DOM element</td>
154
+ </tr>
155
+ <tr class="quikdown-tr">
156
+ <td class="quikdown-td"><code class="quikdown-code">bw.css(rules)</code></td>
157
+ <td class="quikdown-td">Generate a CSS string from a JS object</td>
158
+ </tr>
159
+ <tr class="quikdown-tr">
160
+ <td class="quikdown-td"><code class="quikdown-code">bw.loadDefaultStyles()</code></td>
161
+ <td class="quikdown-td">Inject the built-in component stylesheet</td>
162
+ </tr>
163
+ <tr class="quikdown-tr">
164
+ <td class="quikdown-td"><code class="quikdown-code">bw.generateTheme(name, config)</code></td>
165
+ <td class="quikdown-td">Generate a scoped theme from seed colors</td>
166
+ </tr>
167
+ <tr class="quikdown-tr">
168
+ <td class="quikdown-td"><code class="quikdown-code">bw.patch(uuid, content)</code></td>
169
+ <td class="quikdown-td">Update a specific element&#39;s content by UUID</td>
170
+ </tr>
171
+ <tr class="quikdown-tr">
172
+ <td class="quikdown-td"><code class="quikdown-code">bw.update(el)</code></td>
173
+ <td class="quikdown-td">Re-render an element using its <code class="quikdown-code">o.render</code> function</td>
174
+ </tr>
175
+ <tr class="quikdown-tr">
176
+ <td class="quikdown-td"><code class="quikdown-code">bw.pub(topic, detail)</code></td>
177
+ <td class="quikdown-td">Publish a message to all subscribers</td>
178
+ </tr>
179
+ <tr class="quikdown-tr">
180
+ <td class="quikdown-td"><code class="quikdown-code">bw.sub(topic, handler)</code></td>
181
+ <td class="quikdown-td">Subscribe to a topic; returns an unsubscribe function</td>
182
+ </tr>
183
+ <tr class="quikdown-tr">
184
+ <td class="quikdown-td"><code class="quikdown-code">bw.makeTable(data, opts)</code></td>
185
+ <td class="quikdown-td">Create a sortable table (returns TACO)</td>
186
+ </tr>
187
+ <tr class="quikdown-tr">
188
+ <td class="quikdown-td"><code class="quikdown-code">bw.makeCard(opts)</code></td>
189
+ <td class="quikdown-td">Create a card component (returns TACO)</td>
190
+ </tr>
191
+ <tr class="quikdown-tr">
192
+ <td class="quikdown-td"><code class="quikdown-code">bw.colorInterp(x, in0, in1, colors)</code></td>
193
+ <td class="quikdown-td">Interpolate between colors</td>
194
+ </tr>
195
+ </tbody>
196
+ </table><p>See the full <a class="quikdown-a" href="./pages/08-api-reference.html">API Reference</a> for all functions.</p><h2 class="quikdown-h2">Examples</h2>
197
+ <table class="quikdown-table">
198
+ <thead class="quikdown-thead">
199
+ <tr class="quikdown-tr">
200
+ <th class="quikdown-th">Page</th>
201
+ <th class="quikdown-th">Description</th>
202
+ </tr>
203
+ </thead>
204
+ <tbody class="quikdown-tbody">
205
+ <tr class="quikdown-tr">
206
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/00-quick-start.html">Quick Start</a></td>
207
+ <td class="quikdown-td">First steps with TACO and <code class="quikdown-code">bw.DOM()</code></td>
208
+ </tr>
209
+ <tr class="quikdown-tr">
210
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/01-components.html">Components</a></td>
211
+ <td class="quikdown-td">Buttons, cards, alerts, badges, navbars</td>
212
+ </tr>
213
+ <tr class="quikdown-tr">
214
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/02-tables-forms.html">Tables &amp; Forms</a></td>
215
+ <td class="quikdown-td">Sortable tables, form inputs, validation</td>
216
+ </tr>
217
+ <tr class="quikdown-tr">
218
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/03-styling.html">Styling</a></td>
219
+ <td class="quikdown-td">CSS generation, inline styles, theming strategies</td>
220
+ </tr>
221
+ <tr class="quikdown-tr">
222
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/04-dashboard.html">Dashboard</a></td>
223
+ <td class="quikdown-td">Full-page app with grid layout and charts</td>
224
+ </tr>
225
+ <tr class="quikdown-tr">
226
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/05-state.html">State &amp; Interactivity</a></td>
227
+ <td class="quikdown-td"><code class="quikdown-code">bw.patch()</code>, <code class="quikdown-code">bw.update()</code>, pub/sub</td>
228
+ </tr>
229
+ <tr class="quikdown-tr">
230
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/06-tic-tac-toe-tutorial.html">Tic Tac Toe Tutorial</a></td>
231
+ <td class="quikdown-td">Step-by-step game built with bitwrench</td>
232
+ </tr>
233
+ <tr class="quikdown-tr">
234
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/07-framework-comparison.html">Framework Comparison</a></td>
235
+ <td class="quikdown-td">bitwrench vs React, Vue, Svelte, jQuery</td>
236
+ </tr>
237
+ <tr class="quikdown-tr">
238
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/08-api-reference.html">API Reference</a></td>
239
+ <td class="quikdown-td">Full function listing with signatures</td>
240
+ </tr>
241
+ <tr class="quikdown-tr">
242
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/09-builds.html">Builds &amp; Downloads</a></td>
243
+ <td class="quikdown-td">All dist formats, bundle sizes, SRI hashes</td>
244
+ </tr>
245
+ <tr class="quikdown-tr">
246
+ <td class="quikdown-td"><a class="quikdown-a" href="./pages/10-themes.html">Themes</a></td>
247
+ <td class="quikdown-td">Theme generator, presets, dark mode</td>
248
+ </tr>
249
+ </tbody>
250
+ </table><h2 class="quikdown-h2">CLI</h2>
251
+ <p>The <code class="quikdown-code">bitwrench</code> command converts Markdown, HTML, and JSON files into styled standalone pages.</p><pre class="quikdown-pre"><code class="language-bash"># Install globally
252
+ npm install -g bitwrench
253
+
254
+ # Convert a Markdown file to a styled HTML page
255
+ bitwrench README.md -o index.html --standalone
256
+
257
+ # Use a theme preset
258
+ bitwrench doc.md -o doc.html --standalone --theme ocean
259
+
260
+ # Custom colors (primary, secondary)
261
+ bitwrench doc.md -o doc.html --standalone --theme &quot;#336699,#cc6633&quot;</code></pre><p><strong class="quikdown-strong">Flags:</strong> <code class="quikdown-code">--output/-o</code>, <code class="quikdown-code">--standalone/-s</code> (inline bitwrench), <code class="quikdown-code">--cdn</code> (CDN link), <code class="quikdown-code">--theme/-t</code>, <code class="quikdown-code">--css/-c</code>, <code class="quikdown-code">--title</code>, <code class="quikdown-code">--favicon/-f</code>, <code class="quikdown-code">--highlight</code>, <code class="quikdown-code">--verbose/-v</code></p><h2 class="quikdown-h2">Development</h2>
262
+ <p><pre class="quikdown-pre"><code class="language-bash">npm install # install dev dependencies
263
+ npm run build # build all dist formats
264
+ npm test # run unit tests (251 tests)
265
+ npm run test:cli # run CLI tests (49 tests)
266
+ npm run test:e2e # run Playwright browser tests
267
+ npm run cleanbuild # full production build</code></pre></p><h2 class="quikdown-h2">License</h2>
268
+ <a class="quikdown-a" href="./LICENSE.txt">BSD-2-Clause</a></p><h2 class="quikdown-h2">Documentation</h2>
269
+ <ul class="quikdown-ul">
270
+ <li class="quikdown-li"><a class="quikdown-a" href="https://deftio.github.io/bitwrench/pages/" rel="noopener noreferrer">Interactive Docs &amp; Demos</a> — full tutorial site with live examples</li>
271
+ <li class="quikdown-li"><a class="quikdown-a" href="./pages/index.html">Local Docs</a> — browse the docs locally if you&#39;ve cloned the repo</li>
272
+ </ul><h2 class="quikdown-h2">Links</h2>
273
+ <ul class="quikdown-ul">
274
+ <li class="quikdown-li"><a class="quikdown-a" href="https://github.com/deftio/bitwrench" rel="noopener noreferrer">GitHub</a></li>
275
+ <li class="quikdown-li"><a class="quikdown-a" href="https://www.npmjs.com/package/bitwrench" rel="noopener noreferrer">npm</a></li>
276
+ <li class="quikdown-li"><a class="quikdown-a" href="http://deftio.com/bitwrench" rel="noopener noreferrer">Homepage</a></li>
277
+ </ul>
278
+ </p>
279
+ </div>
280
+ </div>
281
+ </div>
282
+ </div>
283
+
284
+ <script>
285
+ mountExampleNav('#example-nav', '', 'pages/');
286
+ </script>
287
+ </body>
288
+ </html>