@marc111/marc-ui-vue

A Vue 3 component library built with TypeScript and Vite.

Features

• 🚀 Built with Vue 3, TypeScript, and Vite
• 🎨 Modern and clean design
• 🛠️ Fully typed with TypeScript
• 📦 Tree-shakable components
• 🎯 Easy to use and customize

Installation

# Using npm
npm install @marc111/marc-ui-vue

# Using yarn
yarn add @marc111/marc-ui-vue

# Using pnpm
pnpm add @marc111/marc-ui-vue

Quick Start

import { createApp } from 'vue';
import MarcUIVue from '@marc111/marc-ui-vue';
import '@marc111/marc-ui-vue/dist/style.css';

const app = createApp(App);
app.use(MarcUIVue);
app.mount('#app');

Import on Demand

If you want to reduce bundle size, you can import components individually:

import { MButton } from '@marc111/marc-ui-vue';
import '@marc111/marc-ui-vue/dist/style.css';

app.component('MButton', MButton);

Components

Button

A versatile button component with multiple variants and sizes.

Basic Usage

<template>
  <MButton>Default</MButton>
  <MButton type="primary">Primary</MButton>
  <MButton type="success">Success</MButton>
  <MButton type="warning">Warning</MButton>
  <MButton type="danger">Danger</MButton>
</template>

<script setup>
import { MButton } from 'marc-ui-vue';
</script>

Props

| Name | Type | Default | Description | | --------- | ----------------------------------------- | ---------- | ------------------------------- | | type | 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'default' | Button type | | size | 'small' | 'medium' | 'large' | 'medium' | Button size | | plain | boolean | false | Whether to use plain style | | round | boolean | false | Whether to use round corners | | disabled | boolean | false | Whether to disable the button | | loading | boolean | false | Whether to show loading state |

Events

| Name | Parameters | Description | | ----- | ---------- | --------------------- | | click | event | Emitted when clicked |

Development

# Install dependencies
pnpm install

# Start development server
pnpm dev

# Build for production
pnpm build

# Run type checking
pnpm type-check

License

MIT