g360-cli 1.4.0 → 1.6.0

package/src/assets/templates/web-pwa/src/styles/main.css

@@ -0,0 +1,133 @@
+:root {
+  --g360-bg: #0b1220;
+  --g360-surface: #151e2e;
+  --g360-accent: #00d084;
+  --g360-text: #f0f4f8;
+  --g360-muted: #94a3b8;
+  --g360-glass: rgba(21, 30, 46, 0.75);
+  --g360-blur: 16px;
+  --g360-rounded: 16px;
+  --g360-font: system-ui, -apple-system, sans-serif;
+}
+
+* { box-sizing: border-box; margin: 0; padding: 0; }
+
+body {
+  font-family: var(--g360-font);
+  background: var(--g360-bg);
+  color: var(--g360-text);
+  line-height: 1.6;
+  -webkit-font-smoothing: antialiased;
+}
+
+.app {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+.container {
+  max-width: 480px;
+  margin: 0 auto;
+  padding: 24px 16px;
+  flex: 1;
+}
+
+.g360-header {
+  background: var(--g360-surface);
+  border-bottom: 1px solid rgba(255,255,255,0.08);
+  padding: 16px 24px;
+}
+
+.header-content {
+  max-width: 480px;
+  margin: 0 auto;
+  display: flex;
+  align-items: baseline;
+  gap: 12px;
+}
+
+.logo {
+  font-size: 24px;
+  font-weight: 800;
+  color: var(--g360-accent);
+}
+
+.subtitle {
+  font-size: 14px;
+  color: var(--g360-muted);
+}
+
+h1 { font-size: 24px; font-weight: 700; margin-bottom: 8px; }
+
+.muted { color: var(--g360-muted); font-size: 14px; }
+
+.g360-footer {
+  text-align: center;
+  padding: 12px;
+  font-size: 11px;
+  color: var(--g360-muted);
+  background: var(--g360-surface);
+  border-top: 1px solid rgba(255,255,255,0.08);
+}
+
+.g360-loading-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(11, 18, 32, 0.9);
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+  z-index: 1000;
+}
+
+.g360-loading-spinner {
+  width: 40px;
+  height: 40px;
+  border: 3px solid var(--g360-surface);
+  border-top-color: var(--g360-accent);
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+@keyframes spin { to { transform: rotate(360deg); } }
+
+.g360-card {
+  background: var(--g360-surface);
+  border-radius: var(--g360-rounded);
+  padding: 16px;
+  border: 1px solid rgba(255,255,255,0.08);
+}
+
+.g360-glass {
+  background: var(--g360-glass);
+  backdrop-filter: blur(var(--g360-blur));
+  -webkit-backdrop-filter: blur(var(--g360-blur));
+  border: 1px solid rgba(255,255,255,0.1);
+}
+
+.g360-btn {
+  background: var(--g360-accent);
+  color: var(--g360-bg);
+  border: none;
+  border-radius: 8px;
+  padding: 10px 20px;
+  font-size: 14px;
+  font-weight: 700;
+  cursor: pointer;
+  transition: opacity 0.2s;
+}
+
+.g360-btn:hover { opacity: 0.85; }
+
+@media (prefers-color-scheme: light) {
+  :root {
+    --g360-bg: #ffffff;
+    --g360-surface: #f5f5f5;
+    --g360-muted: #6b7280;
+    --g360-text: #1f2937;
+    --g360-glass: rgba(255, 255, 255, 0.75);
+  }
+}

package/src/assets/templates/web-pwa/vite.config.js

@@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  plugins: [react()],
+  server: {
+    port: 3000,
+  },
+  build: {
+    outDir: 'dist',
+  },
+});

package/src/cli.js

@@ -31,7 +31,7 @@ program
   .command('init')
   .argument('<name>', 'Project name')
   .option('-t, --template <type>', 'Project template type', 'web-pwa')
