Vue3 Component Library

A Vue3 component library with reusable UI components like Button, Card and more.

Features

1. page-wrapper
2. c-searchComponent
3. c-table
4. c-card
5. c-steps
6. c-confim-model
7. c-upload-file
8. c-svg

Installation

``bash
npm install huiyi-component-library
`

Usage

$3

`javascript
import { createApp } from 'vue';
import Vue3ComponentLibrary from 'huiyi-component-library';
import 'huiyi-component-library/dist/style.css';

const app = createApp(App);

// Register all components globally
app.use(Vue3ComponentLibrary);

// Now you can use the components anywhere
// Click me
// Card content
`

$3

`javascript
import { Button, Card } from 'huiyi-component-library';
import 'huiyi-component-library/dist/style.css';

export default {
components: {
Button,
Card
}
}
`

Components

$3

`vue

`

#### Button Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| type | String | 'default' | Button type: 'default', 'primary', 'success', 'warning', 'danger' |
| size | String | 'medium' | Button size: 'small', 'medium', 'large' |
| disabled | Boolean | false | Whether the button is disabled |
| loading | Boolean | false | Whether the button is in loading state |
| icon | Object | null | Icon component to show in button |

#### Button Events

| Event | Description |
|-------|-------------|
| click | Triggered when button is clicked |

$3

`vue

`

#### Card Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| header | String | null | Title of the card |
| width | String | '100%' | Width of the card |
| height | String | 'auto' | Height of the card |
| bodyStyle | Object | {} | Style of the card body |
| shadow | String | 'hover' | Shadow mode: 'always', 'hover', 'never' |
| border | Boolean | true | Whether to show border |

Development

`bash


Install dependencies

npm install

Start development server

npm run dev

Build for production

npm run build

Publish to npm

npm run publish:npm
``

License

MIT