@ecomiq/storefront 2.1.3 → 2.1.4

package/README.md

@@ -72,16 +72,14 @@ Ver el monorepo [ecomiq-storefront](https://github.com/ecomiq/ecomiq-storefront)
 
 ## Storefront declarativo
 
-`StorefrontDefinition v1` permite construir y versionar una tienda sin generar
-código React arbitrario. El contrato valida tema, navegación, footer y ocho
-tipos de sección: `hero`, `product-grid`, `collection-grid`, `promo-banner`,
-`image-text`, `rich-text`, `testimonials` y `newsletter`.
+El contrato y el renderer viven fuera de este package:
+
+- `@ecomiq/storefront-definition` — schema Zod, patches, migraciones
+- `@ecomiq/storefront-definition/react` — `DefinitionRenderer`, loaders y hooks
 
 ```tsx
-import {
-  StorefrontDefinitionRenderer,
-  createDefaultStorefrontDefinition,
-} from '@ecomiq/storefront'
+import { createDefaultStorefrontDefinition } from '@ecomiq/storefront-definition'
+import { DefinitionRenderer } from '@ecomiq/storefront-definition/react'
 
 const definition = createDefaultStorefrontDefinition({
   storeName: 'Casa Lumbre',
@@ -90,7 +88,7 @@ const definition = createDefaultStorefrontDefinition({
 
 export function Home() {
   return (
-    <StorefrontDefinitionRenderer
+    <DefinitionRenderer
       definition={definition}
       locale="es-PE"
       currency="PEN"
@@ -107,27 +105,9 @@ export function Home() {
 }
 ```
 
-Los sistemas que solo necesitan validar o modificar el contrato pueden importar
-el subpath sin cargar el renderer:
-
 ```ts
 import {
   StorefrontDefinitionSchema,
-  StorefrontDefinitionPatchSchema,
   applyStorefrontDefinitionPatch,
-  type StorefrontDefinitionInput,
-  type StorefrontDefinitionPatchInput,
-} from '@ecomiq/storefront/definition'
+} from '@ecomiq/storefront-definition'
 ```
-
-Cada definición lleva `version` y `revision`. Los patches son puros, exigen
-`expectedRevision` y conservan el ID de una sección al reemplazarla. Soportan
-`section.add`, `section.replace`, `section.remove`, `section.reorder`,
-`theme.replace`, `navigation.replace` y `footer.replace`.
-
-El template productivo consulta server-side
-`GET /v1/runtime/storefronts/:storeSlug`, revalida la publicación mediante
-ETag y resuelve los `product-grid.source` y `collection-grid.source` contra el
-API storefront. La publicación declarativa reemplaza solo el contenido de la
-home; el layout comercial y las rutas de catálogo, producto, carrito, checkout
-y cuenta siguen siendo las del framework.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecomiq/storefront",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "Micro framework SSR de Ecomiq para storefronts. Páginas, datos y deploy sin configurar nada.",
   "type": "module",
   "license": "MIT",
@@ -32,14 +32,10 @@
       "default": "./src/config.mjs"
     },
     "./ui": "./src/ui/index.ts",
-    "./definition": "./src/storefront-definition/contract.ts",
-    "./definition/react": "./src/storefront-definition/index.ts",
     "./styles.css": "./src/styles.css",
     "./internal/page": "./src/runtime/page.tsx",
     "./internal/context": "./src/runtime/context.ts",
     "./internal/server-config": "./src/server-config-store.ts",
-    "./internal/runtime": "./src/storefront-runtime.ts",
-    "./internal/definition-data": "./src/storefront-definition/data.ts",
     "./internal/health": "./src/health.ts",
     "./internal/head": "./src/runtime/head.ts",
     "./internal/default-layout": "./src/runtime/default-layout.tsx",
@@ -86,8 +82,7 @@
     "vite": "^8.1.0",
     "wrangler": "^4.100.0",
     "zod": "^3.25.0",
-    "@ecomiq/core": "^0.1.9",
-    "@ecomiq/storefront-definition": "^1.0.0"
+    "@ecomiq/core": "^0.1.9"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/src/codegen.mjs