-  .option('-s, --skill <skill>', 'Skill to use (corporativo, corporativo-movil, moderno, moderno-movil, minimalista, custom, flet-desktop)', 'corporativo-movil')
+  .option('-s, --skill <skill>', 'Skill to use (corporativo, corporativo-movil, moderno, moderno-movil, minimalista, custom, flet-desktop, flet-desktop-corporativo, cipsa, cipsa-movil)', 'corporativo-movil')
   .option('-d, --dir <path>', 'Target directory', '.')
   .option('--dry-run', 'Preview without creating files')
   .option('--force', 'Overwrite existing files')
@@ -48,7 +48,7 @@ program
 
 program
   .command('bring')
-  .argument('[asset]', 'Specific asset to bring (template/component/skill/all)')
+  .argument('[asset]', 'Asset to bring: brand, brand/cipsa, brand/g360, components, templates, skills, all')
   .option('-p, --path <path>', 'Target path', '.')
   .option('--dry-run', 'Preview without copying')
   .option('--force', 'Overwrite existing files')
@@ -56,7 +56,7 @@ program
 
 program
   .command('list')
-  .argument('[type]', 'Type to list (templates/components/skills/all)', 'all')
+  .argument('[type]', 'Type to list (templates/components/skills/snippets/brands/all)', 'all')
   .option('--json', 'Output as JSON')
   .action(list);
 
@@ -100,7 +100,7 @@ program
 program
   .command('convert')
   .argument('[path]', 'Path to convert', '.')
-  .option('-s, --skill <skill>', 'Skill to apply', 'corporativo-movil')
+  .option('-s, --skill <skill>', 'Skill to apply (corporativo, corporativo-movil, moderno, moderno-movil, minimalista, custom, flet-desktop, flet-desktop-corporativo, cipsa, cipsa-movil)', 'corporativo-movil')
   .option('--dry-run', 'Preview without applying')
   .option('--restructure', 'Restructure project files')
   .option('--force', 'Force dangerous changes')
@@ -109,9 +109,14 @@ program
 
 program
   .command('signature')
-  .argument('<command>', 'Command to execute (install)')
+  .argument('<command>', 'Command to execute: install, positions')
+  .description('Install g360-signature branding component')
   .option('-p, --path <path>', 'Target project path', '.')
   .option('--force', 'Force reinstall if already exists')
+  .option('-m, --mode <mode>', 'Signature mode: own or powered', 'powered')
+  .option('-v, --version <version>', 'Version to display')
+  .option('--position <position>', 'Signature position: bottom-right, bottom-left, bottom-center, footer-right, footer-left', 'bottom-right')
+  .option('-i, --interactive', 'Interactive mode with guided suggestions')
   .action(signature);
 
 program.parse();

package/src/commands/bring.js

