bitwrench 2.0.14 → 2.0.15

package/src/bitwrench-code-edit.js

@@ -14,53 +14,53 @@
 // -- CSS (injected once) ----------------------------------------------
 var _cssInjected = false;
 var CSS_TEXT =
-  '.bw-ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' +
-  '.bw-ce pre{margin:0;padding:0}' +
-  '.bw-ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' +
-  '.bw-ce code:empty::before{content:"\\200b"}' +
-  '.bw-ce .bw-ce-keyword{color:#c792ea}' +
-  '.bw-ce .bw-ce-string{color:#c3e88d}' +
-  '.bw-ce .bw-ce-comment{color:#546e7a;font-style:italic}' +
-  '.bw-ce .bw-ce-number{color:#f78c6c}' +
-  '.bw-ce .bw-ce-operator{color:#89ddff}' +
-  '.bw-ce .bw-ce-punctuation{color:#89ddff}' +
-  '.bw-ce .bw-ce-property{color:#82aaff}' +
-  '.bw-ce .bw-ce-function{color:#82aaff}' +
-  '.bw-ce .bw-ce-tag{color:#f07178}' +
-  '.bw-ce .bw-ce-attr-name{color:#ffcb6b}' +
-  '.bw-ce .bw-ce-attr-value{color:#c3e88d}' +
-  '.bw-ce .bw-ce-selector{color:#c792ea}' +
-  '.bw-ce .bw-ce-css-prop{color:#82aaff}' +
-  '.bw-ce .bw-ce-css-value{color:#f78c6c}' +
-  '.bw-ce .bw-ce-at-rule{color:#c792ea;font-style:italic}' +
-  '.bw-ce .bw-ce-color{color:#f78c6c}' +
-  '.bw-ce .bw-ce-template-interp{color:#89ddff}' +
+  '.bw_ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' +
+  '.bw_ce pre{margin:0;padding:0}' +
+  '.bw_ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' +
+  '.bw_ce code:empty::before{content:"\\200b"}' +
+  '.bw_ce .bw_ce_keyword{color:#c792ea}' +
+  '.bw_ce .bw_ce_string{color:#c3e88d}' +
+  '.bw_ce .bw_ce_comment{color:#546e7a;font-style:italic}' +
+  '.bw_ce .bw_ce_number{color:#f78c6c}' +
+  '.bw_ce .bw_ce_operator{color:#89ddff}' +
+  '.bw_ce .bw_ce_punctuation{color:#89ddff}' +
+  '.bw_ce .bw_ce_property{color:#82aaff}' +
+  '.bw_ce .bw_ce_function{color:#82aaff}' +
+  '.bw_ce .bw_ce_tag{color:#f07178}' +
+  '.bw_ce .bw_ce_attr_name{color:#ffcb6b}' +
+  '.bw_ce .bw_ce_attr_value{color:#c3e88d}' +
+  '.bw_ce .bw_ce_selector{color:#c792ea}' +
+  '.bw_ce .bw_ce_css_prop{color:#82aaff}' +
+  '.bw_ce .bw_ce_css_value{color:#f78c6c}' +
+  '.bw_ce .bw_ce_at_rule{color:#c792ea;font-style:italic}' +
+  '.bw_ce .bw_ce_color{color:#f78c6c}' +
+  '.bw_ce .bw_ce_template_interp{color:#89ddff}' +
   // Light theme
