Skip to content

@components/organisms treated as npm package, causing pnpm add failure when installing examples #52

Open

Description

@Dilettante258

When running reacticx add line-chart, the generated example file imports StaggeredText from @components/organisms/animated-text:

// src/examples/line-chart/index.tsx (generated)
import { StaggeredText } from "@components/organisms/animated-text";

The CLI's post-install dependency detection then tries to pnpm add @components/organisms, which fails with a 404 because it's not a real npm package — it's an internal path alias within the reacticx monorepo.

Root cause
Looking at the source in reacticx-cli/src/core/transform.ts, the packageFor() function classifies import specifiers as npm packages unless they start with ., /, @/, ~/, or node::

export function packageFor(specifier: string): string | null {
  if (
    specifier.startsWith(".") ||
    specifier.startsWith("/") ||
    specifier.startsWith("@/") ||
    specifier.startsWith("~/") ||
    specifier.startsWith("node:")
  ) {
    return null;
  }

  const parts = specifier.split("/");
  const name = specifier.startsWith("@")
    ? parts.slice(0, 2).join("/")
    : parts[0]!;
  return name || null;
}

Since @components/organisms/animated-text starts with @components/ (not @/ or ~/), it's treated as a scoped npm package @components/organisms. In deps.ts, findMissingDependencies then reports it as missing, and the add command attempts to install it via the package manager.

However, @components/organisms is an internal path alias within the reacticx monorepo, not a publishable npm package. It doesn’t exist on any registry, so the install always fails.

Additional context
The website docs also list @components/organisms as a manual installation step:

@components/organisms @shopify/react-native-skia react-native-gesture-handler ...

This means even users following the manual installation path will hit the same problem — they'll be told to install a package that doesn't exist on npm.

Activity

  1. aniKet0753 commented on Sep 29, 2026

    @aniKet0753

    @Dilettante258
    ok! i got the idea what is goin on in this issue , just assign this to me or tell me i'll shortly raise an pr on this

  2. Dilettante258 commented on Sep 29, 2026

    @Dilettante258
    Author

    Separate issue on /components-preview: Several components render broken on /components-preview but work fine on /blocks. For example, "Profile Settings V1–V4" show only an empty pulsing placeholder on /components-preview because their hoverVideo and previewVideo are both null in components.generated.ts. On /blocks, the same items render correctly as iPhone mockups with real screenshots from v2-mockups.generated.ts.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions