@mimi-ng/cli 0.3.0 → 0.4.0

package/dist/templates/components/tabs/tabs.ts

@@ -97,37 +97,75 @@ export class MimiTabsOutlet {
   });
 }
 
+/**
+ * Orientación de la fila de pestañas (B.10): horizontal (por defecto) o vertical, para una
+ * navegación lateral. En vertical, las flechas son ↑/↓ (las pone aria) y el panel va al lado.
+ */
+export type MimiTabsOrientation = 'horizontal' | 'vertical';
+
 /** El contenedor visible de las pestañas (recibe el `class` del usuario). */
 const containerVariants = cva('relative font-sans', {
   variants: {
     variant: {
-      underline: 'border-b border-border',
+      underline: 'border-border',
       // 4px fijos (no rem): el indicador resta los mismos 8px.
-      pill: 'max-w-[520px] rounded-[calc(var(--mimi-radius)_+_4px)] bg-[color:var(--mimi-tabs-pill-bg,var(--mimi-muted))] p-[4px]',
+      pill: 'rounded-[calc(var(--mimi-radius)_+_4px)] bg-[color:var(--mimi-tabs-pill-bg,var(--mimi-muted))] p-[4px]',
     },
+    orientation: { horizontal: '', vertical: 'self-start' },
   },
-  defaultVariants: { variant: 'underline' },
+  compoundVariants: [
+    { variant: 'underline', orientation: 'horizontal', class: 'border-b' },
+    { variant: 'underline', orientation: 'vertical', class: 'border-s' },
+    { variant: 'pill', orientation: 'horizontal', class: 'max-w-[520px]' },
+  ],
+  defaultVariants: { variant: 'underline', orientation: 'horizontal' },
 });
 
 /**
- * El indicador: columnas iguales, así que su ancho es el de una columna y se desplaza su propio
- * ancho por cada pestaña (sin medir nada). En derecha a izquierda, al revés.
+ * El indicador: columnas (o filas) iguales, así que su tamaño es el de una pestaña y se desplaza
+ * su propio ancho (o alto) por cada una (sin medir nada). En derecha a izquierda, al revés.
  */
 const indicatorVariants = cva(
   [
     'pointer-events-none absolute',
-    'translate-x-[calc(100%_*_var(--mimi-tabs-index))] rtl:translate-x-[calc(-100%_*_var(--mimi-tabs-index))]',
     'transition-[translate] duration-[450ms] ease-[var(--mimi-tabs-spring,cubic-bezier(0.3,1.35,0.5,1))] motion-reduce:transition-none',
   ],
   {
     variants: {
       variant: {
-        underline:
-          '-bottom-px start-0 h-0.5 w-[calc(100%_/_var(--mimi-tabs-count))] rounded-[2px] bg-[color:var(--mimi-tabs-indicator,var(--mimi-foreground))]',
-        pill: 'start-[4px] top-[4px] bottom-[4px] w-[calc((100%_-_8px)_/_var(--mimi-tabs-count))] rounded-[var(--mimi-radius)] bg-[color:var(--mimi-tabs-pill-active,var(--mimi-card))] shadow-neutral',
+        underline: 'rounded-[2px] bg-[color:var(--mimi-tabs-indicator,var(--mimi-foreground))]',
+        pill: 'rounded-[var(--mimi-radius)] bg-[color:var(--mimi-tabs-pill-active,var(--mimi-card))] shadow-neutral',
+      },
+      orientation: {
+        horizontal:
+          'translate-x-[calc(100%_*_var(--mimi-tabs-index))] rtl:translate-x-[calc(-100%_*_var(--mimi-tabs-index))]',
+        vertical: 'translate-y-[calc(100%_*_var(--mimi-tabs-index))]',
       },
     },
-    defaultVariants: { variant: 'underline' },
+    compoundVariants: [
+      {
+        variant: 'underline',
+        orientation: 'horizontal',
+        class: '-bottom-px start-0 h-0.5 w-[calc(100%_/_var(--mimi-tabs-count))]',
+      },
+      {
+        // La barra va a la izquierda (al inicio), sobre el borde del contenedor.
+        variant: 'underline',
+        orientation: 'vertical',
+        class: '-start-px top-0 w-0.5 h-[calc(100%_/_var(--mimi-tabs-count))]',
+      },
+      {
+        variant: 'pill',
+        orientation: 'horizontal',
+        class: 'start-[4px] top-[4px] bottom-[4px] w-[calc((100%_-_8px)_/_var(--mimi-tabs-count))]',
+      },
+      {
+        variant: 'pill',
+        orientation: 'vertical',
+        class: 'start-[4px] end-[4px] top-[4px] h-[calc((100%_-_8px)_/_var(--mimi-tabs-count))]',
+      },
+    ],
+    defaultVariants: { variant: 'underline', orientation: 'horizontal' },
   },
 );
 
