vtex-css-sanitizer-cli 1.0.5 → 1.0.7

package/.github/workflows/release.yml

@@ -39,6 +39,10 @@ jobs:
         working-directory: gui
         run: yarn install --frozen-lockfile
 
+      - name: Sync version from tag
+        working-directory: gui
+        run: npm version "${GITHUB_REF_NAME#v}" --no-git-tag-version
+
       - name: Build & Package
         working-directory: gui
         run: yarn ${{ matrix.build_script }}

package/PUBLISHING.md

@@ -0,0 +1,68 @@
+# Guía de Publicación y Releases
+
+Este repositorio actúa como un monorepo que contiene 3 proyectos independientes que conviven juntos. Cada uno tiene su propio flujo de publicación y distribución:
+
+1. **CLI (Línea de comandos)**: Publicado en el registro de `npm`.
+2. **GUI (Aplicación de Escritorio)**: Compilado y publicado en GitHub Releases a través de GitHub Actions.
+
+A continuación se detalla cómo trabajar con cada uno de ellos cuando hay cambios.
+
+
+## 1. CLI (NPM Package)
+
+La versión de línea de comandos se encuentra en la raíz del proyecto (`/src`) y se distribuye a través del registro de `npm` (`vtex-css-sanitizer-cli`).
+
+**Cómo publicar una nueva versión:**
+
+1. Realiza tus cambios o correcciones en la carpeta `/src`.
+2. Asegúrate de compilar el código TypeScript:
+   ```bash
+   npm run build
+   ```
+3. Actualiza la versión en el `package.json` de la raíz del proyecto. Puedes usar el comando de npm para que te genere el commit y el tag automáticamente:
+   ```bash
+   npm version patch # Para fixes menores (ej: 1.0.4 -> 1.0.5)
+   npm version minor # Para nuevas funciones (ej: 1.0.4 -> 1.1.0)
+   npm version major # Para cambios que rompen compatibilidad (ej: 1.0.4 -> 2.0.0)
+   ```
+4. Publica el paquete en npm (requiere estar logueado previamente con `npm login` si no lo estás):
+   ```bash
+   npm publish
+   ```
+5. Empuja los commits y tags generados al repositorio remoto:
+   ```bash
+   git push origin main --follow-tags
+   ```
+
+---
+
+## 2. GUI (Aplicación de Escritorio)
+
+La aplicación con interfaz gráfica y Electron se encuentra completamente autocontenida en la carpeta `/gui`. Las actualizaciones de esta aplicación se distribuyen a través de la pestaña de **Releases** en GitHub.
+
+Los botones de "Descargar para Windows" o "Descargar para Linux" en la Landing Page siempre apuntan al tag especial genérico de `/releases/latest` en GitHub, garantizando que los usuarios siempre descarguen la versión más reciente publicada.
+
+**Cómo generar y publicar una nueva versión de la GUI:**
+
+1. Realiza y prueba tus cambios dentro de la carpeta `/gui`.
+2. Haz commit y push de los cambios a la rama `main`:
+   ```bash
+   git add gui/
+   git commit -m "feat(gui): nueva funcionalidad"
+   git push origin main
+   ```
+3. **Dispara la creación del Release en GitHub creando un tag Git:**
+   Debes crear un tag en Git que comience con la letra `v` apuntando a la versión que quieres publicar:
+   ```bash
+   git tag v1.0.7
+   git push origin v1.0.7
+   ```
+   *(También puedes empujar tus tags de una vez usando `git push origin main --tags`)*
+
+**¿Qué ocurre después de pushear el tag en Git?**
+
+1. GitHub intercepta el tag `v*.*.*` y automáticamente arranca la [GitHub Action programada](.github/workflows/release.yml).
+2. La Action levanta dos entornos virtuales en los servidores de GitHub (uno con Windows y otro con Ubuntu).
+3. Automáticamente ingresa a la carpeta `/gui`, instala dependencias, **sincroniza la versión del tag en `gui/package.json`**, compila el framework y genera los instaladores `.exe` (NSIS para Windows) y `.AppImage` (para Linux).
+4. La Action crea la entrada en la sección **Releases** de este repositorio y sube ambos binarios como *assets*.
+5. A partir de ese momento, los botones de la Landing Page empezarán a servir automáticamente esta nueva versión.

package/README.md

@@ -7,7 +7,7 @@
 
 ---
 
-vtex-css-sanitizer es una herramienta de línea de comandos (CLI) diseñada para limpiar y optimizar las hojas de estilo en proyectos de **VTEX IO**. Analiza tu base de código para encontrar clases CSS huérfanas y declaraciones `blockClass` sin uso, ayudándote a mantener tu proyecto limpio, performante y fácil de mantener.
+vtex-css-sanitizer es una herramienta diseñada para limpiar y optimizar las hojas de estilo en proyectos de **VTEX IO**. Analiza tu base de código para encontrar clases CSS huérfanas y declaraciones `blockClass` sin uso, ayudándote a mantener tu proyecto limpio, performante y fácil de mantener. Disponible como **Aplicación de Escritorio (GUI)** o como herramienta de **Línea de Comandos (CLI)**.
 
 ---
 
@@ -23,22 +23,35 @@ Estos restos de código aumentan el tamaño de los bundles y hacen que la base d
 ### ✨ Características
 
 - **Análisis Bidireccional:** Encuentra tanto CSS sin `blockClass` como `blockClass` sin CSS.
-- **Limpieza Interactiva:** El comando `fix` te guía a través de cada regla candidata, dándote el control total para decidir qué se elimina y qué se conserva.
+- **Doble Interfaz:** Utilizalo desde tu terminal preferida (CLI) o a través de nuestra moderna Aplicación de Escritorio (GUI).
+- **Limpieza Interactiva:** El proceso guiado te permite decidir qué se elimina y qué se conserva regla por regla.
 - **Inteligente:** Reconoce las clases de estado dinámicas de VTEX (ej. `--isActive`) y solo valida el `blockClass` principal.
 - **Seguro:** Ignora automáticamente los archivos CSS de componentes React custom para evitar falsos positivos.
 - **Informes Detallados:** Genera informes en formato Markdown de cada análisis y sesión de limpieza para un registro histórico.
 
-### 📦 Instalación
+### 📦 Descargas e Instalación
 
-Para usar esta herramienta en cualquier proyecto de tu máquina, instálala globalmente:
+Elegí la versión que mejor se adapte a tu necesidad:
+
+#### 1. Versión GUI (Aplicación de Escritorio)
+
+Interfaz visual intuitiva para analizar y limpiar tu proyecto sin tocar la terminal.
+- **[Descargar para Windows (.exe)](https://github.com/emanueleelias/vtex-css-sanitizer/releases/latest)**
+- **[Descargar para Linux (.AppImage)](https://github.com/emanueleelias/vtex-css-sanitizer/releases/latest)**
+
+*(Los binarios se encuentran en la sección "Assets" de cada Release).*
+
+#### 2. Versión CLI (Línea de Comandos)
+
+Ideal para integrar en workflows de desarrollo. Para usar la herramienta en cualquier proyecto local, instálala globalmente vía npm:
 
 ```bash
 npm install -g vtex-css-sanitizer-cli
 ```
 
-### 🚀 Uso
+### 🚀 Uso (Versión CLI)
 
-Navega a la carpeta raíz de tu proyecto VTEX IO y ejecuta los siguientes comandos.
+Navega a la carpeta raíz de tu proyecto VTEX IO y ejecuta los siguientes comandos. *(Nota: La versión GUI proporciona botones visuales equivalentes a estos comandos).*
 
 #### 1. Analizar el Proyecto (`analyze`)