-  '.bw-ce-light.bw-ce{background:#fafafa;border-color:#d8d8d8}' +
-  '.bw-ce-light.bw-ce code{color:#1a1a1a}' +
-  '.bw-ce-light.bw-ce .bw-ce-keyword{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-string{color:#16a34a}' +
-  '.bw-ce-light.bw-ce .bw-ce-comment{color:#9ca3af;font-style:italic}' +
-  '.bw-ce-light.bw-ce .bw-ce-number{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-operator{color:#0891b2}' +
-  '.bw-ce-light.bw-ce .bw-ce-punctuation{color:#6b7280}' +
-  '.bw-ce-light.bw-ce .bw-ce-property{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-function{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-tag{color:#dc2626}' +
-  '.bw-ce-light.bw-ce .bw-ce-attr-name{color:#d97706}' +
-  '.bw-ce-light.bw-ce .bw-ce-attr-value{color:#16a34a}' +
-  '.bw-ce-light.bw-ce .bw-ce-selector{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-css-prop{color:#2563eb}' +
-  '.bw-ce-light.bw-ce .bw-ce-css-value{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-at-rule{color:#7c3aed}' +
-  '.bw-ce-light.bw-ce .bw-ce-color{color:#ea580c}' +
-  '.bw-ce-light.bw-ce .bw-ce-template-interp{color:#0891b2}';
+  '.bw_ce_light.bw_ce{background:#fafafa;border-color:#d8d8d8}' +
+  '.bw_ce_light.bw_ce code{color:#1a1a1a}' +
+  '.bw_ce_light.bw_ce .bw_ce_keyword{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_string{color:#16a34a}' +
+  '.bw_ce_light.bw_ce .bw_ce_comment{color:#9ca3af;font-style:italic}' +
+  '.bw_ce_light.bw_ce .bw_ce_number{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_operator{color:#0891b2}' +
+  '.bw_ce_light.bw_ce .bw_ce_punctuation{color:#6b7280}' +
+  '.bw_ce_light.bw_ce .bw_ce_property{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_function{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_tag{color:#dc2626}' +
+  '.bw_ce_light.bw_ce .bw_ce_attr_name{color:#d97706}' +
+  '.bw_ce_light.bw_ce .bw_ce_attr_value{color:#16a34a}' +
+  '.bw_ce_light.bw_ce .bw_ce_selector{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_css_prop{color:#2563eb}' +
+  '.bw_ce_light.bw_ce .bw_ce_css_value{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_at_rule{color:#7c3aed}' +
+  '.bw_ce_light.bw_ce .bw_ce_color{color:#ea580c}' +
+  '.bw_ce_light.bw_ce .bw_ce_template_interp{color:#0891b2}';
 
 function ensureCSS(bw) {
   if (_cssInjected) return;
   _cssInjected = true;
   if (bw && bw.injectCSS) {
-    bw.injectCSS(CSS_TEXT, { id: 'bw-code-edit-styles' });
+    bw.injectCSS(CSS_TEXT, { id: 'bw_code_edit_styles' });
   }
 }
 
@@ -483,7 +483,7 @@ function tokensToTACO(tokArr) {
     if (tok.type === 'plain') {
       result.push(tok.text);
     } else {
-      result.push({ t: 'span', a: { class: 'bw-ce-' + tok.type }, c: tok.text });
+      result.push({ t: 'span', a: { class: 'bw_ce_' + tok.type }, c: tok.text });
     }
   }
   return result;
