@gilav21/shadcn-angular 0.0.20 → 0.0.22

package/dist/commands/add.spec.js

@@ -0,0 +1,140 @@
+import { describe, it, expect, vi } from 'vitest';
+import { resolveDependencies, promptOptionalDependencies } from './add.js';
+import { registry } from '../registry/index.js';
+// ---------------------------------------------------------------------------
+// resolveDependencies
+// ---------------------------------------------------------------------------
+describe('resolveDependencies', () => {
+    it('resolves a single component without dependencies', () => {
+        const result = resolveDependencies(['badge']);
+        expect(result).toContain('badge');
+        expect(result.size).toBe(1);
+    });
+    it('includes transitive dependencies', () => {
+        // button depends on ripple
+        const result = resolveDependencies(['button']);
+        expect(result).toContain('button');
+        expect(result).toContain('ripple');
+    });
+    it('resolves deep transitive chains', () => {
+        // date-picker -> calendar -> button -> ripple, calendar -> select
+        const result = resolveDependencies(['date-picker']);
+        expect(result).toContain('date-picker');
+        expect(result).toContain('calendar');
+        expect(result).toContain('button');
+        expect(result).toContain('ripple');
+        expect(result).toContain('select');
+    });
+    it('deduplicates shared dependencies across multiple inputs', () => {
+        // Both button-group and speed-dial depend on button
+        const result = resolveDependencies(['button-group', 'speed-dial']);
+        expect(result).toContain('button-group');
+        expect(result).toContain('speed-dial');
+        expect(result).toContain('button');
+        expect(result).toContain('ripple');
+        // Count how many times button appears — should be exactly once (it's a Set)
+        const asArray = [...result];
+        expect(asArray.filter((n) => n === 'button')).toHaveLength(1);
+    });
+    it('returns a Set containing all resolved names', () => {
+        const result = resolveDependencies(['badge']);
+        expect(result).toBeInstanceOf(Set);
+    });
+    it('handles components with no registry deps gracefully', () => {
+        const result = resolveDependencies(['separator']);
+        expect(result.size).toBe(1);
+        expect(result).toContain('separator');
+    });
+});
+// ---------------------------------------------------------------------------
+// promptOptionalDependencies
+// ---------------------------------------------------------------------------
+vi.mock('prompts', () => ({
+    default: vi.fn(),
+}));
+describe('promptOptionalDependencies', () => {
+    it('returns empty array when no components have optional deps', async () => {
+        const resolved = new Set(['badge', 'button', 'ripple']);
+        const result = await promptOptionalDependencies(resolved, { yes: false, branch: 'master' });
+        expect(result).toEqual([]);
+    });
+    it('returns empty array with --yes flag (skip prompts)', async () => {
+        const resolved = new Set(['data-table', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+        const result = await promptOptionalDependencies(resolved, { yes: true, branch: 'master' });
+        expect(result).toEqual([]);
+    });
+    it('returns all optional dep names with --all flag', async () => {
+        const resolved = new Set(['data-table', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+        const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+        expect(result).toContain('context-menu');
+    });
+    it('filters out optional deps already in the resolved set', async () => {
+        // context-menu is already resolved, so it should not be offered
+        const resolved = new Set(['data-table', 'context-menu', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+        const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+        expect(result).not.toContain('context-menu');
+    });
+    it('deduplicates optional deps across components', async () => {
+        // Both data-table and tree have context-menu as optional
+        const resolved = new Set(['data-table', 'tree', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+        const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+        const contextMenuCount = result.filter((n) => n === 'context-menu').length;
+        expect(contextMenuCount).toBe(1);
+    });
+});
+// ---------------------------------------------------------------------------
+// Registry data integrity
+// ---------------------------------------------------------------------------
+describe('registry optional dependencies', () => {
+    it('data-table has context-menu as optional dependency', () => {
+        const dt = registry['data-table'];
+        expect(dt.optionalDependencies).toBeDefined();
+        const names = dt.optionalDependencies.map((d) => d.name);
+        expect(names).toContain('context-menu');
+    });
+    it('tree has context-menu as optional dependency', () => {
+        const tree = registry['tree'];
+        expect(tree.optionalDependencies).toBeDefined();
+        const names = tree.optionalDependencies.map((d) => d.name);
+        expect(names).toContain('context-menu');
+    });
+    it('every optional dependency name is a valid registry key', () => {
+        for (const [componentName, definition] of Object.entries(registry)) {
+            if (!definition.optionalDependencies)
+                continue;
+            for (const opt of definition.optionalDependencies) {
+                expect(registry[opt.name], `Optional dep "${opt.name}" in "${componentName}" is not a valid registry key`).toBeDefined();
+            }
+        }
+    });
+    it('every dependency name is a valid registry key', () => {
+        for (const [componentName, definition] of Object.entries(registry)) {
+            if (!definition.dependencies)
+                continue;
+            for (const dep of definition.dependencies) {
+                expect(registry[dep], `Dependency "${dep}" in "${componentName}" is not a valid registry key`).toBeDefined();
+            }
+        }
+    });
+});
+// ---------------------------------------------------------------------------
+// help command
+// ---------------------------------------------------------------------------
+describe('help command', () => {
+    it('prints commands, optional dependencies, and component categories', async () => {
+        const { help } = await import('./help.js');
+        const spy = vi.spyOn(console, 'log').mockImplementation(() => { });
+        help();
+        expect(spy).toHaveBeenCalledTimes(1);
+        const output = spy.mock.calls[0][0];
+        expect(output).toContain('Commands');
+        expect(output).toContain('init');
+        expect(output).toContain('add');
+        expect(output).toContain('Optional Dependencies');
+        expect(output).toContain('Available Components');
+        expect(output).toContain('UI');
+        expect(output).toContain('Charts');
+        expect(output).toContain('Animation');
+        spy.mockRestore();
+    });
+});

package/dist/commands/help.d.ts

@@ -0,0 +1 @@
+export declare function help(): void;

package/dist/commands/help.js

@@ -0,0 +1,108 @@
+import chalk from 'chalk';
+import { registry } from '../registry/index.js';
+const CATEGORY_ORDER = ['UI', 'Charts', 'Layout / Page Building', 'Animation', 'Kanban'];
+const ANIMATION_COMPONENTS = new Set([
+    'gradient-text', 'flip-text', 'meteors', 'shine-border', 'scroll-progress',
+    'blur-fade', 'ripple', 'marquee', 'word-rotate', 'morphing-text',
+    'typing-animation', 'wobble-card', 'magnetic', 'orbit', 'stagger-children',
+    'particles', 'confetti', 'number-ticker', 'text-reveal', 'streaming-text', 'sparkles',
+]);
+const KANBAN_COMPONENTS = new Set(['kanban']);
+const LAYOUT_COMPONENTS = new Set(['bento-grid', 'page-builder']);
+function categorize(name) {
+    const def = registry[name];
+    if (!def)
+        return 'UI';
+    const hasChartFile = def.files.some(f => f.startsWith('charts/'));
+    if (hasChartFile)
+        return 'Charts';
+    if (LAYOUT_COMPONENTS.has(name))
+        return 'Layout / Page Building';
+    if (ANIMATION_COMPONENTS.has(name))
+        return 'Animation';
+    if (KANBAN_COMPONENTS.has(name))
+        return 'Kanban';
+    return 'UI';
+}
+function buildComponentsByCategory() {
+    const groups = new Map();
+    for (const cat of CATEGORY_ORDER) {
+        groups.set(cat, []);
+    }
+    for (const name of Object.keys(registry)) {
+        const cat = categorize(name);
+        const list = groups.get(cat);
+        if (list)
+            list.push(name);
+    }
+    for (const list of groups.values()) {
+        list.sort();
+    }
+    return groups;
+}
+function formatComponentList(names, columns = 4) {
+    const colWidth = 26;
+    const lines = [];
+    for (let i = 0; i < names.length; i += columns) {
+        const row = names.slice(i, i + columns);
+        lines.push('  ' + row.map(n => n.padEnd(colWidth)).join(''));
+    }
+    return lines.join('\n');
+}
+function buildCommandsSection() {
+    const branchDefault = chalk.gray('(default: master)');
+    return [
+        chalk.bold('Commands'),
+        '',
+        '  ' + chalk.cyan('init') + '   Initialize shadcn-angular in your project',
+        '    ' + chalk.gray('-y, --yes') + '            Skip confirmation prompt',
+        '    ' + chalk.gray('-d, --defaults') + '       Use default configuration',
+        '    ' + chalk.gray('-b, --branch') + ' <branch> GitHub branch to fetch from ' + branchDefault,
+        '',
+        '  ' + chalk.cyan('add') + '    Add component(s) to your project',
+        '    ' + chalk.gray('[components...]') + '       One or more component names',
+        '    ' + chalk.gray('-y, --yes') + '            Skip confirmation prompt',
+        '    ' + chalk.gray('-o, --overwrite') + '      Overwrite existing files',
+        '    ' + chalk.gray('-a, --all') + '            Add all available components',
+        '    ' + chalk.gray('-p, --path') + ' <path>     Custom install path',
+        '    ' + chalk.gray('--remote') + '             Force remote fetch from GitHub registry',
+        '    ' + chalk.gray('-b, --branch') + ' <branch> GitHub branch to fetch from ' + branchDefault,
+        '',
+        '  ' + chalk.cyan('help') + '   Show this reference',
+        '',
+    ];
+}
+function buildOptionalDepsSection() {
+    return [
+        chalk.bold('Optional Dependencies'),
+        '',
+        '  Some components offer companion packages during installation.',
+        '  With ' + chalk.cyan('--yes') + ' they are skipped; with ' + chalk.cyan('--all') + ' they are included automatically.',
+        '',
+    ];
+}
+function buildComponentsSection() {
+    const groups = buildComponentsByCategory();
+    const lines = [
+        chalk.bold('Available Components'),
+        '',
+    ];
+    for (const [category, names] of groups) {
+        if (names.length === 0)
+            continue;
+        const countLabel = chalk.gray('(' + String(names.length) + ')');
+        lines.push('  ' + chalk.yellow(category) + ' ' + countLabel, formatComponentList(names), '');
+    }
+    return lines;
+}
+export function help() {
+    const output = [
+        '',
+        chalk.bold.underline('shadcn-angular CLI'),
+        '',
+        ...buildCommandsSection(),
+        ...buildOptionalDepsSection(),
+        ...buildComponentsSection(),
+    ];
+    console.log(output.join('\n'));
+}

package/dist/commands/init.js

@@ -1,6 +1,6 @@
 import fs from 'fs-extra';
-import path from 'path';
-import { fileURLToPath } from 'url';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
 import prompts from 'prompts';
 import chalk from 'chalk';
 import ora from 'ora';
@@ -80,7 +80,6 @@ export async function init(options) {
     let createShortcutRegistry = true;
     if (options.defaults || options.yes) {
         config = getDefaultConfig();
-        createShortcutRegistry = true;
     }
     else {
         const THEME_COLORS = {

package/dist/index.js

@@ -2,6 +2,7 @@
 import { Command } from 'commander';
 import { init } from './commands/init.js';
 import { add } from './commands/add.js';
+import { help } from './commands/help.js';
 const program = new Command();
 program
     .name('shadcn-angular')
@@ -25,4 +26,8 @@ program
     .option('--remote', 'Force remote fetch from GitHub registry')
     .option('-b, --branch <branch>', 'GitHub branch to fetch components from', 'master')
     .action(add);
+program
+    .command('help')
+    .description('Show detailed usage information')
+    .action(help);
 program.parse();

package/dist/registry/index.d.ts

@@ -1,7 +1,13 @@
+export interface OptionalDependency {
+    readonly name: string;
+    readonly description: string;
+}
 export interface ComponentDefinition {
     name: string;
     files: string[];
+    peerFiles?: string[];
     dependencies?: string[];
+    optionalDependencies?: readonly OptionalDependency[];
     npmDependencies?: string[];
     libFiles?: string[];
     shortcutDefinitions?: {

package/dist/registry/index.js

@@ -126,9 +126,14 @@ export const registry = {
             'data-table/data-table.component.ts',
             'data-table/data-table-column-header.component.ts',
             'data-table/data-table-pagination.component.ts',
+            'data-table/data-table-multiselect-filter.component.ts',
             'data-table/data-table.types.ts',
+            'data-table/data-table.utils.ts',
             'data-table/index.ts',
         ],
+        peerFiles: [
+            'context-menu-integrations.ts',
+        ],
         dependencies: [
             'table',
             'input',
@@ -139,8 +144,13 @@ export const registry = {
             'popover',
             'component-outlet',
             'icon',
+            'command',
+            'badge',
         ],
         libFiles: ['xlsx.ts'],
+        optionalDependencies: [
+            { name: 'context-menu', description: 'Enables right-click context menus on rows and headers' },
+        ],
     },
     dialog: {
         name: 'dialog',
@@ -337,6 +347,9 @@ export const registry = {
         name: 'tree',
         files: ['tree.component.ts'],
         dependencies: ['icon'],
+        optionalDependencies: [
+            { name: 'context-menu', description: 'Enables right-click context menus on tree nodes' },
+        ],
     },
     'speed-dial': {
         name: 'speed-dial',

package/dist/utils/config.js

@@ -1,5 +1,5 @@
 import fs from 'fs-extra';
-import path from 'path';
+import path from 'node:path';
 export function getDefaultConfig() {
     return {
         $schema: 'https://shadcn-angular.dev/schema.json',

package/dist/utils/package-manager.js

@@ -1,6 +1,6 @@
 import { execa } from 'execa';
 import fs from 'fs-extra';
-import path from 'path';
+import path from 'node:path';
 export async function getPackageManager(cwd) {
     const userAgent = process.env['npm_config_user_agent'];
     if (userAgent) {
@@ -29,12 +29,7 @@ export async function installPackages(packages, options) {
         if (options.dev)
             args.push('-D');
     }
-    else if (packageManager === 'yarn') {
-        args.push('add');
-        if (options.dev)
-            args.push('-D');
-    }
-    else if (packageManager === 'pnpm') {
+    else if (packageManager === 'yarn' || packageManager === 'pnpm') {
         args.push('add');
         if (options.dev)
             args.push('-D');

package/dist/utils/shortcut-registry.js

@@ -1,5 +1,5 @@
 import fs from 'fs-extra';
-import path from 'path';
+import path from 'node:path';
 function aliasToProjectPath(aliasOrPath) {
     return aliasOrPath.startsWith('@/')
         ? path.join('src', aliasOrPath.slice(2))

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gilav21/shadcn-angular",
-    "version": "0.0.20",
+    "version": "0.0.22",
     "description": "CLI for adding shadcn-angular components to your project",
     "bin": {
         "shadcn-angular": "./dist/index.js"

package/src/commands/add.spec.ts

@@ -0,0 +1,170 @@
+import { describe, it, expect, vi } from 'vitest';
+import { resolveDependencies, promptOptionalDependencies } from './add.js';
+import { registry, type ComponentName, type ComponentDefinition } from '../registry/index.js';
+
+// ---------------------------------------------------------------------------
+// resolveDependencies
+// ---------------------------------------------------------------------------
+
+describe('resolveDependencies', () => {
+  it('resolves a single component without dependencies', () => {
+    const result = resolveDependencies(['badge']);
+    expect(result).toContain('badge');
+    expect(result.size).toBe(1);
+  });
+
+  it('includes transitive dependencies', () => {
+    // button depends on ripple
+    const result = resolveDependencies(['button']);
+    expect(result).toContain('button');
+    expect(result).toContain('ripple');
+  });
+
+  it('resolves deep transitive chains', () => {
+    // date-picker -> calendar -> button -> ripple, calendar -> select
+    const result = resolveDependencies(['date-picker']);
+    expect(result).toContain('date-picker');
+    expect(result).toContain('calendar');
+    expect(result).toContain('button');
+    expect(result).toContain('ripple');
+    expect(result).toContain('select');
+  });
+
+  it('deduplicates shared dependencies across multiple inputs', () => {
+    // Both button-group and speed-dial depend on button
+    const result = resolveDependencies(['button-group', 'speed-dial']);
+    expect(result).toContain('button-group');
+    expect(result).toContain('speed-dial');
+    expect(result).toContain('button');
+    expect(result).toContain('ripple');
+
+    // Count how many times button appears — should be exactly once (it's a Set)
+    const asArray = [...result];
+    expect(asArray.filter((n: string) => n === 'button')).toHaveLength(1);
+  });
+
+  it('returns a Set containing all resolved names', () => {
+    const result = resolveDependencies(['badge']);
+    expect(result).toBeInstanceOf(Set);
+  });
+
+  it('handles components with no registry deps gracefully', () => {
+    const result = resolveDependencies(['separator']);
+    expect(result.size).toBe(1);
+    expect(result).toContain('separator');
+  });
+});
+
+// ---------------------------------------------------------------------------
+// promptOptionalDependencies
+// ---------------------------------------------------------------------------
+
+vi.mock('prompts', () => ({
+  default: vi.fn(),
+}));
+
+describe('promptOptionalDependencies', () => {
+  it('returns empty array when no components have optional deps', async () => {
+    const resolved = new Set<ComponentName>(['badge', 'button', 'ripple']);
+    const result = await promptOptionalDependencies(resolved, { yes: false, branch: 'master' });
+    expect(result).toEqual([]);
+  });
+
+  it('returns empty array with --yes flag (skip prompts)', async () => {
+    const resolved = new Set<ComponentName>(['data-table', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+    const result = await promptOptionalDependencies(resolved, { yes: true, branch: 'master' });
+    expect(result).toEqual([]);
+  });
+
+  it('returns all optional dep names with --all flag', async () => {
+    const resolved = new Set<ComponentName>(['data-table', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+    const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+    expect(result).toContain('context-menu');
+  });
+
+  it('filters out optional deps already in the resolved set', async () => {
+    // context-menu is already resolved, so it should not be offered
+    const resolved = new Set<ComponentName>(['data-table', 'context-menu', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+    const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+    expect(result).not.toContain('context-menu');
+  });
+
+  it('deduplicates optional deps across components', async () => {
+    // Both data-table and tree have context-menu as optional
+    const resolved = new Set<ComponentName>(['data-table', 'tree', 'table', 'input', 'button', 'ripple', 'checkbox', 'select', 'pagination', 'popover', 'component-outlet', 'icon']);
+    const result = await promptOptionalDependencies(resolved, { all: true, branch: 'master' });
+    const contextMenuCount = result.filter((n: string) => n === 'context-menu').length;
+    expect(contextMenuCount).toBe(1);
+  });
+});
+
+// ---------------------------------------------------------------------------
+// Registry data integrity
+// ---------------------------------------------------------------------------
+
+describe('registry optional dependencies', () => {
+  it('data-table has context-menu as optional dependency', () => {
+    const dt = registry['data-table'];
+    expect(dt.optionalDependencies).toBeDefined();
+    const names = dt.optionalDependencies!.map((d: { name: string }) => d.name);
+    expect(names).toContain('context-menu');
+  });
+
+  it('tree has context-menu as optional dependency', () => {
+    const tree = registry['tree'];
+    expect(tree.optionalDependencies).toBeDefined();
+    const names = tree.optionalDependencies!.map((d: { name: string }) => d.name);
+    expect(names).toContain('context-menu');
+  });
+
+  it('every optional dependency name is a valid registry key', () => {
+    for (const [componentName, definition] of Object.entries(registry) as [string, ComponentDefinition][]) {
+      if (!definition.optionalDependencies) continue;
+      for (const opt of definition.optionalDependencies) {
+        expect(
+          registry[opt.name],
+          `Optional dep "${opt.name}" in "${componentName}" is not a valid registry key`,
+        ).toBeDefined();
+      }
+    }
+  });
+
+  it('every dependency name is a valid registry key', () => {
+    for (const [componentName, definition] of Object.entries(registry) as [string, ComponentDefinition][]) {
+      if (!definition.dependencies) continue;
+      for (const dep of definition.dependencies) {
+        expect(
+          registry[dep],
+          `Dependency "${dep}" in "${componentName}" is not a valid registry key`,
+        ).toBeDefined();
+      }
+    }
+  });
+});
+
+// ---------------------------------------------------------------------------
+// help command
+// ---------------------------------------------------------------------------
+
+describe('help command', () => {
+  it('prints commands, optional dependencies, and component categories', async () => {
+    const { help } = await import('./help.js');
+    const spy = vi.spyOn(console, 'log').mockImplementation(() => {});
+
+    help();
+
+    expect(spy).toHaveBeenCalledTimes(1);
+    const output = spy.mock.calls[0][0] as string;
+
+    expect(output).toContain('Commands');
+    expect(output).toContain('init');
+    expect(output).toContain('add');
+    expect(output).toContain('Optional Dependencies');
+    expect(output).toContain('Available Components');
+    expect(output).toContain('UI');
+    expect(output).toContain('Charts');
+    expect(output).toContain('Animation');
+
+    spy.mockRestore();
+  });
+});