Getting Started
Installation

Installation

For Consuming Applications

Install the packages you need:

# Core packages
pnpm add @gtcx/tokens @gtcx/theme @gtcx/ui
 
# Or use the meta-package for tokens + theme
pnpm add @gtcx/design-system @gtcx/ui
 
# Optional packages
pnpm add @gtcx/i18n          # translation engine
pnpm add @gtcx/templates     # page templates
pnpm add @gtcx/accessibility  # a11y utilities

Peer Dependencies

All packages expect:

  • react >= 18.0.0
  • react-dom >= 18.0.0
  • antd >= 5.0.0

Basic Setup

Wrap your application root with GtcxConfigProvider:

import { GtcxConfigProvider } from '@gtcx/theme';
 
function App() {
  return (
    <GtcxConfigProvider>
      {/* Your application */}
    </GtcxConfigProvider>
  );
}

For Contributors

Clone and set up the monorepo:

git clone https://github.com/gtcx-ecosystem/ledger-ui.git
cd ledger-ui
pnpm install

Development Commands

pnpm build                          # Build all packages
pnpm test                           # Run all tests (301 tests)
pnpm lint                           # Lint all packages
pnpm typecheck                      # Type-check all packages
 
# Run dev servers
pnpm --filter @gtcx/storybook dev   # Storybook at localhost:6006
pnpm --filter @gtcx/gallery dev     # Gallery at localhost:5173
 
# Single package
pnpm --filter @gtcx/ui build        # Build one package
pnpm --filter @gtcx/ui test         # Test one package

Requirements

  • Node.js >= 20
  • pnpm >= 9