@ecomiq/storefront 2.1.4 → 3.0.0

package/bin/ecomiq.mjs

@@ -1,179 +0,0 @@
-#!/usr/bin/env node
-/**
- * CLI de Ecomiq.
- *
- *   ecomiq dev      → servidor de desarrollo con SSR y HMR
- *   ecomiq build    → build de producción (target Cloudflare Workers)
- *   ecomiq deploy   → build + publicación en Cloudflare Workers
- *   ecomiq clean    → elimina la carpeta interna .ecomiq
- *
- * El usuario nunca interactúa con las herramientas internas: la CLI
- * genera una app interna en `.ecomiq/` y delega en ella.
- */
-import { spawn } from 'node:child_process'
-import { rmSync, existsSync, realpathSync } from 'node:fs'
-import { resolve, dirname } from 'node:path'
-import { fileURLToPath, pathToFileURL } from 'node:url'
-import { generateApp, watchPages } from '../src/codegen.mjs'
-import { parseConfig } from '../src/config.mjs'
-import { createViteConfig, resolveDevRuntime } from '../src/vite-inline.mjs'
-
-const __dirname = dirname(fileURLToPath(import.meta.url))
-const cwd = process.cwd()
-
-const c = {
-  dim: (s) => `\x1b[2m${s}\x1b[0m`,
-  bold: (s) => `\x1b[1m${s}\x1b[0m`,
-  green: (s) => `\x1b[32m${s}\x1b[0m`,
-  red: (s) => `\x1b[31m${s}\x1b[0m`,
-}
-
-function banner(msg) {
-  console.log(`\n  ${c.bold('◈ ecomiq')} ${c.dim('·')} ${msg}\n`)
-}
-
-export async function loadUserConfig(projectDirectory = process.cwd()) {
-  const configPath = resolve(projectDirectory, 'ecomiq.config.js')
-  if (!existsSync(configPath)) {
-    throw new Error(
-      `No se encontró ${configPath}. Crea ecomiq.config.js en la raíz del proyecto.`,
-    )
-  }
-  const mod = await import(pathToFileURL(configPath).href)
-  return parseConfig(mod.default, { source: configPath })
-}
-
-function run(bin, args, opts = {}) {
-  return new Promise((resolvePromise, reject) => {
-    const child = spawn(bin, args, {
-      stdio: 'inherit',
-      shell: process.platform === 'win32',
-      ...opts,
-    })
-    child.on('exit', (code) => (code === 0 ? resolvePromise() : reject(new Error(`${bin} salió con código ${code}`))))
-  })
-}
-
-// Los binarios internos viven en las dependencias del framework.
-const frameworkRoot = resolve(__dirname, '..')
-function internalBin(name) {
-  return resolve(frameworkRoot, 'node_modules', '.bin', name)
-}
-function resolveBin(name) {
-  const local = internalBin(name)
-  if (existsSync(local)) return local
-  // fallback: hoisted en el node_modules del proyecto
-  const hoisted = resolve(cwd, 'node_modules', '.bin', name)
-  return existsSync(hoisted) ? hoisted : name
-}
-
-const appDir = resolve(cwd, '.ecomiq')
-
-async function prepare() {
-  const config = await loadUserConfig()
-  await generateApp({ cwd, appDir, frameworkRoot, config })
-  return config
-}
-
-export async function runCli(command = process.argv[2] ?? 'help') {
-  switch (command) {
-    case 'dev': {
-      const config = await prepare()
-      const port = config.dev?.port ?? 3000
-      const runtime = resolveDevRuntime({ config })
-      const httpsEnabled = Boolean(config.dev?.https)
-      const origin = `${httpsEnabled ? 'https' : 'http'}://localhost:${port}`
-      const { createServer } = await import('vite')
-      const viteConfig = createViteConfig({
-        appDir,
-        config,
-        projectRoot: cwd,
-        runtime,
-      })
-      banner(
-        `dev · ${config.domain ?? 'tienda'} ${c.dim(`· runtime ${runtime}`)} ${c.dim(origin)}`,
-      )
-      const server = await createServer({
-        ...viteConfig,
-        server: {
-          ...viteConfig.server,
-          port,
-          fs: {
-            ...viteConfig.server?.fs,
-            allow: [...new Set([...(viteConfig.server?.fs?.allow ?? []), '..', cwd, frameworkRoot])],
-          },
-        },
-      })
-      await server.listen()
-      const pageWatcher = watchPages({
-        cwd,
-        appDir,
-        frameworkRoot,
-        config,
-        onGenerate() {
-          server.config.logger.info(c.dim('  ↻ rutas regeneradas'))
-        },
-        onError(error) {
-          server.config.logger.error(`No se pudieron regenerar las rutas: ${error.message}`)
-        },
-      })
-      server.httpServer?.once('close', () => pageWatcher.close())
-      server.printUrls()
-      break
-    }
-    case 'build': {
-      const config = await prepare()
-      banner(`build · Cloudflare Workers`)
-      const { createBuilder } = await import('vite')
-      const builder = await createBuilder(
-        createViteConfig({ appDir, config, projectRoot: cwd, runtime: 'workerd' }),
-      )
-      await builder.buildApp()
-      console.log(c.green('\n  ✔ Build listo en .ecomiq/dist\n'))
-      break
-    }
-    case 'deploy': {
-      const config = await prepare()
-      banner(`deploy · Cloudflare Workers`)
-      const { createBuilder } = await import('vite')
-      const builder = await createBuilder(
-        createViteConfig({ appDir, config, projectRoot: cwd, runtime: 'workerd' }),
-      )
-      await builder.buildApp()
-      // @cloudflare/vite-plugin emite la config final del Worker junto al build
-      const built = resolve(appDir, 'dist', 'server', 'wrangler.json')
-      const fallback = resolve(appDir, 'wrangler.jsonc')
-      await run(resolveBin('wrangler'), ['deploy', '--config', existsSync(built) ? built : fallback], { cwd: appDir })
-      console.log(c.green('\n  ✔ Publicado en Cloudflare Workers\n'))
-      break
-    }
-    case 'clean': {
-      rmSync(appDir, { recursive: true, force: true })
-      console.log(c.green('  ✔ .ecomiq eliminado'))
-      break
-    }
-    default: {
-      banner('framework de storefronts')
-      console.log(`  ${c.bold('ecomiq dev')}      servidor de desarrollo`)
-      console.log(`  ${c.bold('ecomiq build')}    build de producción`)
-      console.log(`  ${c.bold('ecomiq deploy')}   publicar en Cloudflare Workers`)
-      console.log(`  ${c.bold('ecomiq clean')}    limpiar archivos internos\n`)
-    }
-  }
-}
-
-const invokedPath = process.argv[1]
-let invokedDirectly = false
-if (invokedPath && existsSync(invokedPath)) {
-  invokedDirectly = realpathSync(invokedPath) === fileURLToPath(import.meta.url)
-}
-
-if (invokedDirectly) {
-  try {
-    await runCli()
-  } catch (error) {
-    const message = error instanceof Error ? error.message : 'Error desconocido'
-    console.error(c.red(`\n  ✖ ${message}\n`))
-    process.exitCode = 1
-  }
-}

