@libcart/ui

Thư viện React UI Components cho chức năng giỏ hàng.

Cài đặt

npm install @libcart/ui

Components

Cart - Giỏ hàng đầy đủ

import { Cart } from '@libcart/ui';
import type { CartItem } from '@libcart/ui';

function MyCart() {
  const [items, setItems] = useState<CartItem[]>([...]);

  return (
    <Cart
      items={items}
      onUpdateQuantity={(id, qty) => {}}
      onRemoveItem={(id) => {}}
      onToggleSelect={(id) => {}}
      onToggleSelectAll={(selected) => {}}
      onCheckout={(selectedItems) => {}}
      currency="VND"
    />
  );
}

Button

import { Button } from '@libcart/ui';

<Button variant="primary" size="medium">
  Click me
</Button>;

Variants: primary, secondary, danger, ghost Sizes: small, medium, large

Input

import { Input } from '@libcart/ui';

<Input
  label="Email"
  type="email"
  error="Invalid email"
  helperText="Enter your email"
/>;

Modal

import { Modal } from '@libcart/ui';

<Modal
  isOpen={isOpen}
  onClose={() => setIsOpen(false)}
  title="Confirm"
  size="medium"
>
  Modal content
</Modal>;

Card

import { Card } from '@libcart/ui';

<Card padding="medium" hoverable>
  Card content
</Card>;

Development

# Storybook
npm run dev

# Build
npm run build