@@ -198,10 +198,22 @@ export async function generateApp({ cwd, appDir, frameworkRoot, config }) {
 
   // ── 5. styles.css: tokens del framework + fuentes de contenido del usuario ──
   const themeOverrides = buildThemeOverrides(config)
+  const projectPkgPath = resolve(cwd, 'package.json')
+  const projectPkg = existsSync(projectPkgPath)
+    ? JSON.parse(readFileSync(projectPkgPath, 'utf8'))
+    : {}
+  const hasStorefrontDefinition = Boolean(
+    projectPkg.dependencies?.['@ecomiq/storefront-definition'] ||
+      projectPkg.devDependencies?.['@ecomiq/storefront-definition'],
+  )
   writeGeneratedFile(
     join(srcDir, 'styles.css'),
     HEADER.replace('/*', '/*!') +
       `@import '@ecomiq/storefront/styles.css';\n` +
+      (hasStorefrontDefinition
+        ? `@import '@ecomiq/storefront-definition/react/styles.css';\n` +
+          `@source '../../../node_modules/@ecomiq/storefront-definition/src/react';\n`
+        : '') +
       `@source '../../pages';\n` +
       `@source '../../components';\n` +
       `@source '../../lib';\n` +

package/src/index.ts

@@ -246,11 +246,6 @@ export {
   type HeroProps,
   type HeroSlide,
 } from './components/hero'
-export * from './storefront-definition'
-export {
-  definitionForRoute,
-  useDefinition,
-} from './storefront-layout'
 export { z } from 'zod'
 
 /**

package/src/pages/pages.$pageSlug.tsx

@@ -1,12 +1,9 @@
 /**
- * Página de contenido (`/pages/$pageSlug`).
- * La Definition es la dueña de estas rutas; el CMS queda solo como fallback
- * de lectura para tiendas que aún no migraron sus páginas.
+ * Página de contenido CMS (`/pages/$pageSlug`).
+ * Las páginas Definition las sirve el template (`$.tsx`).
  */
 import type { CmsPageDetailsDto } from '@ecomiq/core'
-import type { ActiveStorefrontPage } from '../storefront-runtime'
 import {
-  DefinitionSections,
   definePage,
   sanitizeHtml,
   serverApi,
@@ -24,51 +21,30 @@ const ContentPageSettingsSchema = z.object({
   }).optional(),
 }).passthrough()
 
-type ContentPageData =
-  | Extract<ActiveStorefrontPage, { kind: 'definition' }>
-  | {
-      kind: 'cms'
-      page: CmsPageDetailsDto
-      content: z.infer<typeof ContentPageSettingsSchema>
-    }
+type ContentPageData = {
+  page: CmsPageDetailsDto
+  content: z.infer<typeof ContentPageSettingsSchema>
+}
 
 export default definePage<ContentPageData, { pageSlug: string }>({
   loader: async ({ params }) => {
-    const resolved = await serverApi.getActiveStorefrontPage(
-      `/pages/${params.pageSlug}`,
-    )
-    if (resolved.kind === 'definition') return resolved
-
     const page = await serverApi.getPageBySlug(params.pageSlug)
     if (page.status !== 'published') throw new Error('Página no publicada')
 
     return {
-      kind: 'cms' as const,
       page,
       content: ContentPageSettingsSchema.parse(page.settings ?? {}),
     }
   },
 
-  meta: ({ data, settings }) => {
-    if (data.kind === 'definition') {
-      const { page } = data
-      return {
-        title: page.seo.title ?? page.title ?? settings?.store.name ?? '',
-        ...(page.seo.description === undefined
-          ? {}
-          : { description: page.seo.description }),
-        ...(page.seo.noindex ? { noIndex: true } : {}),
-      }
-    }
-    return {
-      title: data.content.seo?.title ?? data.content.title ?? data.page.name,
-      description: data.content.seo?.description ?? (
-        data.content.html
-          ? stripHtml(data.content.html).slice(0, 155)
-          : undefined
-      ),
-    }
-  },
+  meta: ({ data }) => ({
+    title: data.content.seo?.title ?? data.content.title ?? data.page.name,
+    description: data.content.seo?.description ?? (
+      data.content.html
+        ? stripHtml(data.content.html).slice(0, 155)
+        : undefined
+    ),
+  }),
 
   error: () => (
     <StorefrontError
@@ -77,35 +53,22 @@ export default definePage<ContentPageData, { pageSlug: string }>({
     />
   ),
 
-  component: ({ data, settings }) => {
-    if (data.kind === 'definition') {
-      return (
-        <DefinitionSections
-          definition={data.definition}
-          pageId={data.page.id}
-          data={data.data}
-          locale={settings.store.language}
-          currency={settings.store.currency}
-        />
-      )
-    }
-    return (
-      <article className="mx-auto w-full max-w-4xl px-4 py-10 sm:py-14">
-        <header className="mb-8 border-b pb-8">
-          <h1 className="text-balance text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
-            {data.content.title ?? data.page.name}
-          </h1>
-        </header>
+  component: ({ data }) => (
+    <article className="mx-auto w-full max-w-4xl px-4 py-10 sm:py-14">
+      <header className="mb-8 border-b pb-8">
+        <h1 className="text-balance text-3xl font-semibold tracking-[-0.02em] md:text-4xl">
+          {data.content.title ?? data.page.name}
+        </h1>
+      </header>
 
-        {data.content.html ? (
-          <div
-            className="prose prose-neutral max-w-none text-foreground prose-headings:font-semibold prose-a:text-primary"
-            dangerouslySetInnerHTML={{ __html: sanitizeHtml(data.content.html) }}
-          />
-        ) : (
-          <p className="text-muted-foreground">Contenido no disponible.</p>
-        )}
-      </article>
-    )
-  },
+      {data.content.html ? (
+        <div
+          className="prose prose-neutral max-w-none text-foreground prose-headings:font-semibold prose-a:text-primary"
+          dangerouslySetInnerHTML={{ __html: sanitizeHtml(data.content.html) }}
+        />
+      ) : (
+        <p className="text-muted-foreground">Contenido no disponible.</p>
+      )}
+    </article>
+  ),
 })

package/src/server.ts

@@ -71,23 +71,11 @@ import {
   type AddProductToCartInput,
 } from './cart-session'
 import { submitProductReview } from './review-submission'
-import {
-  loadActiveStorefrontHome,
-  loadActiveStorefrontPage,
-} from './storefront-runtime'
 
 const getSettingsFn = createServerFn({ method: 'GET' }).handler(() =>
   getStorefrontClient().getSettings(),
 )
 
-const getActiveStorefrontHomeFn = createServerFn({ method: 'GET' }).handler(
-  () => loadActiveStorefrontHome(),
-)
-
-const getActiveStorefrontPageFn = createServerFn({ method: 'GET' })
-  .validator(z.object({ pathname: z.string().min(1).max(2_048) }))
-  .handler(({ data }) => loadActiveStorefrontPage(data.pathname))
-
 const getStoreIdFn = createServerFn({ method: 'GET' }).handler(() =>
   getStorefrontClient().getStoreId(),
 )
@@ -234,9 +222,6 @@ const getDistrictsFn = createServerFn({ method: 'GET' })
  */
 export const serverApi = {
   getSettings: () => getSettingsFn(),
-  getActiveStorefrontHome: () => getActiveStorefrontHomeFn(),
-  getActiveStorefrontPage: (pathname: string) =>
-    getActiveStorefrontPageFn({ data: { pathname } }),
   getStoreId: () => getStoreIdFn(),
   getCollections: () => getCollectionsFn(),
   getCollectionBySlug: (slug: string) => getCollectionBySlugFn({ data: { slug } }),

package/src/styles.css

@@ -5,7 +5,6 @@
 /* Escanear los componentes UI del propio framework */
 @source './ui';
 @source './components';
-@source './storefront-definition';
 @source './runtime';
 @source './pages';
 @source '../templates';
@@ -75,23 +74,3 @@
     transition-duration: 0.01ms !important;
   }
 }
-
-.storefront-definition {
-  font-family: var(--storefront-font-body);
-  --storefront-content-width: 72rem;
-}
-
-.storefront-definition :where(h1, h2, h3, h4, h5, h6) {
-  font-family: var(--storefront-font-heading);
-}
-
-.storefront-definition-section {
-  padding-block: var(
-      --storefront-section-padding-top,
-      var(--storefront-section-padding)
-    )
-    var(
-      --storefront-section-padding-bottom,
-      var(--storefront-section-padding)
-    );
-}