package/public/design-bridge.js

@@ -1,318 +0,0 @@
-/**
- * Puente de modo design (solo dev). El parent (frontend) envía postMessage;
- * este script pinta hover/select y devuelve metadata del nodo.
- */
-(function () {
-  if (typeof window === 'undefined' || window.parent === window) return;
-
-  var enabled = false;
-  var selectedEl = null;
-  var selectionLocked = false;
-  var previewStyles = {};
-  var hoverBox = null;
-  var hoverLabel = null;
-  var selectBox = null;
-  var selectLabel = null;
-
-  function ensureOverlay() {
-    if (hoverBox) return;
-    var style = document.createElement('style');
-    style.textContent =
-      '#__design_hover__,#__design_select__{pointer-events:none;position:fixed;z-index:2147483646;box-sizing:border-box;transition:top .05s,left .05s,width .05s,height .05s}' +
-      '#__design_hover__{border:2px solid #6366f1;background:rgba(99,102,241,.1)}' +
-      '#__design_select__{border:2px solid #c8a96e;background:rgba(200,169,110,.12)}' +
-      '.__design_lbl{position:fixed;z-index:2147483647;font:11px/1.3 ui-monospace,monospace;padding:2px 6px;border-radius:4px;white-space:nowrap;pointer-events:none}' +
-      '.__design_lbl_hover{background:#6366f1;color:#fff}' +
-      '.__design_lbl_select{background:#c8a96e;color:#1a1714}';
-    document.head.appendChild(style);
-
-    hoverBox = document.createElement('div');
-    hoverBox.id = '__design_hover__';
-    hoverBox.hidden = true;
-    hoverLabel = document.createElement('div');
-    hoverLabel.className = '__design_lbl __design_lbl_hover';
-    hoverLabel.hidden = true;
-
-    selectBox = document.createElement('div');
-    selectBox.id = '__design_select__';
-    selectBox.hidden = true;
-    selectLabel = document.createElement('div');
-    selectLabel.className = '__design_lbl __design_lbl_select';
-    selectLabel.hidden = true;
-
-    document.body.appendChild(hoverBox);
-    document.body.appendChild(hoverLabel);
-    document.body.appendChild(selectBox);
-    document.body.appendChild(selectLabel);
-  }
-
-  function escapeCss(value) {
-    if (typeof CSS !== 'undefined' && CSS.escape) return CSS.escape(value);
-    return value.replace(/[^a-zA-Z0-9_-]/g, '\\$&');
-  }
-
-  function pickElement(raw) {
-    if (!raw || raw === document.body || raw === document.documentElement) return null;
-    if (raw.id === '__design_hover__' || raw.id === '__design_select__') return null;
-    if (raw.classList && raw.classList.contains('__design_lbl')) return null;
-    return raw;
-  }
-
-  function getLabel(el) {
-    var tag = el.tagName.toLowerCase();
-    var classes = Array.from(el.classList || []).filter(function (c) {
-      return !c.startsWith('__design');
-    });
-    if (classes.length) return tag + '.' + classes.slice(0, 2).join('.');
-    return tag;
-  }
-
-  function getSelector(el) {
-    if (el.id) return '#' + escapeCss(el.id);
-    var parts = [];
-    var current = el;
-    while (current && current !== document.body && current !== document.documentElement) {
-      var part = current.tagName.toLowerCase();
-      if (current.id) {
-        parts.unshift('#' + escapeCss(current.id));
-        break;
-      }
-      var parent = current.parentElement;
-      if (parent) {
-        var siblings = Array.from(parent.children).filter(function (c) {
-          return c.tagName === current.tagName;
-        });
-        if (siblings.length > 1) {
-          var idx = siblings.indexOf(current) + 1;
-          part += ':nth-of-type(' + idx + ')';
-        }
-      }
-      var cls = Array.from(current.classList || []).find(function (c) {
-        return !c.startsWith('__design') && !c.startsWith('design-');
-      });
-      if (cls) part += '.' + escapeCss(cls);
-      parts.unshift(part);
-      current = parent;
-    }
-    return parts.join(' > ');
-  }
-
-  function textSnippet(el) {
-    var text = (el.innerText || el.textContent || '').replace(/\s+/g, ' ').trim();
-    if (!text) return undefined;
-    return text.length > 80 ? text.slice(0, 80) + '…' : text;
-  }
-
-  function camelToKebab(key) {
-    return key.replace(/[A-Z]/g, function (m) {
-      return '-' + m.toLowerCase();
-    });
-  }
-
-  function computedSnapshot(el) {
-    var cs = window.getComputedStyle(el);
-    return {
-      display: cs.display,
-      paddingTop: cs.paddingTop,
-      paddingRight: cs.paddingRight,
-      paddingBottom: cs.paddingBottom,
-      paddingLeft: cs.paddingLeft,
-      marginTop: cs.marginTop,
-      marginRight: cs.marginRight,
-      marginBottom: cs.marginBottom,
-      marginLeft: cs.marginLeft,
-      fontSize: cs.fontSize,
-      fontWeight: cs.fontWeight,
-      lineHeight: cs.lineHeight,
-      letterSpacing: cs.letterSpacing,
-      color: cs.color,
-      backgroundColor: cs.backgroundColor,
-      borderWidth: cs.borderWidth,
-      borderStyle: cs.borderStyle,
-      borderColor: cs.borderColor,
-      borderRadius: cs.borderRadius,
-      opacity: cs.opacity,
-      boxShadow: cs.boxShadow,
-      textAlign: cs.textAlign,
-    };
-  }
-
-  function elementRect(el) {
-    var r = el.getBoundingClientRect();
-    return {
-      top: r.top,
-      left: r.left,
-      width: r.width,
-      height: r.height,
-    };
-  }
-
-  function elementPayload(el) {
-    return {
-      selector: getSelector(el),
-      tag: el.tagName.toLowerCase(),
-      label: getLabel(el),
-      classes: Array.from(el.classList || []).filter(function (c) {
-        return !c.startsWith('__design');
-      }),
-      textSnippet: textSnippet(el),
-      computedStyles: computedSnapshot(el),
-      rect: elementRect(el),
-    };
-  }
-
-  var rectRaf = null;
-  function postSelectionRect() {
-    if (!selectionLocked || !selectedEl) return;
-    if (rectRaf) return;
-    rectRaf = requestAnimationFrame(function () {
-      rectRaf = null;
-      post('DESIGN_RECT', { rect: elementRect(selectedEl) });
-    });
-  }
-
-  function clearPreviewStyles() {
-    if (!selectedEl) return;
-    Object.keys(previewStyles).forEach(function (key) {
-      selectedEl.style.removeProperty(camelToKebab(key));
-    });
-    previewStyles = {};
-    updateSelectOverlay();
-  }
-
-  function applyPreviewStyles(styles) {
-    if (!selectedEl || !styles) return;
-    Object.keys(styles).forEach(function (key) {
-      var val = styles[key];
-      if (val === '' || val == null) {
-        selectedEl.style.removeProperty(camelToKebab(key));
-        delete previewStyles[key];
-      } else {
-        selectedEl.style.setProperty(camelToKebab(key), String(val));
-        previewStyles[key] = String(val);
-      }
-    });
-    updateSelectOverlay();
-  }
-
-  function placeBox(box, label, el) {
-    var rect = el.getBoundingClientRect();
-    box.style.top = rect.top + 'px';
-    box.style.left = rect.left + 'px';
-    box.style.width = rect.width + 'px';
-    box.style.height = rect.height + 'px';
-    box.hidden = false;
-
-    label.textContent = getLabel(el);
-    label.style.top = Math.max(4, rect.top - 22) + 'px';
-    label.style.left = rect.left + 'px';
-    label.hidden = false;
-  }
-
-  function hideHover() {
-    if (hoverBox) hoverBox.hidden = true;
-    if (hoverLabel) hoverLabel.hidden = true;
-  }
-
-  function updateSelectOverlay() {
-    if (selectionLocked && selectedEl) {
-      placeBox(selectBox, selectLabel, selectedEl);
-      postSelectionRect();
-    }
-  }
-
-  function post(type, payload) {
-    window.parent.postMessage(
-      { source: 'design-bridge', type: type, payload: payload || {} },
-      '*',
-    );
-  }
-
-  function clearSelection(notifyParent) {
-    clearPreviewStyles();
-    selectedEl = null;
-    selectionLocked = false;
-    if (selectBox) selectBox.hidden = true;
-    if (selectLabel) selectLabel.hidden = true;
-    if (notifyParent) post('DESIGN_DESELECT');
-  }
-
-  function onMouseMove(e) {
-    if (!enabled) return;
-
-    if (selectionLocked && selectedEl) {
-      updateSelectOverlay();
-      hideHover();
-      return;
-    }
-
-    var el = pickElement(document.elementFromPoint(e.clientX, e.clientY));
-    if (!el) {
-      hideHover();
-      return;
-    }
-    placeBox(hoverBox, hoverLabel, el);
-    post('DESIGN_HOVER', elementPayload(el));
-  }
-
-  function onClick(e) {
-    if (!enabled) return;
-    e.preventDefault();
-    e.stopPropagation();
-
-    var el = pickElement(document.elementFromPoint(e.clientX, e.clientY));
-    if (!el) return;
-
-    if (selectionLocked && selectedEl) {
-      if (el === selectedEl) {
-        clearSelection(true);
-        return;
-      }
-      // Click fuera del popover / en otro nodo ya no deselecciona.
-      // clearSelection(true);
-      return;
-    }
-
-    selectedEl = el;
-    selectionLocked = true;
-    placeBox(selectBox, selectLabel, el);
-    hideHover();
-    post('DESIGN_SELECT', elementPayload(el));
-  }
-
-  function enable() {
-    if (enabled) return;
-    enabled = true;
-    ensureOverlay();
-    document.addEventListener('mousemove', onMouseMove, true);
-    document.addEventListener('click', onClick, true);
-    window.addEventListener('scroll', updateSelectOverlay, true);
-    window.addEventListener('resize', updateSelectOverlay);
-    document.body.style.cursor = 'crosshair';
-    post('DESIGN_READY');
-  }
-
-  function disable() {
-    if (!enabled) return;
-    enabled = false;
-    clearSelection(false);
-    document.removeEventListener('mousemove', onMouseMove, true);
-    document.removeEventListener('click', onClick, true);
-    window.removeEventListener('scroll', updateSelectOverlay, true);
-    window.removeEventListener('resize', updateSelectOverlay);
-    document.body.style.cursor = '';
-    hideHover();
-  }
-
-  window.addEventListener('message', function (event) {
-    var data = event.data;
-    if (!data || data.target !== 'design-bridge') return;
-    if (data.type === 'DESIGN_ENABLE') enable();
-    if (data.type === 'DESIGN_DISABLE') disable();
-    if (data.type === 'DESIGN_CLEAR_SELECTION') clearSelection(false);
-    if (data.type === 'DESIGN_APPLY_STYLES') applyPreviewStyles(data.payload && data.payload.styles);
-    if (data.type === 'DESIGN_CLEAR_PREVIEW') clearPreviewStyles();
-  });
-
-  post('DESIGN_READY');
-})();

