Marketrix Shared UI Elements

@marketrix/ui

Recent Updates

React 19 Migration

This package has been updated to use React 19. Please ensure your project is also using React 19 to avoid compatibility issues.

Drag and Drop Migration

The DraggableList component has been migrated from react-beautiful-dnd to @dnd-kit. The API has been updated:

Before (react-beautiful-dnd):

import { DropResult } from 'react-beautiful-dnd';

<DraggableList
  items={items}
  onDragEnd={(result: DropResult) => {
    // Handle drag end
  }}
  renderItem={(item, index) => <div>{item.content}</div>}
/>

After (@dnd-kit):

<DraggableList
  items={items}
  onDragEnd={(result: { oldIndex: number; newIndex: number }) => {
    // Handle drag end
  }}
  renderItem={(item, index) => <div>{item.content}</div>}
/>

Installation

npm install @marketrix/ui

Usage

import { Button, Card, Input } from '@marketrix/ui';

function App() {
  return (
    <div>
      <Button label="Click me" />
      <Card>Content</Card>
      <Input placeholder="Enter text" />
    </div>
  );
}