Public API Surface

This document describes the public API for the admin panel packages.

Overview

Both @monorepo/solid-pkg-ui and @monorepo/solid-pkg-core now expose a controlled public API surface through their root index.ts files. This prevents deep imports and allows internal refactoring without breaking changes.

@monorepo/solid-pkg-ui

Exported Components

import {
  GlassButton,
  GlassCard,
  ProtectedRoute,
  AuthGuard,
} from "@monorepo/solid-pkg-ui";

Available Components

GlassButton - Button component with glassmorphism styling
GlassCard - Card component with glassmorphism styling
ProtectedRoute - Route wrapper that requires authentication
AuthGuard - Conditional rendering based on auth state

Exported Types

import type { GlassButtonProps, GlassCardProps } from "@monorepo/solid-pkg-ui";

❌ Do NOT Use

// ❌ WRONG - Deep imports bypass the public API
import { GlassButton } from "@monorepo/solid-pkg-ui/src/components/GlassButton";
import { cn } from "@monorepo/solid-pkg-ui/src/utils/cn";

✅ Correct Usage

// ✅ CORRECT - Use the public API
import { GlassButton, GlassCard } from "@monorepo/solid-pkg-ui";

@monorepo/solid-pkg-core

Exported Modules

import { apiClient } from "@monorepo/solid-pkg-core";
import { authClient } from "@monorepo/solid-pkg-core";
import { useApprovals } from "@monorepo/solid-pkg-core";
import { env } from "@monorepo/solid-pkg-core";
import { cn } from "@monorepo/solid-pkg-core";

Available Exports

API Client

apiClient - Configured REST API client

Authentication

authClient - Better Auth client
Other auth utilities from ./auth

Data Fetching Hooks

useApprovals - Fetch approvals data
Other TanStack Query hooks from ./hooks

Configuration

env - Environment configuration
Other config from ./config

Utilities

cn - Class name utility (clsx + tailwind-merge)
Other public utilities from ./utils

Types

All types from ./types

❌ Do NOT Use

// ❌ WRONG - Deep imports
import { apiClient } from "@monorepo/solid-pkg-core/src/api/rest/client";
import { useApprovals } from "@monorepo/solid-pkg-core/src/hooks/useApprovals";

✅ Correct Usage

// ✅ CORRECT - Use the public API
import { apiClient, useApprovals, env } from "@monorepo/solid-pkg-core";

Benefits

1. Prevents Deep Imports ✅

Consumers cannot bypass the public API and import internal modules directly.

2. Allows Internal Refactors ✅

You can:

Move files around
Rename internal components
Reorganize folder structure
Change internal implementations

Without breaking any imports in consuming apps.

3. Enforces Design System Discipline ✅

Only approved components are exported
Prevents ad-hoc component usage
Maintains consistency across apps

Example: Building a Page

// src/routes/approvals.tsx
import { GlassCard, GlassButton } from "@monorepo/solid-pkg-ui";
import { useApprovals } from "@monorepo/solid-pkg-core";

export default function ApprovalsPage() {
  const approvals = useApprovals();

  return (
    <div class="container mx-auto p-6">
      <h1 class="text-3xl font-bold mb-6">Approvals</h1>

      <GlassCard>
        {approvals.data?.map((approval) => (
          <div key={approval.id}>
            <p>{approval.title}</p>
            <GlassButton onClick={() => handleApprove(approval.id)}>
              Approve
            </GlassButton>
          </div>
        ))}
      </GlassCard>
    </div>
  );
}

Adding New Public Exports

When adding new components or utilities that should be part of the public API:

For @monorepo/solid-pkg-ui

Create your component in packages/ui/src/components/
Export it from packages/ui/src/components/index.ts
Add it to packages/ui/src/index.ts

// packages/ui/src/index.ts
export { NewComponent } from "./components/NewComponent";
export type { NewComponentProps } from "./components/NewComponent";

For @monorepo/solid-pkg-core

Create your hook/utility in the appropriate directory
Export it from that directory’s index.ts
It will automatically be available (we use export * in the root)

Internal-Only Code

Some code should never be exported:

Internal helper functions
Private utilities
Implementation details
Test utilities
Development tools

These can live in the packages but should not be exported from any index.ts file.

Migration Guide

If you have existing deep imports, update them:

// Before
import { GlassButton } from "@monorepo/solid-pkg-ui/src/components/GlassButton";
import { apiClient } from "@monorepo/solid-pkg-core/src/api/rest/client";

// After
import { GlassButton } from "@monorepo/solid-pkg-ui";
import { apiClient } from "@monorepo/solid-pkg-core";

Enforcement (Optional)

You can add ESLint rules to prevent deep imports:

// .eslintrc.js
module.exports = {
  rules: {
    "no-restricted-imports": [
      "error",
      {
        patterns: ["@monorepo/solid-pkg-ui/src/*", "@monorepo/solid-pkg-core/src/*"],
      },
    ],
  },
};

This will show an error if anyone tries to use deep imports.

Public API Implementation - Implementation details
Public API Quick Reference - Quick reference guide
Adding Features - Where to add new code
Module Boundaries - Package dependencies

Getting Started

Development

UI Components

Public API Surface

Public API Surface

Overview

@monorepo/solid-pkg-ui

Exported Components

Available Components

Exported Types

❌ Do NOT Use

✅ Correct Usage

@monorepo/solid-pkg-core

Exported Modules

Available Exports

❌ Do NOT Use

✅ Correct Usage

Benefits

1. Prevents Deep Imports ✅

2. Allows Internal Refactors ✅

3. Enforces Design System Discipline ✅

Example: Building a Page

Adding New Public Exports

For @monorepo/solid-pkg-ui

For @monorepo/solid-pkg-core

Internal-Only Code

Migration Guide

Enforcement (Optional)

​Public API Surface

​Overview

​@monorepo/solid-pkg-ui

​Exported Components

​Available Components

​Exported Types

​❌ Do NOT Use

​✅ Correct Usage

​@monorepo/solid-pkg-core

​Exported Modules

​Available Exports

​❌ Do NOT Use

​✅ Correct Usage

​Benefits

​1. Prevents Deep Imports ✅

​2. Allows Internal Refactors ✅

​3. Enforces Design System Discipline ✅

​Example: Building a Page

​Adding New Public Exports

​For @monorepo/solid-pkg-ui

​For @monorepo/solid-pkg-core

​Internal-Only Code

​Migration Guide

​Enforcement (Optional)

​Related Documentation

Public API Surface

Overview

@monorepo/solid-pkg-ui

Exported Components

Available Components

Exported Types

❌ Do NOT Use

✅ Correct Usage

@monorepo/solid-pkg-core

Exported Modules

Available Exports

❌ Do NOT Use

✅ Correct Usage

Benefits

1. Prevents Deep Imports ✅

2. Allows Internal Refactors ✅

3. Enforces Design System Discipline ✅

Example: Building a Page

Adding New Public Exports

For @monorepo/solid-pkg-ui

For @monorepo/solid-pkg-core

Internal-Only Code

Migration Guide

Enforcement (Optional)

Related Documentation