package/src/api-proxy.ts

@@ -1,194 +0,0 @@
-/**
- * Proxy HTTP hacia la API storefront de Ecomiq.
- * /api/settings → {baseUrl}/v1/settings (con x-Store-Domain / x-Store-Id).
- */
-import { resolveApiBaseUrl } from '@ecomiq/core'
-import { STOREFRONT_ECOMIQ_OAUTH_COOKIE_NAME } from './auth/ecomiq-oauth-password-constants'
-import { getStorefrontClient } from './client'
-import { getServerConfig } from './server-config-store'
-const ALLOWED_METHODS = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE']
-
-const INCOMING_HEADER_ALLOWLIST = new Set([
-  'accept',
-  'accept-language',
-  'content-type',
-])
-
-const RESPONSE_HEADER_ALLOWLIST = new Set([
-  'cache-control',
-  'content-type',
-  'etag',
-  'last-modified',
-  'retry-after',
-  'vary',
-])
-
-const FORBIDDEN_SERVER_HEADERS = new Set([
-  'connection',
-  'keep-alive',
-  'proxy-authenticate',
-  'proxy-authorization',
-  'te',
-  'trailers',
-  'transfer-encoding',
-  'upgrade',
-  'host',
-  'content-length',
-  'cookie',
-  'cookie2',
-  'set-cookie',
-  'forwarded',
-  'x-forwarded-for',
-  'x-forwarded-host',
-  'x-forwarded-proto',
-  'x-real-ip',
-])
-
-/**
- * Reenvía un Request del store (`/api/...`) al storefront (`/v1/...`).
- * Settings usa `x-Store-Domain`; el resto usa `x-Store-Id` (vía cache de settings).
- */
-export async function proxyStorefrontRequest(
-  request: Request,
-  splat: string | undefined,
-): Promise<Response> {
-  const method = request.method.toUpperCase()
-  if (!ALLOWED_METHODS.includes(method)) {
-    return Response.json(
-      { error: 'Method not allowed', status: 405 },
-      {
-        status: 405,
-        headers: { allow: ALLOWED_METHODS.join(', ') },
-      },
-    )
-  }
-
-  const config = getServerConfig()
-  const base = new URL(resolveApiBaseUrl(config.api?.baseUrl, config.api?.version))
-  const rawPath = splat ?? ''
-  let path = rawPath
-  let invalidPath =
-    /^[a-z][a-z\d+.-]*:/i.test(rawPath) ||
-    rawPath.startsWith('//') ||
-    rawPath.includes('\\') ||
-    rawPath.includes('?') ||
-    rawPath.includes('#') ||
-    /%(?:2f|5c)/i.test(rawPath)
-
-  if (path.startsWith('/')) path = path.slice(1)
-  for (const rawSegment of path.split('/')) {
-    let decoded = rawSegment
-    try {
-      for (let pass = 0; pass < 3; pass += 1) {
-        const next = decodeURIComponent(decoded)
-        if (next === decoded) break
-        decoded = next
-      }
-    } catch {
-      invalidPath = true
-    }
-    if (
-      decoded === '.' ||
-      decoded === '..' ||
-      decoded.includes('/') ||
-      decoded.includes('\\') ||
-      /[\u0000-\u001f\u007f]/.test(decoded)
-    ) {
-      invalidPath = true
-    }
-  }
-
-  if (invalidPath) {
-    return Response.json(
-      { error: 'Invalid proxy path', status: 400 },
-      { status: 400 },
-    )
-  }
-
-  const apiPrefix = base.pathname.endsWith('/') ? base.pathname : `${base.pathname}/`
-  const target = new URL(base)
-  target.pathname = `${apiPrefix}${path}`
-  const incoming = new URL(request.url)
-  target.search = incoming.search
-
-  if (target.origin !== base.origin || !target.pathname.startsWith(apiPrefix)) {
-    return Response.json(
-      { error: 'Invalid proxy path', status: 400 },
-      { status: 400 },
-    )
-  }
-
-  const headers = new Headers()
-  for (const [key, value] of request.headers) {
-    if (INCOMING_HEADER_ALLOWLIST.has(key.toLowerCase())) headers.set(key, value)
-  }
-  for (const [key, value] of Object.entries(config.api?.headers ?? {})) {
-    const lower = key.toLowerCase()
-    if (FORBIDDEN_SERVER_HEADERS.has(lower) || lower.startsWith('cf-')) continue
-    headers.set(key, value as string)
-  }
-  headers.set('accept', headers.get('accept') ?? 'application/json')
-
-  const cookieHeader = request.headers.get('cookie')
-  if (cookieHeader) {
-    for (const part of cookieHeader.split(';')) {
-      const [rawName, ...rawValue] = part.trim().split('=')
-      if (rawName !== STOREFRONT_ECOMIQ_OAUTH_COOKIE_NAME) continue
-      try {
-        const accessToken = decodeURIComponent(rawValue.join('=')).trim()
-        if (accessToken) headers.set('authorization', `Bearer ${accessToken}`)
-      } catch {}
-      break
-    }
-  }
-
-  const isSettings = path === 'settings' || path.startsWith('settings/')
-  if (isSettings) {
-    headers.delete('x-Store-Id')
-    headers.set('x-Store-Domain', config.domain)
-  } else {
-    try {
-      const storeId = await getStorefrontClient().getStoreId()
-      headers.set('x-Store-Id', storeId)
-    } catch {
-      return Response.json(
-        { error: 'Bad gateway', status: 502 },
-        { status: 502 },
-      )
-    }
-  }
-
-  const body =
-    method === 'GET' || method === 'HEAD' ? undefined : await request.arrayBuffer()
-
-  let upstream: Response
-  try {
-    upstream = await fetch(target.toString(), { method, headers, body })
-  } catch {
-    return Response.json(
-      { error: 'Bad gateway', status: 502 },
-      { status: 502 },
-    )
-  }
-
-  const responseHeaders = new Headers()
-  for (const header of RESPONSE_HEADER_ALLOWLIST) {
-    const value = upstream.headers.get(header)
-    if (value) responseHeaders.set(header, value)
-  }
-
-  if (upstream.status === 204 || upstream.status === 205 || upstream.status === 304) {
-    responseHeaders.delete('content-type')
-    return new Response(null, {
-      status: upstream.status,
-      statusText: upstream.statusText,
-      headers: responseHeaders,
-    })
-  }
-
-  return new Response(upstream.body, {
-    status: upstream.status,
-    statusText: upstream.statusText,
-    headers: responseHeaders,
-  })
-}