ABC Primitive UI

A basic UI components library for the ABC system, providing reusable components built with React and TypeScript.

📦 Installation

npm install abc-primitive-ui
# or
pnpm add abc-primitive-ui

🚀 Usage

import { SeoContent, Loading, Empty } from 'abc-primitive-ui';

// Use components
<SeoContent content="<p>HTML content</p>" />
<Loading />
<Empty />

📚 Components

SeoContent

Component for safely displaying HTML content with special character conversion capabilities.

<SeoContent content="<p>HTML content</p>" />

Loading

Loading component with smooth animations.

<Loading />

Empty

Component for displaying empty states.

<Empty />

BannerHome

Banner component for home page.

<BannerHome />

CountTime

Countdown timer component.

<CountTime />

IconLinkStoreApp

Icon component linking to app stores.

<IconLinkStoreApp />

Keyboard

Virtual keyboard component.

<Keyboard />

LoadingSkeleton

Skeleton loading component.

<LoadingSkeleton />

ScrollToTopArrow

Scroll to top arrow button component.

<ScrollToTopArrow />

PlatformContactsLogo

Component for social platform contact logos.

<PlatformContactsLogo />

🎨 Styling

Package uses CSS modules and Tailwind CSS. Styles are imported automatically:

import "abc-primitive-ui/styles.css";

📖 Storybook

To view all components and stories:

pnpm storybook

🛠️ Development

# Install dependencies
pnpm install

# Run development mode
pnpm dev

# Build package
pnpm build

# Run tests
pnpm test

# Lint code
pnpm lint

# Type check
pnpm check

📝 License

MIT

🤝 Contributing

Contributions are welcome! Please create an issue or pull request.

📞 Support

If you encounter any issues, please create an issue on the repository.