@mimi-ng/cli 0.3.0 → 0.5.0

package/dist/templates/theme/provider.ts

@@ -101,6 +101,10 @@ const COMPONENT_PREFIX: Record<keyof MimiComponentTokens, string> = {
   date: 'date',
   fileUpload: 'upload',
   colorPicker: 'color-picker',
+  tree: 'tree',
+  sortable: 'sortable',
+  command: 'command',
+  dataTable: 'table',
 };
 
 /** Nombres de la 0.1.0 que siguen funcionando hasta la 1.0 (spec 12): ruta → qué usar. */

package/dist/templates/theme/types.ts

@@ -555,6 +555,86 @@ export interface MimiColorPickerTokens {
   swatchGap?: string;
 }
 
+/**
+ * Tree. Fondo, hover y el nodo elegido van en el CSS (`--mimi-tree-bg`, `-hover`, `-selected`,
+ * `-selected-fg`).
+ */
+export interface MimiTreeTokens {
+  /** Relleno del contenedor (6px). */
+  padding?: string;
+  /** Alto de cada nodo (32px). */
+  rowHeight?: string;
+  /** Radio del nodo (el global `radius-sm`). */
+  rowRadius?: string;
+  /** Sangría por nivel (18px). */
+  indent?: string;
+  /** Tamaño de texto (13.5px). */
+  fontSize?: string;
+}
+
+/**
+ * Sortable List. Fondo, el hover del asa y los colores del hueco van en el CSS
+ * (`--mimi-sortable-bg`, `-handle-hover`, `-drop`, `-drop-bg`).
+ */
+export interface MimiSortableTokens {
+  /** Alto mínimo de cada elemento (56px). */
+  itemHeight?: string;
+  /** Separación entre elementos (8px). */
+  gap?: string;
+  /** Radio del elemento y del hueco (el global `radius`). */
+  radius?: string;
+  /** Giro y escala del elemento levantado (`rotate(-1.5deg) scale(1.03)`). */
+  lift?: string;
+  /** Curva del reacomodo (`cubic-bezier(.2, .8, .2, 1)`). */
+  easing?: string;
+}
+
+/**
+ * Command. El fondo del comando activo va en el CSS (`--mimi-command-active`).
+ */
+export interface MimiCommandTokens {
+  /** Ancho del panel en el diálogo (560px). */
+  width?: string;
+  /** Distancia del panel al borde superior en el diálogo (36px). */
+  top?: string;
+  /** Alto de la fila del buscador (52px). */
+  inputHeight?: string;
+  /** Tamaño del texto del buscador (15px). */
+  inputFontSize?: string;
+  /** Alto máximo de la lista (332px). */
+  listHeight?: string;
+  /** Alto de cada comando (40px). */
+  itemHeight?: string;
+  /** Radio del comando (el global `radius-sm`). */
+  itemRadius?: string;
+  /** Caja del ícono del comando (26px). */
+  iconSize?: string;
+}
+
+/**
+ * Data Table. Los fondos (tabla, encabezado, hover, elegida, detalle) y la sombra de la columna
+ * fija van en el CSS (`--mimi-table-bg`, `-head-bg`, `-row-hover`, `-row-selected`,
+ * `-expanded-bg`, `-sticky-shadow`).
+ */
+export interface MimiTableTokens {
+  /** Alto de fila en la densidad compacta (42px). */
+  rowHeight?: string;
+  /** Alto de fila en la densidad cómoda (60px). */
+  rowHeightComfortable?: string;
+  /** Alto del encabezado, compacta (38px). */
+  headHeight?: string;
+  /** Alto del encabezado, cómoda (44px). */
+  headHeightComfortable?: string;
+  /** Texto de las celdas, compacta (13px). */
+  fontSize?: string;
+  /** Texto de las celdas, cómoda (14px). */
+  fontSizeComfortable?: string;
+  /** Relleno horizontal de la celda (10px). */
+  cellPx?: string;
+  /** Alto mínimo de la barra (56px). */
+  toolbarHeight?: string;
+}
+
 /**
  * Tokens por componente (spec 13). Solo los que no dependen del modo: los colores de los
  * componentes (`--mimi-<prefijo>-bg`, `-fg`, `-border`…) se cambian en el CSS (spec 6.2).
@@ -594,6 +674,10 @@ export interface MimiComponentTokens {
   date?: MimiDateTokens;
   fileUpload?: MimiFileUploadTokens;
   colorPicker?: MimiColorPickerTokens;
+  tree?: MimiTreeTokens;
+  sortable?: MimiSortableTokens;
+  command?: MimiCommandTokens;
+  dataTable?: MimiTableTokens;
 }
 
 export interface MimiThemePreset {

package/dist/ui/index.js

@@ -8,13 +8,19 @@ const css_1 = require("../init/css");
 const items_1 = require("../init/items");
 const paths_1 = require("../init/paths");
 const registry_1 = require("../registry");
+const pages_1 = require("../utils/pages");
 const project_1 = require("../utils/project");
+const tailwind_1 = require("../utils/tailwind");
 const write_files_1 = require("../utils/write-files");
-/** Componentes que se pueden agregar: los ítems `component` del registro. */
-exports.AVAILABLE = Object.entries(registry_1.registry.items)
-    .filter(([, item]) => item.type === 'component')
+const namesOf = (type) => Object.entries(registry_1.registry.items)
+    .filter(([, item]) => item.type === type)
     .map(([name]) => name)
     .sort();
