bluedither 1.0.18 → 1.0.20

package/fine-tuner/dev-middleware.js

@@ -18,17 +18,20 @@ import { resolve, dirname } from 'path';
 const ENDPOINT = '/__bluedither/commit';
 
 function findTokensPath() {
-  // Search from cwd for bluedither/tokens.json
+  // Search from cwd — prioritize public/ (Vite serves static from there)
   const cwd = process.cwd();
   const paths = [
-    resolve(cwd, 'bluedither', 'tokens.json'),
     resolve(cwd, 'public', 'bluedither', 'tokens.json'),
+    resolve(cwd, 'bluedither', 'tokens.json'),
     resolve(cwd, 'theme', 'tokens.json'),
   ];
   for (const p of paths) {
     if (existsSync(p)) return p;
   }
-  // Default to bluedither/tokens.json even if it doesn't exist yet
+  // Default to public/bluedither if public/ dir exists (Vite project), else bluedither/
+  if (existsSync(resolve(cwd, 'public'))) {
+    return resolve(cwd, 'public', 'bluedither', 'tokens.json');
+  }
   return resolve(cwd, 'bluedither', 'tokens.json');
 }
 

package/fine-tuner/inject.js

@@ -10,6 +10,10 @@
  */
 
 (async function () {
+  // Prevent double-init (React StrictMode re-fires effects in dev)
+  if (window.__BD_INJECT_LOADED__) return;
+  window.__BD_INJECT_LOADED__ = true;
+
   // Find the base path to bluedither/ directory
   const scriptEl = document.currentScript;
   const scriptSrc = scriptEl?.src || '';
@@ -111,7 +115,9 @@
       if (t.shader?.scale != null) params.scale = t.shader.scale;
       if (t.shader?.size != null) params.size = t.shader.size;
       if (t.shader?.rotation != null) params.rotation = t.shader.rotation;
-      shader.updateParams(params);
+      if (typeof shader.updateParams === 'function') {
+        shader.updateParams(params);
+      }
       return true;
     };
 

package/fine-tuner/tuner.js

@@ -9,6 +9,10 @@
  * - Real-time shader parameter updates
  */
 
+// Prevent double-init (React StrictMode re-fires effects in dev)
+if (!window.__BD_TUNER_LOADED__) {
+window.__BD_TUNER_LOADED__ = true;
+
 const tokens = structuredClone(
   window.__BD_TOKENS__ ||
   JSON.parse(document.querySelector('script[type="application/json"][data-bluedither-tokens]')?.textContent || '{}')
@@ -341,17 +345,17 @@ function addSegmented(section, label, tokenPath, options, extraCb) {
 
 // ── Colors ──
 const colorsSection = addSection('Colors');
-addColor(colorsSection, 'Background', 'colors.background', '--bd-color-background');
+addColor(colorsSection, 'Background', 'colors.background', '--bd-bg');
 // Shader Front is declared first (but appended later) so Primary can reference it
 let shaderFrontHandle;
-addColor(colorsSection, 'Primary', 'colors.primary', '--bd-color-primary', (v) => {
+addColor(colorsSection, 'Primary', 'colors.primary', '--bd-primary', (v) => {
   // Sync shader front color: update token, UI, and live shader
   shaderFrontHandle.setValue(v);
   updateShader('colorFront', v);
 });
-addColor(colorsSection, 'Text', 'colors.text', '--bd-color-text');
-addColor(colorsSection, 'CTA Background', 'colors.ctaBackground', '--bd-color-cta-bg');
-addColor(colorsSection, 'CTA Text', 'colors.ctaText', '--bd-color-cta-text');
+addColor(colorsSection, 'Text', 'colors.text', '--bd-text');
+addColor(colorsSection, 'CTA Background', 'colors.ctaBackground', '--bd-cta-bg');
+addColor(colorsSection, 'CTA Text', 'colors.ctaText', '--bd-cta-text');
 shaderFrontHandle = addColor(colorsSection, 'Shader Front', 'colors.shaderFront', null, (v) => updateShader('colorFront', v));
 
 // ── Typography ──
@@ -360,8 +364,8 @@ addFontDropdown(typoSection, 'Primary Font', 'typography.primaryFont', '--bd-fon
 addFontDropdown(typoSection, 'Secondary Font', 'typography.secondaryFont', '--bd-font-secondary');
 addPxField(typoSection, 'Headline Size', 'typography.headline.referencePx', 32, 300, 1, '--bd-headline-size');
 addPxField(typoSection, 'Headline LH', 'typography.headline.lineHeightPx', 24, 280, 1, '--bd-headline-lh');
-addPxField(typoSection, 'Sub Size', 'typography.subHeadline.referencePx', 10, 48, 1, '--bd-subheadline-size');
-addPxField(typoSection, 'Sub LH', 'typography.subHeadline.lineHeightPx', 12, 80, 1, '--bd-subheadline-lh');
+addPxField(typoSection, 'Sub Size', 'typography.subHeadline.referencePx', 10, 48, 1, '--bd-sub-size');
+addPxField(typoSection, 'Sub LH', 'typography.subHeadline.lineHeightPx', 12, 80, 1, '--bd-sub-lh');
 addPxField(typoSection, 'Logo Size', 'typography.logo.referencePx', 12, 80, 1, '--bd-logo-size');
 addPxField(typoSection, 'Nav Size', 'typography.navItem.referencePx', 10, 48, 1, '--bd-nav-size');
 
@@ -499,3 +503,4 @@ commitBtn.onclick = async () => {
   }
 };
 panel.appendChild(commitBtn);
+} // end guard

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bluedither",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "description": "A bold, dithered-shader hero theme for Claude Code — skill + fine-tuner",
   "type": "module",
   "bin": {

package/theme/generators/react.md

@@ -80,9 +80,23 @@ function App() {
       u_fit: 0, u_offsetX: 0, u_offsetY: 0,
     }, { alpha: true, premultipliedAlpha: false }, SHADER_PARAMS.speed, 0, 2);
 
-    // CRITICAL: expose for tuner
-    window.__BD_SHADER__ = mount;
-    return () => { mount.dispose(); window.__BD_SHADER__ = null; };
+    // CRITICAL: expose wrapper with updateParams for the tuner
+    window.__BD_SHADER__ = {
+      updateParams(params) {
+        const uniforms = {};
+        if (params.colorFront !== undefined) uniforms.u_colorFront = getShaderColorFromString(params.colorFront);
+        if (params.colorBack !== undefined) uniforms.u_colorBack = getShaderColorFromString(params.colorBack);
+        if (params.shape !== undefined) uniforms.u_shape = DitheringShapes[params.shape] ?? DitheringShapes.warp;
+        if (params.type !== undefined) uniforms.u_type = DitheringTypes[params.type] ?? DitheringTypes['2x2'];
+        if (params.size !== undefined) uniforms.u_pxSize = params.size;
+        if (params.scale !== undefined) uniforms.u_scale = params.scale;
+        if (params.rotation !== undefined) uniforms.u_rotation = parseFloat(params.rotation) || 180;
+        if (Object.keys(uniforms).length > 0) mount.setUniforms(uniforms);
+        if (params.speed !== undefined) mount.setSpeed(params.speed);
+      },
+      dispose() { mount.dispose(); },
+    };
+    return () => { window.__BD_SHADER__.dispose(); window.__BD_SHADER__ = null; };
   }, []);
 
   // Load tuner in dev mode only