arckode-ui 0.1.0

package/dist/vite.js

@@ -0,0 +1,366 @@
+var y = Object.defineProperty;
+var C = (r, t, e) => t in r ? y(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var x = (r, t, e) => C(r, typeof t != "symbol" ? t + "" : t, e);
+import { transformWithEsbuild as b } from "vite";
+import { a as N, f as v } from "./analyzer-Ctnj3WTI.js";
+class h extends Error {
+  constructor(e, n, s) {
+    super(n);
+    x(this, "code");
+    x(this, "line");
+    this.name = "ArkParseError", this.code = e, this.line = s, Object.setPrototypeOf(this, h.prototype);
+  }
+}
+const k = /<(template|script|style)((?:\s+[^>]*)??)>([\s\S]*?)<\/\1>/g;
+function O(r, t) {
+  let e = 1;
+  for (let n = 0; n < t; n++)
+    r[n] === `
+` && e++;
+  return e;
+}
+function T(r, t) {
+  const n = new RegExp(`${t}=["']([^"']*)["']`).exec(r);
+  return n != null ? n[1] ?? null : null;
+}
+function R(r, t) {
+  return new RegExp(`(?:^|\\s)${t}(?:\\s|$|=)`).test(r);
+}
+function L(r) {
+  const t = [];
+  let e;
+  for (k.lastIndex = 0; (e = k.exec(r)) !== null; ) {
+    const i = e[1], u = e[2] ?? "", d = e[3] ?? "", m = O(r, e.index);
+    i !== void 0 && t.push({ tag: i, attrs: u, content: d, openLine: m });
+  }
+  const n = t.filter((i) => i.tag === "template"), s = t.filter((i) => i.tag === "script"), c = t.filter((i) => i.tag === "style");
+  if (n.length > 1 || s.length > 1) {
+    const i = n.length > 1 ? n[1] : s[1];
+    throw new h(
+      "DUPLICATE_SECTION",
+      `Duplicate <${i.tag}> section`,
+      i.openLine
+    );
+  }
+  if (n.length === 0)
+    throw new h(
+      "MISSING_TEMPLATE",
+      "Missing <template> section",
+      1
+    );
+  if (s.length === 0)
+    throw new h(
+      "MISSING_SCRIPT",
+      "Missing <script> section",
+      1
+    );
+  const p = n[0], o = s[0];
+  if (o.openLine < p.openLine)
+    throw new h(
+      "WRONG_ORDER",
+      "<script> must appear after <template>",
+      o.openLine
+    );
+  const l = T(o.attrs, "lang");
+  if (l !== "ts")
+    throw new h(
+      "MISSING_LANG_TS",
+      '<script> must have lang="ts"',
+      o.openLine
+    );
+  let f;
+  if (c.length > 0) {
+    const i = c[0], u = R(i.attrs, "scoped");
+    f = { content: i.content, scoped: u };
+  }
+  return {
+    template: {
+      content: p.content,
+      start: p.openLine
+    },
+    script: {
+      content: o.content,
+      lang: l
+    },
+    ...f !== void 0 ? { style: f } : {}
+  };
+}
+const E = /(?:(@[\w.]+|:[a-zA-Z][\w-]*|v-else-if|v-if|v-for|v-show|v-else|[\w-]+)(?:="([^"]*)")?)/g;
+function j(r) {
+  const t = [];
+  E.lastIndex = 0;
+  let e;
+  for (; (e = E.exec(r)) !== null; )
+    t.push({ name: e[1] ?? "", value: e[2] ?? "", raw: e[0] });
+  return t;
+}
+const I = /<(\/?)([a-zA-Z][a-zA-Z0-9-]*)((?:"[^"]*"|[^>])*)(\/?)>|([^<]+)/g;
+function W(r) {
+  const t = [], e = [];
+  I.lastIndex = 0;
+  let n;
+  const s = /* @__PURE__ */ new Set([
+    "area",
+    "base",
+    "br",
+    "col",
+    "embed",
+    "hr",
+    "img",
+    "input",
+    "link",
+    "meta",
+    "param",
+    "source",
+    "track",
+    "wbr"
+  ]);
+  for (; (n = I.exec(r)) !== null; ) {
+    const c = n[1] === "/", p = n[2], o = (n[3] ?? "").trim(), l = o.endsWith("/"), f = l ? o.slice(0, -1).trim() : o, i = l || n[4] === "/" || p !== void 0 && s.has(p.toLowerCase()), u = n[5];
+    if (u !== void 0) {
+      const d = u;
+      d.length > 0 && (e.length > 0 ? e[e.length - 1].children : t).push({ kind: "text", text: d });
+      continue;
+    }
+    if (p !== void 0)
+      if (c) {
+        if (e.length > 0) {
+          const d = e.pop();
+          (e.length > 0 ? e[e.length - 1].children : t).push({ kind: "element", el: d });
+        }
+      } else {
+        const d = {
+          tag: p,
+          attrs: j(f),
+          children: [],
+          selfClosing: i
+        };
+        i ? (e.length > 0 ? e[e.length - 1].children : t).push({ kind: "element", el: d }) : e.push(d);
+      }
+  }
+  for (; e.length > 0; ) {
+    const c = e.pop();
+    (e.length > 0 ? e[e.length - 1].children : t).push({ kind: "element", el: c });
+  }
+  return t;
+}
+const $ = /\{\{\s*([\s\S]+?)\s*\}\}/g;
+function z(r) {
+  return $.lastIndex = 0, $.test(r);
+}
+function M(r) {
+  $.lastIndex = 0;
+  const t = [];
+  let e = 0, n;
+  for ($.lastIndex = 0; (n = $.exec(r)) !== null; )
+    n.index > e && t.push({ kind: "text", value: r.slice(e, n.index) }), t.push({ kind: "expr", value: n[1] }), e = n.index + n[0].length;
+  return e < r.length && t.push({ kind: "text", value: r.slice(e) }), t.length === 0 ? JSON.stringify(r) : t.length === 1 && t[0].kind === "expr" ? t[0].value : "`" + t.map((c) => c.kind === "text" ? c.value : `\${${c.value}}`).join("") + "`";
+}
+const D = {
+  enter: "Enter",
+  escape: "Escape",
+  esc: "Escape",
+  tab: "Tab",
+  space: " ",
+  up: "ArrowUp",
+  down: "ArrowDown",
+  left: "ArrowLeft",
+  right: "ArrowRight",
+  delete: "Delete",
+  backspace: "Backspace"
+};
+function J(r, t) {
+  const e = r.slice(1), [n, ...s] = e.split("."), p = `on${n.charAt(0).toUpperCase() + n.slice(1)}`;
+  if (s.length === 0)
+    return `${p}: ${t}`;
+  const o = s[0].toLowerCase(), l = D[o] ?? o.charAt(0).toUpperCase() + o.slice(1);
+  return `${p}: (e) => e.key === '${l}' && ${t}(e)`;
+}
+function P(r) {
+  const { name: t, value: e } = r;
+  return t.startsWith("@") ? J(t, e) : t.startsWith(":") ? `${t.slice(1)}: ${e}` : ["v-if", "v-for", "v-else", "v-else-if"].includes(t) ? null : t === "v-show" ? `style: { display: ${e} ? '' : 'none' }` : e === "" ? `${t}: true` : `${t}: ${JSON.stringify(e)}`;
+}
+function V(r) {
+  const t = r;
+  return z(t) ? `h('span', null, ${M(t)})` : /^\s+$/.test(t) ? "" : JSON.stringify(t);
+}
+function w(r) {
+  const t = r.attrs.find((f) => f.name === "v-for");
+  if (r.tag === "slot")
+    return "(props.__slot_default ? props.__slot_default() : [])";
+  const e = r.attrs.map(P).filter((f) => f !== null && f !== ""), n = e.length === 0 ? "null" : `{ ${e.join(", ")} }`, s = A(r.children);
+  let l = `h(${[/^[A-Z]/.test(r.tag) ? r.tag : JSON.stringify(r.tag), n, ...s].join(", ")})`;
+  return t !== void 0 && (l = G(t.value, l)), l;
+}
+function A(r) {
+  const t = [];
+  let e = 0;
+  for (; e < r.length; ) {
+    const n = r[e];
+    if (n.kind === "text") {
+      const o = V(n.text);
+      o !== "" && t.push(o), e++;
+      continue;
+    }
+    const s = n.el, c = s.attrs.find((o) => o.name === "v-if");
+    if (!c && s.attrs.some((o) => o.name === "v-else" || o.name === "v-else-if")) {
+      e++;
+      continue;
+    }
+    if (c) {
+      let o = `${c.value} ? ${w(s)} : `;
+      for (e++; e < r.length; ) {
+        const l = r[e];
+        if (l.kind === "text" && /^\s+$/.test(l.text)) {
+          e++;
+          continue;
+        }
+        if (l.kind !== "element") break;
+        const f = l.el.attrs.find((u) => u.name === "v-else-if"), i = l.el.attrs.some((u) => u.name === "v-else");
+        if (f)
+          o += `${f.value} ? ${w(l.el)} : `, e++;
+        else if (i) {
+          o += w(l.el), e++;
+          break;
+        } else
+          break;
+      }
+      o.endsWith(" : ") && (o += "null"), t.push(o);
+      continue;
+    }
+    t.push(w(s)), e++;
+  }
+  return t;
+}
+function G(r, t) {
+  const e = /^\s*(?:\(([^)]+)\)|(\w+))\s+in\s+(.+?)\s*$/.exec(r);
+  if (!e)
+    return `(${r}).map((item) => ${t})`;
+  const n = e[1] ?? e[2] ?? "item";
+  return `${e[3].trim()}.map((${n}) => ${t})`;
+}
+function F(r) {
+  const t = W(r.trim()), e = A(t).filter((s) => s !== "");
+  let n;
+  return e.length === 0 ? n = "null" : e.length === 1 ? n = e[0] : n = `[${e.join(", ")}]`, `function h(tag, props, ...children) {
+  return { tag, props: props ?? {}, children: children.flat().filter(c => c != null) }
+}
+
+export default function render(props, state, computed, actions) {
+  return ${n}
+}
+`;
+}
+function U(r) {
+  let t = 5381;
+  for (let n = 0; n < r.length; n++)
+    t = (t << 5) + t ^ r.charCodeAt(n), t = t | 0;
+  return (t >>> 0).toString(36).padStart(6, "0").slice(-6);
+}
+function Z(r) {
+  const t = /export\s+default\s+(defineComponent\s*\([\s\S]*\))\s*;?\s*$/, e = r.trim(), n = t.exec(e);
+  return n ? {
+    preamble: e.slice(0, n.index).trim(),
+    defineComponentExpr: n[1]
+  } : {
+    preamble: e,
+    defineComponentExpr: null
+  };
+}
+function K(r, t, e) {
+  const s = F(t).replace(/export default function render/, "function render").replace(/function h\(tag, props, \.\.\.children\) \{\n  return [^\n]+\n\}\n+/, "").trim(), { preamble: c, defineComponentExpr: p } = Z(r);
+  return p ? [
+    "import { defineComponent, h } from 'arckode-ui'",
+    "",
+    c,
+    "",
+    "// [compiled render function — generated from <template>]",
+    s,
+    "",
+    `// [scope id: ${e}]`,
+    `const __scopeId = ${JSON.stringify(e)}`,
+    "",
+    `const __component = ${p}`,
+    "__component.__scopeId = __scopeId",
+    "__component.__render = render",
+    "",
+    "export default __component"
+  ].filter((o) => o !== void 0).join(`
+`) : [
+    "import { defineComponent } from 'arckode-ui'",
+    "",
+    c,
+    "",
+    "// [compiled render function — generated from <template>]",
+    s,
+    "",
+    `export default { __render: render, __scopeId: ${JSON.stringify(e)} }`
+  ].join(`
+`);
+}
+function H(r = {}) {
+  let t = "development";
+  return {
+    name: "arckode-ui",
+    enforce: "pre",
+    configResolved(e) {
+      t = e.mode;
+    },
+    transform(e, n) {
+      var S, _;
+      if (!n.endsWith(".ark")) return null;
+      let s;
+      try {
+        s = L(e);
+      } catch (a) {
+        if (a instanceof h) {
+          const g = [
+            `[arckode-ui] Parse error in ${n}`,
+            `  ${a.code} (line ${a.line}): ${a.message}`,
+            "",
+            "  Fix the .ark file structure before continuing."
+          ].join(`
+`);
+          throw new Error(g);
+        }
+        throw a;
+      }
+      const c = ((S = r.analyzer) == null ? void 0 : S.ignore) ?? [], p = ((_ = r.analyzer) == null ? void 0 : _.failOnWarnings) ?? !1, l = N(e).filter((a) => !c.includes(a.code)), f = l.filter((a) => a.severity === "error"), i = l.filter((a) => a.severity === "warning"), u = t === "production";
+      for (const a of i)
+        console.warn(v(a, n, e));
+      if (f.length > 0) {
+        const a = f.map((g) => v(g, n, e)).join(`
+
+`);
+        if (u)
+          throw new Error(
+            `[arckode-ui] ${f.length} error(s) in ${n}:
+
+${a}`
+          );
+        console.warn(`[arckode-ui] Analyzer errors in ${n} (not blocking in dev):
+
+${a}`);
+      }
+      if (p && u && i.length > 0) {
+        const a = i.map((g) => v(g, n, e)).join(`
+
+`);
+        throw new Error(
+          `[arckode-ui] ${i.length} warning(s) treated as errors (failOnWarnings=true) in ${n}:
+
+${a}`
+        );
+      }
+      const d = U(n), m = K(s.script.content, s.template.content, d);
+      return b(m, n + ".ts", {
+        loader: "ts",
+        target: "esnext"
+      }).then((a) => ({ code: a.code, map: a.map }));
+    }
+  };
+}
+export {
+  H as arkcodeUi,
+  U as generateScopeId
+};

package/package.json

@@ -0,0 +1,67 @@
+{
+  "name": "arckode-ui",
+  "version": "0.1.0",
+  "type": "module",
+  "description": "Frontend framework con .ark SFCs, signals, file-system router y analyzer estático con sugerencias concretas de fix. Diseñado para máxima predictibilidad de output de IA.",
+  "keywords": [
+    "framework",
+    "frontend",
+    "signals",
+    "reactivity",
+    "sfc",
+    "vite-plugin",
+    "ai-friendly",
+    "typescript",
+    "ark",
+    "arckode"
+  ],
+  "author": "underworf",
+  "license": "MIT",
+  "homepage": "https://gitlab.com/underworf/arckode-ui",
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitlab.com/underworf/arckode-ui.git"
+  },
+  "bugs": {
+    "url": "https://gitlab.com/underworf/arckode-ui/-/issues"
+  },
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./vite": {
+      "import": "./dist/vite.js",
+      "types": "./dist/vite.d.ts"
+    }
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "bin": {
+    "ark": "./dist/cli.js"
+  },
+  "files": [
+    "dist",
+    "skills",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "build": "vite build && chmod +x dist/cli.js",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "type-check": "tsc --noEmit",
+    "prepublishOnly": "bun run build && bun run test && bun run type-check"
+  },
+  "peerDependencies": {
+    "typescript": ">=5.0.0",
+    "vite": ">=5.0.0"
+  },
+  "devDependencies": {
+    "@types/bun": "latest",
+    "happy-dom": "^20.9.0",
+    "typescript": "^5.4.0",
+    "vite": "^5.4.0",
+    "vitest": "^2.0.0"
+  }
+}