@@ -10,7 +10,7 @@ export async function bring(asset, options) {
   const { path: targetPath = '.', dryRun = false, force = false } = options;
   const targetDir = path.join(process.cwd(), targetPath);
   const assetsPath = path.join(__dirname, '../assets');
-  
+
   console.log(chalk.bold.cyan('\n📦 G360 Asset Manager\n'));
 
   if (!asset || asset === 'all') {
@@ -19,14 +19,89 @@ export async function bring(asset, options) {
   }
 
   const assetPath = path.join(assetsPath, asset);
-  
+
   if (!fs.existsSync(assetPath)) {
     console.error(chalk.red(`❌ Asset "${asset}" not found.`));
-    console.log(chalk.gray('\nRun "g360 list assets" to see available assets.'));
+    console.log(chalk.gray('\nRun "g360 list all" to see available assets.'));
     return;
   }
 
   await copyAssets(assetPath, targetDir, dryRun, force);
+
+  if (asset.startsWith('brand')) {
+    const brandName = asset.split('/')[1];
+    if (brandName) {
+      await applyBrand(targetDir, brandName, dryRun);
+    }
+  }
+}
+
+async function applyBrand(targetDir, brandName, dryRun) {
+  const brandConfigPath = path.join(targetDir, 'g360', 'brand', 'brand.json');
+  if (!fs.existsSync(brandConfigPath)) {
+    console.log(chalk.yellow(`\n⚠ brand.json not found. Run 'g360 bring brand' first.`));
+    return;
+  }
+
+  let brandConfig;
+  try {
+    brandConfig = fs.readJsonSync(brandConfigPath);
+  } catch {
+    console.log(chalk.yellow(`\n⚠ Could not parse brand.json.`));
+    return;
+  }
+
+  const brand = brandConfig.brands?.[brandName];
+  if (!brand) {
+    console.log(chalk.yellow(`\n⚠ Brand "${brandName}" not found in brand.json`));
+    return;
+  }
+
+  const skillCandidates = [
+    path.join(targetDir, 'skill.json'),
+    path.join(targetDir, 'src', 'core', 'skill.json'),
+  ];
+
+  let skillPath = null;
+  for (const c of skillCandidates) {
+    if (fs.existsSync(c)) {
+      skillPath = c;
+      break;
+    }
+  }
+
+  if (!skillPath) {
+    console.log(chalk.yellow(`\n⚠ No skill.json found. Create one with 'g360 init'.`));
+    return;
+  }
+
+  if (dryRun) {
+    console.log(chalk.yellow(`\n📋 DRY RUN - Would update ${skillPath}`));
+    return;
+  }
+
+  const skill = fs.readJsonSync(skillPath);
+  skill.brand = brandName;
+
+  if (!skill.guidelines) skill.guidelines = {};
+  skill.guidelines.logo = brand.default_logo;
+  skill.guidelines.description = brand.description;
+
+  if (brand.signature) {
+    if (!skill.signature) skill.signature = {};
+    skill.signature.mode = brand.signature.mode;
+    skill.signature.text = brand.signature.text;
+  }
+
+  if (brand.primary_color) {
+    if (!skill.colors) skill.colors = {};
+    skill.colors.accent = brand.primary_color;
+  }
+
+  fs.writeJsonSync(skillPath, skill, { spaces: 2 });
+  console.log(chalk.green(`\n✅ Brand "${brandName}" applied to ${skillPath}`));
+  console.log(chalk.gray(`   Logo: ${brand.default_logo}`));
+  console.log(chalk.gray(`   Signature: ${brand.signature?.text || 'none'}`));
 }
 
 async function copyAssets(src, dest, dryRun, force) {
@@ -36,18 +111,18 @@ async function copyAssets(src, dest, dryRun, force) {
   }
 
   const progressBar = progress('Copying assets...');
-  
+
   try {
     const items = fs.readdirSync(src);
     for (const item of items) {
       const srcPath = path.join(src, item);
       const destPath = path.join(dest, 'g360', item);
-      
+
       if (fs.statSync(srcPath).isDirectory()) {
         await fs.copy(srcPath, destPath, { overwrite: force });
       }
     }
-    
+
     progressBar.stop();
     console.log(chalk.green('\n✅ Assets copied successfully!\n'));
   } catch (error) {

package/src/commands/list.js

@@ -14,13 +14,15 @@ export async function list(type, options) {
   const assets = {
     templates: [],
     components: [],
-    skills: []
+    skills: [],
+    brands: []
   };
 
   const templatesPath = path.join(assetsPath, 'templates');
   const componentsPath = path.join(assetsPath, 'components');
-  const skillsPath = path.join(assetsPath, 'skills');
-  const enginePath = path.join(assetsPath, 'engine');
+  const configPath = path.join(assetsPath, 'config');
+  const snippetsPath = path.join(assetsPath, 'snippets');
+  const brandPath = path.join(assetsPath, 'brand');
 
   if (fs.existsSync(templatesPath)) {
     assets.templates = fs.readdirSync(templatesPath);
@@ -28,11 +30,53 @@ export async function list(type, options) {
   if (fs.existsSync(componentsPath)) {
     assets.components = fs.readdirSync(componentsPath).filter(f => f.endsWith('.jsx') || f.endsWith('.js'));
   }
-  if (fs.existsSync(skillsPath)) {
-    assets.skills = fs.readdirSync(skillsPath).filter(f => f.endsWith('.js') || f.endsWith('.mjs'));
+  
+  if (fs.existsSync(configPath)) {
+    const g360SkillsPath = path.join(configPath, 'g360-skills.json');
+    if (fs.existsSync(g360SkillsPath)) {
+      try {
+        const skillsData = fs.readJsonSync(g360SkillsPath);
+        assets.skills = skillsData.skills.map(skill => ({
+          name: skill.name,
+          description: skill.description,
+          device: skill.device
+        }));
+      } catch (error) {
+        console.log(chalk.yellow(`Warning: Could not read skills config: ${error.message}`));
+      }
+    }
+  }
+  
+  if (fs.existsSync(snippetsPath)) {
+    const snippetsJsonPath = path.join(snippetsPath, 'snippets.json');
+    if (fs.existsSync(snippetsJsonPath)) {
+      try {
+        const snippetsData = fs.readJsonSync(snippetsJsonPath);
+        assets.snippets = snippetsData.snippets.map(snippet => ({
+          name: snippet.name,
+          description: snippet.description,
+          language: snippet.language
+        }));
+      } catch (error) {
+        console.log(chalk.yellow(`Warning: Could not read snippets config: ${error.message}`));
+      }
+    }
   }
-  if (fs.existsSync(enginePath)) {
-    assets.engine = fs.readdirSync(enginePath).filter(f => f.startsWith('g360-skill-'));
+
+  if (fs.existsSync(brandPath)) {
+    const brandConfigPath = path.join(brandPath, 'brand.json');
+    if (fs.existsSync(brandConfigPath)) {
+      try {
+        const brandData = fs.readJsonSync(brandConfigPath);
+        assets.brands = Object.entries(brandData.brands || {}).map(([key, val]) => ({
+          name: key,
+          description: val.description,
+          logo: val.default_logo
+        }));
+      } catch (error) {
+        console.log(chalk.yellow(`Warning: Could not read brand config: ${error.message}`));
+      }
+    }
   }
 
   if (json) {
@@ -60,12 +104,38 @@ export async function list(type, options) {
 
   if (!type || type === 'all' || type === 'skills') {
     console.log(chalk.bold.yellow('\n⚡ Skills:'));
-    if (assets.engine.length) {
-      assets.engine.forEach(s => console.log(chalk.gray(`  - ${s}`)));
+    if (assets.skills.length) {
+      assets.skills.forEach(skill => {
+        console.log(chalk.gray(`  - ${skill.name}`));
+        console.log(chalk.gray(`    ${skill.description}`));
+        console.log(chalk.gray(`    Device: ${skill.device}`));
+      });
     } else {
       console.log(chalk.gray('  No skills found'));
     }
   }
 
+  if (!type || type === 'all' || type === 'brands') {
+    console.log(chalk.bold.yellow('\n🎨 Brands:'));
+    if (assets.brands.length) {
+      assets.brands.forEach(b => console.log(chalk.gray(`  - ${b.name}`)));
+    } else {
+      console.log(chalk.gray('  No brands found'));
+    }
+  }
+
+  if (!type || type === 'all' || type === 'snippets') {
+    console.log(chalk.bold.yellow('\n📝 Snippets:'));
+    if (assets.snippets && assets.snippets.length) {
+      assets.snippets.forEach(snippet => {
+        console.log(chalk.gray(`  - ${snippet.name}`));
+        console.log(chalk.gray(`    ${snippet.description}`));
+        console.log(chalk.gray(`    Language: ${snippet.language}`));
+      });
+    } else {
+      console.log(chalk.gray('  No snippets found'));
+    }
+  }
+
   console.log();
 }