+/**
+ * Lo que se puede agregar: los ítems `component` del registro y, después, los `block` (B.1-c;
+ * el mismo orden que el x-prompt).
+ */
+exports.AVAILABLE = [...namesOf('component'), ...namesOf('block')];
 /**
  * `ng g mimi button input form-field`: copia los componentes y sus dependencias del registro a la
  * carpeta de mimi.json. Sin nombres, pregunta (x-prompt de selección múltiple).
@@ -34,12 +40,15 @@ function ui(options) {
                 items: [...plan.items, ...plan.implicit],
                 implicit: plan.implicit,
                 componentsDir: plan.componentsDir,
+                blocksDir: plan.blocksDir,
+                pages: plan.pages,
                 overwrite: options.overwrite ?? false,
                 version: registry_1.registry.version,
                 report,
             }),
             updateMimiConfig(plan, report),
             updateGlobalCss(plan),
+            addFolderSources(plan),
             ...Object.entries(plan.newPackages).map(([name, version]) => (0, utility_1.addDependency)(name, version, {
                 type: utility_1.DependencyType.Default,
                 existing: utility_1.ExistingBehavior.Skip,
@@ -56,6 +65,7 @@ function inspect(tree, options) {
         throw new schematics_1.SchematicsException('Mimi no está configurado en este proyecto (falta mimi.json). Ejecuta primero:\n' +
             '  ng add @mimi-ng/cli');
     }
+    (0, project_1.assertAliases)(config);
     const requested = [...new Set((options.components ?? []).map((name) => name.trim()))].filter(Boolean);
     if (requested.length === 0) {
         throw new schematics_1.SchematicsException(`Indica qué componentes agregar, por ejemplo: ng g mimi button\nDisponibles: ${exports.AVAILABLE.join(', ')}.`);
@@ -64,7 +74,7 @@ function inspect(tree, options) {
     if (unknown.length > 0) {
         const lines = unknown.map((name) => {
             const suggestion = closest(name);
-            return `"${name}" no es un componente de Mimi.${suggestion ? ` ¿Quisiste decir ${suggestion}?` : ''}`;
+            return `"${name}" no es un componente ni un Block de Mimi.${suggestion ? ` ¿Quisiste decir ${suggestion}?` : ''}`;
         });
         throw new schematics_1.SchematicsException(`${lines.join('\n')}\nDisponibles: ${exports.AVAILABLE.join(', ')}.`);
     }
@@ -103,9 +113,170 @@ function inspect(tree, options) {
     }
     const implicit = [...new Set(items_1.INIT_ITEMS.flatMap((item) => (0, registry_1.resolveItems)(item)))].filter((item) => !items.includes(item));
     const componentsDir = (0, paths_1.normalizePath)(config.aliases?.components ?? 'src/app/components/ui');
+    const blocksDir = (0, paths_1.normalizePath)(config.aliases?.blocks ?? (0, project_1.defaultBlocksDir)(componentsDir));
+    const pagesDir = (0, paths_1.normalizePath)(config.aliases?.pages ?? (0, project_1.defaultPagesDir)(componentsDir));
+    const { pages, legacyPages } = planPages(tree, config, items, options.name, blocksDir, pagesDir);
     const outdated = outdatedPeers(tree, items, installed, newPackages);
     const updatable = PEERS_WITH_MINIMUM.filter((name) => installed[name] || newPackages[name]);
-    return { componentsDir, config, items, implicit, newPackages, outdated, updatable };
+    const missingExclusion = mimiExclusion(tree, config, installed);
+    return {
+        componentsDir,
+        blocksDir,
+        pagesDir,
+        pages,
+        legacyPages,
+        config,
+        items,
+        implicit,
+        newPackages,
+        outdated,
+        updatable,
+        missingExclusion,
+    };
+}
+// ── Páginas (B.11) ────────────────────────────────────────────────────────────────────
+/**
+ * Dónde va cada Block de tipo `page` de esta ejecución. Todo se comprueba antes de escribir: si
+ * algo no cuadra (un `--name` inválido, una carpeta que ya existe y no es esa página, dos páginas
+ * en la misma carpeta), falla sin cambiar nada.
+ *
+ * - Ya generada (`mimi.json → blocks.<ítem>.path`): se actualiza ahí, con su nombre (B.11-f).
+ * - Instalada con la 0.4.0 (`<aliases.blocks>/<ítem>/<ítem>.ts`, sin `path`): se queda donde está
+ *   y se actualiza como antes (B.11-g).
+ * - Nueva: `<aliases.pages>/<nombre>/`, con `--name` o el nombre por defecto (B.11-c).
+ */
+function planPages(tree, config, items, name, blocksDir, pagesDir) {
+    const pageItems = items.filter((item) => (0, registry_1.isPageBlock)(item));
+    if (name !== undefined) {
+        if (!pages_1.PAGE_NAME.test(name)) {
+            throw new schematics_1.SchematicsException(`--name ${JSON.stringify(name)} no sirve como nombre de página: usa minúsculas, números y ` +
+                'guiones, empezando con una letra (por ejemplo, --name admin-login). No se cambió nada.');
+        }
+        if (pageItems.length !== 1) {
+            const pageNames = exports.AVAILABLE.filter((item) => (0, registry_1.isPageBlock)(item)).join(', ');
+            throw new schematics_1.SchematicsException((pageItems.length === 0
+                ? '--name es el nombre de la página que se genera, y no pediste ningún Block de tipo página'
+                : `--name sirve para una sola página, y pediste ${pageItems.join(', ')}: agrégalas por separado`) +
+                ` (son páginas: ${pageNames}). No se cambió nada.`);
+        }
+        if ((0, pages_1.isBlockLikeName)(pageItems[0], name)) {
+            throw new schematics_1.SchematicsException(`--name ${name} lleva el nombre del Block (${pageItems[0]}): elige el de tu página, por ` +
+                `ejemplo --name ${(0, pages_1.defaultPageName)(pageItems[0])} o --name admin-` +
+                `${(0, pages_1.defaultPageName)(pageItems[0])}. No se cambió nada.`);
+        }
+    }
+    const prefix = projectPrefix(tree, pagesDir);
+    const pages = {};
+    const legacyPages = [];
+    const taken = new Map();
+    for (const item of pageItems) {
+        const entry = config.blocks?.[item];
+        let target;
+        if (entry?.path) {
+            const dir = (0, paths_1.normalizePath)(entry.path);
+            const trackedName = entry.name && pages_1.PAGE_NAME.test(entry.name) ? entry.name : basename(dir);
+            if (name !== undefined && name !== trackedName) {
+                throw new schematics_1.SchematicsException(`${item} ya es tu página ${trackedName} (${dir}/): Mimi la sigue por su nombre del ` +
+                    `registro, así que está en un solo sitio. Para actualizarla, ejecuta ng g mimi ${item} ` +
+                    'sin --name. Si quieres otra copia con otro nombre, renombra o mueve la tuya y cambia ' +
+                    `"path" y "name" de blocks.${item} en mimi.json. No se cambió nada.`);
+            }
+            target = { item, dir, name: trackedName, prefix };
+        }
+        else if (tree.exists(`${blocksDir}/${item}/${item}.ts`)) {
+            if (name !== undefined) {
+                throw new schematics_1.SchematicsException(`${item} está instalado como en la 0.4.0, en ${blocksDir}/${item}/, y se sigue ` +
+                    'actualizando ahí. Para generarlo como página, guarda tus cambios (por ejemplo, en git), ' +
+                    `borra esa carpeta y vuelve a ejecutar el comando. No se cambió nada.`);
+            }
+            legacyPages.push(item);
+            continue;
+        }
+        else {
+            const pageName = name ?? (0, pages_1.defaultPageName)(item);
+            const dir = `${pagesDir}/${pageName}`;
+            if (hasContent(tree, dir)) {
+                const owner = Object.entries(config.blocks ?? {}).find(([, other]) => other?.path && (0, paths_1.normalizePath)(other.path) === dir)?.[0];
+                throw new schematics_1.SchematicsException(`La carpeta ${dir}/ ya existe${owner ? ` (es tu página de ${owner})` : ''}, así que ` +
+                    `${item} no se generó ahí: Mimi no sobrescribe tus archivos. Elige otro nombre con ` +
+                    `--name, por ejemplo: ng g mimi ${item} --name ${pageName}-2. No se cambió nada.`);
+            }
+            target = { item, dir, name: pageName, prefix };
+        }
+        const other = taken.get(target.dir);
+        if (other) {
+            throw new schematics_1.SchematicsException(`${other} y ${item} irían a la misma carpeta (${target.dir}/). Agrégalos por separado, ` +
+                `uno de ellos con --name (por ejemplo: ng g mimi ${item} --name ${target.name}-2). ` +
+                'No se cambió nada.');
+        }
+        taken.set(target.dir, item);
+        pages[item] = target;
+    }
+    return { pages, legacyPages };
+}
+const basename = (path) => path.slice(path.lastIndexOf('/') + 1);
+/** ¿La carpeta existe y tiene algo dentro? (Un árbol de schematics no tiene carpetas vacías.) */
+function hasContent(tree, dir) {
+    const entry = tree.getDir(dir);
+    return entry.subfiles.length + entry.subdirs.length > 0;
+}
+/**
+ * Prefijo de los selectores (`app`, de angular.json → projects → prefix): el del proyecto que
+ * contiene la carpeta de páginas o, si no, el de la única aplicación. Si no se sabe, `app`.
+ */
+function projectPrefix(tree, dir) {
+    let workspace = null;
+    try {
+        workspace = (0, project_1.readJson)(tree, 'angular.json');
+    }
+    catch {
+        return 'app';
+    }
+    const projects = Object.values(workspace?.projects ?? {});
+    const sourceOf = (project) => (0, paths_1.normalizePath)(project.sourceRoot ?? `${project.root ?? ''}/src`);
+    const inside = projects
+        .filter((project) => `${dir}/`.startsWith(`${sourceOf(project)}/`))
+        .sort((a, b) => sourceOf(b).length - sourceOf(a).length);
+    const apps = projects.filter((project) => project.projectType === 'application');
+    const project = inside[0] ?? (apps.length === 1 ? apps[0] : undefined);
+    return typeof project?.prefix === 'string' && /^[a-z][a-z0-9-]*$|^$/.test(project.prefix)
+        ? project.prefix
+        : 'app';
+}
+/**
+ * Cómo importa `app.routes.ts` el archivo de rutas de una página: relativo a la carpeta del
+ * `app.routes.ts` que está por encima de la página (`src/app/pages/login` →
+ * `./pages/login/login.routes`). Se busca subiendo desde la carpeta de arriba de la página (nunca
+ * la suya: una página `app` tiene su propio `app.routes.ts`); si no hay ninguno, la carpeta `app/`
+ * más cercana por encima. Si tampoco, la ruta del workspace (y `appDir` null: hay que ajustarla).
+ */
+function routesImportOf(tree, page) {
+    const routes = `${page.dir}/${page.name}.routes`;
+    const ancestors = [];
+    const parts = page.dir.split('/');
+    for (let length = parts.length - 1; length > 0; length--) {
+        ancestors.push(parts.slice(0, length).join('/'));
+    }
+    const appDir = ancestors.find((dir) => tree.exists(`${dir}/app.routes.ts`)) ??
+        ancestors.find((dir) => basename(dir) === 'app') ??
+        null;
+    return appDir ? { path: (0, paths_1.relativePath)(appDir, routes), appDir } : { path: routes, appDir: null };
+}
+/**
+ * Sin `@source not` hacia `.mimi/`, Tailwind escanea las copias originales (van en git) y genera
+ * sus clases aunque el usuario ya las haya cambiado en sus componentes. Proyectos de la 0.3.0 o
+ * anteriores no la tienen: se avisa para que no tengan que volver a ejecutar ng add. Con
+ * Tailwind 4.0 no se avisa aquí (no la entiende; init ya lo explicó).
+ */
+function mimiExclusion(tree, config, installed) {
+    const cssPath = config.tailwind?.css;
+    if (!cssPath || !tree.exists(cssPath))
+        return null;
+    if (!(0, tailwind_1.tailwindSupportsSourceNot)(tree, installed['tailwindcss']))
+        return null;
+    if (!(0, tailwind_1.missingMimiExclusion)(tree.readText(cssPath), cssPath))
+        return null;
+    return { cssPath, line: (0, tailwind_1.mimiSourceNotLine)(cssPath) };
 }
 // ── Versiones mínimas de cdk y aria (M.4) ─────────────────────────────────────────────
 /**
@@ -252,16 +423,40 @@ function updateMimiConfig(plan, report) {
         const skipped = new Set(report.skipped);
         const blocked = new Set(report.blocked.map((b) => b.item));
         const components = { ...plan.config.components };
+        const blocks = { ...plan.config.blocks };
         for (const item of plan.items) {
-            if (registry_1.registry.items[item].type !== 'component')
+            const { type } = registry_1.registry.items[item];
+            if (type !== 'component' && type !== 'block')
                 continue;
             if (blocked.has(item))
                 continue;
-            if (registry_1.registry.items[item].files.some((file) => skipped.has(file)))
+            if ((0, write_files_1.itemFiles)(item, plan.pages).some((file) => skipped.has(file)))
                 continue;
-            components[item] = { version: registry_1.registry.version };
+            if (type === 'component') {
+                components[item] = { version: registry_1.registry.version };
+                continue;
+            }
+            // Una página guarda dónde está y con qué nombre se generó (B.11-f).
+            const page = plan.pages[item];
+            blocks[item] = page
+                ? { version: registry_1.registry.version, path: page.dir, name: page.name }
+                : { version: registry_1.registry.version };
         }
         const next = { ...plan.config, components };
+        if (Object.keys(blocks).length > 0) {
+            next.blocks = blocks;
+            // Proyectos anteriores: la carpeta queda escrita la primera vez que se copia un Block
+            // (B.1-a) o se genera una página (B.11-b).
+            const entries = Object.values(blocks);
+            const aliases = { ...plan.config.aliases };
+            if (!aliases.blocks && entries.some((entry) => !entry.path))
+                aliases.blocks = plan.blocksDir;
+            if (!aliases.pages && entries.some((entry) => entry.path))
+                aliases.pages = plan.pagesDir;
+            if (JSON.stringify(aliases) !== JSON.stringify(plan.config.aliases ?? {})) {
+                next.aliases = aliases;
+            }
+        }
         const text = `${JSON.stringify(next, null, 2)}\n`;
         if (tree.readText('mimi.json') !== text)
             tree.overwrite('mimi.json', text);
@@ -299,11 +494,70 @@ function updateGlobalCss(plan) {
             context.logger.info(`  ${line}`);
     };
 }
+/**
+ * G1: con `@import "tailwindcss" source(none)`, Tailwind no escanea la carpeta de los Blocks ni
+ * la de las páginas (B.11-i), y la pantalla queda sin sus estilos. Si se copia un Block o se
+ * genera una página, se agrega el `@source` de su carpeta (una vez).
+ */
+function addFolderSources(plan) {
+    return (tree, context) => {
+        const dirs = [];
+        if (plan.items.some((item) => registry_1.registry.items[item].type === 'block' && !plan.pages[item])) {
+            dirs.push(plan.blocksDir);
+        }
+        for (const page of Object.values(plan.pages)) {
+            const dir = `${page.dir}/`.startsWith(`${plan.pagesDir}/`) ? plan.pagesDir : page.dir;
+            if (!dirs.includes(dir))
+                dirs.push(dir);
+        }
+        if (dirs.length === 0)
+            return;
+        const cssPath = plan.config.tailwind?.css;
+        if (!cssPath || !tree.exists(cssPath))
+            return;
+        let css = tree.readText(cssPath);
+        const lines = [];
+        for (const dir of dirs) {
+            const result = (0, tailwind_1.withFolderSource)(css, cssPath, [plan.componentsDir, plan.blocksDir, plan.pagesDir], dir);
+            if (!result)
+                continue;
+            css = result.css;
+            lines.push(result.line);
+        }
+        if (lines.length === 0)
+            return;
+        tree.overwrite(cssPath, css);
+        context.logger.info(`Agregado a ${cssPath} (tu @import de Tailwind usa source(none), así que Tailwind solo ` +
+            `escanea las carpetas que indicas):\n${lines.map((line) => `  ${line}`).join('\n')}`);
+    };
+}
 // ── Mensaje final ─────────────────────────────────────────────────────────────────────
