@smart-coder-labs/apple-design-system 1.0.0

package/README.md

@@ -0,0 +1,442 @@
+# 🍏✨ Apple Creative Design System
+
+<div align="center">
+
+**Un design system completo inspirado en macOS, iOS y VisionOS**
+
+*Construido con Framer Motion + Radix UI + Tailwind CSS*
+<br>
+*✨ Creado con Inteligencia Artificial ✨*
+
+[![TypeScript](https://img.shields.io/badge/TypeScript-5.3-blue)](https://www.typescriptlang.org/)
+[![React](https://img.shields.io/badge/React-18+-61dafb)](https://reactjs.org/)
+[![Framer Motion](https://img.shields.io/badge/Framer%20Motion-10+-ff69b4)](https://www.framer.com/motion/)
+[![Radix UI](https://img.shields.io/badge/Radix%20UI-Latest-purple)](https://www.radix-ui.com/)
+[![Tailwind CSS](https://img.shields.io/badge/Tailwind%20CSS-3.4-38bdf8)](https://tailwindcss.com/)
+[![npm](https://img.shields.io/badge/npm-@smart--coder--labs/design--system-red)](https://github.com/smart-coder-labs/design-system/packages)
+
+[📦 Instalación](#-inicio-rápido) •
+[📖 Documentación](#-documentación) •
+[🧩 Componentes](#-componentes) •
+[🎨 Demo](#-demo)
+
+</div>
+
+---
+
+## 📦 Instalación
+
+```bash
+npm install @smart-coder-labs/design-system
+```
+
+El paquete está publicado en **GitHub Package Registry**. Para configurar la autenticación, consulta la [guía de inicio rápido](./QUICKSTART.md).
+
+---
+
+## 💻 CLI (Nuevo)
+
+El Design System ahora incluye una CLI integrada para facilitar la instalación y gestión de componentes.
+
+### `init`
+
+Configura tu proyecto automáticamente instalando dependencias y configurando Tailwind CSS.
+
+```bash
+npx @smart-coder-labs/design-system init
+```
+
+### `add`
+
+Añade componentes individuales a tu proyecto. La CLI descargará el código fuente más reciente directamente desde el repositorio.
+
+```bash
+npx @smart-coder-labs/design-system add Button Card
+```
+
+Esto:
+1.  Descarga el código del componente a `./components/ui`.
+2.  Instala automáticamente las dependencias necesarias (`framer-motion`, `radix-ui`, etc.) solo para ese componente.
+
+---
+
+## ✨ Características
+
+- 🎨 **Estilo Apple Premium** - Minimalista, elegante y aireado
+- 🌓 **Dark Mode Completo** - Soporte automático para modo oscuro
+- ⚡ **Animaciones Fluidas** - Springs suaves y transiciones elegantes
+- ♿ **Accesibilidad AA/AAA** - Componentes accesibles con Radix UI
+- 🎯 **TypeScript** - Completamente tipado
+- 📱 **Responsive** - Diseñado para todos los dispositivos
+- 🎭 **Personalizable** - Tokens configurables fácilmente
+
+---
+
+## 📦 Contenido
+
+### 🧩 10 Componentes Completos
+
+| Componente | Descripción | Tecnología |
+|------------|-------------|------------|
+| **Button** | Botones con animaciones suaves | Framer Motion |
+| **Card** | Tarjetas con efectos glass | Framer Motion |
+| **Input** | Inputs con focus elegante | Framer Motion |
+| **Modal** | Modales con animación VisionOS | Radix UI + Framer Motion |
+| **Dropdown** | Menús desplegables | Radix UI + Framer Motion |
+| **Tooltip** | Tooltips pequeños y elegantes | Radix UI + Framer Motion |
+| **Tabs** | Segmented control iOS/macOS | Radix UI + Framer Motion |
+| **Switch** | Toggle iOS con spring | Radix UI + Framer Motion |
+| **Badge** | Indicadores de estado | Framer Motion |
+| **NavBar** | Navegación minimal | Framer Motion |
+
+### 🎨 Tokens Completos
+
+- ✅ Colores (light/dark)
+- ✅ Tipografía
+- ✅ Espaciado
+- ✅ Border Radius
+- ✅ Sombras
+- ✅ Blur
+- ✅ Animaciones
+- ✅ Breakpoints
+
+### 📚 Documentación Extensa
+
+- ✅ README completo
+- ✅ Guía de inicio rápido
+- ✅ Decisiones de diseño explicadas
+- ✅ 50+ ejemplos de código
+- ✅ Estructura del proyecto
+- ✅ Índice general
+
+---
+
+## 🚀 Inicio Rápido
+
+### 1. Instalar el paquete
+
+```bash
+npm install @smart-coder-labs/design-system
+```
+
+> **Nota:** Este paquete está publicado en GitHub Package Registry. Necesitarás configurar la autenticación en tu archivo `.npmrc`:
+> ```bash
+> @smart-coder-labs:registry=https://npm.pkg.github.com
+> //npm.pkg.github.com/:_authToken=TU_GITHUB_TOKEN
+> ```
+> [Ver guía completa de instalación →](./QUICKSTART.md)
+
+### 2. Configurar Tailwind
+
+**IMPORTANTE:** Usa el preset de Tailwind para acceder a todas las clases personalizadas:
+
+```javascript
+// tailwind.config.js
+import preset from '@smart-coder-labs/design-system/tailwind.preset';
+
+export default {
+  presets: [preset],
+  content: [
+    './src/**/*.{js,ts,jsx,tsx}',
+    './node_modules/@smart-coder-labs/design-system/**/*.{js,ts,jsx,tsx}',
+  ],
+};
+```
+
+### 3. Usar en tu proyecto
+
+```tsx
+import { Button, Card, Input } from '@smart-coder-labs/design-system';
+import '@smart-coder-labs/design-system/globals.css';
+
+function App() {
+  return (
+    <Card>
+      <Input label="Email" placeholder="your@email.com" />
+      <Button variant="primary">Submit</Button>
+    </Card>
+  );
+}
+```
+
+**[📖 Ver guía completa de inicio →](./QUICKSTART.md)**
+
+---
+
+## 🧩 Componentes
+
+### Button
+
+```tsx
+<Button variant="primary" size="md">
+  Click me
+</Button>
+```
+
+**Variantes:** `primary` | `secondary` | `ghost` | `subtle`  
+**Tamaños:** `sm` | `md` | `lg`  
+**Estados:** `loading` | `disabled`
+
+### Card
+
+```tsx
+<Card variant="glass" hoverable>
+  <CardHeader>
+    <CardTitle>Title</CardTitle>
+  </CardHeader>
+  <CardContent>Content</CardContent>
+</Card>
+```
+
+**Variantes:** `elevated` | `glass` | `outlined` | `flat`
+
+### Modal
+
+```tsx
+<Modal open={open} onOpenChange={setOpen}>
+  <ModalHeader>
+    <ModalTitle>Title</ModalTitle>
+  </ModalHeader>
+  <ModalContent>Content</ModalContent>
+</Modal>
+```
+
+**Animación VisionOS-like con backdrop blur**
+
+**[📖 Ver todos los componentes →](./EXAMPLES.md)**
+
+---
+
+## 🎨 Demo
+
+![Apple Design System Demo](https://via.placeholder.com/800x400/007AFF/FFFFFF?text=Apple+Design+System+Demo)
+
+**[🎬 Ver demo completa →](./DemoPage.tsx)**
+
+---
+
+## 📖 Documentación
+
+| Archivo | Descripción |
+|---------|-------------|
+| **[INDEX.md](./INDEX.md)** | 📑 Índice general de todo el proyecto |
+| **[QUICKSTART.md](./QUICKSTART.md)** | 🚀 Instalación y configuración rápida |
+| **[README.md](./README.md)** | 📘 Documentación completa |
+| **[EXAMPLES.md](./EXAMPLES.md)** | 📖 50+ ejemplos de código |
+| **[DESIGN_DECISIONS.md](./DESIGN_DECISIONS.md)** | 🎨 Decisiones de diseño explicadas |
+| **[PROJECT_STRUCTURE.md](./PROJECT_STRUCTURE.md)** | 📂 Estructura del proyecto |
+| **[SUMMARY.md](./SUMMARY.md)** | 📊 Resumen ejecutivo |
+
+---
+
+## 🎯 Filosofía de Diseño
+
+### Minimalismo
+- Espacio negativo amplio
+- Elementos esenciales solamente
+- Sin decoraciones innecesarias
+
+### Elegancia
+- Bordes suaves (12-20px)
+- Sombras sutiles
+- Transiciones fluidas (160-260ms)
+
+### Premium
+- Paleta neutra con acentos elegantes
+- Tipografía cuidada (Inter/SF Pro)
+- Efectos glass y translucidez
+
+**[🎨 Ver decisiones completas →](./DESIGN_DECISIONS.md)**
+
+---
+
+## 🌓 Dark Mode
+
+```tsx
+import { Switch } from '@smart-coder-labs/design-system';
+
+const [darkMode, setDarkMode] = useState(false);
+
+useEffect(() => {
+  document.documentElement.classList.toggle('dark', darkMode);
+}, [darkMode]);
+
+<Switch
+  checked={darkMode}
+  onCheckedChange={setDarkMode}
+  label="Dark Mode"
+/>
+```
+
+---
+
+## 🎨 Personalización
+
+### Modificar colores
+
+```typescript
+import { tokens } from '@smart-coder-labs/design-system';
+
+const customTokens = {
+  ...tokens,
+  colors: {
+    ...tokens.colors,
+    light: {
+      ...tokens.colors.light,
+      accent: {
+        blue: '#0066CC', // Tu color
+      },
+    },
+  },
+};
+```
+
+**[🔧 Ver guía completa →](./README.md#personalización)**
+
+---
+
+## 📊 Estadísticas
+
+```
+📁 Archivos:         25
+📝 Líneas de código: 3,178
+🧩 Componentes:      10
+🎨 Tokens:           100+
+📖 Documentación:    7 archivos
+```
+
+---
+
+## 🛠️ Tecnologías
+
+- **React** 18+ - UI Library
+- **TypeScript** 5+ - Type Safety
+- **Framer Motion** 10+ - Animaciones
+- **Radix UI** - Componentes accesibles
+- **Tailwind CSS** 3+ - Estilos
+- **PostCSS** - Procesamiento CSS
+
+---
+
+## ♿ Accesibilidad
+
+✅ WCAG 2.1 nivel AA  
+✅ Navegación por teclado  
+✅ Focus visible  
+✅ ARIA labels  
+✅ Touch targets 40x40px  
+✅ Screen reader friendly  
+
+---
+
+## 📱 Responsive
+
+Todos los componentes son responsive por defecto.
+
+**Breakpoints:**
+- `sm`: 640px
+- `md`: 768px
+- `lg`: 1024px
+- `xl`: 1280px
+- `2xl`: 1536px
+
+---
+
+## 🎯 Casos de Uso
+
+- ✅ Aplicaciones web premium
+- ✅ Dashboards administrativos
+- ✅ Landing pages elegantes
+- ✅ Aplicaciones SaaS
+- ✅ Portfolios profesionales
+- ✅ E-commerce moderno
+
+---
+
+## 📂 Estructura
+
+```
+apple-design-system/
+├── 📄 Documentación (7 archivos)
+├── 🎨 Configuración (tokens, tailwind, globals)
+├── 🧩 Componentes (10 componentes)
+├── 📦 Package.json
+└── 🎬 DemoPage.tsx
+```
+
+**[📂 Ver estructura completa →](./PROJECT_STRUCTURE.md)**
+
+---
+
+## 🚀 Próximos Pasos
+
+1. **[📖 Lee el índice](./INDEX.md)** - Vista general
+2. **[🚀 Instalación rápida](./QUICKSTART.md)** - 5 minutos
+3. **[📖 Copia ejemplos](./EXAMPLES.md)** - Código listo
+4. **[🎨 Personaliza](./README.md)** - Hazlo tuyo
+5. **[🎬 Ve la demo](./DemoPage.tsx)** - Inspiración
+
+---
+
+## 💡 Inspiración
+
+Este design system está inspirado en:
+
+- **macOS** System Preferences
+- **iOS** Settings
+- **VisionOS** Cards y UI
+- **Apple Human Interface Guidelines**
+
+---
+
+## 🔄 Migración
+
+### Actualizando desde v1.0.2 o anterior
+
+A partir de **v1.0.3**, es necesario usar el preset de Tailwind:
+
+```bash
+npm install @smart-coder-labs/design-system@latest
+```
+
+Actualiza tu `tailwind.config.js`:
+
+```javascript
+import preset from '@smart-coder-labs/design-system/tailwind.preset';
+
+export default {
+  presets: [preset],
+  content: [
+    './src/**/*.{js,ts,jsx,tsx}',
+    './node_modules/@smart-coder-labs/design-system/**/*.{js,ts,jsx,tsx}',
+  ],
+};
+```
+
+**[📖 Ver guía completa de migración →](./MIGRATION.md)**
+
+---
+
+## 📄 Licencia
+
+MIT © 2025
+
+---
+
+## 🙏 Agradecimientos
+
+Construido con:
+- [Framer Motion](https://www.framer.com/motion/)
+- [Radix UI](https://www.radix-ui.com/)
+- [Tailwind CSS](https://tailwindcss.com/)
+- [Apple Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/)
+
+---
+
+<div align="center">
+
+**Hecho con ❤️ e IA inspirado en Apple**
+
+[⬆ Volver arriba](#-apple-creative-design-system)
+
+</div>

package/dist/cli/commands/add.d.ts

@@ -0,0 +1,2 @@
+export declare const add: (components: string[]) => Promise<void>;
+//# sourceMappingURL=add.d.ts.map

package/dist/cli/commands/add.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"add.d.ts","sourceRoot":"","sources":["../../../cli/commands/add.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,GAAG,GAAU,YAAY,MAAM,EAAE,kBAsG7C,CAAC"}

package/dist/cli/commands/add.js

@@ -0,0 +1,102 @@
+import prompts from "prompts";
+import path from "path";
+import fs from "fs-extra";
+import chalk from "chalk";
+import ora from "ora";
+import { getAvailableComponents, getComponentSource } from "../utils/registry";
+export const add = async (components) => {
+    if (!components || components.length === 0) {
+        // If no components specified, list available ones
+        const available = await getAvailableComponents();
+        const response = await prompts({
+            type: "multiselect",
+            name: "items",
+            message: "Which components would you like to add?",
+            choices: available.map(c => ({ title: c, value: c })),
+            min: 1
+        });
+        components = response.items;
+    }
+    if (!components || components.length === 0) {
+        console.log(chalk.yellow("No components selected."));
+        return;
+    }
+    // Load config
+    let config = { componentsDir: "./components/ui" };
+    if (fs.existsSync("design-system.json")) {
+        try {
+            config = await fs.readJSON("design-system.json");
+        }
+        catch (e) {
+            console.warn("Could not read design-system.json, using defaults.");
+        }
+    }
+    else {
+        console.warn("design-system.json not found. Using default ./components/ui");
+    }
+    const spinner = ora("Installing components...").start();
+    for (const component of components) {
+        spinner.text = `Installing ${component}...`;
+        const source = await getComponentSource(component);
+        if (!source) {
+            spinner.warn(`Component '${component}' not found.`);
+            continue;
+        }
+        const destPath = path.resolve(process.cwd(), config.componentsDir, `${component}.tsx`);
+        await fs.ensureDir(path.dirname(destPath));
+        // Quick and dirty import fix:
+        // Some components might import from "@/lib/utils" or similar.
+        // The source code likely has: import { cn } from "@/lib/utils";
+        // We should ensure that matches the user's setup or leave it to them to resolve aliases.
+        // For now we assume standard Next.js-like alias @/lib/utils is configured or simple relative imports.
+        // We can try to detect missing "cn" import or other common utils.
+        await fs.writeFile(destPath, source);
+        spinner.succeed(`Installed ${component}`);
+        // Auto-install dependencies found in the registry
+        // We can now rely on the registry manifest rather than regex parsing if we want,
+        // but regex parsing on the fetched content is still robust.
+        // However, since we have the registry, let's try to use it if we can.
+        // For now, let's stick to the content analysis as fallback or primary if registry.json dependency list is empty.
+        const dependenciesToInstall = new Set();
+        // Check for Radix UI
+        const radixMatch = source.match(/@radix-ui\/react-[a-z-]+/g);
+        if (radixMatch) {
+            radixMatch.forEach(dep => dependenciesToInstall.add(dep));
+        }
+        // Check for other common libs
+        if (source.includes('framer-motion'))
+            dependenciesToInstall.add('framer-motion');
+        if (source.includes('lucide-react'))
+            dependenciesToInstall.add('lucide-react');
+        if (source.includes('clsx'))
+            dependenciesToInstall.add('clsx');
+        if (source.includes('tailwind-merge'))
+            dependenciesToInstall.add('tailwind-merge');
+        if (source.includes('class-variance-authority'))
+            dependenciesToInstall.add('class-variance-authority');
+        // Also use explicit dependencies from registry if available
+        try {
+            const { getComponentDependencies } = require('../utils/registry');
+            const regDeps = await getComponentDependencies(component);
+            regDeps.forEach((dep) => dependenciesToInstall.add(dep));
+        }
+        catch {
+            // failed to get registry deps, fallback to regex above
+        }
+        if (dependenciesToInstall.size > 0) {
+            const deps = Array.from(dependenciesToInstall).join(" ");
+            spinner.start(`Installing dependencies: ${deps}...`);
+            try {
+                const { execSync } = require('child_process');
+                execSync(`npm install ${deps}`, { stdio: 'ignore' });
+                spinner.succeed(`Dependencies installed: ${deps}`);
+            }
+            catch (e) {
+                spinner.warn(`Failed to auto-install dependencies: ${deps}. Please install manually.`);
+            }
+        }
+    }
+    spinner.stop();
+    console.log(chalk.bold.green("\nDone!"));
+};
+//# sourceMappingURL=add.js.map

package/dist/cli/commands/add.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"add.js","sourceRoot":"","sources":["../../../cli/commands/add.ts"],"names":[],"mappings":"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"}

package/dist/cli/commands/init.d.ts

@@ -0,0 +1,2 @@
+export declare const init: () => Promise<void>;
+//# sourceMappingURL=init.d.ts.map

package/dist/cli/commands/init.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"init.d.ts","sourceRoot":"","sources":["../../../cli/commands/init.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,IAAI,qBA6EhB,CAAC"}

package/dist/cli/commands/init.js

@@ -0,0 +1,73 @@
+import prompts from "prompts";
+import path from "path";
+import fs from "fs-extra";
+import chalk from "chalk";
+import ora from "ora";
+export const init = async () => {
+    console.log(chalk.bold.green("🍏 Apple Design System Initialization"));
+    console.log("This utility will help you configure your project.");
+    const response = await prompts([
+        {
+            type: "text",
+            name: "componentsDir",
+            message: "Where would you like to install components?",
+            initial: "./components/ui",
+        },
+        {
+            type: "text",
+            name: "globalCss",
+            message: "Where is your global CSS file?",
+            initial: "./app/globals.css",
+        },
+        {
+            type: "confirm",
+            name: "installDeps",
+            message: "Would you like to install required dependencies now?",
+            initial: true,
+        },
+    ]);
+    const spin = ora("Configuring project...").start();
+    // Create config file
+    const config = {
+        componentsDir: response.componentsDir,
+        globalCss: response.globalCss,
+    };
+    await fs.writeJSON("design-system.json", config, { spaces: 2 });
+    spin.succeed("Configuration file design-system.json created.");
+    // Check/Create components directory
+    const resolvedComponentsDir = path.resolve(process.cwd(), response.componentsDir);
+    await fs.ensureDir(resolvedComponentsDir);
+    // Also create a lib/utils.ts for cn helper if it doesn't exist
+    // Many components rely on 'cn'. We should probably include a helper or ask where utils are.
+    // For simplicity, we'll try to find or create a lib/utils.ts
+    const utilsPath = path.resolve(process.cwd(), "lib/utils.ts");
+    if (!fs.existsSync(utilsPath)) {
+        await fs.ensureDir(path.resolve(process.cwd(), "lib"));
+        await fs.writeFile(utilsPath, `import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}
+`);
+        console.log(chalk.green("Created lib/utils.ts for 'cn' utility."));
+    }
+    if (response.installDeps) {
+        spin.start("Installing dependencies...");
+        // We are just displaying instructions for now or running npm install
+        // Actually running npm install might be risky if we don't know the package manager.
+        // But we can try to detect or just default to npm.
+        try {
+            const { execSync } = require('child_process');
+            execSync('npm install clsx tailwind-merge cva framer-motion lucide-react', { stdio: 'inherit' });
+            spin.succeed("Dependencies installed.");
+        }
+        catch (e) {
+            spin.fail("Failed to install dependencies. Please run manually:");
+            console.log(chalk.cyan("npm install clsx tailwind-merge cva framer-motion lucide-react"));
+        }
+    }
+    console.log(chalk.bold.green("\nSuccess! Project initialized."));
+    console.log(`You can now run ${chalk.cyan("npx apple-design-system add [component]")} to add components.`);
+};
+//# sourceMappingURL=init.js.map

package/dist/cli/commands/init.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"init.js","sourceRoot":"","sources":["../../../cli/commands/init.ts"],"names":[],"mappings":"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"}

package/dist/cli/index.d.ts

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/cli/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../cli/index.ts"],"names":[],"mappings":""}

package/dist/cli/index.js

@@ -0,0 +1,20 @@
+#!/usr/bin/env node
+import { Command } from "commander";
+import { init } from "./commands/init";
+import { add } from "./commands/add";
+const program = new Command();
+program
+    .name("apple-design-system")
+    .description("CLI for adding components and initializing the design system")
+    .version("1.0.0");
+program
+    .command("init")
+    .description("Initialize the design system configuration")
+    .action(init);
+program
+    .command("add")
+    .description("Add a component to your project")
+    .argument("[components...]", "The components to add")
+    .action((components) => add(components));
+program.parse();
+//# sourceMappingURL=index.js.map

package/dist/cli/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../cli/index.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAErC,MAAM,OAAO,GAAG,IAAI,OAAO,EAAE,CAAC;AAE9B,OAAO;KACJ,IAAI,CAAC,qBAAqB,CAAC;KAC3B,WAAW,CAAC,8DAA8D,CAAC;KAC3E,OAAO,CAAC,OAAO,CAAC,CAAC;AAEpB,OAAO;KACJ,OAAO,CAAC,MAAM,CAAC;KACf,WAAW,CAAC,4CAA4C,CAAC;KACzD,MAAM,CAAC,IAAI,CAAC,CAAC;AAEhB,OAAO;KACJ,OAAO,CAAC,KAAK,CAAC;KACd,WAAW,CAAC,iCAAiC,CAAC;KAC9C,QAAQ,CAAC,iBAAiB,EAAE,uBAAuB,CAAC;KACpD,MAAM,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC;AAE3C,OAAO,CAAC,KAAK,EAAE,CAAC"}

package/dist/cli/utils/registry.d.ts

@@ -0,0 +1,4 @@
+export declare function getAvailableComponents(): Promise<string[]>;
+export declare function getComponentSource(componentName: string): Promise<string | null>;
+export declare function getComponentDependencies(componentName: string): Promise<string[]>;
+//# sourceMappingURL=registry.d.ts.map

package/dist/cli/utils/registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../../cli/utils/registry.ts"],"names":[],"mappings":"AAsCA,wBAAsB,sBAAsB,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC,CAGhE;AAED,wBAAsB,kBAAkB,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAqBtF;AAED,wBAAsB,wBAAwB,CAAC,aAAa,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,EAAE,CAAC,CAIvF"}