package/skills/analyzer/SKILL.md

@@ -0,0 +1,128 @@
+# SKILL: Analyzer — reglas, fix suggestions, agregar nueva
+
+> Cargá este skill cuando trabajés en `src/compiler/analyzer.ts` o cuando necesites agregar una nueva regla de validación estática.
+
+## Interfaz Violation
+
+```typescript
+export interface Violation {
+  code: string                          // ej: 'HANDLER_NOT_IN_ACTIONS'
+  severity: 'error' | 'warning'         // error bloquea build en prod
+  line: number                          // 1-based
+  message: string                       // descripción en español
+  fix?: string                          // sugerencia concreta (sino, undefined)
+}
+```
+
+**Toda violation nueva DEBE incluir `fix` cuando el fix es determinístico.** La IA lee el fix y aplica directo, sin cruzar tablas externas.
+
+## Las 16 reglas implementadas
+
+| Código | Severidad | Detecta |
+|--------|-----------|---------|
+| MISSING_TEMPLATE | error | sin `<template>` |
+| MISSING_SCRIPT | error | sin `<script>` |
+| MISSING_LANG_TS | error | `<script>` sin `lang="ts"` |
+| WRONG_TEMPLATE_ORDER | error | `<script>` antes que `<template>` |
+| MISSING_COMPONENT_NAME | error | `defineComponent()` sin `name` |
+| PROP_MISSING_TYPE | error | prop sin `type` |
+| EMIT_CAMELCASE | error | evento en camelCase |
+| REF_REACTIVE_USAGE | error | uso de `ref()` o `reactive()` |
+| PROVIDE_INJECT_USAGE | error | uso de `provide()` o `inject()` |
+| DIRECT_FETCH_IN_COMPONENT | error | `fetch()` en script de componente |
+| LOGIC_IN_TEMPLATE | error | `++`, `--`, ternario en directiva |
+| HANDLER_NOT_IN_ACTIONS | error | `@event` sin prefijo `actions.` |
+| VFOR_NOT_NAMESPACED | error | colección de `v-for` sin `state.`/`computed.`/`props.` |
+| SETUP_UNKNOWN_RETURN_KEY | error | llave extra en `return` de setup() |
+| ARROW_FUNCTION_ACTION | warning | action como arrow function |
+| VIF_NOT_NAMESPACED | warning | `v-if` con bare identifier (sin `.`) |
+
+## formatViolation — output
+
+```
+[arckode-ui] UserCard.ark:5
+  HANDLER_NOT_IN_ACTIONS: El handler "handleClick" no está namespaced.
+
+  > 5 | <button @click="handleClick">
+  Fix: Reemplazar "handleClick" por "actions.handleClick" y asegurarse...
+```
+
+La línea `Fix: ...` aparece solo si `violation.fix !== undefined`.
+
+## Cómo agregar una regla nueva
+
+### Paso 1: definir el checker
+
+```typescript
+function checkMyRule(source: string): Violation[] {
+  const violations: Violation[] = []
+  // Extraer template/script según corresponda
+  const template = extractTemplateContent(source)
+  if (!template) return violations
+
+  // ... detectar pattern, push violations con fix
+
+  return violations
+}
+```
+
+### Paso 2: registrar en `analyze()`
+
+```typescript
+if (!missing.template) {
+  violations.push(...checkMyRule(source))
+}
+```
+
+### Paso 3: testear
+
+```typescript
+describe('MY_RULE', () => {
+  test('detecta el problema', () => { ... })
+  test('no flaga código válido', () => { ... })
+  test('fix tiene la sugerencia esperada', () => {
+    const v = findViolation(violations, 'MY_RULE')
+    expect(v?.fix).toContain('lo que sugieres')
+  })
+})
+```
+
+### Paso 4: documentar
+
+- Skill principal (`~/.claude/skills/arckode-ui/SKILL.md`) → tabla de violations
+- README del repo → tabla rápida
+- Este skill → sumar a "Las 16 reglas implementadas"
+
+## Helpers disponibles
+
+```typescript
+extractTemplateContent(source)        // { content, lineOffset } | null
+extractBalancedBlock(source, startIdx) // { content, start, end } | null
+getTopLevelObjectKeys(content)        // string[]
+getLineNumber(source, index)          // number (1-based)
+getLines(source)                      // string[]
+```
+
+## Convenciones de mensaje y fix
+
+**Message** — describe QUÉ está mal en lenguaje natural, con el valor problemático entre comillas:
+```
+'El handler "handleClick" no está namespaced.'
+```
+
+**Fix** — describe EXACTAMENTE qué cambiar, idealmente con el código de reemplazo:
+```
+'Reemplazar "handleClick" por "actions.handleClick" y asegurarse de que la función esté declarada en setup() y exportada en el return.actions.'
+```
+
+Para fixes ambiguos (varias opciones válidas), enumerar:
+```
+'v-for="item in state.items.value"  // o computed.items.value / props.items'
+```
+
+## Regla de retrocompatibilidad
+
+- **NUNCA** cambiar el `code` de una regla existente
+- **NUNCA** eliminar una regla (consumidores parsean output del analyzer en CI)
+- **NUNCA** quitar el campo `fix` de una violation que ya lo tenía
+- Solo agregar reglas nuevas; modificar mensaje OK; modificar fix para mejorarlo OK