@@ -148,8 +186,10 @@ const tabVariants = cva(
         // 34px sin token (el token de alto es el de la subrayada): plan D6.
         pill: 'h-[34px] gap-1.5 rounded-[var(--mimi-radius)] text-[13.5px] [&_svg]:size-[15px] [&_svg]:shrink-0',
       },
+      // En vertical, el texto al inicio, como una navegación lateral.
+      orientation: { horizontal: '', vertical: 'justify-start px-3 text-start' },
     },
-    defaultVariants: { variant: 'underline' },
+    defaultVariants: { variant: 'underline', orientation: 'horizontal' },
   },
 );
 
@@ -196,11 +236,12 @@ const COUNT_CLASSES =
             <div
               ngTabList
               data-slot="tablist"
+              [orientation]="orientation()"
               [selectedTab]="painted()"
               (selectedTabChange)="fromAria($event)"
               [attr.aria-label]="ariaLabel() || null"
               [attr.aria-labelledby]="ariaLabelledby() || null"
-              [class]="tablistClasses"
+              [class]="tablistClasses()"
               (click)="choose($event)"
               (keydown.enter)="choose($event)"
               (keydown.space)="choose($event)"
@@ -248,12 +289,19 @@ const COUNT_CLASSES =
     </div>
   `,
   host: {
-    style: 'display: flex; flex-direction: column; gap: 14px',
+    // flex-direction va en su binding (B.10), no aquí.
+    style: 'display: flex; gap: 14px',
     // El class es del contenedor de las pestañas; aria-label y aria-labelledby, del tablist.
     '[attr.class]': 'null',
     '[attr.aria-label]': 'null',
     '[attr.aria-labelledby]': 'null',
     '[attr.data-variant]': 'variant()',
+    '[attr.data-orientation]': 'orientation()',
+    // En vertical, las pestañas a un lado y el panel al otro. Bindings sueltos (no [style] con
+    // un objeto, que sumaba ɵɵstyleMap al JS inicial: spec 10).
+    // Siempre con valor: con null, Angular quita también el flex-direction del style estático.
+    '[style.flex-direction]': 'orientation() === "vertical" ? "row" : "column"',
+    '[style.align-items]': 'orientation() === "vertical" ? "flex-start" : null',
   },
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
@@ -264,6 +312,8 @@ export class MimiTabs {
   readonly value = model<string | undefined>(undefined);
   /** Por defecto, `underline`. */
   readonly variant = input<MimiTabsVariant>('underline');
+  /** Por defecto, `horizontal`. Puede cambiar en vivo (por ejemplo, con el ancho). */
+  readonly orientation = input<MimiTabsOrientation>('horizontal');
   /** Conserva el contenido de los paneles al cambiar de pestaña (por defecto se destruye). */
   readonly preserveContent = input(false, { transform: booleanAttribute });
   /** Nombre accesible de la fila de pestañas. */
@@ -298,22 +348,37 @@ export class MimiTabs {
     this.tabs().findIndex((tab) => tab.value() === this.painted()),
   );
 
+  private readonly variants = computed(() => ({
+    variant: this.variant(),
+    orientation: this.orientation(),
+  }));
   protected readonly containerClasses = computed(() =>
-    cn(containerVariants({ variant: this.variant() }), this.userClass()),
+    cn(containerVariants(this.variants()), this.userClass()),
   );
-  protected readonly indicatorClasses = computed(() =>
-    indicatorVariants({ variant: this.variant() }),
-  );
-  protected readonly tabClasses = computed(() => tabVariants({ variant: this.variant() }));
+  protected readonly indicatorClasses = computed(() => indicatorVariants(this.variants()));
+  // Con cn(): la vertical cambia `justify-center` por `justify-start` (sin él, quedaban las dos y
+  // ganaba la que va después en el CSS).
+  protected readonly tabClasses = computed(() => cn(tabVariants(this.variants())));
   // Sin outline-none: en Tailwind 4 pone --tw-outline-style en none y anula el anillo de foco.
-  protected readonly tablistClasses = cn(
-    'grid grid-cols-[repeat(var(--mimi-tabs-count),minmax(0,1fr))] rounded-[inherit]',
-    // Con todas deshabilitadas, el foco queda en la fila (aria).
-    buttonFocusStyles,
+  // Las clases de cada orientación, completas (no variantes encadenadas: selectores largos, G2.1).
+  protected readonly tablistClasses = computed(() =>
+    cn(
+      this.orientation() === 'vertical'
+        ? 'grid grid-rows-[repeat(var(--mimi-tabs-count),minmax(0,1fr))]'
+        : 'grid grid-cols-[repeat(var(--mimi-tabs-count),minmax(0,1fr))]',
+      'rounded-[inherit]',
+      // Con todas deshabilitadas, el foco queda en la fila (aria).
+      buttonFocusStyles,
+    ),
   );
   protected readonly countClasses = COUNT_CLASSES;
   protected readonly panelClasses = computed(() =>
-    cn('px-0.5 py-1', buttonFocusStyles, this.panelClass()),
+    cn(
+      'px-0.5 py-1',
+      this.orientation() === 'vertical' && 'min-w-0 flex-1',
+      buttonFocusStyles,
+      this.panelClass(),
+    ),
   );
 
   /** El último valor que puso Mimi (no viene de fuera). */

package/dist/ui/index.js

@@ -9,12 +9,17 @@ const items_1 = require("../init/items");
 const paths_1 = require("../init/paths");
 const registry_1 = require("../registry");
 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 +39,14 @@ function ui(options) {
                 items: [...plan.items, ...plan.implicit],
                 implicit: plan.implicit,
                 componentsDir: plan.componentsDir,
+                blocksDir: plan.blocksDir,
                 overwrite: options.overwrite ?? false,
                 version: registry_1.registry.version,
                 report,
             }),
             updateMimiConfig(plan, report),
             updateGlobalCss(plan),
+            addBlocksSource(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 +63,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 +72,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 +111,37 @@ 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 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,
+        config,
+        items,
+        implicit,
+        newPackages,
+        outdated,
+        updatable,
+        missingExclusion,
+    };
+}
+/**
+ * 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 +288,25 @@ 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, files } = 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 (files.some((file) => skipped.has(file)))
                 continue;
-            components[item] = { version: registry_1.registry.version };
+            (type === 'block' ? blocks : components)[item] = { version: registry_1.registry.version };
         }
         const next = { ...plan.config, components };
+        if (Object.keys(blocks).length > 0) {
+            next.blocks = blocks;
+            // Proyectos de la 0.3.0 o anteriores: la carpeta queda escrita la primera vez (B.1-a).
+            if (!plan.config.aliases?.blocks) {
+                next.aliases = { ...plan.config.aliases, blocks: plan.blocksDir };
+            }
+        }
         const text = `${JSON.stringify(next, null, 2)}\n`;
         if (tree.readText('mimi.json') !== text)
             tree.overwrite('mimi.json', text);
@@ -299,11 +344,58 @@ function updateGlobalCss(plan) {
             context.logger.info(`  ${line}`);
     };
 }
+/**
+ * G1: con `@import "tailwindcss" source(none)`, Tailwind no escanea la carpeta de los Blocks y
+ * la pantalla queda sin sus estilos. Si se copia un Block, se agrega su `@source` (una vez).
+ */
+function addBlocksSource(plan) {
+    return (tree, context) => {
+        if (!plan.items.some((item) => registry_1.registry.items[item].type === 'block'))
+            return;
+        const cssPath = plan.config.tailwind?.css;
+        if (!cssPath || !tree.exists(cssPath))
+            return;
+        const result = (0, tailwind_1.withBlocksSource)(tree.readText(cssPath), cssPath, plan.componentsDir, plan.blocksDir);
+        if (!result)
+            return;
+        tree.overwrite(cssPath, result.css);
+        context.logger.info(`Agregado a ${cssPath} (tu @import de Tailwind usa source(none), así que Tailwind solo ` +
+            `escanea las carpetas que indicas):\n  ${result.line}`);
+    };
+}
 // ── 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;
+}
+/**
+ * Cómo se importa un Block desde `app.routes.ts` (en `src/app/`): `src/app/blocks` →
+ * `./blocks/login-01`. Si la carpeta no está dentro de `app/`, la ruta del workspace.
+ */
+function routesImport(blocksDir, item) {
+    const at = `/${blocksDir}`.lastIndexOf('/app/');
+    return at >= 0 ? `./${`/${blocksDir}`.slice(at + 5)}/${item}` : `${blocksDir}/${item}`;
+}
 function summary(plan, report) {
     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);
         if (report.created.length > 0) {
             log.info('Agregado:');
             for (const file of report.created)
@@ -313,17 +405,38 @@ 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 Set(report.overwritten.filter(write_files_1.isBlockFile).map((file) => file.split('/')[1])),
+            ];
+            for (const block of screens) {
+                log.warn(`--overwrite reemplazó tu pantalla ${block} (${plan.blocksDir}/${block}/) 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;
         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)) {
             log.warn(message);
         }