+/**
+ * M1: un componente que se actualizó y que usa un Block instalado (en `mimi.json → blocks`) que
+ * no se actualizó en esta ejecución (porque el usuario lo modificó, o porque no se pidió). Solo
+ * avisa: la pantalla es del usuario y puede necesitar cambios con la API nueva.
+ */
+function blocksUsingUpdated(plan, report, itemOf) {
+    const updated = new Set(report.updated.map(({ file }) => itemOf(file)));
+    const messages = [];
+    for (const block of Object.keys(plan.config.blocks ?? {}).sort()) {
+        if (updated.has(block) || registry_1.registry.items[block]?.type !== 'block')
+            continue;
+        const used = (0, registry_1.resolveItems)(block).filter((item) => updated.has(item) && registry_1.registry.items[item].type === 'component');
+        if (used.length === 0)
+            continue;
+        const list = used.join(', ');
+        messages.push(`Tu Block ${block} usa ${list}, que se actualizó a ${registry_1.registry.version}; revisa el ` +
+            'CHANGELOG por si tu pantalla necesita algún cambio.');
+    }
+    return messages;
+}
+/** `pricing-01` → `Pricing01`: la clase de un Block copiado tal cual. */
+const blockClassName = (item) => item.replace(/(^|-)([a-z0-9])/g, (_, _dash, c) => c.toUpperCase());
 function summary(plan, report) {
-    return (_tree, context) => {
+    return (tree, context) => {
         const log = context.logger;
-        const path = (file) => `${plan.componentsDir}/${(0, write_files_1.projectPathOf)(file)}`;
+        const path = (file) => (0, write_files_1.targetPathOf)(file, plan.componentsDir, plan.blocksDir, plan.pages);
         if (report.created.length > 0) {
             log.info('Agregado:');
             for (const file of report.created)
@@ -313,17 +567,68 @@ function summary(plan, report) {
             log.info('Reemplazado (--overwrite):');
             for (const file of report.overwritten)
                 log.info(`  ~ ${path(file)}`);
+            // Un Block es una pantalla del usuario: --overwrite la reemplaza entera (B.1, trampas).
+            const screens = new Map();
+            for (const file of report.overwritten) {
+                if ((0, pages_1.isPageFile)(file)) {
+                    const item = (0, pages_1.pageItemOf)(file);
+                    screens.set(item, `${plan.pages[item].dir}/`);
+                }
+                else if ((0, write_files_1.isBlockFile)(file)) {
+                    const item = file.split('/')[1];
+                    screens.set(item, `${plan.blocksDir}/${item}/`);
+                }
+            }
+            for (const [block, dir] of screens) {
+                log.warn(`--overwrite reemplazó tu pantalla ${block} (${dir}) por la de ` +
+                    `Mimi ${registry_1.registry.version}. Si tenías cambios, recupéralos de git.`);
+            }
         }
-        const itemOf = (file) => [...plan.items, ...plan.implicit].find((item) => registry_1.registry.items[item].files.includes(file)) ??
-            file;
+        const itemOf = (file) => [...plan.items, ...plan.implicit].find((item) => (0, write_files_1.itemFiles)(item, plan.pages).includes(file)) ?? file;
         for (const message of (0, write_files_1.updatedMessages)(report, itemOf, registry_1.registry.version))
             log.info(message);
+        for (const message of blocksUsingUpdated(plan, report, itemOf))
+            log.warn(message);
         for (const file of report.skipped) {
             log.warn(`Omitido: ${path(file)} ya existe con otro contenido (usa --overwrite para reemplazarlo).`);
         }
-        for (const message of (0, write_files_1.blockedMessages)(report, plan.componentsDir, registry_1.registry.version)) {
+        for (const message of (0, write_files_1.blockedMessages)(report, plan.componentsDir, registry_1.registry.version, plan.blocksDir, plan.pages)) {
             log.warn(message);
         }
+        // Una página nueva se enruta con la línea exacta (B.11-e); la CLI no edita app.routes.ts.
+        // Una sección nueva va dentro de una página.
+        const created = new Set(report.created);
+        for (const item of plan.items) {
+            if (registry_1.registry.items[item].type !== 'block' || plan.legacyPages.includes(item))
+                continue;
+            const page = plan.pages[item];
+            if (page) {
+                if (!created.has((0, pages_1.routesKey)(item)))
+                    continue;
+                const { path: routes, appDir } = routesImportOf(tree, page);
+                const routesFile = appDir ? `${appDir}/app.routes.ts` : null;
+                log.info(`${item} es ahora tu página ${page.name} (${page.dir}/, clase ` +
+                    `${(0, pages_1.pageClassName)(page.name)}). Para abrirla en /${page.name}, agrega esta línea a ` +
+                    (routesFile && tree.exists(routesFile)
+                        ? `las rutas de ${routesFile}:`
+                        : 'tus rutas (la ruta del import es relativa a tu app.routes.ts):'));
+                log.info(`  ${(0, pages_1.routeLine)(page, routes)}`);
+                continue;
+            }
+            if (!registry_1.registry.items[item].files.some((file) => created.has(file)))
+                continue;
+            log.info(`${item} es una sección (una parte de una página): ponla en una de tus páginas con ` +
+                `<mimi-${item} />, importando ${blockClassName(item)} de ${plan.blocksDir}/${item}.`);
+        }
+        // Pantallas de la 0.4.0: siguen donde estaban (B.11-g). Una bloqueada ya tiene su aviso.
+        const blockedItems = new Set(report.blocked.map((b) => b.item));
+        for (const item of plan.legacyPages.filter((legacy) => !blockedItems.has(legacy))) {
+            log.info(`${item} sigue en ${plan.blocksDir}/${item}/, donde lo instalaste con la 0.4.0, y se ` +
+                `actualiza ahí. Los Blocks de pantalla se generan ahora como páginas ` +
+                `(${plan.pagesDir}/${(0, pages_1.defaultPageName)(item)}/, ${(0, pages_1.pageClassName)((0, pages_1.defaultPageName)(item))}): ` +
+                'para pasarlo, guarda tus cambios, borra esa carpeta y vuelve a ejecutar ' +
+                `ng g mimi ${item}.`);
+        }
         if (!(0, write_files_1.hasFileChanges)(report) && report.skipped.length === 0 && report.blocked.length === 0) {
             log.info('Nada que hacer: los archivos ya están al día.');
         }
@@ -340,6 +645,11 @@ function summary(plan, report) {
                 `tienen errores conocidos con sus componentes) y tu proyecto tiene:\n${lines.join('\n')}\n` +
                 `Actualízalos con:\n  ng update ${plan.updatable.join(' ')}`);
         }
+        if (plan.missingExclusion) {
+            const { cssPath, line } = plan.missingExclusion;
+            log.warn(`Tailwind escanea ${write_files_1.BASE_DIR}/ (las copias originales de Mimi) y genera CSS de clases que ` +
+                `quizá ya no usas. Agrega a ${cssPath}, después de @import "tailwindcss":\n  ${line}`);
+        }
         if ((0, write_files_1.hasFileChanges)(report)) {
             log.info(`Guarda la carpeta ${write_files_1.BASE_DIR.split('/')[0]}/ en git: Mimi la usa para actualizar tus ` +
                 'componentes sin perder tus cambios.');

package/dist/ui/schema.json

@@ -9,13 +9,13 @@
       "items": {
         "type": "string"
       },
-      "description": "Componentes que se agregan (varios a la vez: button input form-field).",
+      "description": "Componentes o Blocks que se agregan (varios a la vez: button input form-field, o un Block: login-01).",
       "$default": {
         "$source": "argv",
         "index": 0
       },
       "x-prompt": {
-        "message": "¿Qué componentes quieres agregar?",
+        "message": "¿Qué componentes o Blocks quieres agregar?",
         "type": "list",
         "multiselect": true,
         "items": [
@@ -51,6 +51,10 @@
             "value": "combobox",
             "label": "combobox"
           },
+          {
+            "value": "command",
+            "label": "command"
+          },
           {
             "value": "confirm",
             "label": "confirm"
@@ -59,6 +63,10 @@
             "value": "context-menu",
             "label": "context-menu"
           },
+          {
+            "value": "data-table",
+            "label": "data-table"
+          },
           {
             "value": "date-picker",
             "label": "date-picker"
@@ -131,6 +139,10 @@
             "value": "slider",
             "label": "slider"
           },
+          {
+            "value": "sortable-list",
+            "label": "sortable-list"
+          },
           {
             "value": "switch",
             "label": "switch"
@@ -162,6 +174,38 @@
           {
             "value": "tooltip",
             "label": "tooltip"
+          },
+          {
+            "value": "tree",
+            "label": "tree"
+          },
+          {
+            "value": "login-01",
+            "label": "login-01 (Block, página)"
+          },
+          {
+            "value": "login-02",
+            "label": "login-02 (Block, página)"
+          },
+          {
+            "value": "otp-01",
+            "label": "otp-01 (Block, página)"
+          },
+          {
+            "value": "pricing-01",
+            "label": "pricing-01 (Block, sección)"
+          },
+          {
+            "value": "settings-01",
+            "label": "settings-01 (Block, página)"
+          },
+          {
+            "value": "signup-01",
+            "label": "signup-01 (Block, página)"
+          },
+          {
+            "value": "table-01",
+            "label": "table-01 (Block, página)"
           }
         ]
       }
@@ -170,6 +214,10 @@
       "type": "boolean",
       "default": false,
       "description": "Reemplaza los archivos que ya existan con otro contenido."
+    },
+    "name": {
+      "type": "string",
+      "description": "Nombre de la página que genera un Block de tipo página (por defecto, el del Block sin el número: login-01 → login). En kebab-case: --name admin-login."
     }
   }
 }