npm - @polderlabs/bizar - Versions diffs - 4.4.6 → 4.4.8 - Mend

@polderlabs/bizar 4.4.6 → 4.4.8

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 (19) hide show

package/bizar-dash/dist/assets/main-CEazNxxy.js +347 -0
package/bizar-dash/dist/assets/main-CEazNxxy.js.map +1 -0
package/bizar-dash/dist/assets/{mobile-CQTXbuHq.js → mobile-DSb-t42Y.js} +2 -2
package/bizar-dash/dist/assets/{mobile-CQTXbuHq.js.map → mobile-DSb-t42Y.js.map} +1 -1
package/bizar-dash/dist/assets/{mobile-CaZ0gEeJ.js → mobile-Dl1q7Cyq.js} +2 -2
package/bizar-dash/dist/assets/{mobile-CaZ0gEeJ.js.map → mobile-Dl1q7Cyq.js.map} +1 -1
package/bizar-dash/dist/index.html +2 -2
package/bizar-dash/dist/mobile.html +2 -2
package/bizar-dash/src/server/glyphs/mdx-compiler.mjs +13 -0
package/bizar-dash/src/web/views/glyphs/GlyphRenderer.tsx +240 -9
package/cli/bin.mjs +39 -30
package/cli/install.mjs +13 -51
package/cli/provision.mjs +967 -0
package/cli/update.mjs +28 -878
package/config/skills/glyph/SKILL.md +126 -25
package/install.sh +226 -439
package/package.json +1 -1
package/bizar-dash/dist/assets/main-C4Dq4wTz.js +0 -347
package/bizar-dash/dist/assets/main-C4Dq4wTz.js.map +0 -1

package/bizar-dash/dist/index.html CHANGED Viewed

@@ -29,8 +29,8 @@
         }
       })();
     </script>
-    <script type="module" crossorigin src="/assets/main-C4Dq4wTz.js"></script>
-    <link rel="modulepreload" crossorigin href="/assets/mobile-CaZ0gEeJ.js">
+    <script type="module" crossorigin src="/assets/main-CEazNxxy.js"></script>
+    <link rel="modulepreload" crossorigin href="/assets/mobile-Dl1q7Cyq.js">
     <link rel="stylesheet" crossorigin href="/assets/mobile-CsZQAswA.css">
     <link rel="stylesheet" crossorigin href="/assets/main-Nq8Dq3VR.css">
   </head>

package/bizar-dash/dist/mobile.html CHANGED Viewed

@@ -12,8 +12,8 @@
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-    <script type="module" crossorigin src="/assets/mobile-CQTXbuHq.js"></script>
-    <link rel="modulepreload" crossorigin href="/assets/mobile-CaZ0gEeJ.js">
+    <script type="module" crossorigin src="/assets/mobile-DSb-t42Y.js"></script>
+    <link rel="modulepreload" crossorigin href="/assets/mobile-Dl1q7Cyq.js">
     <link rel="stylesheet" crossorigin href="/assets/mobile-CsZQAswA.css">
   </head>
   <body>

package/bizar-dash/src/server/glyphs/mdx-compiler.mjs CHANGED Viewed