+        // Un Block nuevo es una página: se enruta (B.1, «API pública»).
+        const created = new Set(report.created);
+        for (const item of plan.items) {
+            const { type, files } = registry_1.registry.items[item];
+            if (type !== 'block' || !files.some((file) => created.has(file)))
+                continue;
+            const className = item.replace(/(^|-)([a-z0-9])/g, (_, _dash, c) => c.toUpperCase());
+            log.info(`${item} es una pantalla: agrégala a tus rutas, por ejemplo ` +
+                `{ path: '${item.split('-')[0]}', component: ${className} } ` +
+                `(import { ${className} } from '${routesImport(plan.blocksDir, 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 +453,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": [
@@ -162,6 +162,30 @@
           {
             "value": "tooltip",
             "label": "tooltip"
+          },
+          {
+            "value": "login-01",
+            "label": "login-01 (Block)"
+          },
+          {
+            "value": "login-02",
+            "label": "login-02 (Block)"
+          },
+          {
+            "value": "otp-01",
+            "label": "otp-01 (Block)"
+          },
+          {
+            "value": "pricing-01",
+            "label": "pricing-01 (Block)"
+          },
+          {
+            "value": "settings-01",
+            "label": "settings-01 (Block)"
+          },
+          {
+            "value": "signup-01",
+            "label": "signup-01 (Block)"
           }
         ]
       }

package/dist/utils/project.js

@@ -1,12 +1,47 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MIMI_COLLECTION = void 0;
+exports.defaultBlocksDir = defaultBlocksDir;
+exports.assertAliases = assertAliases;
 exports.readJson = readJson;
 exports.allDependencies = allDependencies;
 exports.majorOf = majorOf;
 const schematics_1 = require("@angular-devkit/schematics");
+const paths_1 = require("../init/paths");
 /** Nombre de esta colección (el paquete). */
 exports.MIMI_COLLECTION = '@mimi-ng/cli';
+/**
+ * Carpeta de los Blocks si mimi.json no la dice: la hermana de `components/` cuando la de
+ * componentes es la de siempre (`src/app/components/ui` → `src/app/blocks`), o si no, la hermana
+ * de la carpeta de componentes (`src/app/ui` → `src/app/blocks`).
+ */
+function defaultBlocksDir(componentsDir) {
+    const parts = componentsDir.split('/').filter(Boolean);
+    if (parts.length >= 2 && parts.at(-1) === 'ui' && parts.at(-2) === 'components') {
+        parts.splice(-2, 2);
+    }
+    else {
+        parts.pop();
+    }
+    return [...parts, 'blocks'].join('/');
+}
+/**
+ * M2: falla con un error claro (sin escribir nada) si `aliases.components` o `aliases.blocks` de
+ * mimi.json es absoluto, tiene `..` o sale del proyecto.
+ */
+function assertAliases(config) {
+    for (const name of ['components', 'blocks']) {
+        const value = config.aliases?.[name];
+        if (value === undefined)
+            continue;
+        const reason = (0, paths_1.invalidAliasReason)(value);
+        if (!reason)
+            continue;
+        const example = name === 'blocks' ? 'src/app/blocks' : 'src/app/components/ui';
+        throw new schematics_1.SchematicsException(`mimi.json → aliases.${name} ${reason}: ${JSON.stringify(value)}. Usa una ruta relativa a ` +
+            `la raíz del workspace y dentro de ella (por ejemplo "${example}"). No se cambió nada.`);
+    }
+}
 function readJson(tree, path) {
     if (!tree.exists(path))
         return null;

package/dist/utils/tailwind.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tailwindSupportsSourceNot = tailwindSupportsSourceNot;
+exports.withBlocksSource = withBlocksSource;
+exports.mimiSourceNotLine = mimiSourceNotLine;
+exports.mimiSourceNotPath = mimiSourceNotPath;
+exports.missingMimiExclusion = missingMimiExclusion;
+const css_1 = require("../init/css");
+const paths_1 = require("../init/paths");
+/** La carpeta de las copias originales (`.mimi/base/`), en la raíz del workspace. */
+const MIMI_DIR = '.mimi';
+/**
+ * ¿El Tailwind del proyecto entiende `@source not` (4.1 o superior)? Manda la versión instalada
+ * (`node_modules`, la que corre de verdad); si no está instalado, el rango de package.json: solo
+ * un rango que no puede pasar de la 4.0 (`4.0.5`, `~4.0.17`) cuenta como 4.0. `^4.0.17` instala
+ * la última 4.x, así que sí lo entiende.
+ */
+function tailwindSupportsSourceNot(tree, declared) {
+    const file = tree.read('node_modules/tailwindcss/package.json');
+    const installed = file
+        ? JSON.parse(file.toString('utf-8')).version
+        : undefined;
+    if (installed)
+        return atLeast41(installed);
+    if (!declared)
+        return true;
+    // Solo un rango exacto o con `~` fija el minor; `^4.0.17`, `>=4`, `^4`, `latest`: la última 4.x.
+    const match = /^\s*(?:~|=|v)?\s*(\d+)\.(\d+)/.exec(declared);
+    if (!match)
+        return true;
+    const [major, minor] = [Number(match[1]), Number(match[2])];
+    return major > 4 || (major === 4 && minor >= 1);
+}
+function atLeast41(version) {
+    const [major, minor] = version.split('.').map((n) => Number.parseInt(n, 10) || 0);
+    return major > 4 || (major === 4 && minor >= 1);
+}
+/**
+ * Con `source(none)`, Tailwind solo escanea lo que dice un `@source`: la carpeta de los Blocks
+ * necesita el suyo (G1), como la de componentes. Devuelve el CSS con la línea agregada (después
+ * del `@source` de componentes, o del tema), o `null` si no hace falta: sin `source(none)`, o si
+ * ya está (comillas simples o dobles).
+ */
+function withBlocksSource(css, cssPath, componentsDir, blocksDir) {
+    const tailwind = (0, css_1.findTailwindImport)(css);
+    if (!tailwind?.sourceNone)
+        return null;
+    const cssDir = (0, paths_1.dirnameOf)(cssPath);
+    const path = (0, paths_1.relativePath)(cssDir, blocksDir);
+    if ((0, css_1.hasDirective)(css, '@source', path))
+        return null;
+    const line = `@source "${path}";`;
+    const after = new RegExp(String.raw `^[ \t]*@source\s+(["'])` +
+        (0, paths_1.relativePath)(cssDir, componentsDir).replace(/[.*+?^${}()|[\]\\]/g, '\\$&') +
+        String.raw `\1[^;\n]*;[^\n]*$`, 'm').exec(css);
+    if (after) {
+        const end = after.index + after[0].length;
+        const eol = /\r\n/.test(css) ? '\r\n' : '\n';
+        return { css: css.slice(0, end) + eol + line + css.slice(end), line };
+    }
+    const updated = (0, css_1.insertAfterTheme)(css, [line]);
+    return updated === null ? null : { css: updated, line };
+}
+/** La línea que excluye `.mimi/` del escaneo de Tailwind, relativa al CSS global. */
+function mimiSourceNotLine(cssPath) {
+    return `@source not "${mimiSourceNotPath(cssPath)}";`;
+}
+function mimiSourceNotPath(cssPath) {
+    return (0, paths_1.relativePath)((0, paths_1.dirnameOf)(cssPath), MIMI_DIR);
+}
+/**
+ * ¿Falta la exclusión de `.mimi/` en este CSS? No hace falta con `source(none)` (Tailwind no
+ * escanea nada por su cuenta) ni si ya está, con comillas simples o dobles.
+ */
+function missingMimiExclusion(css, cssPath) {
+    const tailwind = (0, css_1.findTailwindImport)(css);
+    if (!tailwind || tailwind.sourceNone)
+        return false;
+    return !(0, css_1.hasDirective)(css, '@source not', mimiSourceNotPath(cssPath));
+}