package/skills/cli/SKILL.md

@@ -0,0 +1,109 @@
+# SKILL: CLI — comandos `ark` y generators
+
+> Cargá este skill cuando trabajés en `src/cli/` o cuando uses `ark new/generate/analyze/routes`.
+
+## Comandos disponibles
+
+```bash
+ark new <nombre>                     # scaffold proyecto nuevo
+ark generate <tipo> <nombre>         # alias: ark g
+ark analyze [--json]                 # analiza .ark files
+ark routes                           # lista rutas detectadas en src/pages/
+ark help | --help | -h               # ayuda
+```
+
+## Tipos del generator
+
+| Tipo | Alias | Naming | Output |
+|------|-------|--------|--------|
+| `component` | `c` | PascalCase | `src/components/features/<Name>.ark` |
+| `page` | `p` | kebab/path | `src/pages/<path>.ark` |
+| `store` | `s` | camelCase | `src/stores/<name>.store.ts` |
+| `service` | `sv` | PascalCase | `src/services/<name>.service.ts` |
+| `layout` | `l` | name | `src/pages/<name>/_layout.ark` |
+
+Errores del generator:
+- `INVALID_COMPONENT_NAME` — component no en PascalCase
+- `INVALID_STORE_NAME` — store no en camelCase
+- `INVALID_SERVICE_NAME` — service no en PascalCase
+- `UNKNOWN_GENERATE_TYPE` — tipo no reconocido
+- `FILE_ALREADY_EXISTS` — el destino ya existe
+
+## Plantillas (`src/cli/templates/index.ts`)
+
+Cada tipo tiene su función pura que retorna el contenido:
+- `componentTemplate(name)` → `.ark` con shape estándar
+- `pageTemplate(name)` → `.ark` para `src/pages/`
+- `layoutTemplate(name)` → `.ark` con slot
+- `storeTemplate(name)` → `.ts` con defineStore
+- `serviceTemplate(name)` → `.ts` con createService
+
+**Garantía**: el output de cada plantilla pasa el analyzer con 0 errors. Hay test que lo valida (`src/cli/__tests__/templates.test.ts`).
+
+## Cómo agregar un tipo nuevo al generator
+
+1. Crear función `xxxTemplate(name)` en `src/cli/templates/index.ts`
+2. Agregar al `TYPE_ALIASES` en `src/cli/commands/generate.ts`
+3. Agregar `buildXxxPath()` función
+4. Agregar `case 'xxx':` al switch
+5. Validación de naming si aplica
+6. Test en `src/cli/__tests__/generate.test.ts` + `templates.test.ts`
+
+## ark new — scaffold de proyecto
+
+Crea estructura completa en `<projectName>/`:
+- `src/pages/index.ark`, `src/pages/_layout.ark`
+- `src/components/{ui,features}/` (con .gitkeep)
+- `src/{stores,services,types,shared/{helpers,constants}}/`
+- `src/styles/global.css` (Tailwind entry)
+- `vite.config.ts` (con `arkcodeUi`)
+- `tsconfig.json`, `tailwind.config.js`, `postcss.config.js`
+- `package.json` con scripts dev/build/preview
+
+**IMPORTANTE**: el `vite.config.ts` generado importa de `'arckode-ui/vite'` con el nombre real `arkcodeUi` (no `arckodePlugin`). Test cubre esto en `src/cli/__tests__/new.test.ts`.
+
+Hay test que verifica que **ninguna** plantilla del scaffold use nombres rotos (`arckodePlugin`, `defineConfig from 'arckode-ui/vite'`).
+
+## Anti-patterns
+
+```typescript
+// ❌ generar templates con imports inexistentes
+const TEMPLATE = `import { arckodePlugin } from 'arckode-ui/vite'`
+// → 'arkcodeUi' (es el nombre real)
+
+// ❌ olvidar el test del template
+// si agregás un tipo nuevo, agregar test que corra analyze() sobre el output
+
+// ❌ shebang en src/cli/index.ts
+// esbuild lo rechaza. El shebang se inyecta vía rollupOptions.output.banner
+```
+
+## Cómo se construye el bin
+
+```typescript
+// vite.config.ts
+build: {
+  lib: {
+    entry: {
+      index: 'src/index.ts',
+      vite:  'src/compiler/vite-plugin.ts',
+      cli:   'src/cli/index.ts',
+    },
+  },
+  rollupOptions: {
+    output: {
+      banner: (chunk) => chunk.name === 'cli' ? '#!/usr/bin/env node' : '',
+    },
+  },
+}
+```
+
+Y en package.json:
+```json
+{
+  "bin": { "ark": "./dist/cli.js" },
+  "scripts": { "build": "vite build && chmod +x dist/cli.js" }
+}
+```
+
+El `chmod +x` es obligatorio porque el shebang solo se respeta si el archivo es ejecutable.