@@ -537,13 +537,13 @@ function codeEditor(opts) {
   var lang = opts.lang || 'js';
   var height = opts.height || '180px';
   var readOnly = !!opts.readOnly;
-  var className = 'bw-ce' + (opts.className ? ' ' + opts.className : '');
+  var className = 'bw_ce' + (opts.className ? ' ' + opts.className : '');
 
   var highlighted = highlight(code, lang);
 
   var codeAttrs = {
     spellcheck: 'false',
-    class: 'bw-ce-code'
+    class: 'bw_ce_code'
   };
   if (!readOnly) {
     codeAttrs.contenteditable = 'true';
@@ -557,7 +557,7 @@ function codeEditor(opts) {
     ],
     o: {
       mounted: function(el) {
-        var codeEl = el.querySelector('.bw-ce-code');
+        var codeEl = el.querySelector('.bw_ce_code');
         if (!codeEl) return;
 
         var currentCode = code;

package/src/bitwrench-color-utils.js

@@ -6,9 +6,13 @@
  * bw.colorParse, bw.colorRgbToHsl, etc.
  *
  * @module bitwrench-color-utils
- * @license BSD-2-Clause
+ * @license BSD-2-Clause 
+ * @copy Manu Chatterjee @deftio
  */
 
+function _xs (x) {
+  return ('0' + x.toString(16)).slice(-2)
+}
 /**
  * Clamp a value between min and max.
  * @param {number} val
@@ -200,10 +204,7 @@ export function hexToHsl(hex) {
  */
 export function hslToHex(hsl) {
   var rgb = colorHslToRgb(hsl[0], hsl[1], hsl[2], 255, true);
-  return '#' +
-    ('0' + rgb[0].toString(16)).slice(-2) +
-    ('0' + rgb[1].toString(16)).slice(-2) +
-    ('0' + rgb[2].toString(16)).slice(-2);
+  return '#' + _xs(rgb[0])+_xs(rgb[1])+_xs(rgb[2]);
 }
 
 /**
@@ -232,10 +233,7 @@ export function mixColor(hex1, hex2, ratio) {
   var r = Math.round(c1[0] + (c2[0] - c1[0]) * ratio);
   var g = Math.round(c1[1] + (c2[1] - c1[1]) * ratio);
   var b = Math.round(c1[2] + (c2[2] - c1[2]) * ratio);
-  return '#' +
-    ('0' + r.toString(16)).slice(-2) +
-    ('0' + g.toString(16)).slice(-2) +
-    ('0' + b.toString(16)).slice(-2);
+  return '#' + _xs(r) + _xs(g) + _xs(b);
 }
 
 /**
@@ -415,16 +413,25 @@ export function derivePalette(config) {
   var lightBase = config.light || hslToHex([h, 8, 97]);
   var darkBase  = config.dark  || hslToHex([h, 10, 13]);
 
+  // Background & surface tokens — default to light (white/near-white).
+  // Dark backgrounds require explicit config.background / config.surface.
+  // Primary/secondary colors are accents, not page backgrounds, so
+  // isLightPalette should NOT drive bg/surface defaults.
+  var bgBase = config.background || '#ffffff';
+  var surfBase = config.surface || '#f8f9fa';
+
   var palette = {
-    primary:   deriveShades(config.primary),
-    secondary: deriveShades(config.secondary),
-    tertiary:  deriveShades(config.tertiary),
-    success:   deriveShades(successBase),
-    danger:    deriveShades(dangerBase),
-    warning:   deriveShades(warningBase),
-    info:      deriveShades(infoBase),
-    light:     deriveShades(lightBase),
-    dark:      deriveShades(darkBase)
+    primary:    deriveShades(config.primary),
+    secondary:  deriveShades(config.secondary),
+    tertiary:   deriveShades(config.tertiary),
+    success:    deriveShades(successBase),
+    danger:     deriveShades(dangerBase),
+    warning:    deriveShades(warningBase),
+    info:       deriveShades(infoBase),
+    light:      deriveShades(lightBase),
+    dark:       deriveShades(darkBase),
+    background: bgBase,
+    surface:    surfBase
   };
 
   return palette;

package/src/bitwrench-components-stub.js

@@ -1,5 +1,8 @@
 /**
- * Empty stub for bitwrench-components-v2.js.
+ * Empty stub for bitwrench-bccl.js.
  * Used by the lean build to exclude all BCCL component code.
  */
 export const componentHandles = {};
+export function variantClass() { return ''; }
+export var BCCL = {};
+export function make() { throw new Error('bw.make() requires the full bitwrench build (not lean)'); }

package/src/bitwrench-file-ops.js

@@ -0,0 +1,180 @@
+/**
+ * Bitwrench v2 File I/O Functions
+ *
+ * Save/load files in both Node.js and browser environments.
+ * Node uses fs module, browser uses Blob/XHR/FileReader.
+ *
+ * Called via bindFileOps(bw) which attaches all functions to the bw namespace.
+ * This preserves the same public API (bw.saveClientFile, bw.loadClientFile, etc.)
+ * while keeping the implementation in a separate module.
+ *
+ * @module bitwrench-file-ops
+ * @license BSD-2-Clause
+ * @author M A Chatterjee <deftio [at] deftio [dot] com>
+ */
+
+/**
+ * Attach all file I/O functions to the bitwrench namespace.
+ *
+ * @param {Object} bw - Bitwrench namespace object
+ */
+export function bindFileOps(bw) {
+
+  /**
+   * Save data to a file. Works in both Node.js (fs.writeFile) and browser (download link).
+   *
+   * @param {string} fname - Filename to save as
+   * @param {*} data - Data to save (string or buffer)
+   * @category File I/O
+   */
+  bw.saveClientFile = function(fname, data) {
+    if (bw.isNodeJS()) {
+      bw._getFs().then(function(fs) {
+        if (!fs) { console.error('bw.saveClientFile: fs module not available'); return; }
+        fs.writeFile(fname, data, function(err) {
+          if (err) {
+            console.error("Error saving file:", err);
+          }
+        });
+      });
+    } else {
+      var blob = new Blob([data], { type: "application/octet-stream" });
+      var url = window.URL.createObjectURL(blob);
+      var a = bw.createDOM({
+        t: 'a',
+        a: {
+          href: url,
+          download: fname,
+          style: 'display: none'
+        }
+      });
+      document.body.appendChild(a);
+      a.click();
+      window.URL.revokeObjectURL(url);
+      document.body.removeChild(a);
+    }
+  };
+
+  /**
+   * Save data as a JSON file with pretty formatting.
+   *
+   * @param {string} fname - Filename to save as
+   * @param {*} data - Data to serialize as JSON
+   * @category File I/O
+   */
+  bw.saveClientJSON = function(fname, data) {
+    bw.saveClientFile(fname, JSON.stringify(data, null, 2));
+  };
+
+  /**
+   * Load a file by path (Node.js) or URL (browser via XHR).
+   *
+   * @param {string} fname - File path (Node) or URL (browser)
+   * @param {Function} callback - Called with (data, error). data is null on error.
+   * @param {Object} [options] - Options
+   * @param {string} [options.parser="raw"] - "raw" for string, "JSON" to auto-parse
+   * @returns {string} "BW_OK"
+   * @category File I/O
+   */
+  bw.loadClientFile = function(fname, callback, options) {
+    var opts = { parser: 'raw' };
+    if (options && options.parser) { opts.parser = options.parser; }
+    var parse = (opts.parser === 'JSON') ? JSON.parse : function(s) { return s; };
+
+    if (bw.isNodeJS()) {
+      bw._getFs().then(function(fs) {
+        if (!fs) { callback(null, new Error('fs module not available')); return; }
+        fs.readFile(fname, 'utf8', function(err, data) {
+          if (err) { callback(null, err); }
+          else {
+            try { callback(parse(data), null); }
+            catch (e) { callback(null, e); }
+          }
+        });
+      });
+    } else {
+      var x = new XMLHttpRequest();
+      x.open('GET', fname, true);
+      x.onreadystatechange = function() {
+        if (x.readyState === 4) {
+          if (x.status >= 200 && x.status < 300) {
+            try { callback(parse(x.responseText), null); }
+            catch (e) { callback(null, e); }
+          } else {
+            callback(null, new Error('HTTP ' + x.status + ': ' + fname));
+          }
+        }
+      };
+      x.send(null);
+    }
+    return 'BW_OK';
+  };
+
+  /**
+   * Load a JSON file by path (Node.js) or URL (browser).
+   *
+   * @param {string} fname - File path (Node) or URL (browser)
+   * @param {Function} callback - Called with (parsedData, error)
+   * @returns {string} "BW_OK"
+   * @category File I/O
+   */
+  bw.loadClientJSON = function(fname, callback) {
+    return bw.loadClientFile(fname, callback, { parser: 'JSON' });
+  };
+
+  /**
+   * Prompt user to pick a local file via file dialog (browser only).
+   *
+   * @param {Function} callback - Called with (data, filename, error)
+   * @param {Object} [options] - Options
+   * @param {string} [options.accept] - File type filter (e.g. ".json,.txt")
+   * @param {string} [options.parser="raw"] - "raw" for string, "JSON" to auto-parse
+   * @category File I/O
+   */
+  bw.loadLocalFile = function(callback, options) {
+    var opts = { parser: 'raw', accept: '' };
+    if (options) {
+      if (options.parser) { opts.parser = options.parser; }
+      if (options.accept) { opts.accept = options.accept; }
+    }
+    var parse = (opts.parser === 'JSON') ? JSON.parse : function(s) { return s; };
+
+    if (bw.isNodeJS()) {
+      callback(null, '', new Error('bw.loadLocalFile is browser-only. Use bw.loadClientFile() in Node.'));
+      return;
+    }
+
+    var input = bw.createDOM({
+      t: 'input',
+      a: {
+        type: 'file',
+        accept: opts.accept,
+        style: 'display: none'
+      }
+    });
+    input.addEventListener('change', function() {
+      var file = input.files[0];
+      if (!file) { callback(null, '', new Error('No file selected')); return; }
+      var reader = new FileReader();
+      reader.onload = function(e) {
+        try { callback(parse(e.target.result), file.name, null); }
+        catch (err) { callback(null, file.name, err); }
+      };
+      reader.onerror = function() { callback(null, file.name, reader.error); };
+      reader.readAsText(file);
+      input.remove();
+    });
+    document.body.appendChild(input);
+    input.click();
+  };
+
+  /**
+   * Prompt user to pick a local JSON file via file dialog (browser only).
+   *
+   * @param {Function} callback - Called with (parsedData, filename, error)
+   * @category File I/O
+   */
+  bw.loadLocalJSON = function(callback) {
+    bw.loadLocalFile(callback, { parser: 'JSON', accept: '.json' });
+  };
+}

package/src/bitwrench-lean.js

@@ -2,13 +2,13 @@
  * bitwrench-lean.js — Entry point for the lean build.
  *
  * This is identical to bitwrench.js but the Rollup config redirects
- * the bitwrench-components-v2.js import to an empty stub, so no
+ * the bitwrench-bccl.js import to an empty stub, so no
  * BCCL component code is included in the output.
  *
  * Includes: HTML/DOM generation, CSS generation, color utilities,
  *           state management, pub/sub, file I/O, random/lorem,
  *           cookies, URL params, logging, makeTable, makeDataTable.
- * Excludes: All make* component helpers from bitwrench-components-v2.js
+ * Excludes: All make* component helpers from bitwrench-bccl.js
  *           (makeButton, makeCard, makeAlert, makeTabs, etc.)
  */
 export { default } from './bitwrench.js';