Sellmate Design System

A comprehensive web components library built with Stencil for Sellmate.

Installation

``bash
npm install @sellmate/design-system
`

or

`bash
yarn add @sellmate/design-system
`

Quick Start

$3

Include this script in your HTML:

`html

`

Then use any component:

`html
Click me
`

$3

`tsx
import '@sellmate/design-system/dist/design-system/design-system.esm.js';

function App() {
return (
label='Click me'
onClick={() => console.log('clicked')}
>

);
}

export default App;
`

$3

`js
const { defineCustomElements } = require('@sellmate/design-system/loader');

defineCustomElements();
`

Available Components

- sd-button - Button component
- sd-input - Input field component
- sd-checkbox - Checkbox component
- sd-select - Select dropdown component
- sd-table - Data table component
- sd-tag - Tag/badge component
- sd-icon - Icon component
- sd-tooltip - Tooltip component
- sd-popover - Popover component
- sd-date-picker - Date picker component
- sd-date-range-picker - Date range picker component
- sd-pagination - Pagination component

Framework Integration

$3

Use the React wrapper package for better TypeScript support:

`bash
npm install @sellmate/design-system-react
`

`tsx
import { SdButton } from '@sellmate/design-system-react';

export function App() {
return Click me;
}
`

$3

Use the Vue wrapper package:

`bash
npm install @sellmate/design-system-vue
`

`vue



``

Browser Support

- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)

License

MIT