@@ -199,6 +199,19 @@ function parseJsxValue(src) {
       }
       while (i < len) {
         skipWs();
+        // v4.4.8 — After consuming a comma + whitespace, check for the
+        // closer before recursing. Without this, an array like `[a, b, ]`
+        // would call parseValue on `]`, which falls through to the
+        // bareword-identifier branch and returns `{__ident: ''}` as a
+        // phantom element. The trailing-comma-then-closer case was the
+        // user-visible bug in the v3-to-v4-consolidation glyph: the
+        // FileTree's last entry was the bareword phantom, which then
+        // crashed the React renderer (components.tsx:609 tried to read
+        // `t.bg` on undefined).
+        if (arr && src[i] === closer) {
+          i += 1;
+          return items;
+        }
         if (arr) {
           items.push(parseValue());
         } else {

package/bizar-dash/src/web/views/glyphs/GlyphRenderer.tsx CHANGED Viewed

@@ -49,6 +49,142 @@ import {
   Mockup,
 } from './components';
+// ---------------------------------------------------------------------------
+// BlockErrorBoundary — v4.4.8
+//
+// A single broken block (e.g. a FileTree whose `data.entries` ended up
+// not being an array because the parser silently produced a phantom
+// bareword entry) used to throw inside React, which propagated up and
+// blanked the whole canvas. The boundary catches throws per-block and
+// renders an inline error card instead. The boundary also exposes its
+// errors via a callback so we can surface them in the top-of-page
+// "render errors" banner.
+// ---------------------------------------------------------------------------
+interface BlockErrorBoundaryProps {
+  blockId: string;
+  blockType: string;
+  children: React.ReactNode;
+  onError: (blockId: string, blockType: string, err: Error, info: React.ErrorInfo) => void;
+}
+interface BlockErrorBoundaryState {
+  err: Error | null;
+}
+class BlockErrorBoundary extends React.Component<BlockErrorBoundaryProps, BlockErrorBoundaryState> {
+  state: BlockErrorBoundaryState = { err: null };
+  static getDerivedStateFromError(err: Error): BlockErrorBoundaryState {
+    return { err };
+  }
+  componentDidCatch(err: Error, info: React.ErrorInfo): void {
+    try {
+      this.props.onError(this.props.blockId, this.props.blockType, err, info);
+    } catch {
+      /* ignore — the boundary itself must not throw */
+    }
+  }
+  render(): React.ReactNode {
+    if (this.state.err) {
+      return (
+        <div
+          className="glyph-block-error"
+          role="alert"
+          style={{
+            border: '1px solid var(--error, #f85149)',
+            background: 'rgba(248, 81, 73, 0.06)',
+            borderRadius: 8,
+            padding: '12px 14px',
+            margin: '12px 0',
+            color: 'var(--text)',
+            fontFamily: 'var(--font-mono, ui-monospace, monospace)',
+            fontSize: 12,
+            lineHeight: 1.55,
+          }}
+        >
+          <strong style={{ color: 'var(--error, #f85149)', fontFamily: 'var(--font-sans, system-ui, sans-serif)', display: 'block', marginBottom: 4 }}>
+            {this.props.blockType} block crashed
+          </strong>
+          <div style={{ color: 'var(--text-muted)', marginBottom: 6 }}>
+            block id: <code>{this.props.blockId}</code>
+          </div>
+          <pre style={{ margin: 0, whiteSpace: 'pre-wrap', wordBreak: 'break-word', color: 'var(--text)' }}>
+            {this.state.err.message}
+          </pre>
+        </div>
+      );
+    }
+    return this.props.children;
+  }
+}
+// ---------------------------------------------------------------------------
+// Block validation — v4.4.8
+//
+// Before handing block data to the component switch, verify that the
+// shape matches the prop contract. Returns `{ ok: true }` when the
+// block can be rendered, or `{ ok: false, error }` when a field is
+// missing or wrong type. The renderer uses the error to skip the
+// component and surface an inline message instead of throwing.
+// ---------------------------------------------------------------------------
+function validateBlock(b: Block): { ok: true } | { ok: false; error: string } {
+  const data = (b.data ?? {}) as Record<string, unknown>;
+  switch (b.type) {
+    case 'RichText':
+      return { ok: true };
+    case 'Callout':
+      return { ok: true };
+    case 'Checklist':
+      if (!Array.isArray(data.items)) return { ok: false, error: 'Checklist requires data.items to be an array' };
+      return { ok: true };
+    case 'Table':
+      if (!Array.isArray(data.columns)) return { ok: false, error: 'Table requires data.columns to be an array' };
+      if (!Array.isArray(data.rows)) return { ok: false, error: 'Table requires data.rows to be an array' };
+      if (data.rows.length > 0 && !Array.isArray(data.rows[0])) return { ok: false, error: 'Table.data.rows[0] must be an array (cell array)' };
+      return { ok: true };
+    case 'CodeTabs':
+      if (!Array.isArray(data.tabs)) return { ok: false, error: 'CodeTabs requires data.tabs to be an array' };
+      return { ok: true };
+    case 'Decision':
+      if (!Array.isArray(data.options)) return { ok: false, error: 'Decision requires data.options to be an array' };
+      return { ok: true };
+    case 'OpenQuestions':
+      if (!Array.isArray(data.questions)) return { ok: false, error: 'OpenQuestions requires data.questions to be an array' };
+      return { ok: true };
+    case 'FileTree':
+      if (!Array.isArray(data.entries)) return { ok: false, error: 'FileTree requires data.entries to be an array' };
+      // v4.4.8 — also catch the phantom bareword entry the parser used
+      // to emit (the v3-to-v4-consolidation glyph crash). An entry that
+      // is not an object means the parser miscounted braces.
+      for (const e of data.entries) {
+        if (e === null || typeof e !== 'object' || Array.isArray(e)) {
+          return { ok: false, error: `FileTree contains a malformed entry: ${JSON.stringify(e)}` };
+        }
+      }
+      return { ok: true };
+    case 'Diff':
+      if (typeof data.before !== 'string') return { ok: false, error: 'Diff requires data.before to be a string' };
+      if (typeof data.after !== 'string') return { ok: false, error: 'Diff requires data.after to be a string' };
+      return { ok: true };
+    case 'Stat':
+      if (data.label === undefined || data.label === null) return { ok: false, error: 'Stat requires data.label' };
+      if (data.value === undefined || data.value === null) return { ok: false, error: 'Stat requires data.value' };
+      return { ok: true };
+    case 'Workflow':
+      if (!Array.isArray(data.steps)) return { ok: false, error: 'Workflow requires data.steps to be an array' };
+      return { ok: true };
+    case 'Mockup':
+      if (typeof data.html !== 'string') return { ok: false, error: 'Mockup requires data.html to be a string' };
+      return { ok: true };
+    case 'Diagram':
+      if (typeof data.dataHtml !== 'string') return { ok: false, error: 'Diagram requires data.dataHtml to be a string' };
+      return { ok: true };
+    default:
+      return { ok: false, error: `Unknown block type: ${(b as { type: string }).type}` };
+  }
+}
 // ---------------------------------------------------------------------------
 // Types — match the server compiler output
 // ---------------------------------------------------------------------------
@@ -72,7 +208,7 @@ interface CompiledGlyph {
   slug: string;
   frontmatter: Record<string, unknown>;
   blocks: Block[];
-  errors: string[];
+  errors: Array<{ line?: number; message: string }>;
   compiledAt: string;
 }
@@ -162,6 +298,25 @@ export function GlyphRenderer({ slug, onClose, onCommentAdded }: Props) {
   // Active pin (expanded thread view)
   const [activePin, setActivePin] = useState<string | null>(null);
+  // v4.4.8 — Per-block render errors caught by BlockErrorBoundary. The
+  // boundary calls onError(err) which pushes into this array. We render
+  // the array at the top of the canvas in a prominent red banner so the
+  // user isn't left staring at a blank screen wondering what happened.
+  const [blockErrors, setBlockErrors] = useState<
+    Array<{ blockId: string; blockType: string; message: string }>
+  >([]);
+  const reportBlockError = React.useCallback(
+    (blockId: string, blockType: string, err: Error) => {
+      setBlockErrors((prev) => {
+        // dedupe by blockId so the same block crashing twice doesn't
+        // duplicate the entry
+        if (prev.some((e) => e.blockId === blockId)) return prev;
+        return [...prev, { blockId, blockType, message: err.message || String(err) }];
+      });
+    },
+    [],
+  );
   const canvasRef = useRef<HTMLDivElement>(null);
   // Section grouping — memoized so we don't re-walk the block array on every render
@@ -289,10 +444,58 @@ export function GlyphRenderer({ slug, onClose, onCommentAdded }: Props) {
     setFullscreen((v) => !v);
   }
-  // Render a single block
+  // Render a single block — wrapped in a BlockErrorBoundary so a single
+// broken block (e.g. wrong data shape from a parser bug) shows an inline
+// error card instead of blanking the whole canvas.
   const renderBlock = (b: Block) => {
     const id = b.id;
     const data = (b.data ?? {}) as Record<string, unknown>;
+    // Validate data shape BEFORE handing to the component switch. A
+    // validation failure shows an inline error card immediately, no
+    // need for the boundary to catch it.
+    const validation = validateBlock(b);
+    if (!validation.ok) {
+      return (
+        <div
+          key={id}
+          id={id}
+          className="glyph-block-error"
+          role="alert"
+          style={{
+            border: '1px solid var(--error, #f85149)',
+            background: 'rgba(248, 81, 73, 0.06)',
+            borderRadius: 8,
+            padding: '12px 14px',
+            margin: '12px 0',
+            color: 'var(--text)',
+            fontFamily: 'var(--font-mono, ui-monospace, monospace)',
+            fontSize: 12,
+            lineHeight: 1.55,
+          }}
+        >
+          <strong style={{ color: 'var(--error, #f85149)', fontFamily: 'var(--font-sans, system-ui, sans-serif)', display: 'block', marginBottom: 4 }}>
+            {b.type} block invalid
+          </strong>
+          <div style={{ color: 'var(--text-muted)', marginBottom: 6 }}>
+            block id: <code>{id}</code>
+          </div>
+          <pre style={{ margin: 0, whiteSpace: 'pre-wrap', wordBreak: 'break-word' }}>{validation.error}</pre>
+        </div>
+      );
+    }
+    // Wrap the actual render in an error boundary so even runtime
+    // errors (bad component props, undefined data, etc.) don't crash
+    // the whole canvas.
+    return (
+      <BlockErrorBoundary key={id} blockId={id} blockType={b.type} onError={reportBlockError}>
+        {renderBlockInner(b, id, data)}
+      </BlockErrorBoundary>
+    );
+  };
+  // Inner renderer — split out so the outer renderBlock can validate +
+  // wrap in an error boundary without nesting the switch in the JSX tree.
+  const renderBlockInner = (b: Block, id: string, data: Record<string, unknown>) => {
     switch (b.type) {
       case 'RichText':
         return <RichText key={id} id={id}>{b.childrenMarkdown ?? ''}</RichText>;
@@ -506,13 +709,41 @@ export function GlyphRenderer({ slug, onClose, onCommentAdded }: Props) {
           </div>
         </header>
-        {/* Compiler warnings */}
-        {compiled.errors?.length > 0 && (
-          <div className="glyph-errors">
-            <strong>Compiler warnings:</strong>
-            <ul>
-              {compiled.errors.map((e, i) => (
-                <li key={i}>{e}</li>
+        {/* v4.4.8 — Render errors banner. Two layers:
+              1. Compiler warnings from the MDX parser (e.g. unknown
+                 tag, unclosed block). Lightweight, yellow border.
+              2. Block render errors caught by BlockErrorBoundary. These
+                 are the "one block crashed but the rest still rendered"
+                 cases. Red border, prominent, listed first so the user
+                 sees them before scrolling. */}
+        {(blockErrors.length > 0 || compiled.errors?.length > 0) && (
+          <div
+            className="glyph-render-errors"
+            role="alert"
+            style={{
+              border: '1px solid var(--error, #f85149)',
+              background: 'rgba(248, 81, 73, 0.08)',
+              borderRadius: 8,
+              padding: '12px 16px',
+              margin: '0 0 16px 0',
+              color: 'var(--text)',
+            }}
+          >
+            <strong style={{ color: 'var(--error, #f85149)', display: 'block', marginBottom: 8 }}>
+              {blockErrors.length > 0
+                ? `${blockErrors.length} block${blockErrors.length === 1 ? '' : 's'} failed to render`
+                : 'Compiler warnings'}
+            </strong>
+            <ul style={{ margin: 0, paddingLeft: 20, fontFamily: 'var(--font-mono, ui-monospace, monospace)', fontSize: 12, lineHeight: 1.6 }}>
+              {blockErrors.map((e, i) => (
+                <li key={`be-${i}`}>
+                  <strong>{e.blockType}</strong> (<code>{e.blockId}</code>): {e.message}
+                </li>
+              ))}
+              {compiled.errors?.map((e, i) => (
+                <li key={`ce-${i}`}>
+                  {e.line ? `line ${e.line}: ` : ''}{e.message}
+                </li>
               ))}
             </ul>
           </div>

package/cli/bin.mjs CHANGED Viewed

@@ -153,59 +153,68 @@ function showExportHelp() {
 function showInstallHelp() {
   console.log(`
-  bizar install — Run the canonical BizarHarness installer
+  bizar install — Run the unified BizarHarness installer
   Usage:
-    bizar install
+    bizar install                 Install (or refresh) every component
+    bizar install --dry-run       Print what would happen, change nothing
+    bizar install --force         Overwrite existing files
+    bizar install --help          Show this help
   Description:
-    v3.20.11+ — thin wrapper around ./install.sh. The bash script
-    auto-installs every system dep (uv, python3.12, chrome-headless-shell
-    + runtime libs, jq), installs browser-harness via uv, syncs agents /
-    commands / hooks / skills into ~/.config/opencode/, configures
-    opencode.json + the Bizar plugin, and prints a single status banner.
-    No API key collection, no interactive prompts, no opencode restart —
-    the installer is safe to re-run anytime.
-    Run from a fresh git clone instead: \`cd BizarHarness && ./install.sh\`
+    v4.4.7+ — unified installer. Same code path as 'bizar update'; the
+    difference is just mode=install vs mode=update. Every step is
+    idempotent — running this twice is safe.
+    1. Installs @polderlabs/bizar via npm (skipped if already current).
+    2. Shells to ./install.sh for platform-specific system deps (uv,
+       python3.12, jq, gh on Linux; brew on macOS) + service registration
+       (systemd / launchd / Task Scheduler).
+    3. Syncs agent files, slash commands, and bundled skills into
+       ~/.config/opencode/.
+    4. Copies plugins/bizar/ from the npm install into
+       ~/.config/opencode/plugins/bizar/ (preserves dev symlinks).
+    5. Patches ~/.config/opencode/opencode.json with the Bizar plugin
+       entry (skipped if already present).
+    6. Runs 'bizar doctor' as a post-install health check.
+    No API key collection, no interactive prompts.
   `);
 }
 function showUpdateHelp() {
   console.log(`
-  bizar update — Update opencode, bizar, bizar-dash, and/or bizar-plugin
+  bizar update — Update opencode + @polderlabs/bizar (which bundles the
+  plugin and dashboard). Detects what's installed and only touches what's
+  missing or out of date.
   Usage:
     bizar update                       Update EVERYTHING (default; auto-kills + restarts)
-    bizar update --pick                Interactive picker (legacy per-component UI)
-    bizar update opencode bizar dash    Update specific components
     bizar update --no-restart          Don't auto-restart the dashboard after update
     bizar update --dry-run             Print what would happen, change nothing
+    bizar update --force               Override .bizar/PRE_PUSH_NOTES.md blockers
+    bizar update --yes                 Same as --force, but named for one-line scripts
     bizar update --help                Show this help
-  Components:
-    opencode   the opencode CLI itself
-    bizar      @polderlabs/bizar (this CLI + installer + agents + rules)
-    dash       @polderlabs/bizar-dash (web dashboard + TUI)
-    plugin     @polderlabs/bizar-plugin (opencode plugin)
+  Components updated:
+    opencode-ai   the opencode CLI itself
+    @polderlabs/bizar    this CLI + dashboard + plugin (one package)
-  Behavior (v3.15.0+):
-    • Default = automatic. Updates all 4 components without prompting.
-      Any missing package is auto-installed so a broken install gets
-      repaired in one shot.
+  Behavior (v4.4.7+):
+    • Single unified provisioner. 'bizar install' and 'bizar update' are
+      the same code path with different mode flags. Every step is
+      idempotent — re-running is safe.
     • Detects running Bizar instances (background service daemon, web
       dashboard) by reading ~/.config/bizar/{service,dashboard}.pid and
       cleans up any stale or empty PID files.
-    • Auto-kills running instances with a brief notice (use --pick to
-      be prompted first instead).
+    • Auto-kills running instances with a brief notice.
     • Sends SIGTERM, waits up to 5s, escalates to SIGKILL if needed.
     • Re-runs the install script so the deployed plugin source matches
       the just-upgraded npm version (avoids the version-skew trap).
-    • If the dashboard was running and bizar or dash was updated,
-      spawns a fresh detached dashboard process with the new code
-      (skipped with --no-restart).
-    • Runs \`bizar doctor\` after a successful update to catch config
+    • If the dashboard was running and bizar was updated, spawns a
+      fresh detached dashboard process with the new code (skipped with
+      --no-restart).
+    • Runs 'bizar doctor' after a successful update to catch config
       regressions before opencode tries to start.
   Examples:

package/cli/install.mjs CHANGED Viewed

@@ -203,60 +203,22 @@ export async function installPluginFromGlobal(opts = {}) {
 }
 /**
- * runInstaller — v3.20.11 thin wrapper.
+ * runInstaller — v4.4.7 thin wrapper around the unified provisioner.
  *
- * As of v3.20.11, `bizar install` is a thin wrapper around the canonical
- * `install.sh` script at the repo root. The bash script handles all the
- * heavy lifting: system-dep installation (uv, python3.12, chrome-headless-shell
- * + runtime libs, jq), browser-harness via uv, Chrome lifecycle, agent /
- * command / hook / skill sync, opencode.json merging, install-state.
+ * `bizar install` and `bizar update` are now the SAME code path with
+ * different `mode` flags. Everything (deps, plugin copy, opencode.json
+ * patching, service registration, agent files, skills, doctor) is
+ * owned by `cli/provision.mjs:runProvision`. This file just parses the
+ * flags and forwards.
  *
- * Why a thin wrapper instead of the old TUI:
- *   - One source of truth. The bash script is also what `git clone` users
- *     run (`./install.sh`), what `bizar update` re-runs, and what the npm
- *     postinstall hook invokes. Keeping a parallel Node implementation
- *     guarantees the two will diverge.
- *   - No interactive prompts. The TUI asked for API keys, restart
- *     confirmation, and component selection — none of which belong in a
- *     `npm i -g @polderlabs/bizar` install (no TTY, secrets stay local).
- *   - Cross-platform. The bash script already detects Windows and falls
- *     back to the npm-based path; re-implementing that in Node is busywork.
- *
- * Returns the install.sh exit code (0 = success, 1 = partial failure).
- * On platforms where bash isn't available (rare — Windows without WSL),
- * falls back to running the npm-based path directly.
+ * Backward-compatible — the public exports (`runInstaller`,
+ * `runPostInstall`, `installPluginFromGlobal`) still exist so that any
+ * external callers (including the postinstall npm hook) keep working.
+ * New code should call `runProvision({ mode: 'install' })` directly.
  */
-export async function runInstaller() {
-  const { existsSync } = await import('node:fs');
-  const { join } = await import('node:path');
-  const { spawnSync } = await import('node:child_process');
-  // __dirname is defined at module scope (see top of file)
-  // cli/install.mjs → ../install.sh
-  const installSh = join(__dirname, '..', 'install.sh');
-  if (!existsSync(installSh)) {
-    console.error(chalk.red('  ✗ install.sh not found at ' + installSh));
-    console.error(chalk.dim('    Run `git clone https://github.com/DrB0rk/BizarHarness` first, then `cd BizarHarness && ./install.sh`.'));
-    process.exit(1);
-  }
-  console.log(chalk.bold.hex('#6366f1')('\n  BizarHarness installer (delegating to install.sh)\n'));
-  const useBash = process.platform !== 'win32' || process.env.WSL_DISTRO_NAME;
-  if (useBash) {
-    const r = spawnSync('bash', [installSh], { stdio: 'inherit' });
-    process.exit(r.status ?? 1);
-  }
-  // Windows without WSL — bash isn't available. The bash script has a
-  // Windows fallback that uses npm-based install paths. Run the npm path
-  // directly: install the BizarHarness npm packages + copy plugin from
-  // global to ~/.config/opencode/plugins/bizar/. This is the same code
-  // path install.sh uses for `platform == win32`.
-  console.log(chalk.dim('  bash not available — running npm-based installer (Windows path)'));
-  console.log('');
-  await runPostInstall();
+export async function runInstaller(opts = {}) {
+  const { runProvision } = await import('./provision.mjs');
+  return runProvision({ ...opts, mode: 'install' });
 }
 // ── Interactive prompts for optional packages ─────────────────────────────────